@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; } .contact-wrapper { height: 100vh; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .contact { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100vw; color: #d4d4d4; background-color: transparent; z-index: 0; margin-bottom: 50px; } .contact #contact { position: relative; padding: 40px 0; background: #131313; width: 100%; max-width: 500px; padding: 25px; } .contact #contact:before { content: ''; position: absolute; top: -5px; left: -5px; right: -5px; bottom: -5px; background: linear-gradient(45deg, #ffd800, #ff5520, #750cf2, #0cbcf2); z-index: -1; } .contact #contact:after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(45deg, #ffd800, #ff5520, #750cf2, #0cbcf2); z-index: -2; -webkit-filter: blur(40px); filter: blur(40px); } .contact #contact h1 { margin: 0 0 15px; font-family: "Poppins", sans-serif; font-size: 3em; } .contact #contact fieldset { border: none !important; margin: 0 0 10px; min-width: 100%; padding: 0; width: 100%; } .contact #contact input, .contact #contact textarea { font-family: "Open Sans", sans-serif; color: #d4d4d4; border-color: #d4d4d4; width: 100%; margin: 0 0 5px; padding: 10px; } .contact #contact input:last-child, .contact #contact textarea:last-child { margin: 0; } .contact #contact input::-webkit-input-placeholder, .contact #contact textarea::-webkit-input-placeholder { color: #d4d4d4; } .contact #contact input:-ms-input-placeholder, .contact #contact textarea:-ms-input-placeholder { color: #d4d4d4; } .contact #contact input::-ms-input-placeholder, .contact #contact textarea::-ms-input-placeholder { color: #d4d4d4; } .contact #contact input::placeholder, .contact #contact textarea::placeholder { color: #d4d4d4; } .contact #contact textarea { height: 100px; max-width: 100%; resize: none; } .contact #contact button { color: #131313; background: #d4d4d4; width: 100%; padding: 10px 20px; text-transform: lowercase; font-family: "Poppins", sans-serif; font-weight: bold; border: none; } .contact #contact .alternative { font-family: "Open Sans", sans-serif; color: #747474; } .contact #contact .alternative a { color: #747474; } /*# sourceMappingURL=contact.css.map */