main{grid-template-rows:320px 192px auto;align-items:center;width:100%;height:100%;display:grid}main .nav{width:100%;height:320px;position:relative}main .nav .title-container{justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0}main .nav .separator{background:linear-gradient(to top,var(--primary)64%,rgba(var(--primary-rgb),0));width:100%;height:64px;position:absolute;bottom:0}main .nav .title-container h1{width:fit-content;text-shadow:0 0 64px var(--text);font-size:8em}main .presentation{justify-content:center;align-items:center;gap:8vh;width:100%;height:192px;display:flex}main .presentation img{border:solid 4px var(--text);width:192px;height:192px;filter:drop-shadow(-4px 4px 8px var(--text));border-radius:50%}main .presentation .container p{color:rgba(var(--text-rgb),.8);margin-top:2vh;font-family:monospace}main .roadmap-container .separator{grid-template-columns:1fr auto 1fr;justify-content:center;align-items:center;width:100%;margin-top:2vh;display:grid}main .roadmap-container .separator .stroke{background-color:var(--text);border-radius:2px;justify-self:center;width:90%;height:4px}main .roadmap-container .roadmap{flex-direction:column;align-items:center;width:100%;margin:2vh 0;display:flex}main .roadmap-container .roadmap .point{grid-template-columns:1fr 32px 1fr;align-items:center;gap:2vh;height:32px;display:grid}main .roadmap-container .roadmap .point img{border:solid 4px rgba(var(--text-rgb),.64);cursor:url(/src/svgs/pointer.svg),pointer;filter:grayscale();border-radius:16px;grid-column:2;width:32px;height:32px}main .roadmap-container .roadmap .point.active img{filter:none;border-color:var(--text)!important;background-color:var(--text)!important}main .roadmap-container .roadmap .point img:hover,main .roadmap-container .roadmap .point img.touched{filter:grayscale(.5);border-color:var(--text)!important;background-color:var(--text)!important}main .roadmap-container .roadmap .point h2{color:rgba(var(--text-rgb),.64)}main .roadmap-container .roadmap .point.active h2{color:var(--text);text-shadow:0 0 8px var(--text)}main .roadmap-container .roadmap .line{grid-template-columns:1fr 32px 1fr;gap:2vh;display:grid}main .roadmap-container .roadmap .line div{background-color:rgba(var(--text-rgb),.64);grid-column:2;justify-self:center;width:4px;height:auto;min-height:128px}main .roadmap-container .roadmap .line div span{background-color:var(--text);width:100%;height:0%;display:block}main .roadmap-container .roadmap .line p{color:rgba(var(--text-rgb),.8);opacity:.1;margin-top:1vh;font-family:monospace}main .roadmap-container .roadmap>:nth-child(4n+2) p{padding-right:4vh}main .roadmap-container .roadmap>:nth-child(4n+4) p{text-align:right;padding-left:4vh}main .roadmap-container .roadmap .end{background-color:rgba(var(--text-rgb),.64);border-radius:8px;grid-column:2;justify-self:center;width:32px;height:32px}@media screen and (width<=850px){main .nav .title-container h1{border-right:solid 8px var(--text);font-size:4em}main .presentation{gap:4vh}main .presentation img{width:128px;height:128px;filter:drop-shadow(-2px 2px 4px var(--text))}}@media screen and (width<=750px){main{grid-template-rows:320px repeat(2,auto)}main .presentation{text-align:center;flex-direction:column;height:auto;padding:0 2vh}main .presentation .container h2{font-size:1.3em}main .presentation .container p{font-size:.9em}}@media screen and (width<=450px){main .roadmap-container .separator h1{font-size:1.5em}main .roadmap-container .roadmap .line p{font-size:.9em}}