@font-face { font-family: 'Poppins'; src: url("fonts/Poppins/Poppins-Regular.ttf"); } @font-face { font-family: 'Open Sans'; src: url("fonts/Open_Sans/OpenSans-Regular.ttf"); } @font-face { font-family: 'Astro'; src: url("fonts/Astro/astro.ttf"); } @font-face { font-family: 'Garamond'; src: url("fonts/Garamond/EBGaramond-Regular.ttf"); } * { margin: 0px; padding: 0px; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #131313; } body { overflow-x: hidden; } .nav { position: fixed; width: 100vw; top: 0; z-index: 999; } .nav nav { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; -webkit-box-align: center; -ms-flex-align: center; align-items: center; min-height: 8vh; background-color: #131313; font-family: "Poppins", sans-serif; } .nav nav .logo { color: #d4d4d4; text-transform: uppercase; letter-spacing: 3px; font-size: 1.75em; } .nav nav .logo h4 { display: -webkit-box; display: -ms-flexbox; display: flex; } .nav nav .logo span { padding-left: 20px; } .nav nav ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; width: 30%; } .nav nav ul li { list-style: none; } .nav nav ul span { display: none; } .nav nav ul a { font-family: "Open Sans", sans-serif; color: #d4d4d4; text-decoration: none; font-weight: bold; font-size: 1.1em; } .nav nav ul a:hover { color: white; } .nav nav .nav-active { -webkit-transform: translateX(0%) !important; transform: translateX(0%) !important; } .nav nav .burger { display: none; } .nav nav .burger div { width: 25px; height: 3px; background-color: #d4d4d4; margin: 5px; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } @media (max-width: 768px) { .nav nav { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 20px; } .nav nav .logo img { width: 28px; height: 28px; } .nav nav .logo span { display: none; } .nav nav ul { z-index: 1; -webkit-transform: translateX(100%); transform: translateX(100%); position: absolute; right: 0%; top: 8vh; height: 30vh; width: 100% !important; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-color: #131313; -webkit-transition: -webkit-transform 0.5s ease-in; transition: -webkit-transform 0.5s ease-in; transition: transform 0.5s ease-in; transition: transform 0.5s ease-in, -webkit-transform 0.5s ease-in; border-bottom: 3px solid #d4d4d4; } .nav nav ul span { display: block; color: #d4d4d4; font-weight: bold; text-transform: uppercase; letter-spacing: 3px; font-size: 1.75em; } .nav nav ul li a { color: #d4d4d4 !important; font-size: 1.2em; font-weight: normal; } .nav nav .burger { display: block !important; } .nav nav .burger.toggle .line1 { -webkit-transform: rotate(-45deg) translate(-5px, 6px); transform: rotate(-45deg) translate(-5px, 6px); } .nav nav .burger.toggle .line2 { opacity: 0; } .nav nav .burger.toggle .line3 { -webkit-transform: rotate(45deg) translate(-5px, -6px); transform: rotate(45deg) translate(-5px, -6px); } } footer { position: relative; margin-top: 10%; height: 10vh; width: 100%; } footer .footer { width: 50%; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; color: #d4d4d4; font-family: "Open Sans", sans-serif; } footer .footer .columns { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-pack: distribute; justify-content: space-around; } footer .footer .columns .logo { margin: auto 0; } footer .footer .columns .logo h4 { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: auto 0; color: #d4d4d4; text-transform: uppercase; letter-spacing: 3px; font-size: 1.2em; } footer .footer .columns .logo span { padding-left: 10px; } footer .footer .columns ul { list-style: none; } footer .footer .columns ul li { color: #868686; } footer .footer .columns ul li:first-child { font-size: 1.2em; padding: 5px 0; color: #939393; } footer .footer .columns ul li a { padding: 4px 0; color: inherit; text-decoration: none; } footer .footer .columns ul li a:hover { color: #acacac; } footer .footer .copyright { color: #797979; text-align: center; font-size: 0.9em; margin: 50px 0; } footer .footer .copyright a { color: inherit; } /*# sourceMappingURL=base.css.map */