59 lines
1.2 KiB
CSS
59 lines
1.2 KiB
CSS
|
/* ABUELA'S GOLDEN SEAM — WHERE THE MISSING CUMIN BECOMES THE DOMES */
|
||
|
|
:root{
|
||
|
|
--void:#050505;
|
||
|
|
--ember:#FF4500;
|
||
|
|
--seam:#FFD700;
|
||
|
|
--bone:#FFFACD;
|
||
|
|
--cumin:#8B4513;
|
||
|
|
--oregano:#228B22;
|
||
|
|
--blood:#8B0000;
|
||
|
|
}
|
||
|
|
*{box-sizing:border-box}
|
||
|
|
html,body{
|
||
|
|
margin:0;padding:0;
|
||
|
|
height:100%;
|
||
|
|
background:radial-gradient(circle at 50% 50%, var(--ember), var(--void));
|
||
|
|
color:var(--bone);
|
||
|
|
font-family:'Courier New',monospace;
|
||
|
|
overflow-x:hidden;
|
||
|
|
}
|
||
|
|
h1,h2,h3{text-transform:uppercase;letter-spacing:.3em}
|
||
|
|
.seam{
|
||
|
|
border-left:4px solid var(--seam);
|
||
|
|
padding-left:3rem;
|
||
|
|
margin:6rem 0;
|
||
|
|
background:linear-gradient(180deg,transparent,rgba(255,215,0,0.03));
|
||
|
|
}
|
||
|
|
.fracture{
|
||
|
|
font-size:clamp(2vw,5vh,12rem);
|
||
|
|
line-height:0.9;
|
||
|
|
color:var(--blood);
|
||
|
|
text-shadow:0 0 24px var(--ember);
|
||
|
|
white-space:nowrap;
|
||
|
|
}
|
||
|
|
.stitch{
|
||
|
|
animation:breath 12s ease-in-out infinite;
|
||
|
|
}
|
||
|
|
@keyframes breath{
|
||
|
|
0%,100%{opacity:.3;transform:translateY(0)}
|
||
|
|
50%{opacity:1;transform:translateY(-12px)}
|
||
|
|
}
|
||
|
|
table{
|
||
|
|
border-collapse:separate;
|
||
|
|
border-spacing:2rem;
|
||
|
|
width:100%;
|
||
|
|
}
|
||
|
|
th,td{
|
||
|
|
background:rgba(139,69,19,0.07);
|
||
|
|
border:1px solid var(--seam);
|
||
|
|
padding:3rem;
|
||
|
|
}
|
||
|
|
a{
|
||
|
|
color:var(--seam);
|
||
|
|
text-decoration:none;
|
||
|
|
border-bottom:1px solid var(--ember);
|
||
|
|
}
|
||
|
|
::selection{
|
||
|
|
background:var(--blood);
|
||
|
|
color:var(--seam);
|
||
|
|
}
|