@charset "utf-8";
@import url("fonts.css");

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table
}
.clearfix:after {
    clear: both
}
.clearfix {
    *zoom: 1
}

html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}

/* use */
body {
    margin: 0;
    font-family: 'open_sansregular';
    font-size: 1rem;
    color: #333333;
}
header,footer,section,main,menu,nav{display:block}
.header, footer {
   font-weight: bold;
}
.navbar-nav .nav-link {
  font-family: 'open_sansbold';
}
.titlebox {
  font-family: 'open_sansbold';
  margin-bottom: 2rem;
}
.btnbox {
  font-family: 'open_sansbold';
  border: 0 transparent;
  border-radius: 2rem;
  text-transform: uppercase;
  padding: 1rem;
}
.bold {
  font-family: 'open_sansbold';
}
.italic {
  font-family: 'open_sansitalic';
}
.darkbluetxt {
  color: #04518d;
}
.lightgreytxt {
  color: #999999;
}
.darkgreytxt {
  color: #333333;
}
.whitetxt {
  color: #ffffff;
}
.greentxt {
  color: #339999;
}
.whitebox {
  background-color: #fff;
  border-radius: 1rem;
  border: none;
}
.bluebox {
  background-color: #04518d;
  border-radius: 1rem;
  border: none;
}
.creamwhitebox {
  display: inline-block;
  background-color: #E6E6E6;
  padding: 0.1875rem 0.5rem;
  border-radius: 0.5rem;
  border: none;
}
.textcontainer {
  position:absolute;
  width:100%;
}
.small-font {
  font-size: 0.75rem;
}
.big-font {
  font-size: 1.25rem;
}
.section-padding {
  padding: 3rem 2rem;
}
.page-padding {
   padding: 3rem 5rem;
}
.breadcrumb {
  background-color: transparent;
  text-transform: uppercase;
  font-weight: bold;
}
.breadcrumb-item + .breadcrumb-item::before {
    content:'';
}
.content-wrapperx {
  position: relative;
  /*padding-bottom: 4rem;*/
}
.oi-chevron-right {
    display: inline-block;
    padding: 0.2rem 0.5rem;
    color: #cccccc;
    font-weight: lighter;
  }
.breadcrumb-item.active {
     color: #04518D;
}

.breadcrumb-item a {
     color: #cccccc;
}
section.menu-navi {
  margin-left: 2.5rem;
    margin-right: 2.5rem;
    text-transform: uppercase;
}
section.menu-navi a {
    color: #04518D !important;
}
section .navbar a:hover, a:active, a:focus {
    color: #F48123 !important;
}
section .navbar li.active > a {
  color: #F48123 !important;
}
.navbar-toggler {
  border-color: transparent !important;
}
.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba(4,81,141, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}
footer {
  background-color: #022B47;
}
footer .jumbotron {
  background: transparent;
  color: #cccccc;
  border-radius: 0;
  margin-bottom: 0;
}
footer .jumbotron .footer-padding {
  padding: 0 2.5rem;
}
footer .navbar {
    text-transform: uppercase;
}
footer .navbar, footer .navbar .navbar-nav, footer .navbar ul.navbar-nav li:first-child .nav-link {
  padding-left: 0;
}
footer .menu-footer a {
  color: #cccccc;
}
footer p {
  color: #ffffff;
}
footer .jumbotron .footer-copyright {
  /*padding: 0.5rem 1rem;*/
  font-size: 0.75rem;
}
footer .jumbotron p button {
  background-color: transparent;
  border-radius: 1rem;
  border: 0.1rem solid;
  text-transform: uppercase;
  font-weight: bold;
  color: #cccccc;
}
.menu-footer .nav-link {
  color: #ffffff;
}
.footer-social {
  font-family: 'open_sansbold';
  color: #ffffff;
}
.footer-social .displayblock{
  display: block;
  margin-bottom: 15px;
}
.htitle {
  font-size: 3rem;
  font-weight: bold;
}
.ptitle {
  font-size: 3rem;
  font-family: 'open_sansbold';
  text-transform: capitalize;
  padding-left: 0.75rem;
}
.photo_hlight {
    height: auto;
    justify-content: inherit;
    align-items: inherit;
}
.photo_hlight .photo img {
  width: 100%;
    display: block;
}
.hctitle {
  font-size: 1.25rem;
  font-weight: bold;
  text-transform: uppercase;
  font-family: 'open_sansbold';
}
.ctitle {
  font-size: 1.25rem;
  font-weight: bold;
  text-transform: capitalize;
  font-family: 'open_sansbold';
}
.hcdesc {
  margin-top: 1rem;
  color: #999999;
}
.cdesc {
  color: #999999;
  font-size: 0.875rem;
}
.btngrp {
  width: 100%;
  text-align:center;
}
/*.about-section img.img-thumbnail, .services-section img.img-thumbnail,  .ochart-section img.img-thumbnail {*/
img.img-thumbnail {
  border: none !important; /*height: 15.5rem;*/
}
.hlight {
    height: auto;
    position: relative;
}
.hlight .hlight-title {
    color: #04518D;
    font-family: 'open_sansbold';
    text-transform: uppercase;
    font-size: 3rem;
    text-align: left;
}
.hlight .hlight-desc {
    font-size: 1.125rem;
    margin-top: 1rem;
}
.hlight .hlightBox {
    margin-left: 5rem;
    margin-right: 5rem;
    padding-bottom: 0;
}
.grad1 {
    display: block;
    width: 6.125rem;
    height: 0.5rem;
   /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f48123+0,ffcc33+100,ffcc33+100 */
    background: #f48123; /* Old browsers */
    background: -moz-linear-gradient(left,  #f48123 0%, #ffcc33 100%, #ffcc33 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  #f48123 0%,#ffcc33 100%,#ffcc33 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  #f48123 0%,#ffcc33 100%,#ffcc33 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f48123', endColorstr='#ffcc33',GradientType=1 ); /* IE6-9 */
}
.short-grad1 {
    display: block;
    width: 2.125rem;
    height: 0.5rem;
     /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f48123+0,ffcc33+100,ffcc33+100 */
    background: #f48123; /* Old browsers */
    background: -moz-linear-gradient(left,  #f48123 0%, #ffcc33 100%, #ffcc33 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  #f48123 0%,#ffcc33 100%,#ffcc33 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  #f48123 0%,#ffcc33 100%,#ffcc33 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f48123', endColorstr='#ffcc33',GradientType=1 ); /* IE6-9 */
}
.short-grad2 {
    display: block;
    width: 4.125rem;
    height: 0.5rem;
     /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f48123+0,ffcc33+100,ffcc33+100 */
    background: #f48123; /* Old browsers */
    background: -moz-linear-gradient(left,  #f48123 0%, #ffcc33 100%, #ffcc33 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  #f48123 0%,#ffcc33 100%,#ffcc33 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  #f48123 0%,#ffcc33 100%,#ffcc33 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f48123', endColorstr='#ffcc33',GradientType=1 ); /* IE6-9 */
}
.grad2 {
    border: 0 transparent;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#04518d+0,339999+100 */
    background: #04518d; /* Old browsers */
    background: -moz-linear-gradient(left, #04518d 0%, #339999 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #04518d 0%,#339999 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #04518d 0%,#339999 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04518d', endColorstr='#339999',GradientType=1 ); /* IE6-9 */
}
.grad3 {
    display: block;
    width: 6.125rem;
    height: 0.5rem; 
    background: #ffffff;
}
.btnblue {
    padding: 0.9375rem 2.5rem;
    font-family: 'open_sansbold';
    color: #ffffff;
    border: 0 transparent;
    border-radius: 2rem;
    text-align: center;
    text-transform: uppercase;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#04518d+0,339999+100 */
    background: #04518d; /* Old browsers */
    background: -moz-linear-gradient(left, #04518d 0%, #339999 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #04518d 0%,#339999 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #04518d 0%,#339999 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04518d', endColorstr='#339999',GradientType=1 ); /* IE6-9 */

}
.btnblue:hover{
  background: transparent;
  border: 0.125rem solid #04518D;
  color: #04518D;
}
.btntrans {
    display: block;
    width: 10rem;
   height: 2.5rem;
    border: 0.05rem solid #ffffff;
    border-radius: 1rem;
    line-height: 2rem;
    text-align: center;
    background-color: transparent;
    color: #ffffff;
}
.gradbtn {
  font-size: 1rem;
    font-weight: bold;
  line-height: normal;
    display: inline-block;
    vertical-align: middle;
    color: #ffffff;
}
.project-section .btntrans:hover {
  background: white;
  color: #04518D;
}
.project-section a.gradbtn:hover,
.project-section .btntrans:hover a,
a.gradbtn:focus {
    color: #04518D !important;
}
a.gradbtn:hover, a.gradbtn:focus {
    /*color: #F48123 !important;*/
}
.btn-outline-light {
  border-radius: 2rem;
  font-family: 'open_sansbold';
  padding: 6px 30px;
}
.arrow-prev {
  width: 30%;
    content: url('../assets/img/icons/left-arrow.png');
}
.arrow-next {
  width: 50%;
    content: url('../assets/img/icons/right-arrow.png');
}
.carousel {
    width: 90%;
}
.slick-slide {
  padding: 0 1.5rem;
}
.slick-slide {
  transition: all ease-in-out .3s;
  opacity: 0.2;
}
.slick-active {
  opacity: 1;
}
.slick-current {
  opacity: 1;
}
.slick-prev:before {
    content: url('../assets/img/icons/left-arrow.png');
}
.slick-next:before {
    content: url('../assets/img/icons/right-arrow.png');
}
.slick-prev, .slick-next {
   z-index: 9;
  top: 30%;
}
.home-banner .slick-prev, .home-banner .slick-next {
   display: none !important;
}
.home-banner .slick-dots {
    bottom: 1.5rem;
}
.home-banner .slick-list {
    padding: 0 !important;
}
.home-banner .slick-slide {
    padding: 0 !important;
}
.arrow-prev.disabled:before, .arrow-next.disabled:before {
  opacity: 0;
}

.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before {
  opacity: 0;
}
.slick-list {
  padding: 0 1.25rem !important;
}
.slick-dots {
    bottom: -3.25rem;
}
.slick-dots li button:before {
  font-size: 3rem;
    color: #cbcbcb;
}
.slick-dots li.slick-active button:before {
    color: #04518D;
}
.slick-slider .slick-slide img {
  border: 0;
  background-color: transparent;
}
.news-details-section .slick-prev {
  z-index: 9;
  top: 30%;
}
.news-details-section .slick-next {
   z-index: 9;
  top: 30%;
  right: 1.2rem;
}
.news-details-section .slick-dots {
    bottom: -2.25rem;
}
.project-section {
  background: url('../assets/img/project-bg.jpg') center no-repeat fixed;
  background-size: cover;
  height: 100%;
  padding-left: 3rem;
}
.project-section .slick-dots li.slick-active button:before {
    color: #ffffff;
}
.overlay {
  height: 100%;
  width: 100%;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: #ffffff;
  overflow-x: hidden;
  transition: 0.5s;
}
.overlay-content {
  position: relative;
  top: 3rem;
  text-align: left;
  margin-top: 1.875rem;
}
.overlay#collapsibleNavbar a {
  padding: 0.5rem;
  text-decoration: none;
  font-size: 2rem;
  color: #818181;
  display: block;
  transition: 0.3s;
}
.overlay#collapsibleNavbar a:hover, .overlay#collapsibleNavbar a:focus {
  color: #f1f1f1;
}
.overlay .close {
  padding-right: 2.9rem !important;
  font-size: 3.75rem;
}
.overlay#collapsibleNavbar .navbar-nav {
  padding-left: 2rem;
}
.bottom { 
    position: absolute;                  
    bottom: 0;                          
    width: 100%;                          
}
.bottom p { 
  padding-left: 2.5rem;
}
.x-scroll {
  overflow: hidden;
}

section.content .title-desc {
  font-size: 1.25rem;
}
.services-more {
  color: #04518D;
  font-size: 1.625rem;
  font-family: 'open_sansbold';
}
.mg-t-3 {
  margin-top: 3rem;
}
.mg-b-8 {
  margin-bottom: 8rem;
}
.mg-y-5 {
  margin: 5rem 0;
}
.mg-auto {
  margin: 0 auto;
}
.p-y-2 {
  padding: 2rem 0;
}

.contact-section .contact-info {
  font-size: 1.25rem;
  font-family: 'open_sansbold';
  max-width: 90%;
}
.contact-section .contact-info .gmap-wrapper {
  height: 25rem;  
  width: 100%; 
  margin-bottom:1rem;
}
.contact-section .contact-info .gmapbox {
  height: 100%; 
  width:100%; 
}
.contact-section .contact-info .address {
  font-family: 'open_sansregular';
}
.contact-section .contact-news-title {
  font-size: 1.625rem;
  font-family: 'open_sansbold';
}
.contact-section .contact-info a.btn {
  width: 100%;
}
.contact-section .contact-social a {
   font-family: 'open_sansbold';
  font-size: 3.75rem;
  color: #898F9C;
}
.contact-section .contact-social img {
   border-radius: 1rem;
   border: 0.1rem solid transparent;
}
.contact-section hr {
   width: 100%;
}
.contact-section .slick-list {
  padding: 0 3.125rem 0 0!important;
}
.contact-section .slick-dots {
    bottom: -1.25rem;
}
.contact-section .slick-dots li button:before {
  font-size: 1rem;
    color: transparent;
    border-radius: 1rem;
   border: 0.1rem solid #999999;
  display: inline-block;
}
.contact-section .slick-dots li.slick-active button:before {
    background-color: #999999;
}
.ochart-section .ptitle {
  padding-left: 0;
}
.ochart-section .checkout {
  display: none;
}
.list-group .list-group-item {
  background-color: transparent;
  border: none;
}
.opos {
  font-size: 1.125rem;
  color: #999999;
  font-family: 'open_sansitalic';
}
.read-morex {
 /* position: absolute;
  bottom: 0;*/
}

.portfolio-section .filter-group li button.active,
.portfolio-section .filter-group li button:active,
.portfolio-section .filter-group li button:focus,
.portfolio-section .filter-group li button:hover {
     color: #ffffff;
    border: 0 transparent;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#04518d+0,339999+100 */
    background: #04518d; /* Old browsers */
    background: -moz-linear-gradient(left, #04518d 0%, #339999 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #04518d 0%,#339999 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #04518d 0%,#339999 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04518d', endColorstr='#339999',GradientType=1 ); /* IE6-9 */
}
.pagination .page-link {
  border: none;
  color: #999999;
}
.pagination .page-item .page-link:hover, .pagination .page-item .page-link:active, .pagination .page-item .page-link:focus {
  border-radius: 50%;
  background-color: #04518d;
}
.pagination .page-item.active .page-link {
  border-radius: 50%;
  background-color: #04518d;
}
.news-details-section .modal-popup .modal .modal-header {
  border: none;
}
.news-details-section .modal-popup .modal .modal-content {
  line-height: 2;
}
.hidex {
  display: none !important;
}
.progress-bar {
  position:relative;
    border-radius: 0.3rem;
    background-color: #E6E6E6;
    height: 1rem;
}
.level-percent {
  height: 100%;
  display:block;
  position: absolute;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f48123+0,ffcc33+100,ffcc33+100 */     /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#04518d+0,339999+100 */
    background: #04518d; /* Old browsers */
    background: -moz-linear-gradient(left, #04518d 0%, #339999 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #04518d 0%,#339999 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #04518d 0%,#339999 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04518d', endColorstr='#339999',GradientType=1 ); /* IE6-9 */
}

textarea, input {
  padding:10px;
  font-family: FontAwesome, open_sansregular;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
}


@media ( min-width: 1301px ) {
  .checkout {
    display: block !important;
  }
}

@media ( min-width: 1200px ) {
  .hlight .hlightBox {
    position: absolute;
    width: 50%;
    top: 50%;
    transform: translateY(-50%);
  }
  .hlight .hlightBox .hlight-desc {
    max-width: 80%;
  }
}

@media ( min-width: 991px ) {
  .carousel {
    margin: 0 auto;
  }
   .contact-section .grid-divider {
      position: relative;
      padding: 0;
  }
  .contact-section .grid-divider>[class*='col-'] {
      position: static;
  }
  .contact-section .grid-divider>[class*='col-']:nth-child(n+2):before {
      content: "";
      border-left: 0.0625rem solid #dddddd;
      position: absolute;
      top: 0;
      bottom: 0;
  }
  .contact-section .col-padding {
      padding: 0 0.9375rem;
  }
}
@media ( max-width: 1200px ) {
  .hlight .hlightBox {
    position: absolute;
    width: 50%;
    top: 50%;
    transform: translateY(-50%);
  }
  .hlight .hlightBox .hlight-desc {
    max-width: 80%;
  }
}

@media ( max-width: 991px ) {
  .carousel .photobox img {
    margin: 0 auto;
  }
  .hlight .hlightBox {
    position: absolute;
    width: 50%;
    top: 50%;
    transform: translateY(-50%);
  }
  .hlight .hlightBox .hlight-desc {
    max-width: 100%;
    padding-right: 4rem;
  }
}

@media ( max-width: 768px ) {
  .hlight .hlightBox {
    margin-left: 3rem;
    position: static;
    width: 90%;
    top: 0%;
    transform: translateY(0%);
  }
  .hlight .hlightBox .hlight-desc {
    max-width: 100%;
    padding-right: 4rem;
  }
  .home-banner .slick-dots {
    display: none !important;
  }
  .portfolio-details-section .page-navi .arrow-prev,
  .portfolio-details-section .page-navi .arrow-next {
    display: none !important;
  }
}

@media ( min-width: 768px ) {
  .ochart-section .grid-divider {
      position: relative;
      padding: 0;
  }
  .ochart-section .grid-divider>[class*='col-'] {
      position: static;
  }
  .ochart-section .grid-divider>[class*='col-']:nth-child(n+2):before {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      border: none;
      width: 0.125rem;
       background: #f48123; 
       background: -moz-linear-gradient(top, #f48123 0%, #ffcc33 100%, #ffcc33 100%); 
      background : -webkit-linear-gradient(top, #f48123 0%,#ffcc33 100%,#ffcc33 100%); 
       background: linear-gradient(to bottom, #f48123 0%,#ffcc33 100%,#ffcc33 100%,); 
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f48123', endColorstr='#ffcc33',GradientType=0 );
  }
  .ochart-section .col-padding {
      padding: 0 2rem;
  }
  .news-details-section .content .titlebox .grad1 {
    margin: 0 auto;
  }
}

