/***
Header
***/
.header{ 
  width: 100%; 
  height: 124px;
  background: #000;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 100;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 30px;
  transition: all 0.3s linear;
}
.logoWhite{ width: 90px;}
.topNav li{ display: inline-block; text-transform: uppercase; font-size: 14px; margin-left: 34px; font-size: 22px;}
.topNav li a{ display: block; color: #fff;}
.topNav li a.active{ color: #d91f15;}

.homeHeaderBg{
  width: 100%; 
  height: 124px;
  background: #000;
  position: fixed;
  left: 0;
  top: -124px;
  z-index: -1;
  transition: all 0.3s ease-in-out;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 30px;
}
.header.homeHeader{ background: none;}
.homeHeaderBg.homeHeaderBgActive{ top: 0;}

.header.homeHeader .logoWhite { opacity: 0; transition: all 0.3s linear;}
.homeHeaderBg .logoWhite { opacity: 1 !important; transition: all 0.3s linear;}

.burger {
  height: 3em;
  width: 3em;
  position: fixed;
  font-size: 12px;
  cursor: pointer;
  -webkit-transition: .2s all;
  -o-transition: .2s all;
  transition: .2s all;
  -webkit-tap-highlight-color: transparent; 
  right: 16px;
  top: 13px;
  display: none;
}
.burger .burger-lines:after {
  left: 0;
  top: -1em; 
}
.burger .burger-lines:before {
  left: 1em;
  top: 1em; 
}
.burger:after {
  content: '';
  display: block;
  position: absolute;
  height: 150%;
  width: 150%;
  top: -25%;
  left: -25%; 
}
.burger .burger-lines {
  top: 50%;
  margin-top: -0.125em; 
}
.burger .burger-lines, .burger .burger-lines:after, .burger .burger-lines:before {
  pointer-events: none;
  display: block;
  content: '';
  width: 100%;
  border-radius: 0.25em;
  background-color: white;
  height: 0.25em;
  position: absolute;
  -webkit-transform: rotate(0);
  -ms-transform: rotate(0);
  transform: rotate(0);
}
.burger .burger-lines:after {
  left: 0;
  top: -1em; 
}
.burger .burger-lines:before {
  left: 1em;
  top: 1em;
}
.burger.burger-squeeze .burger-lines, .burger.burger-squeeze .burger-lines:after, .burger.burger-squeeze .burger-lines:before {
  -webkit-transition: .2s top .2s, .1s left, .2s transform, .4s background-color .2s;
  -o-transition: .2s top .2s, .1s left, .2s transform, .4s background-color .2s;
  transition: .2s top .2s, .1s left, .2s transform, .4s background-color .2s;
}
.burger.burger-squeeze .burger-lines:after, .burger.burger-squeeze .burger-lines:before {
  width: 2em;
}
.burger.burger-squeeze.open .burger-lines, .burger.burger-squeeze.open .burger-lines:after, .burger.burger-squeeze.open .burger-lines:before {
  -webkit-transition: .2s background-color, .2s top, .2s left, .2s transform .15s;
  -o-transition: .2s background-color, .2s top, .2s left, .2s transform .15s;
  transition: .2s background-color, .2s top, .2s left, .2s transform .15s; 
}
.burger.burger-squeeze.open .burger-lines {
  background-color: transparent;
}
.burger.burger-squeeze.open .burger-lines:before, .burger.burger-squeeze.open .burger-lines:after {
  left: 0.5em;
  top: 0px;
}
.burger.burger-squeeze.open .burger-lines:before {
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.burger.burger-squeeze.open .burger-lines:after {
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

/***
Home Page
***/
body.noScroll{ overflow: hidden;}
.wrapper{ max-width: 1280px; margin: 0 auto;}
.homepageHeader{ background: url(../images/homepage-header-bg.jpg) top center no-repeat; background-size: cover; min-height: 100vh; display: flex; align-items: center;}
.homepageHeaderContent{ padding: 0 130px;}
.mainLogo{ width: 191px; margin-bottom: 80px;}
.homepageHeaderContent h3{ font-family: 'san_francisco_displaybold', Arial; font-size: 80px; color: #fff; text-transform: uppercase;}
.homepageHeaderContent h4{ font-size: 40px; color: #fff;}

.homepageContentRow{padding: 100px 80px; display: flex; justify-content: space-between; align-items: center;}
.homepageContentRow .column{ flex: 1;}
.homepageContentRow .column:first-child{ margin-right: 50px;}

.homepageContentRow h3{ font-size: 80px; color: #000;}
.homepageContentRow h3 span{ font-family: 'san_francisco_displaybold', Arial; }
.homepageContentRow h4{ font-size: 30px; color: #000; margin-bottom: 50px;}
.homepageContentRow p{ font-size: 25px; line-height: 34px; color: #4A4A4A; margin-bottom: 50px;}

.whatis12N{ background: #E8EEEF;}
.team12N{ background: #fff;}
.investments12N{ background: #E8EEEF;}

.overlay{ width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 101; background: rgba(0, 0, 0, 0.5); display: none;}
.aboutModal{ width: 90%; background: #fff; position: fixed; left: 50%; top: 50%; z-index: 102; padding: 50px; transform: translate(-50%, -50%); display: none;}
.aboutModalInner{ max-height: 600px; overflow-y: auto; padding-right: 20px;}
.aboutModal h3{ font-size: 100px; color: #000000; text-transform: uppercase;}
.aboutModal h3 span{ font-family: 'san_francisco_displaybold', Arial;}
.aboutModal h4{ font-family: 'san_francisco_displaylight', Arial; font-size: 40px; color: #000000; margin-bottom: 40px;}
.aboutModal p{ font-size: 25px; line-height: 34px; color: #4A4A4A; margin-bottom: 20px;}
.close {
  position: absolute;
  right: 20px;
  top: 20px;
  width: 32px;
  height: 32px;
  opacity: 0.8;
  display: inline-block;
}
.close:hover {
  opacity: 1;
}
.close:before, .close:after {
  position: absolute;
  left: 15px;
  content: ' ';
  height: 33px;
  width: 4px;
  background-color: #000000;
  border-radius: 10px;
}
.close:before {
  transform: rotate(45deg);
}
.close:after {
  transform: rotate(-45deg);
}
.btnLearnMore{ font-family: 'san_francisco_displaybold', Arial; font-size: 20px; color: #000; text-transform: uppercase; display: inline-block; background: url(../images/arrow.png) left 6px no-repeat; padding-left: 40px; border-bottom: 1px #000 solid; padding-bottom: 18px;}

.collageImg{ text-align: center; margin-top: -130px;}

/***
About
***/
.aboutBackground{ background: url(../images/about-background.jpg) top center no-repeat; background-size: cover;}

.aboutHeader{ height: 255px; background: url(../images/about-bg.jpg) top center no-repeat; background-size: cover; margin-top: 124px; display: flex; align-items: center; justify-content: center;}
.aboutHeader h2{ font-size: 80px; color: #fff;}
.aboutContentOuter{ padding: 0 80px; margin-top: 124px;}
.aboutContentInner{ padding: 50px;}

.aboutContentInner h3{ font-size: 72px; color: #fff; text-transform: uppercase;}
.aboutContentInner h3 span{ font-family: 'san_francisco_displaybold', Arial;}
.aboutContentInner h4{ font-family: 'san_francisco_displaylight', Arial; font-size: 32px; color: #fff; margin-bottom: 40px;}
.aboutContentInner p{ font-size: 18px; line-height: 24px; color: #fff; margin-bottom: 20px;}

/***
Team
***/
.teamBackground{ background: url(../images/team-background.jpg) top center no-repeat; background-size: cover;}
.teamHeader{ height: 255px; background: url(../images/team-header-bg.jpg) top center no-repeat; background-size: cover; margin-top: 124px; display: flex; align-items: center; justify-content: center;}
.teamHeader h2{ font-size: 80px; color: #fff;}
.teamContentOuter{ padding: 0 80px; margin-top: 124px;}
.teamContentInner{ padding:150px 50px; display: flex;}
.teamContentLeft{ width: 440px; flex-shrink: 0; border-right: 1px #fff solid; padding: 40px 0 40px 180px;}
.teamList li{ font-size: 25px; margin-bottom: 30px;}
.teamList li a{ color: #fff;}
.teamList li a.activeTab{ color: #E73625; font-weight: bold;}

.teamContentRight{ flex: 1; padding:40px 0 40px 50px;}
.teamContentRight h4{ font-family: 'san_francisco_displaybold', Arial; font-size: 44px; color: #fff;}
.teamContentRight p{ font-size: 25px; color: #fff;}


/***
Investments
***/
.investmentBackground{ background: url(../images/investment-background.jpg) top center no-repeat; background-size: cover;}

.InvestmentsHeader{height: 255px; background: url(../images/investment-header-bg.jpg) top center no-repeat; background-size: cover; margin-top: 124px; display: flex; align-items: center; justify-content: center;}
.InvestmentsHeader h2{ font-size: 80px; color: #fff;}
.InvestmentsContentOuter{ padding: 0 80px; margin-top: 124px;}
.InvestmentsContentInner{ padding: 50px;}
.InvestmentsContentInner h3{ font-size: 32px; color: #fff; margin-bottom: 30px;}
.investmentCont{ display: flex; flex-wrap: wrap;}
.investmentCont:first-of-type{ margin-bottom: 50px;}
.investmentBox{ background: #fff; width: 20%; height: auto; box-shadow: 0px 7px 17px rgba(0, 0, 0, 0.5); border-radius: 15px; border: 1px #E1E1E1 solid; margin: 0 20px 20px 20px; align-items: center; display: flex; flex-direction: column; padding: 10px; text-align: center;}
.logoCont{ min-height: 130px; display: flex; align-items: center;}
.investmentBox h4{ font-family: 'san_francisco_displaybold', Arial; color: #4A4A4A; font-size: 22px;}
.investmentBox p{ font-size: 18px; color: #7A7A7A; margin-bottom: 20px;}

.btnLearnMoreSmall{ font-family: 'san_francisco_displaybold', Arial; font-size: 12px; color: #000; text-transform: uppercase; display: inline-block; background: url(../images/arrow.png) left 4px no-repeat; background-size: 15px; padding-left: 24px; border-bottom: 1px #000 solid; padding-bottom: 7px;}

/***
Contact
***/
.contactBackground{ background: url(../images/contact-background.jpg) top center no-repeat; background-size: cover;}

.contactContentOuter{ padding: 0 80px; margin-top: 124px;}
.contactContentInner{ padding:150px 50px; display: flex; justify-content: center; flex-direction: column; align-items: center;}
.contactIcon{ width: 184px; height: 184px; background: #fff; box-shadow: 0px 7px 17px rgba(0, 0, 0, 0.5); border-radius: 50%; border: 1px #E1E1E1 solid; display: flex; align-items: center; justify-content: center; margin-bottom: 50px;}
.contactContentInner a{ font-family: 'san_francisco_displaylight', Arial; font-size: 44px; color: #fff;}

/***
Footer
***/
.footer{
  background: #E8EEEF;
  padding: 60px 40px;
}
.bottomMenu{
  text-align: center;
  margin-bottom: 60px;
}
.bottomMenu li{
  display: inline-block;
  text-transform: uppercase;
  font-size: 16px;
  margin: 0 13px;
}
.bottomMenu li a{
  display: block;
  color: #000000;
}
.bottomMenu li a:hover,
.bottomMenu li a.active{
  color: #d91f15;
}
.footerBar{
  display: flex;
  justify-content: space-between;
  flex: 1;
}
.footerBar p{
  font-size: 14px;
  color: #4A4A4A;
}
.footerBar p a{
  color: #4A4A4A;
}

.copyright{ 
  position: absolute;
  width: 100%;
  bottom: 30px;
  left: 0;
  text-align: center;
}
.copyright p{ 
  font-family: 'gothambold';
  font-size: 12px;
  color: #A2A2A2;
  margin-bottom: 10px;
}
.copyright p a{
  color: #A2A2A2;
}