body { margin: 0; padding: 0; font-family: dinosaur; color: #244047; font-size: 1.25em; }

p { text-align: center; line-height: 1.25; }

a { position: relative; transition: color 0.25s; text-decoration: none; color: #244047; white-space: nowrap; }
a:after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; z-index: -1; border-radius: 2px; border-bottom: 0.125em solid #BA5624; animation-name: borderIn; animation-duration: 0.25s; animation-fill-mode: forwards; }
a:hover:after { animation-name: borderOut; animation-duration: 0.25s; animation-fill-mode: forwards; }

main.page-splash { width: 100vw; height: 100vh; display: flex; box-sizing: border-box; flex-direction: column; justify-content: center; align-items: center; padding: 4em; overflow: hidden; }
@media screen and (max-width: 720px) { main.page-splash { padding: 2em; } }
main.page-splash .wrapper { max-width: 740px; display: flex; flex-direction: column; justify-content: center; align-items: center; }
main.page-splash .wrapper h1 { font-weight: 400; display: none; }
main.page-splash .wrapper p { z-index: 2; position: relative; line-height: 1.5; }
main.page-splash .wrapper .logo { position: relative; z-index: 1; margin-bottom: 1em; }
main.page-splash .wrapper .logo:before { content: ''; position: absolute; top: 107.33px; left: 53.665px; margin-left: -1000px; margin-top: -500px; width: 2000px; height: 1000px; background: repeating-linear-gradient(26.565deg, transparent 0, transparent calc( 96px - 1px ), #f8eee9 calc( 96px - 1px ), #f8eee9 96px), repeating-linear-gradient(26.565deg, transparent 0, transparent calc( 19.2px - 1px ), #f8eee9 19.2px), repeating-linear-gradient(153.435deg, transparent 0, transparent calc( 96px - 1px ), #f8eee9 calc( 96px - 1px ), #f8eee9 96px), repeating-linear-gradient(153.435deg, transparent 0, transparent calc( 19.2px - 1px ), #f8eee9 19.2px); background-position: 16.0995px 53.665px; z-index: 1; }
main.page-splash .wrapper .logo svg { fill: #244047; position: relative; z-index: 2; }
main.page-splash .wrapper .logo svg .light { fill: transparent; }
main.page-splash .wrapper .logo svg:first-child { position: absolute; fill: #f8eee9; }
main.page-splash .wrapper .logo svg:nth-child(2) { position: relative; top: 0; transition: top 0.25s; }
main.page-splash .wrapper .logo svg:nth-child(2):hover { top: -10px; /*.light { fill: $links;
}*/ }
main.page-splash .wrapper .logo:after { content: ''; position: fixed; top: 0; bottom: 0; left: 0; right: 0; background: radial-gradient(transparent 0%, #fff 100%); z-index: 1; }

@keyframes borderIn { 0% { left: 0; right: 100%; }
  100% { left: 0; right: 0; } }
@keyframes borderOut { 0% { left: 0; right: 0; }
  100% { left: 100%; right: 0; } }
