html, body { height: 100%; font-size: 16px; letter-spacing: 0.1rem; }

.hide { display: none; z-index: -9999 !important; }

#content-wrapper { min-height: 100%; background-color: lightblue; }

:root { --navbar-hover-color-top: grey; }

a, .desktop-navbar-option, .mobile-menu-dropdown { color: white; text-decoration: none; }

a:hover, .desktop-navbar-option:hover, .mobile-menu-dropdown:hover { cursor: pointer; color: grey; }

.desktop-navbar-option-top:hover { color: var(--navbar-hover-color-top); }

.hidden { z-index: -1; }

.front { z-index: 2; }

.navbar { top: 0px; left: 0px; position: static; color: white; background-color: black; border-bottom: inherit; width: 100%; font-variant: small-caps; padding: 1.1em 0 1em 0; z-index: 4; transition: top 0.2s ease-in-out; }

.navbar .container { display: flex; align-items: center; justify-content: space-between; z-index: 4; }

.navbar .container:after { display: none; }

#desktop-navbar-options { display: none; }

#hamburger { width: 30px; display: block; }

#hamburger:hover { cursor: pointer; }

#hamburger div { background-color: white; border-radius: 3px; content: ''; display: block; height: 4px; margin: 6px 0; transition: all .2s ease-in-out; }

.menu-expand #hamburger-top { transform: translateY(10px) rotate(135deg); }

.menu-expand #hamburger-middle { transform: scale(0); }

.menu-expand #hamburger-bottom { transform: translateY(-10px) rotate(-135deg); }

@media screen and (min-width: 1000px) { #hamburger { display: none; } #desktop-navbar-options { display: flex; } #desktop-navbar-options a { margin-left: 1em; } #desktop-navbar-options:first { margin-left: 0em; } }

/* deskop sub-menus */
.sub-menu-wrapper { position: absolute; }

.sub-menu { position: relative; max-height: 0px; transition: max-height 0.2s ease-in-out; }

.sub-menu-background { position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; background-color: black; z-index: -1; }

.sub-menu-options { padding: 1em; color: white; display: flex; flex-direction: column; visibility: hidden; opacity: 0; transition: opacity 0.2s; transition-delay: 0.2s; }

.sub-menu-options a { margin: 0px !important; }

.desktop-menu-dropdown:hover .sub-menu-options { visibility: visible; opacity: 1; }

.desktop-menu-dropdown:hover .sub-menu { max-height: 140px; }

#mobile-navbar-options { position: fixed; top: 0px; height: 100%; width: 100%; z-index: 3; background-color: black; opacity: 0; transition: opacity .5s ease-in-out; display: flex; align-items: center; justify-content: center; flex-direction: column; }

#mobile-navbar-options > a, #mobile-navbar-options .mobile-menu-dropdown { font-size: 2rem; }

.menu-expand .navbar { border-bottom: initial; margin-bottom: 1px; }

.menu-expand #mobile-navbar-options { opacity: 1; }

.mobile-menu-dropdown-content-wrapper { max-height: 0px; transition: max-height 0.2s ease-in-out; }

.mobile-menu-dropdown-contents { visibility: hidden; z-index: -1; display: flex; flex-direction: column; align-items: center; justify-content: center; }

.mobile-menu-dropdown-contents a { opacity: 0; font-size: 1rem; transition: opacity 0.2s ease-in-out; transition-delay: 0.2s; }

.mobile-menu-dropdown-content-wrapper-expanded .mobile-menu-dropdown-contents { visibility: inherit; }

.mobile-menu-dropdown-content-wrapper-expanded a { opacity: 1; }

.hero-wrapper-full, .hero-wrapper-aspect { width: 100%; background-size: cover; background-position: center; position: relative; }

.hero-wrapper-aspect { padding-top: 75%; }

@media screen and (min-width: 1000px) { .hero-wrapper-aspect { padding-top: 56.25%; } }

.hero-wrapper-full { height: 100vh; }

.hero, .hero-mute { position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; }

.hero-mute { z-index: 1; background-color: black; }

.hero { z-index: 2; display: flex; background-position: center; align-items: center; justify-content: center; flex-direction: column; }

.hero:first { margin-top: 0; }

.hero-content { opacity: 1; margin-bottom: 0; margin-top: 1rem; }

#hero-title { font-size: 4em; }

div.hero-content { font-size: 1.5rem; }

/*# sourceMappingURL=site.css.map */