118 lines
3.0 KiB
CSS
118 lines
3.0 KiB
CSS
@import "tailwindcss";
|
|
|
|
@theme {
|
|
--color-gractwo-red: #fb636b;
|
|
--color-gractwo-red-semidark: #cc4f55;
|
|
--color-gractwo-red-dark: #b2454b;
|
|
--color-gractwo-blu: #61f2ea;
|
|
--color-gractwo-blu-semidark: #47b2ad;
|
|
--color-gractwo-blu-dark: #3d9994;
|
|
}
|
|
|
|
.bg-gractwo-index-light {
|
|
background-size: "100% 100%";
|
|
background-image:
|
|
radial-gradient(125% 125% at 50% 90%, #ffffff 40%, transparent 95%),
|
|
linear-gradient(to right, #ff637e 15%, #00d3f2 100%);
|
|
}
|
|
|
|
.dashed-top-fade-grid {
|
|
position: absolute;
|
|
inset: 0;
|
|
z-index: 0;
|
|
|
|
background-image:
|
|
linear-gradient(to right, #e7e5e4 1px, transparent 1px),
|
|
linear-gradient(to bottom, #e7e5e4 1px, transparent 1px);
|
|
background-size: 20px 20px;
|
|
background-position:
|
|
0 0,
|
|
0 0;
|
|
|
|
mask-image:
|
|
repeating-linear-gradient(
|
|
to right,
|
|
black 0px,
|
|
black 3px,
|
|
transparent 3px,
|
|
transparent 8px
|
|
),
|
|
repeating-linear-gradient(
|
|
to bottom,
|
|
black 0px,
|
|
black 3px,
|
|
transparent 3px,
|
|
transparent 8px
|
|
),
|
|
radial-gradient(ellipse 70% 60% at 50% 0%, #000 60%, transparent 100%);
|
|
-webkit-mask-image:
|
|
repeating-linear-gradient(
|
|
to right,
|
|
black 0px,
|
|
black 3px,
|
|
transparent 3px,
|
|
transparent 8px
|
|
),
|
|
repeating-linear-gradient(
|
|
to bottom,
|
|
black 0px,
|
|
black 3px,
|
|
transparent 3px,
|
|
transparent 8px
|
|
),
|
|
radial-gradient(ellipse 70% 60% at 50% 0%, #000 60%, transparent 100%);
|
|
|
|
mask-composite: intersect;
|
|
-webkit-mask-composite: source-in;
|
|
}
|
|
|
|
.dashed-bottom-fade-grid {
|
|
position: absolute;
|
|
inset: 0;
|
|
z-index: 0;
|
|
|
|
background-image:
|
|
linear-gradient(to right, rgba(255, 99, 126, 0.3) 1px, transparent 1px),
|
|
linear-gradient(to bottom, rgba(0, 211, 242, 0.3) 1px, transparent 1px);
|
|
background-size: 20px 20px;
|
|
background-position:
|
|
0 0,
|
|
0 0;
|
|
|
|
mask-image:
|
|
repeating-linear-gradient(
|
|
to right,
|
|
black 0px,
|
|
black 3px,
|
|
transparent 3px,
|
|
transparent 8px
|
|
),
|
|
repeating-linear-gradient(
|
|
to bottom,
|
|
black 0px,
|
|
black 3px,
|
|
transparent 3px,
|
|
transparent 8px
|
|
),
|
|
radial-gradient(ellipse 100% 80% at 50% 100%, #000 50%, transparent 90%);
|
|
-webkit-mask-image:
|
|
repeating-linear-gradient(
|
|
to right,
|
|
black 0px,
|
|
black 3px,
|
|
transparent 3px,
|
|
transparent 8px
|
|
),
|
|
repeating-linear-gradient(
|
|
to bottom,
|
|
black 0px,
|
|
black 3px,
|
|
transparent 3px,
|
|
transparent 8px
|
|
),
|
|
radial-gradient(ellipse 100% 80% at 50% 100%, #000 50%, transparent 90%);
|
|
|
|
mask-composite: intersect;
|
|
-webkit-mask-composite: source-in;
|
|
}
|