/* Gulf Blue : #0a377b;
*/
@font-face {
  font-family: "Clarity free";
  src: url("../fonts/Clarity free.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
a:focus, a:hover{text-decoration: none;}
.errors{position: relative; background: none; }
.errors h1{color: #0a377b !important;}
.sidebar_link a {font-size: 16px; color: #0a377b !important; line-height: 28px;}
.errors h5{color: #0a377b !important; text-align: center;}
.topbar .company-infos li a:focus, a:hover{color: #c2c2c2 !important;}
.navbar-default{box-shadow: none;}
.navbar-brand{padding: 5px 5px 5px 15px;}
.navbar-default .navbar-nav li{text-transform: capitalize;}

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover
{background: none; color: #fff !important; border: none; box-shadow: none; opacity: 1;}
.navbar-default .navbar-nav .list-unstyled li a{
line-height: 28px;
float: left;
color: #384254;
font-size: 1.1em;
font-weight: normal;
border-top: none;
padding: 2px 0 0 0;
}
/*.navbar-default .navbar-nav li a:hover {
    color: #fff;
    opacity: 1;
    border-top: 3px solid #fff;}*/

.home-services {
    width: 100%;
    float: left;
    padding: 50px 0;
    background: url(https://s3-ap-southeast-1.amazonaws.com/gulfcryo/images/parallax-bg2.jpg) bottom center no-repeat #fff; }
    

.solutions {
    width: 100%;
    float: left;
    padding-top: 100px;
    background: url(https://s3-ap-southeast-1.amazonaws.com/gulfcryo/images/parallax-bg1.jpg) bottom center no-repeat #fff;}

.latest-news {
    width: 100%;
    float: left;
    padding-top: 100px;
    background: url(https://s3-ap-southeast-1.amazonaws.com/gulfcryo/images/parallax-bg1.jpg) bottom center no-repeat #fff;    }

.topbar .company-infos li{margin-left: 20px;}
.grid-demo h5{margin-top: 10px; margin-bottom: 5px;}

.gulf {
    background: #0a377b; font-size: 16px !important;
    color: #fff;
    padding: 30px 25px;}

.fact-box{margin: 5px 0;}
.latest-news, .solutions, .about-predio{padding-top: 20px;}


.team-box figure figcaption h5{font-size: 13px;
text-align: center;}

.section-titles .main-title{font-size:30px; font-family: calibri; text-align: left;}
.int-header {
    width: 100%;
    height: 260px;}
.int-header .page-title {
    font-size: 45px;
    color: #fff;
    font-weight: 700;}

.site-content{padding: 50px 0;}
.section-titles .title-intro{margin-bottom: 20px;}

.home_box{width: 100%; height: 100px;/* border: 1px solid #d2d2d2;*/}
.about-predio{ background:#f0f0f0; }
.with-image2{width:300px !important; background:url(../images/image66.png) right bottom no-repeat; background-color:#fff; background-size:auto 95%;}


/* Slider text*/

.predio-slider .hero-content{  padding: calc(60vh - 100px) 0;}
.predio-slider .hero-content .text1 {font-family: 'Volkhov', serif; color:#0a377b; font-size:55px; font-weight:700; 
margin-bottom:20px; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);position: relative;left: 10%;}
.predio-slider .hero-content .text2{ font-family: calibri;  bottom:20px;
text-shadow: -3px -2px 15px gray; line-height: 60px; font-weight:400; width: 80%; 
font-size:55px; color:#fff; padding-left:0px; text-align: center; font-size: 40px;left: 10%;top: 20%;}

/* Home Video */
.video{ width:100%; float:left; padding:100px 0; text-align:center; position:relative; overflow:hidden;}
.video .video-container{ width:100%; height:100%; position:absolute; left:0; top:0; z-index:2;}
.video .video-container:after{content:''; width:100%; height:100%; position:absolute; left:0; top:0;background:none; /*background:#384254; -o-object-fit:cover; object-fit:cover; mix-blend-mode:exclusion;*/ }
.video .video-container video{ min-width:100%; min-height:100%; /*-webkit-filter:grayscale(100%) contrast(1.2); filter:grayscale(100%) contrast(1); opacity:0.6;*/}
.video .image-container{ width:100%; position:absolute; left:0; top:0; z-index:2;}
.video .image-container:after{content:''; width:100%; height:100%; position:absolute; left:0; top:0; background:none;-o-object-fit:cover; object-fit:cover; mix-blend-mode:exclusion; }
.video .image-container img{ min-width:100%; min-height:100%; /*-webkit-filter:grayscale(100%) contrast(1.2); filter:grayscale(100%) contrast(1); opacity:0.6;*/}

.footer {padding-top: 30px;margin-top: 0;}
.footer .sub-footer{margin-top:20px;}
.footer .footer-inner-bar{padding: 0;border-bottom:none;margin-bottom:0;}
/* Footer Menu */
.footer .footer-menu li{ width:100%; float:left; margin:2px 0; list-style:none;}
.footer .footer-menu li:before{content:none; width:4px; height:4px; float:left; border-radius:50%; background:#fff; margin-top:8px; margin-right:10px;}

.footer .footer-menu li a{ float:left; color:#fff;}
.footer .footer-menu li a:hover{text-decoration:none; color:#fff;}

.price-box{width: 100%;
    float: left;
    padding: 20px;
    border: 1px solid #eee;
    text-align: center;}

.post-box .post-content .post-title a{color:#0a377b; }
.post-box .post-content .readmore-btn{color:#0a377b;}
.footer img{float: left;}
.fun-facts .fact-box h6{color:#a4a3a3; }
.fun-facts .fact-box i{color:#0a377b;}


/** typing ***/
.typewriter h2 {
  overflow: hidden; /* Ensures the content is not revealed until the animation */
  border-right: .15em solid orange; /* The typwriter cursor */
  white-space: nowrap; /* Keeps the content on a single line */
  margin: 0 auto; /* Gives that scrolling effect as the typing happens */
  letter-spacing: .15em; /* Adjust as needed */
  animation: 
    typing 3.5s steps(40, end),
    blink-caret .75s step-end infinite;
}

/* The typing effect */
@keyframes typing {
  from { width: 0 }
  to { width: 100% }
}

/* The typewriter cursor effect */
@keyframes blink-caret {
  from, to { border-color: transparent }
  50% { border-color: orange; }
}



/* Button */
.button {
  border-radius: 4px;
  background-color: #0a377b;
  border: none;
  color: #FFFFFF;
  text-align: center;
  font-size: 15px;
  padding: 8px;
  width: 180px;
  transition: all 0.5s;
  cursor: pointer;
  margin: 5px;
  font-weight: bold;
}

.button span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
}

.button span:after {
  content: '\00bb';
  position: absolute;
  opacity: 0;
  top: 0;
  right: -20px;
  transition: 0.5s;
}

.button:hover span {
  padding-right: 25px;
}

.button:hover span:after {
  opacity: 1;
  right: 0;
}
.site-content .lead{text-align: left;}
.site-content {text-align: justify;}
.table-responsive {text-align: left;}
.table-condensed{width: 100%;}
.panel-group .panel-body{padding: 0 25px 10px 25px;} 
.panel-group .panel-body p{color: #384254;}
/* Modal */
.modal-header{border: none;}
.modal-footer{border: none;}
.modal-content{background-color: #fff !important ; background: url(../images/parallax-bg2.jpg) bottom left no-repeat;}

/* Timeline */
.timeline h3{font-size: 16px !important; font-weight: bolder;}
.timeline p{font-size: 13px;line-height: 16px;}
.timeline-content{padding-bottom: 10px;}
.timeline-content{padding-left: 15px;}
.timeline-split .timeline-info, .timeline-centered .timeline-info{padding-right: 15px;}
.form-group{width: 50%; float: left;}

/*Stack Slide Show*/
.image_slides { cursor: pointer; min-height: 210px;}

.image_slides:hover .image_slide:nth-child(4) {
  -moz-transform: rotate(10deg) translateX(30px);
  -ms-transform: rotate(10deg) translateX(30px);
  -webkit-transform: rotate(10deg) translateX(30px);
  transform: rotate(10deg) translateX(30px);
}

.image_slides:hover .image_slide:nth-child(3) {
  -moz-transform: rotate(3deg) translateX(55px);
  -ms-transform: rotate(3deg) translateX(55px);
  -webkit-transform: rotate(3deg) translateX(5px);
  transform: rotate(3deg) translateX(55px);
}5

.image_slides:hover .image_slide:nth-child(2) {
  -moz-transform: rotate(-4deg) translateX(-40px);
  -ms-transform: rotate(-4deg) translateX(-40px);
  -webkit-transform: rotate(-4deg) translateX(-40px);
  transform: rotate(-4deg) translateX(-40px);
}

.image_slides:hover .image_slide:first-child {
  -moz-transform: rotate(-8deg) translateX(-45px) translateY(-10px);
  -ms-transform: rotate(-8deg) translateX(-45px) translateY(-10px);
  -webkit-transform: rotate(-8deg) translateX(-45px) translateY(-10px);
  transform: rotate(-8deg) translateX(-45px) translateY(-10px);
}

.image_slide {
  position: absolute;
  /*top: 50%;
  left: 40%;*/
  height: auto;
  width: 200px !important;
  /*margin-top: -110px;*/
  margin-left: 15px;
  border: 5px solid #fff;
  border-bottom-width: 15px;
  -moz-box-shadow: 0 2px 5px rgba(30, 30, 30, 0.25);
  -webkit-box-shadow: 0 2px 5px rgba(30, 30, 30, 0.25);
  box-shadow: 0 2px 5px rgba(30, 30, 30, 0.25);
  z-index: 2;
  -moz-transition: -moz-transform 0.3s ease-in-out;
  -o-transition: -o-transform 0.3s ease-in-out;
  -webkit-transition: -webkit-transform 0.3s ease-in-out;
  transition: transform 0.3s ease-in-out;
}

.image_slide:first-child {
  -moz-transform: rotate(8deg);
  -ms-transform: rotate(8deg);
  -webkit-transform: rotate(8deg);
  transform: rotate(8deg);
}

.image_slide:nth-child(2) {
  -moz-transform: rotate(2deg);
  -ms-transform: rotate(2deg);
  -webkit-transform: rotate(2deg);
  transform: rotate(2deg);
}

.image_slide:nth-child(3) {
  -moz-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  -webkit-transform: rotate(-3deg);
  transform: rotate(-3deg);
}

.image_slide:nth-child(4) {
  -moz-transform: rotate(-10deg);
  -ms-transform: rotate(-10deg);
  -webkit-transform: rotate(-10deg);
  transform: rotate(-10deg);
}

.image_slide:last-child {
  -moz-transform: rotate(-5deg);
  -ms-transform: rotate(-5deg);
  -webkit-transform: rotate(-5deg);
  transform: rotate(-5deg);
}

.image_slide.slide-right {
  -moz-transform: rotate(290deg) translateX(250px);
  -ms-transform: rotate(290deg) translateX(250px);
  -webkit-transform: rotate(290deg) translateX(250px);
  transform: rotate(290deg) translateX(250px);
}

.image_slide.slide-left {
  -moz-transform: rotate(-290deg) translateX(-250px);
  -ms-transform: rotate(-290deg) translateX(-250px);
  -webkit-transform: rotate(-290deg) translateX(-250px);
  transform: rotate(-290deg) translateX(-250px);
}

.image_slide.back { z-index: 1; }

.carousel-control.left, .carousel-control.right{background: none;}

.project_block{margin:20px 0; padding-bottom: 20px; border-bottom:1px solid #d2d2d2;}


/**** Down Arrow ****/
.arrows {
  width: 60px;
  height: 72px;
  position: absolute;
  left: 95%;
  margin-left: -30px;
  bottom: 20px;
  z-index: 1000;
}

.arrows path {
  stroke: #fff; /*#2994D1*/
  fill: transparent;
  stroke-width: 3px;  
  animation: arrow 8s infinite;
  -webkit-animation: arrow 8s infinite; 
}

@keyframes arrow
{
0% {opacity:0}
40% {opacity:1}
80% {opacity:0}
100% {opacity:0}
}

@-webkit-keyframes arrow /*Safari and Chrome*/
{
0% {opacity:0}
40% {opacity:1}
80% {opacity:0}
100% {opacity:0}
}

.arrows path.a1 {
  animation-delay:-1s;
  -webkit-animation-delay:-1s; /* Safari 和 Chrome */
}

.arrows path.a2 {
  animation-delay:-0.5s;
  -webkit-animation-delay:-0.5s; /* Safari 和 Chrome */
}

.arrows path.a3 { 
  animation-delay:0s;
  -webkit-animation-delay:0s; /* Safari 和 Chrome */
}
/**** Down Arrow Ends ***/


/******** Quote *****/

.testimonial-quote {
    font-size: 16px;
}

.testimonial-quote blockquote {
    /* Negate theme styles */
    border: 0;
    margin: 0;
    padding: 0;

    background: none;
    color: gray;
    font-family: Georgia, serif;
    font-size: 1.5em;
    font-style: italic;
    line-height: 1.4 !important;
    margin: 0;
    position: relative;
    text-shadow: 0 1px white;
    z-index: 600;
}

.testimonial-quote blockquote * {
    box-sizing: border-box; 
}

.testimonial-quote blockquote p {
    color: #75808a; 
    line-height: 1.4 !important;
}

.testimonial-quote blockquote p:first-child:before {
    content: '\201C';
    color: #81bedb;
    font-size: 7.5em;
    font-weight: 700;
    opacity: .3;
    position: absolute;
    top: -.4em;
    left: -.2em;    
    text-shadow: none;
    z-index: -300;
}

.testimonial-quote img {
    border: 3px solid #9CC1D3;
    border-radius: 50%;
    display: block;
    width: 120px;
    height: 120px;
    position: absolute;
    top: -.2em; 
    left: 0;    
}

.testimonial-quote cite {
    color: gray;
    display: block;
    font-size: .8em; 
}
  
.testimonial-quote cite span {
    color: #5e5e5e;
    font-size: 1em;
    font-style: normal;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    text-shadow: 0 1px white; 
}

.testimonial-quote {
    position: relative; 
}

.testimonial-quote .quote-container {
    padding-left: 160px; 
}
  
.testimonial-quote.right .quote-container {
    padding-left: 0;
    padding-right: 160px; 
}

.testimonial-quote.right img {
    left: auto;
    right: 0;
}

.testimonial-quote.right cite {
    text-align: right; 
}
/*******************/

.cbp-spmenu-vertical{display: none;}
/*navbar-collapse.collapse{float: right!important;
    margin-right: -15px;}*/
.modal-header .close{ margin-top: 0; text-align: right;
    font-size: 20px;line-height: 0; right: 0; width: 100%}
.text22 {font-family:'Clarity free'; left:0%; font-size: 60px; background: none !important; color: #fff;text-align: center;width: 100%;}
.text2{ background: none !important; color: #fff;font-family: calibri; text-align: center;
    text-shadow: -3px -2px 15px grey;
    line-height: 60px;
    font-weight: 300 !important;
    font-size: 40px;
    color: #fff;}
.rev-slider{background-color:#0a377b;
 }
.rev-slider .text2:after{display: none;}
.rev-slider .title2-bg{text-align: center;}
.slider_logo{max-width:100% !important;min-width: 280px !important;margin: 0 auto !important;}

/***** Investor Page ********/

.down_box{border: 1px solid #d2d2d2;
    border-radius: 5px;
    box-shadow: 2px 2px 3px 0px #c2c2c2;
    text-align: center;
    font-size: 15px;
    padding: 20px 0;
    height: 150px;
    background: #fff;
    margin-bottom: 20px;
}
.down_box:hover{border: 1px solid #c2c2c2 ;
    border-radius: 5px;
    box-shadow: 3px 3px 5px 0px #c2c2c2;
    text-align: center;
    font-size: 15px;
    padding: 20px 0;
    height: 150px;
}

/***** Investor Page Ends********/


@media (max-width: 768px) and (min-device-width: 421px) {
  html{background-color:#0a377b; }
  .cbp-spmenu-vertical{display: none;}
  .sidebar{padding-left: 0;}
  .navbar-default{box-shadow: none; margin: 0;}
  .navbar-collapse{padding: 0;width: 75%; float: right;}
  .cbp-spmenu-right { right: -100%;}
.cbp-spmenu{background-color:#0a377b; }
.text2 { font-size: 32px !important; }
.text22 {font-family:'Clarity free'; left:0%; font-size: 45px; color: #fff;text-align: center;width: 100%;}

.predio-slider .hero-content{padding: calc(35vh - 100px) 0}
.fun-facts h2{font-size: 70px;}
.fun-facts h4{font-size: 28px;}
}


@media screen and (max-width: 420px) { 
  html{background-color:#0a377b; }
  .grid-demo [class*="col-"]{min-height: 20px;}
  .navbar-default .navbar-toggle .icon-bar{    background-color: #fff;}
  .navbar-toggle.is-active span{background: none !important;}
  .cbp-spmenu-vertical{display: block;}
   .cbp-spmenu-vertical h5  {padding: 0; color: #c2c2c2; font-size: 14px;}
  .cbp-spmenu{background-color:#0a377b; max-height: 520px; overflow-y: scroll; }
   .cbp-spmenu::-webkit-scrollbar-track {
        /*border: 1px solid #c2c2c2;*/
        padding: 2px 0;
        background-color: #0a377b;
    }
    .cbp-spmenu::-webkit-scrollbar {
        width: 10px;
        background: #fff;
    }
    .cbp-spmenu::-webkit-scrollbar-thumb {
        border-radius: 10px;
        box-shadow: inset 0 0 6px rgba(0,0,0,.3);  
        border: 1px solid #fff;
        background: #fff;
    }
.cbp-spmenu-right {
    right: -280px;
}

.int-header .page-title{font-size: 22px;}

.timeline-content{padding-left: 0;}
.text2 { font-size: 18px !important; }
.text22 {font-family:'Clarity free'; left:0%; font-size: 36px; color: #fff;text-align: center;width: 100%;}

 .slider_logo{max-width:80% !important;min-width: 280px !important;}
.team-box{    width: 100%;
    float: left;
    margin-bottom:0px;
    text-align: center;
    min-height: 280px;}
    .fun-facts h2{font-size: 32px;}
}