body{ font-family: 'Roboto', sans-serif !important; } header{ position:relative; } .offcanvas-collapse { position: fixed; height: 100%; z-index: 999; top: 0; /* Height of navbar */ bottom: 0; right: 100%; left:-300px; width: 300px; padding-right: 1rem; padding-left: 1rem; overflow-y: auto; visibility: hidden; background-color: #01264D; transition-timing-function: ease-in-out; transition-duration: .3s; transition-property: left, visibility; } .offcanvas-collapse { align-items:start; -moz-background-clip: padding; /* Firefox 3.6 */ -webkit-background-clip: padding; /* Safari 4? Chrome 6? */ background-clip: padding-box; /* Firefox 4, Safari 5, Opera 10, IE 9 */ border-right:5px solid rgba(0, 0, 0, 0.2); } /* Makes the nav visibile with the open class */ .offcanvas-collapse.open { left: 0; visibility: visible; } .navbar-expand-lg .navbar-nav { -ms-flex-direction: column; flex-direction: column; } .nav-scroller { position: relative; z-index: 2; height: 2.75rem; overflow-y: hidden; } .nav-scroller .nav { display: -ms-flexbox; display: flex; -ms-flex-wrap: nowrap; flex-wrap: nowrap; padding-bottom: 1rem; margin-top: -1px; overflow-x: auto; color: rgba(255, 255, 255, .75); text-align: center; white-space: nowrap; -webkit-overflow-scrolling: touch; } .u-link-ghost { color: #fff !important; } .c-navigation__trigger { background: transparent; border: 0; } .c-icon { display: inline-block; fill: currentColor; height: 24px; stroke-width: 0; stroke: currentColor; vertical-align: baseline; width: 24px; } .mobileMenu li{ padding:1.5rem 0; } .mobileMenu li a{ font-size: 18px; color: #FFFFFF; transition: color .2s ease; } .mobileMenu li a:hover{ font-size: 18px; color: #FAB266; transition: color .2s ease; text-decoration:none; } .mobileMenu li a img{ max-width: 45px; opacity:1; transition: opacity .2s ease; } .mobileMenu li a img:hover{ opacity:.6; transition: opacity .2s ease; } .mainNav{ list-style-type: none; } .mainNav li{ display:inline-block; padding:0 2rem; } .mainNav li.social { padding: 0 1rem; } .mainNav li:nth-child(5){ padding: 0 1rem 0 2rem !important; } .mainNav li a{ font-size: 18px; color: #FFFFFF; transition: color .2s ease; } .mainNav li a:hover{ font-size: 18px; color: #FAB266; transition: color .2s ease; text-decoration:none; } .mainNav li a img:hover{ opacity:.6; transition: opacity .2s ease; } .mainNav li a img{ max-width:45px; opacity:1; transition: opacity .2s ease; } .top-logo{ display: block; height: 100px; width: 300px; background: url(../images/logo.svg) no-repeat; background-size: 100%; color: transparent; font-size: 0; line-height: 0; } .logo-negative{ background: url(../images/Embark_Logo-01-01.svg) no-repeat; } header{ /* background-image:url(../images/Hero.jpg); */ background-size:cover; background-repeat: no-repeat; padding:3rem 0; position: relative; } .orange-cta-lg{ font-family: 'Roboto', sans-serif; font-size: 18px; font-weight:700; color: #FFFFFF; text-align: center; height: 52px; width: 196.11px; border-radius: 5px; padding: .9rem 2rem; background-color: #FAB266; transition:.2s ease; border: 1px solid transparent; } .orange-cta-lg:hover { transition:.2s ease; color: #FAB266; background-color:transparent; text-decoration:none; border: 1px solid #FAB266; } .pos-rel{ position: relative; } .c-header__background { height: 100%; left: 0; opacity:1; position: absolute; top: 0; width: 100%; background-image: url(../images/Hero.jpg); background-position: center right; background-repeat: no-repeat; background-size: cover; } .inner-header{ padding: 9rem 0px 12rem 0px; } .inner-header h1{ font-family: 'Roboto', sans-serif; font-weight: bold; font-size: 58px; color: #FFFFFF; text-align: left; line-height: 45px; } .inner-header h2 { font-family: 'Roboto', sans-serif; font-size: 24px; color: #FFFFFF; text-align: left; line-height: 24px; margin-top: 1.5rem; margin-bottom: 3rem; } .floating-astro { position: absolute; z-index: 9; left: 3%; bottom: -12.5rem; -webkit-transform: translatey(0px); transform: translatey(0px); -webkit-animation: float 6s ease-in-out infinite; animation: float 6s ease-in-out infinite; max-width: 400px; } .footer-link-cols { padding: 4rem 0 3rem 0; } .footer-link-cols a{ color: #FFFFFF; font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: bold; line-height: 21px; transition: .2s ease; opacity: 1; } .footer-link-cols a:hover{ transition: .2s ease; opacity: .6; text-decoration: none; } .footer-link-cols ul li{ margin-bottom:1.2rem; } .footer-link-cols ul{ margin-top:2rem !important; } .footer-link-cols .footer-widget .social-footer{ list-style-type: none; margin:0; padding:0; } .footer-link-cols .footer-widget .social-footer li a img{ max-width:35px; margin-right:1rem; } .footer-link-cols .footer-widget .widget-header{ font-size: 18px; color: #5D7D97; font-family: 'Roboto', sans-serif; } .footer-link-cols .footer-widget .links-footer{ list-style-type: none; margin:0; padding:0; } .two-cols{ columns: 2; -webkit-columns: 2; -moz-columns: 2; } @-webkit-keyframes float { 0% { -webkit-transform: translatey(0px); transform: translatey(0px); } 50% { -webkit-transform: translatey(-20px); transform: translatey(-20px); } 100% { -webkit-transform: translatey(0px); transform: translatey(0px); } } @keyframes float { 0% { -webkit-transform: translatey(0px); transform: translatey(0px); } 50% { -webkit-transform: translatey(-20px); transform: translatey(-20px); } 100% { -webkit-transform: translatey(0px); transform: translatey(0px); } } @-webkit-keyframes float2 { 0% { -webkit-transform: translatey(0px); transform: translatey(0px); } 50% { -webkit-transform: translatey(-20px); transform: translatey(-20px); } 100% { -webkit-transform: translatey(0px); transform: translatey(0px); } } @keyframes float2 { 0% { -webkit-transform: translatey(0px); transform: translatey(0px); } 50% { -webkit-transform: translatey(-20px); transform: translatey(-20px); } 100% { -webkit-transform: translatey(0px); transform: translatey(0px); } } .right-tool{ background-image: url(../images/rt-bg.jpg); background-size:cover; padding: 6rem 0 0rem 0; height: 100vh; position:relative; } .righttool { display: flex; align-items: center; justify-content: center; flex-direction: column; width: 100%; text-align: center; min-height: 100vh; padding: 6rem 0 6rem 0; background-image: url(../images/rt-bg.jpg); background-size:cover; align-items: center; position:relative; } .explore-more{ position: absolute; bottom: 0; left: 0; right: 0; overflow: hidden; padding-bottom: 3rem; } .right-tool-header { font-size: 76px; line-height: 76px; font-weight: bold; color: #0B476D; max-width: 500px; margin: 0 auto; } .right-tool-sub { font-size: 24px; color: #080E1A; text-align: center; max-width: 500px; margin: 2rem auto 0 auto; } .right-tool-logos { margin-top: 6rem; margin-bottom: 5rem; } .scroll{} .scroll img{ opacity:.41; } .scroll p { font-size: 12px; font-style: italic; margin-top: 10px; color: rgba(2, 2, 2, 0.41); letter-spacing: 0; text-align: center; } .explore-image:before { content: ''; width: 100%; height: 100%; background-color: #FFF !important; position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 0; } .explore-image img { position: relative; z-index: 1; max-width: 560px; margin: 0 auto; display: block; padding: 6rem 0; } .explore-more-blocks{ background-image:url(../images/BG_Stars.jpg); background-position: center right; background-size: cover; background-attachment: fixed; background-repeat: no-repeat; } .white-cta-lg { font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: 700; color: #FAB266; text-align: center; height: 52px; width: 196.11px; border-radius: 5px; padding: .9rem 2rem; background-color: #FFF; transition:.2s ease; border:1px solid transparent; } .white-cta-lg:hover{ text-decoration: none; transition:.2s ease; background-color:transparent; border:1px solid #FFF; color: #FFF; } .explore-content { -webkit-animation: float2 6s ease-in-out; animation: float2 6s ease-in-out; margin: 0 auto; max-width: 575px; padding-right: 3rem; } .explore-content h3{ font-weight:bold; font-size: 50px; color: #FFFFFF; line-height: 50px; margin-bottom: 2.5rem; } .explore-content p{ font-size: 24px; color: #547E99; margin-bottom: 4rem; } .start { background-image: url(../images/JoinCommunity_Embark.jpg); background-size: cover; min-height: 695px; height:100vh; position: relative; /* margin-top: -47px; */ z-index: 99; } .start h2 { max-width: 374px; color: #FFFFFF; font-family: 'Roboto', sans-serif; font-size: 76px; font-weight: bold; line-height: 80px; } .start p { max-width: 517px; color: #FFFFFF; font-family: 'Roboto', sans-serif; font-size: 24px; line-height: 28px; margin: 1.5rem 0 4rem 0; } #eci { padding: 4rem 0; position: relative; } .companiesHeader { font-family: 'Roboto', sans-serif; font-size: 24px; font-weight: bold; letter-spacing: 1.8px; line-height: 28px; color: #0B476D; text-align: center; margin-top: 5rem; margin-bottom: 3rem; } #questions{ background-image: url(../images/SpacePlanetAsteroids_BG.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; position: relative; width: 100%; height: 900px; } .content { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-justify-content: center; justify-content: center; position: absolute; top: 0; bottom: 0; left: 30px; right: 30px; } .content h2 { color: #FFFFFF; font-family: 'Roboto', sans-serif; font-size: 76px; font-weight: bold; line-height: 80px; max-width: 386px; margin-bottom: 4rem; } .updates { /* background-image: linear-gradient(180deg, #00173D 0%, #5D7D97 88%); */ padding: 3.5rem 0; position: relative; z-index: 999; } .signupLabel { color: #0B476D; font-family: 'Roboto', sans-serif; font-size: 24px; line-height: 28px; margin-right: 1rem; } .subEmailInput { width: 253px !important; color: #080E1A !important; font-family: 'Roboto', sans-serif; font-size: 18px !important; line-height: 21px !important; background-color: rgba(174,206,227,0.5) !important; border: 0 !important; border-radius: 2px !important; height: 40px; } .btn-sub { width: 193px; border-radius: 2px; background-color: #FAB266; height: 40px; border: 0; text-transform: uppercase; color: white; font-family: 'Roboto', sans-serif; font-size: 18px; font-weight: bold; line-height: 21px; } .rocket-ship img{ position: absolute; z-index: -5; bottom: 0; width: 100%; bottom: -107px; } .subForm { max-width: 725px; margin: 0 auto 0 auto; } footer { background-color: #01264D; position: relative; z-index: 999; } .footer-astro { position: absolute; bottom: 0; top: 18rem; max-width: 42%; left: 6%; -webkit-transform: translatey(0px); transform: translatey(0px); -webkit-animation: float 6s ease-in-out infinite; animation: float 6s ease-in-out infinite; } .disable-desktop{ display: none; } .disable-mobile{ display: block; } @media only screen and (max-width: 1200px) { .explore-content { padding-right: 1rem; padding-left: 2rem; } } @media only screen and (max-width: 1170px) { .rocket-ship img{ bottom: -79px; } } @media only screen and (max-width: 1024px) { .footer-astro { left: 1%; } #questions { height: 700px; } .explore-content { padding-right: 1rem; padding-left: 2rem; } } @media only screen and (max-width: 991px) { .explore-more { position: relative; } .right-tool { height: 100%; position: relative; } .subEmailInput { width: 239px !important; } .content h2 { font-size: 65px; line-height: 64px; } .explore-content h3 { font-size: 40px; } .explore-content p { font-size: 20px; } .explore-content { padding-right: 1rem; padding-left: 2rem; } } @media only screen and (max-width: 840px) { .rocket-ship img{ bottom: -55px; } } @media only screen and (max-width: 768px) { .footer-widget{ text-align:center; } .two-cols { columns: 1; -webkit-columns: 1; -moz-columns: 1; } .c-header__background { background-position: bottom; } .floating-astro { left: 10%; bottom: -7.5rem; max-width: 270px; } .explore-content { margin: 0 auto; max-width: 100%; padding-right: 3rem; padding-left: 3rem; } .explore-content p { font-size: 20px; } .signupLabel { font-size: 18px; } .explore-content { padding: 4rem 1rem 5rem 1rem; } .signupLabel { margin-right: 0rem; width: 100%; text-align: center; margin: 0 auto !important; display: block !important; margin-bottom: 3rem !important; } #questions { height: 500px; } .footer-astro { display: none; } } @media only screen and (max-width: 767px) { .disable-desktop{ display: block; } .disable-mobile{ display: none; } } @media only screen and (max-width: 600px) { .rocket-ship img{ bottom: 0; } .c-header__background { background-position: center; } .inner-header h1 { font-size: 48px; } .inner-header h2 { font-size: 20px; line-height: 30px; } .floating-astro { bottom: -7.5rem; max-width: 200px; } .right-tool-header { font-size: 48px; line-height: 56px; } .right-tool-sub { font-size: 20px; } .explore-image img { padding: 2rem; } .explore-content { padding: 4rem 1rem 5rem 1rem; } .start h2 { font-size: 48px; line-height: 52px; } .start p { font-size: 20px; line-height: 26px; } .explore-more-blocks { background-image: url(../images/BG_Stars.jpg); background-position: center right; background-size: auto; background-attachment: fixed; background-repeat: repeat; } .container-text { padding-bottom: 88%; } .content h2 { font-size: 50px; line-height: 49px; } .footer-astro { display: none; } .signupLabel { width: 100%; margin:0; } .subForm .form-group{ width:100%; } .subEmailInput { width: 100% !important; display: block !important; } .btn-sub { display: block !important; width: 100%; } .explore-content h3 { font-size: 42px; } #questions{ height: 400px; } } @media only screen and (max-width: 375px) { .c-header__background { background-position: center; } .inner-header h1 { font-size: 48px; } .inner-header h2 { font-size: 20px; line-height: 30px; } .floating-astro { bottom: -7.5rem; max-width: 200px; } .right-tool-header { font-size: 48px; line-height: 56px; } .right-tool-sub { font-size: 20px; } .explore-image img { padding: 2rem; } .explore-content { padding: 4rem 1rem 5rem 1rem; } .start h2 { font-size: 48px; line-height: 52px; } .start p { font-size: 20px; line-height: 26px; } .explore-more-blocks { background-image: url(../images/BG_Stars.jpg); background-position: center right; background-size: auto; background-attachment: fixed; background-repeat: repeat; } .container-text { padding-bottom: 88%; } .content h2 { font-size: 50px; line-height: 49px; } .footer-astro { display: none; } .subForm .form-group{ width:100%; } .subEmailInput { width: 100% !important; display: block !important; } .btn-sub { display: block !important; width: 100%; } .explore-content h3 { font-size: 42px; } #questions{ height: 400px; } } .onlyMobile{ display:none; } .onlyDesktop{ display:block; } @media (max-width:1200px){ .mainNav li { padding: 0 1.5rem; } } @media (max-width:991px){ .onlyMobile{ display:block; } .onlyDesktop{ display:none; } } .text-gray-blue { color:#5D7D97 !important; } .meet-the-team-heading { color:#0B476D !important; font-weight: 800; font-size: 50px } .hover-shadow:hover{ text-decoration: none; } .gradient-hex { margin-top: -700px; }