@charset "UTF-8"; /*=========*/ /* Layout. */ /*=========*/ body.home-page { --deus-body-padding: 5rem 5rem 10rem 5rem; width: 100%; height: 100vh; } @media only screen and (max-width: 960px) { body.home-page { --deus-body-padding: 4rem 4rem 8rem 4rem; } } @media only screen and (max-width: 520px) { body.home-page { --deus-body-padding: 3rem 3rem 8rem 3rem; } } body.home-page::before { content: none; } /*===============*/ /* Splash image. */ /*===============*/ body.home-page #splash-image { width: 100%; height: 100%; opacity: 1.0; transition: opacity 2.5s ease; } body.home-page #splash-image.hidden { opacity: 0.0; } body.home-page #splash-image.fade { opacity: 0.15; transition: opacity 1s ease; } body.home-page #splash-image img { width: 100%; height: 100%; object-fit: contain; } body.home-page #splash-image img.tall { display: none; } @media only screen and (max-width: 960px) { body.home-page #splash-image img.tall { display: initial; } body.home-page #splash-image img.wide { display: none; } } /*================*/ /* Navigation UI. */ /*================*/ body.home-page #main-nav { top: unset; bottom: -2rem; opacity: 0.0; border-bottom: none; box-shadow: none; background-color: transparent; font-size: 1.75em; justify-content: center; } body.home-page #main-nav.shown { bottom: 0; opacity: 1.0; transition: bottom 1s ease, opacity 1s ease; } body.home-page #main-nav a.text { margin: 0 0.75em; width: 4em; } body.home-page #main-nav .social-buttons { position: fixed; top: 0; right: 0; font-size: 0.75em; padding: 0.5em; } @media only screen and (max-width: 520px) { body.home-page #main-nav .social-buttons { flex-flow: column nowrap; } body.home-page #main-nav .social-buttons a + a { margin: 0.5em 0 0 0; } } body.home-page #main-nav .logo { display: none; } /*===================*/ /* Copyright notice. */ /*===================*/ body.home-page #copyright { top: -0.75rem; opacity: 0.0; } body.home-page #copyright.shown { top: 0.75rem; opacity: 0.5; transition: top 1s ease, opacity 1s ease; }