:root{--dark-background:#252126;--dark-header-text:#faf6f9;--dark-paragraph-text:#a9a9a9;--light-background:#faf6f9;--light-header-text:#252126;--light-paragraph-text:#4d4a4d;--accent:#cd2a89;--max-content-width:700px}*{box-sizing:border-box}html{overflow-wrap:break-word;-webkit-text-size-adjust:100%;font-size:1.1rem;line-height:1.8}body{margin:0}img,video,iframe{width:100%;height:auto;display:break}h1{line-height:1.3}h2{line-height:1.4}h3{line-height:1.5}a{color:var(--accent);transition:opacity .3s}a:hover{opacity:.8}.bg-image{background-color:var(--dark-background);background-image:url(../../../trace-pattern.svg);background-repeat:repeat;background-size:200px 200px}header{text-align:center;flex-direction:column;align-items:center;padding:40px;display:flex}header h1{color:var(--dark-header-text)}header p{width:100%;max-width:var(--max-content-width);color:var(--dark-paragraph-text)}header img{-webkit-user-select:none;user-select:none;width:150px;position:absolute;top:0;left:30px}nav ul{justify-content:center;gap:50px;margin:0;list-style-type:none;display:flex}nav ul li{text-align:center;padding-bottom:20px;transition:opacity .3s;position:relative}nav ul li a{color:var(--dark-paragraph-text)}nav ul li p{margin:0}nav ul li span{opacity:.5;font-size:.9em}nav ul li:after{content:"";width:100%;height:3px;transition:background-color .3s;display:inline-block;position:absolute;bottom:0;left:0}nav ul li:hover:after,nav ul li.current:after{background-color:var(--dark-paragraph-text)}nav ul li:hover,nav ul li.current{opacity:.8}main{flex-direction:column;align-items:center;padding:50px 0;display:flex}main div{width:100%;max-width:var(--max-content-width)}main p,main li{color:var(--light-paragraph-text)}footer{flex-direction:column;align-items:center;padding-top:55vh;display:flex}footer p{opacity:.5;color:var(--light-paragraph-text)}footer ul{gap:50px;margin-top:0;padding:10px 100px 0;display:flex;position:relative}footer ul:before{content:"";background:var(--light-paragraph-text);opacity:.2;width:100%;height:1px;position:absolute;top:0;left:0}footer ul li{list-style:none}footer ul li a{opacity:.5;color:var(--light-paragraph-text);display:flex}footer ul li a svg{width:15px;fill:var(--light-paragraph-text);margin-left:5px}
