/* CSS Document */

/*============== Base Styles ==============*/

body {
 margin: 0;
 padding:0;
 color: #ffffff;
 background:#ffffff;
 font-size: 16px;
 font-family: 'Lato', sans-serif;
 font-weight: 400;
 letter-spacing: 1px;
}
table {
 border-collapse:collapse;
}
p, h1, h2, h3, h4, h5, h6 {
margin-top: 0px;
}

/*  links */
a {
 text-decoration:none;
}
a:hover {
 text-decoration:none;
}
a img {opacity: 1.0;}
a:hover img {opacity: 0.6;}

/*  headers */
h1, h2, h3, h4, h5, h6 {
 font-family: 'Lato', sans-serif;
 font-weight: 700;
 color:#ffffff;
 text-transform: uppercase;
}
h1 {font-size: 31px; line-height: 31px; margin-top: 0px;}
h2 {font-size: 19px; line-height: 19px; margin-top: 0px;}

/*============== Header ==============*/
.clear {clear: both !important;}
.no-border {border: 0px !important;}

/*  triangles and plus */
.triangle {
 width:0; 
 height:0; 
 border-bottom:46px solid #C33D27; 
 border-left:46px solid transparent;
 position: absolute;
 bottom:0px; 
 right:0px; 
 opacity: 0;
 z-index: 1;
}
.plus-sign {position: absolute; bottom: 4px; right: 11px; z-index: 2;}
.plus-sign div{
 background:#ffffff;
 width:4px;
 height:18px;
 position:relative;
 margin-left:7px;
}
.plus-sign div:before {
 background:#ffffff;
 content:"";
 width:18px;
 height:4px;
 position:absolute;
 top:7px;
 left:-7px;
}
div.plus:hover .triangle {opacity: 1; z-index: 1;}
.triangle:hover {opacity: 1;}
.boxlink {position: absolute; top: 0; left: 0; bottom: 0; right: 0;}

/*  gutter styles */
.north {border-top:#EBEBEB 12px solid;}
.east {border-right:#EBEBEB 12px solid;}
.south {border-bottom:#EBEBEB 12px solid;}
.west {border-left:#EBEBEB 12px solid;}

/* Width Check */
#widthCheck {display:none; z-index: 2; position: absolute;}


/*============== Header ==============*/

#header {height: 130px; width: 100%;}
#logo {margin-top: 35px;}
#nav {margin-top: 60px;}
#nav ul {list-style: none; float: right; margin:0px; padding: 0px;}
#nav .navigation li {float: left; padding: 0px 0px 48px 45px; position: relative;}
#nav .navigation li.b {padding-left: 0px;}
#nav .navigation li a {font-size: 22px; color: #15252d; text-transform: uppercase; line-height: 22px; padding-bottom: 4px;}
#nav .navigation li:hover a {border-bottom: 6px solid #C33D27;}
#nav .navigation ul.sub {
 display: none; 
 list-style: none;
 position: absolute; 
 top:73px;
 left:45px;
 width:300px; 
 box-sizing:border-box;
 background-color: #C33D27;
 z-index:1000;
}
#nav .navigation li.b ul.sub {left: 0px !important;}
#nav .navigation ul.sub li {border-bottom: 2px solid #F18578; width: 100%; padding: 20px 0px 20px 15px;}
#nav .navigation ul.sub li a {font-size: 19px; line-height: 19px; color: #ffffff;}
#nav .navigation ul.sub li:hover {background-color: #F18578;}
#nav .navigation ul.sub li:hover a {border-bottom: 0px;}


/*============== Main ==============*/

#main {padding: 55px 12px 90px 12px; background-color: #EBEBEB; width: 100%; clear: both;}
#projects {padding: 0px; margin: 0px; overflow: hidden;}
#news {background-color: #1C3543; height: 480px; position: relative; padding: 30px 20px 30px 30px; font-size: 19px; line-height: 23px;}
#stock {background-color: #0F5275; padding: 30px 10px 65px 15px; font-size: 25px; line-height: 30px; font-weight: 700;}
.up {color: #8dc63f;}
.down {color: #FF0000;}
#investor {background-color: #16252C; padding: 30px 10px 30px 15px; text-align: center;}
#investor h2 {text-align: left;}
#team {
 background-color: #1C445B; 
 padding: 30px 15px 30px 25px; 
 font-size: 19px; 
 line-height: 22px; 
 background-image: url(../img/team@2x.png); 
 background-position: left 25px bottom 30px; 
 background-repeat: no-repeat;
 background-size: 90px 73px;
}
#team h2 {margin-bottom: 6px;}
/*#team img {padding-top: 40px;}*/



/*============== News ==============*/

#news h2 {margin-bottom: 10px;}
.news_description {display: none;}
.news_title {position: relative;}
.news_title .plus_hold {display: none;}
.news_title a {color: #ffffff; z-index: 2;}
.news_title a:hover {color: #B4B4B4;}
.news_item {padding-bottom: 35px;}

/*============== Slider ==============*/

.flexslider {border:0px; background-color: transparent; position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; margin: 0px;} 
.flexslider ul.slides {position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; z-index: 1;}
.flexslider ul.slides li {top: 0px; right: 0px; bottom: 0px; left: 0px;}
#projects .flex-control-nav {bottom: 15px; left:20px; text-align: left; z-index: 2;}
#projects .flex-control-paging li a {background: #7d7d7d; background: rgba(125, 125, 125, 0.9); box-shadow: none; width: 14px; height: 14px;}
#projects .flex-control-paging li a.flex-active {background: #ffffff; background: rgba(255, 255, 255, 0.75);}
#projects #slide1 {background-size: cover; background-position: center center; background-image: url(../../../../_resources/home-slider/slide1-bg.jpg);}
#projects #slide2 {background-size: cover; background-position: center center; background-image: url(../../../../_resources/home-slider/slide2-bg.jpg);}
#timeline #slide1 {background-size: cover; background-position: center center; background-image: url(../../../../_resources/home-timeline/timeline-1b.jpg);}
#timeline #slide2 {background-size: cover; background-position: center center; background-image: url(../../../../_resources/home-timeline/timeline-2c.jpg);}
#timeline #slide3 {background-size: cover; background-position: center center; background-image: url(../../../../_resources/home-timeline/timeline-3.jpg);}
#timeline a {position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px;}
/* text */
.title-bar h1 {margin: 0px; padding: 0px; z-index: 3; position: relative; font-size: 31px; line-height: 31px;}
h1.large {font-size: 60px; line-height: 70px; margin: 50px 50px 0px 30px;}
.title-bar {padding: 15px 15px 15px 30px; background-color: #C33D27; display: inline-block; position: relative;}
.title-bar:after {
 content: '';
 -webkit-transform: rotate(18deg);
 -webkit-transform-origin: bottom right;
 -ms-transform: rotate(18deg);
 -ms-transform-origin: bottom right;
 transform: rotate(18deg);
 transform-origin: bottom right;  
 height: 150%;
 width: 100%;
 background-color: #C33D27;
 position: absolute;
 right: 0px;
 bottom: 0px;
 z-index: 2;
}
#timeline {overflow: hidden;}
#timeline .caption {margin: 30px 0px 0px 25px;}
#timeline .logo {float: left; margin-right: 12px;}
#timeline .dates {float: left; font-size: 19px; line-height: 19px;}
#timeline .dates h3 {font-size:32px; line-height: 32px; margin: 0px;}
#timeline .logo img {width: 110px; margin-bottom: 15px;}
#timeline #slide1 .logo img {width: 110px; padding-left: 15px; padding-right: 15px;}
/* Timebar */
#timebar {
 font-size:19px; 
 line-height:29px;
 height: 29px;
 background-color: #cccccc; 
 background-color: rgba(204, 204, 204, 0.79);
 position: absolute;
 bottom: 0px;
 left: 0px;
 right: -2px;
 z-index: 1;
 text-align: justify;
 overflow: hidden;
}
#timebar:after {
 content: "";
 display: inline-block;
 width: 100%;
}
#timebar span {padding: 5px 5px; position: relative;}
#timebar span a {z-index: 2; position: relative;}
#timebar span.active, #timebar span.active2 {background-color: #C33D27;}
#timebar span.active:after, #timebar span.active2:after {
 content: '';
 -webkit-transform: rotate(18deg);
 -webkit-transform-origin: bottom right;
 -ms-transform: rotate(18deg);
 -ms-transform-origin: bottom right;
 transform: rotate(18deg);
 transform-origin: bottom right;  
 height: 200%;
 width: 50%;
 background-color: #C33D27;
 position: absolute;
 right: -10px;
 bottom: -5px;
 z-index: 1; 
}
#timebar span.active:before, #timebar span.active2:before {
 content: '';
 -webkit-transform: rotate(18deg);
 -webkit-transform-origin: top left;
 -ms-transform: rotate(18deg);
 -ms-transform-origin: top left;
 transform: rotate(18deg);
 transform-origin: top left;  
 height: 200%;
 width: 50%;
 background-color: #C33D27;
 position: absolute;
 left: -10px;
 top: -5px;
 z-index: 1; 
}
#timebar span:nth-child(1) {padding-left: 15px;}
#timebar span:nth-child(3) {padding-right: 15px;}


/*============== Footer ==============*/

#footer {padding: 50px 0px;}
#footer .row {padding: 0px 12px;}
#foot-nav {line-height: 40px; color: #000000; font-size: 19px; float: left; margin-right: 30px;}
#foot-nav a {color: #000000;}
#foot-nav a:hover {opacity:0.6;}
#social {float: right; margin-right: 70px;}
#social img {margin-left: 30px;}
#social a:nth-child(1) img {margin-left: 0px;}
#email {float: right;}
#form-password {display: none;}
#form-email {font-size: 19px; line-height: 40px; width: 290px; height: 40px; background-color: #242424; border: 0px; padding-left: 15px; float: left;}
#signup_message {color: #000000; width: 350px;}
#signup_message .error {color: red;}
#form-submit {width: 60px; height: 40px; line-height: 34px; background-color: #fff; border: 2px solid #242424; box-sizing: border-box; float: left; color: #242424; font-weight: 700; font-size: 40px; transition:0.5s ease-in-out;}
#form-submit:hover {background-color: #242424; color: #ffffff;}

/*============== Mobile ==========*/

.mobile-show {display: none !important;}
#menu-icon{
 width: 23px;
 height: 18px;
 position: relative;
 -webkit-transition: .5s ease-in-out;
 -moz-transition: .5s ease-in-out;
 -ms-transition: .5s ease-in-out;
 transition: .5s ease-in-out;
 cursor: pointer;
 top: 15px;
 left: 15px;
 z-index: 1;
}
#menu-icon span{
 display: block;
 position: absolute;
 height: 4px;
 width: 100%;
 background: #A3A1A2;
 /*border-radius: 4px;*/
 opacity: 1;
 left: 0;
}
#menu-icon span:nth-child(1) {
 top: 0px;
 -webkit-transition: .25s ease-in-out;
 -moz-transition: .25s ease-in-out;
 -ms-transition: .25s ease-in-out; 
 transition: .25s ease-in-out;
}
#menu-icon span:nth-child(2) {
 top: 7px;
 -webkit-transition: .5s ease-in-out;
 -moz-transition: .5s ease-in-out;
 -ms-transition: .5s ease-in-out; 
 transition: .5s ease-in-out;
}
#menu-icon span:nth-child(3) {
 top: 14px;
 -webkit-transition: .75s ease-in-out;
 -moz-transition: .75s ease-in-out;
 -ms-transition: .75s ease-in-out; 
 transition: .75s ease-in-out;
}
#menu-icon.open span:nth-child(1) {opacity: 0; left: -16px;}
#menu-icon.open span:nth-child(2) {opacity: 0; left: -16px;}
#menu-icon.open span:nth-child(3) {opacity: 0; left: -16px;}
#mobile-header {height: 45px; position: fixed; top: 0px; width: 100%; box-sizing:border-box; z-index: 1000; display: none;}
#mobile-menu {display: none; background-color: #fff; height: 45px; width: 100%; top: 0px; position: absolute; z-index: 0;}
#mobile-logo {float: right; padding-right: 15px; padding-top: 3px;}
#mobile-close {float: left; margin-left: 15px; margin-top: 20px; width: 14px; height: 14px; position: relative;}
#mobile-close span {
 display: block;
 position: absolute;
 height: 2px;
 width: 100%;
 background: #C33D27;
 /*border-radius: 4px;*/
 opacity: 1;
 left: 0px;
}
#mobile-close span:nth-child(1) {
 top: 0px;
 -webkit-transform: rotate(50deg);
 -ms-transform: rotate(50deg);
 transform: rotate(50deg);
}
#mobile-close span:nth-child(2) {
 top: 0px;
 -webkit-transform: rotate(-50deg);
 -ms-transform: rotate(-50deg);
 transform: rotate(-50deg);
}

/* Mobile Nav ==========*/

#mobile-menu ul.navigation {
 list-style: none; 
 width: 100%;  
 top:45px;
 position: absolute;
 margin: 0px;
 display:none;
 height: auto;
 padding: 0px;
 text-align: center;
 max-height: 89vh;
 overflow-y: scroll;
 -webkit-overflow-scrolling: touch;
}
#mobile-menu ul.navigation li {display: block; padding: 10px 0px; background-color: rgb(195, 61, 39); background-color: rgba(195, 61, 39, 0.95);}
#mobile-menu ul.navigation li.hover {background-color: rgb(241, 133, 120); background-color: rgba(241, 133, 120, 0.95);}
#mobile-menu ul.navigation li.hover a {border-bottom: 1px #FFFFFF solid; padding: 2px 0px;}
#mobile-menu ul.navigation li a {font-size:16px; text-transform: uppercase; color: #ffffff; line-height: 16px; cursor: pointer;}
#mobile-menu .navigation ul.sub {
 display: none;
 padding: 10px 0px;
 margin: 0px; 
}
#mobile-menu .navigation ul.sub li {background-color: transparent; padding: 5px 0px;}
#mobile-menu .navigation ul.sub li a {font-size:14px; text-transform: uppercase; border-bottom: none; line-height: 14px;}


/*============== RESPONSIVE ADJUSTMENTS ==============*/

@media (max-width: 1285px) {
h1.large {font-size: 60px; line-height: 65px; margin: 60px 0px 0px 30px;}
}
@media (max-width: 1209px) {
#social {float: left; margin-top: 15px;}
}
@media (max-width: 1130px) {
#timebar span.active:before, #timebar span.active2:before {left:-5px;}
#timebar span.active:after, #timebar span.active2:after {right:-5px;}
}
@media (max-width: 999px) {
#nav ul {float: left;}
#nav {margin-top: 48px;}
#widthCheck {z-index: 1;}
#timebar {font-size:15px; }
#timebar span {padding: 7px 5px;}
#timebar span.active:before, #timebar span.active2:before {left: -3px;}
#timebar span.active:after, #timebar span.active2:after {right: -3px;}
#team {padding-bottom: 100px;}
}
@media (max-width: 850px) {
#email {float: left; margin: 10px 200px 0px 0px;}
#social {margin-top: 15px;}
h1.large {font-size: 40px; line-height: 45px; margin: 60px 0px 0px 30px;}
}
@media (max-width: 800px) {
#nav .navigation li {padding: 0px 0px 48px 28px;}
#nav .navigation ul.sub {left:28px;}
}
@media (max-width: 736px) {
.mobile-show {display:block !important;}
#mobile-header {display: block;}
#nav {display: none;}
#logo {text-align: center;}
#widthCheck {z-index: 0;}
#projects, #timeline {height: 300px !important;}
#timebar span.active:before, #timebar span.active2:before {left: -9px;}
#timebar span.active:after, #timebar span.active2:after {right: -9px;}
#main {padding: 40px 12px 40px 12px;}
#footer {padding: 30px 0px;}
}
@media (max-width: 568px) {
h1.large {font-size: 30px; line-height: 35px; margin: 50px 0px 0px 30px;}
.title-bar h1 {font-size: 25px; line-height: 25px;}
}
@media (max-width: 500px) {
#foot-nav {line-height: 24px;}
#social {margin-right: 15px;}
#timebar span.active:before, #timebar span.active2:before {left: 0px;}
#timebar span.active:after, #timebar span.active2:after {right: 0px;}
}
@media (max-width: 450px) {
.title-bar {padding: 10px 10px 10px 15px;}
.title-bar h1 {font-size: 20px; line-height: 20px;}
#timebar {font-size:13px; }
#timebar span {padding: 8px 0px;}
#timebar span:nth-child(1) {padding-left: 5px;}
#timebar span:nth-child(3) {padding-right: 5px;}
}
@media (max-width: 400px) {
#email, #email form {width: 100%; box-sizing: border-box;}
#form-email {width: 70%;}
#form-submit {width: 20%;} 
#social img {margin-left: 23px;}
}

/*Sep 2023 */

.button{ margin-top: 10px;font-size: 15px;font-family: 'Lato', sans-serif; sans-serif;font-weight: 600;line-height: normal;color: #ffffff;background-color: #C33D27 !important;text-align: center;padding: 10px 30px;border: 1px solid #C33D27;display: inline-block;cursor: pointer;transition: all 0.25s ease-in-out;}
#consent-modal { position: fixed; top: 0; right: 0; bottom: 0; left: 0; display: flex; align-items: center; justify-content: center; z-index: 100000; opacity: 0; pointer-events: none; transition: all 0.25s ease-in-out; }
#consent-modal.show { opacity: 1; pointer-events: all; overflow-y: hidden; }
#consent-modal::before { content: ''; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 100000; background-color: #000000; opacity: 0.5; }
#consent-modal > div {color:#15252d; box-sizing: border-box; position: relative; z-index: 100001; width: 100%; max-width: 700px; background-color: #ffffff;    /*border: solid 1px #000000;*/ box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.2); padding: 40px 80px 40px 30px; }
#consent-modal .close { position: absolute; top: 10px; right: 20px; cursor: pointer; display: block; }
#consent-modal .close span { text-decoration: underline; }
/*#consent-modal .close::after { content: '\f00d'; margin-left: 6px; font-family: "Font Awesome 5 Pro"; display: inline-block; }*/
#consent-modal .content { display: flex; }
#consent-modal .content > div *:first-child { margin-top: 0px; }
#consent-modal input[type="checkbox"] { -webkit-appearance: checkbox; margin: 10px 20px 0px 0px; min-width: 20px; }
@media screen and (max-width:767px) {
  #consent-modal > div { padding: 40px 40px 40px 20px; }
}

.grecaptcha-badge { display: none !important;}
.grecaptcha-badge.show { display: block !important; visibility: visible !important;}