/* Custom Style Definitions */
/* for Infrastructure Project Management Consultant Ltd., London */

body { width: 100%; margin: 0px; padding: 0px; overflow-x:hidden; background: #fff; }
html { font-family: "Open Sans", san-serif; font-size: 16px; color: #777;  }

/*---------------headings--------------------*/
h1, h2, h3, h4, h5, h6 { font-weight: 700; color: #222; }
h2 {font-size: 48px; line-height: 48px; margin: 0 auto; text-align: center;  letter-spacing: -1px; text-transform: capitalize;}
h3 {font-size: 36px; line-height: 36px; padding-bottom: 25px; }
h4 {font-size: 24px; color: #222;} 
h5{ font-size: 18px; }
h6{font-size: 16px; color: #999;}

/*--------------text & paragaphs----------- */
p {font-weight: 400; line-height: 28px; word-wrap: break-word; overflow-wrap: break-word; }
p strong{ font-weight: 700; }
p.tiny{font-size: 12px;}
p.intro{ font-size: 14px; line-height: 30px;}
p.emp{ font-size: 18px; line-height: 28px;}
p.large{font-size: 30px; color: #222; line-height: 36px; letter-spacing: -1px;}
a.textlink { font-size: 14px; color: #123d6a; text-decoration: none; }
a.textlink:hover{color: #123d6a; text-decoration: underline;}

/*--------------divs & ids------------------*/
/*colors*/
.ambr{background-color: #f5c910;}
.slvr {background-color: #f7f7f7;}
.dblu{background-color: #14213d;}
.whte{background-color: #fff;}

/*common*/
.toupcase {text-transform: uppercase;}
.nomrgpad .row {margin: 0; padding: 0;}
.xtrapad {padding-top: 50px; padding-bottom: 30px;}
.brdright{border-right: 1px solid #bbb;}
.brdleft{border-left: 2px solid #f5c910; padding-left: 30px;}

.xtratpad {padding-top: 40px; }

.infopanel p { text-transform: uppercase; font-size: 18px; margin: 0; padding-top: 10px; padding-bottom: 20px; color: #c00; line-height: 30px;}
.infopanel p img{vertical-align: middle;}
.infopanel p strong{ color: #ab3b61; }
.slvr p{color: #222;}
.slvr .infopanel p { font-size: 20px; margin: 0; padding: 15px 0 10px;}
.slvr .row{margin-bottom: 0;}
#callout{ width: 100%; text-align: center; height: 300px; background: transparent url("../images/callout_bg2.jpg") no-repeat top center; -webkit-background-size: cover;}
.resize-img{ width: 100%; object-fit: cover;}
p.crdlink{background-color: #b93203; font-size: 10px; color: #FC4C0F; padding: 30px 0 10px; text-align: center; margin: 0;}
p.crdlink a{text-decoration: none; color:#FC4C0F; }
.imgbox{position: relative;}
.btmright{position: absolute; bottom: 0px; right: 0px; background-color: #123d6a; color: #fff;}
.btmright p{padding: 5px 20px; font-size: 18px; text-transform: uppercase; letter-spacing:1px; }

#mapdiv iframe{ display:block; }
#mapdiv .row{margin: 0;}

/*fixes*/

.valign-wrapper {flex-wrap: wrap;} 

/*----------------parallax--------------*/
.parallax-container { height: 200px; min-height: 200px; }

/*------------buttons--------------*/
.ghost { background-color: transparent; border: 1px solid #222; font-size: 14px; letter-spacing: 2px; margin-top: 10px;}
.ghost:hover { background-color: #FFD629;}

/*------------collections--------------*/
.collection { border: none; }
.collection .collection-item { background-color: transparent; padding: 3px 0 2px 0; border-bottom: none; color: #222;}
ul.ftrlist{ }
ul.ftrlist li{ list-style-type: square; font-size: 15px; margin-bottom: 10px; list-style-position: inside;}

/*----------------navbar--------------------*/
.nav-wrapper{ }
#navdiv { z-index: 1; position: relative; height: 134px; }
.navbar-material .nav-wrapper { }
.navbar-material .nav-wrapper .brand-logo img { height: 233px; z-index: -1;}
nav { background: transparent;}
nav ul {  border-top: 1px solid #ccc; }
nav ul li a{ color: #333; font-family: 'Josefin Sans', sans-serif; font-weight: 700; font-size: 18px; text-transform: uppercase; padding: 0 15px;  }    
nav i, nav [class^="mdi-"], nav [class*="mdi-"], nav i.material-icons { color: #fff; }
nav ul li.active { background-color: transparent; }
nav ul li.active a{color: #f4c810;  }

nav ul li a:hover { background-color: #fff; color: #777; border-top: 1px solid #333;}
nav ul li.active a:hover{color: #FFD41E; background-color: none;}

/*--------------sidenav-----------------*/
#sidenav-overlay { z-index: 0;}
.side-nav .collapsible { margin: 0; }
.side-nav .collapsible li ul li a{color: #777; font-size: 16px;}
.side-nav{ }
.side-nav li{height: auto; border-bottom: 1px solid #eee; }
.side-nav li:hover {}
.side-nav li a { font-size: 1.4rem;}
.side-nav a:hover { color: #2E58A4;}
.material-icons{display: none;}

/*-------------footernav---------------*/
.footernav ul{ list-style:none; text-align: center; padding-bottom: 10px; }
.footernav ul li { list-style-type:none; display:inline; color:#ccc ; }
.footernav ul li a { padding:0 6px 0 3px; display:inline-block; font-size: 14px; font-weight: normal; color:#ccc; text-decoration: none; border-right: 1px solid #ccc; letter-spacing: 1px;}
.footernav ul li a:hover, .footernav ul li a:focus, .footernav ul li a:active { text-decoration: underline; color: #ccc; }
.footernav ul li a.lastnav{border: none;}

/*-------------footer-------------*/
footer.page-footer{ background-color: #333; margin-top: 0;}
footer.page-footer .row{margin-bottom: 0;}
footer.page-footer p.tiny{ font-size: 14px; color: #ccc;}
footer.page-footer p.tiny a{color:#999;}
footer.page-footer p.tiny a:hover{text-decoration: underline;}

/*------------gallery--------------*/
.gallery{position: relative;}
.gallery .row{margin-bottom: 0;}
.gallery .row .col{padding: 0;}
.gallery img{ display: block;}
.gallery .imgbox{color: #fff; text-align: left; }
.gallery .caption{position: absolute; top: 45%; left: 10%; font-size: 18px; line-height: 18px; font-weight: 700; text-transform: lowercase;}

/*------------form--------------*/
.btn-color { background-color: #777; text-transform: uppercase; font-weight: 700; letter-spacing: 1px; border:none; cursor:pointer; margin-top: 20px; margin-bottom: 45px; /*border-radius: 25px;*/ color:#fff;}
    .btn-color:hover { background-color: #aaa; border:none; cursor:pointer; }

/*------------cards------------------*/
.card .card-content{padding: 0; margin-bottom: 50px;}
.card .card-content .card-title{font-size: 24px; font-weight: 700; color: #222; padding-bottom: 5px; text-transform: uppercase; }
.card .card-content p{padding: 10px 35px 40px; font-size: 15px; line-height: 24px; color: #555;}
.card .card-content img{ display: block; margin: 0 auto; padding-top: 40px; padding-bottom: 10px; }

/*equal col height fix*/
.gridcard { display: flex; flex-wrap: wrap; align-content: flex-start;}
.row.gridcard .cellcard { // flex: auto; // flex: 0; // flex: 1; display: flex;  }

/*------------slider------------------*/

.slider{ z-index: 0; width: 100%; position: relative; height: 700px; }
.slider .slide { z-index: -1; position: absolute; width: 100%; top: 0; left: 0; height: 100%; 
      transition: opacity 1s ease-in-out; background-position: center center; background-repeat: no-repeat; background-size: cover; opacity: 0;  }
.slider .slide.show { opacity: 1; }
.slider .slider-caption{ color: #fff; position: absolute; top:45%; left: 0; width: 100%; text-align: center; z-index: 0; padding: 0 30px;  
    font-size: 40px; line-height: 40px; text-shadow: -1px 0 #222, 0 1px #222, 1px 0 #222, 0 -1px #222; }
.slider h2{color: #fff;}
.slider .indicators .indicator-item {
  background-color: #666666; 
  border: 3px solid #ffffff;
  -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
  -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}
.slider .indicators .indicator-item.active { background-color: #ffffff;}
.slider .indicators { bottom: 60px; z-index: 100;  /* text-align: left; */}

/**********************table**********************************/
.table-container { width: 100%; overflow-y: auto; _overflow: auto; margin: 0 0 1em;}
.table-container::-webkit-scrollbar { -webkit-appearance: none; width: 14px; height: 14px; }
.table-container::-webkit-scrollbar-thumb { border-radius: 8px; border: 3px solid #fff; background-color: rgba(0, 0, 0, .3); }

/*-------------home-------------*/
#homcontent .resize-img{height: 400px; }
#homcontent p.large{ margin-bottom: 0; }
#homcontent .ambr .row{margin: 0; }
#homcontent .ambr .row .col{padding: 0;}
#homcontent .ambr img{display: block;} 
#homcontent .ambr .resize-img{height: 500px; }
#homcontent .ambr h3{padding-top: 30px; padding-bottom: 0;}
#homcontent .prtnr{background-color: #14213d; height: 170px; width: 90%; margin: 0 auto; margin-bottom: 40px;}
#homcontent .prtnr p{color: #fff; font-size: 15px; padding-left: 15px; padding-right: 5px; line-height: 24px;}
#homcontent .prtnr p em{color: #9DC7FF; font-size: 14px; line-height: 14px;}
#homcontent .whte{width: 100%; background: #fff url("../images/building_bg.jpg") center top no-repeat; -webkit-background-size: cover; margin: 0; padding: 0; border: 1px solid #fff;}

/*-------------about-------------*/
#abtcontent #content .slvr img{display: block;}
#abtcontent .resize-img{height: 250px; }
#abtcontent .slvr .resize-img{height: 300px; }
#abtcontent .ambr p.large{padding: 50px 30px; margin-top: 20px;}

/*-------------services-------------*/
#srvcontent .ambr .card .card-content .card-title{letter-spacing: -1px;}

/*-------------sectors-------------*/
#sctcontent .slvr .row .col{margin: 0; padding: 0;}
#sctcontent .resize-img{ object-fit: cover; }
#sctcontent .whte.row{margin-bottom: 40px;}
#sctcontent .whte img{display: block;}
#sctcontent .whte h3{padding: 30px 0 0 40px; font-weight: 800; font-size: 48px; line-height: 46px; color: #f5c910; letter-spacing: -2px;}
#sctcontent .whte h5{padding: 0 10px 15px 40px;}
#sctcontent .whte p{font-size: 14px; padding: 0 30px 20px 40px; color: #555; }
#sctcontent .tall.resize-img{height: 600px;}

/*-------------case studies-------------*/
#cstcontent .slider{height: auto;}
#cstcontent h3{padding: 20px 0 0 30px; margin-bottom: 0; font-weight: 800; font-size: 36px; line-height: 36px; color: #222; letter-spacing: -2px;}
#cstcontent h5{padding: 0 0 15px 30px; color: #fff;}
#cstcontent .ambr .row{ margin-bottom: 0; }
#cstcontent p{font-size: 15px; padding-right: 20px; line-height: 27px; color: #555; }
#cstcontent .xtrapad{padding: 30px 0 10px;}

/*-------------partners-------------*/
#ptncontent .card .card-content .card-title{font-size: 24px; line-height: 30px; font-weight: 800; color: #f5c910; text-transform: capitalize; }
#ptncontent .card .card-content p{ font-size: 14px; padding: 20px 0; line-height: 24px; color: #fff;}
#ptncontent .card .card-content{padding: 0; margin: 50px 30px 30px 40px;}

/*-------------contact-------------*/

#concontent .whte{ }
#concontent #content .slvr{padding-left: 30px; }
#concontent #content .slvr h4{color: #f5c910; }


/*custom media queries*/
@media only screen and (max-width: 320px){

}
@media only screen and (max-width: 600px){
  #homcontent .ambr h3{padding-top: 10px;}
  a.ghost{ margin-bottom: 20px; }

}
@media only screen and (max-width: 992px) and (min-width: 601px) {

}
@media only screen and (max-width: 993px){
  .brdleft{border-left: none; padding-left: 0px;}
  #abtcontent #content .slvr{ padding: 30px 0 10px; }
  #abtcontent #content .slvr img{margin-bottom: 20px;}
  #sctcontent .resize-img{height: 340px; object-fit: cover; object-position: 100% 0;}
  #sctcontent .tall.resize-img{height: 340px; object-fit: cover; object-position: 100% 0;}
  #sctcontent .whte h3{padding: 20px 0 0 25px; font-size: 36px;} 
  #sctcontent .whte h5{padding: 0 10px 15px 25px;}
  #sctcontent .whte p{ padding: 0 20px 20px 25px; }
}
@media only screen and (min-width: 991px){
  #navdiv { padding: 0 20px;}
  #sctcontent .resize-img{height: 480px;}

}
@media only screen and (min-width: 1600px){

}