Files

908 lines
18 KiB
CSS

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;
}