@import url(effect.css);

/* Fonts */
@import url('https://fonts.googleapis.com/css2?family=Bai+Jamjuree:wght@500;600;700&family=Work+Sans:wght@300;400;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Brygada+1918:ital,wght@0,400..700;1,400..700&display=swap');
/* Fonts */

html { margin: 0; padding:0; overflow-x:hidden; width:100%;}
body{
font-family: "Work Sans"; font-weight:400; padding:0; color:#00131d; font-weight:normal; padding-right:0!important; background:#fff;
font-size:15px;
line-height:1.5;
 overflow-x:hidden; width:100%;
}
/*	--------------------------------------------------
Global Reset & Standards
-------------------------------------------------- */

:root{--sky:#07a1e1; --blue:#2c2c6c; --dark:#313554;}

img{border:0;}

*{ box-sizing:border-box;}
*:hover{
}

a{color:var(--sky); text-decoration:none;
-webkit-transition:all .2s ease-in-out;
-moz-transition:all .2s ease-in-out;
-ms-transition:all .2s ease-in-out;
-o-transition:all .2s ease-in-out;
transition:all .2s ease-in-out;
}
a:hover{text-decoration:none; color:var(--dark);}

h1, h2, h3, h4, h5{margin:0 0 15px; padding:0; font-family: "Brygada 1918"; font-weight:600;}


::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #666;
  opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #666;
}

::-ms-input-placeholder { /* Microsoft Edge */
  color: #666;
}


@keyframes wiggle {
0%{transform:rotate(0deg);}
80%{transform:rotate(0deg);}
85%{transform:rotate(5deg);}
95%{transform:rotate(-5deg);}
100%{transform:rotate(0deg);}
}


.fullArea{width:1280px; max-width:92%; margin:0 auto;}

.floatBtn{background:#fff; position:fixed; right:0; top:30%; box-shadow:0 0 8px rgba(130,100,30,0.8); z-index:999;}
.floatBtn ul{margin:0; padding:0; list-style-type:none;}
.floatBtn ul li a{display:block; padding:3px 7px; font-size:26px; line-height:1.3;}
.floatBtn ul li a img, .socialIcon li a img{width:30px;}
.floatBtn ul li:last-child a{ border-top:1px var(--sky) solid; margin-top:10px;}
.floatBtn ul li a:hover img, .socialIcon li a:hover img{ filter: brightness(70%);}

/* Header */
.headerArea{display:block; position:relative; overflow:hidden; clear:both; padding:0 25px; font-size:20px; font-family: "Square721 Dm"; background:var(--blue);}
.logo{display:block; padding:10px 0;}
.logo img{height:100px; max-width:100%;}
.text-md-right{position:relative; z-index:5;}
.text-md-right:before{position:absolute; left:0; right:-60%; top:0; bottom:0; content:''; border-top-left-radius:10px; display:block; background:var(--sky); z-index:-1; transform: skew(-45deg);}
.text-md-right a{padding:10px 15px; display:inline-block; color:#fff;}
.text-md-right a i{color:#fff; border:2px #fff solid; width:38px; height:38px; border-radius:50%; text-align:center; line-height:32px; margin-right:5px;}
.text-md-right a:hover i{background:var(--blue);}


.navArea{float:left; width:100%; clear:both; position:relative; background:#fff;}
.navArea .menu-dropdown-icon:hover + .project-slider:before{ position:absolute; left:0; right:0; top:0; bottom:0; content:''; display:block; background:var(--dark); z-index:5; opacity:0.8;}

.topFixed{position:relative; background:var(--blue); display:block; overflow:hidden; clear:both; text-align:center; opacity:0; height:0;}
.topFixed a{padding:10px; display:block; overflow:hidden; font-size:18px; font-weight:700; color:#fff;}
.topFixed [class^="col"]:nth-child(2) a, .topFixed [class^="col"]:hover a{background:var(--sky); color:#fff;}
.topFixed [class^="col"]:nth-child(2) a{border:2px #fff solid; border-bottom:0; border-top:0;}
.topFixed.sticky{position:fixed; z-index:999; top:0; width:100%; opacity:1; height:auto;}


.project-slider{display:block; position:relative; overflow:hidden; clear:both;}
.project-slider img{width:100%;}
/*.project-slider:before{position:absolute; left:0; right:0; top:0; bottom:0; content:''; background:rgba(0,0,0,0.5); display:block; z-index:2;}*/
.project-slider .carousel-control-prev, .project-slider .carousel-control-next{padding:25px 10px; top:42%; bottom:auto; background:var(--dark); color:#fff; width:auto; opacity:1; font-size:15px; z-index:15;}

.sliderContent{position:absolute; z-index:10; top:50%; left:50%; width:1000px; max-width:85%; text-shadow: 2px 2px 2px #222; transform:translate(-50%,-50%); margin-bottom:0; text-align:center;color:#fff;}
.sliderContent h2{ margin-bottom:10px;}
.sliderContent h3{ font-size:24px; margin-bottom:25px; font-weight:400;}
.sliderContent a{background:var(--blue); color:#fff; display:inline-block; overflow:hidden; padding:10px 25px; font-weight:600; font-size:17px; border-radius:5px;}
.sliderContent a:hover{background:var(--sky);}

.aboutArea{display:block; padding:60px 0 0; text-align:center; position:relative;z-index:2;}
.aboutArea .aboutContent{width:800px; max-width:100%; margin:0 auto;}
.aboutArea h2{color:var(--blue); font-size:38px;}
.aboutArea h2 span{display:block; overflow:hidden; color:var(--dark); font-size:30px;}
.aboutArea h3{font-size:22px;}
.aboutArea h3 + a, .highLightText .row + a{display:inline-block; margin:15px 0 60px; background:#fff; border:2px var(--blue) solid; text-transform:uppercase; color:var(--blue); padding:12px 20px; font-weight:700;
-webkit-box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.2);
box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.2);
}
.aboutArea a:hover, .highLightText .row + a:hover{background:var(--blue); color:#fff;}
.aboutArea .row{background:var(--blue); text-align:left; color:#fff;}
.aboutArea .row [class^="col"]{position:relative;}
.aboutArea .row [class^="col"]:before{position:absolute; width:100%; top:0; bottom:0; background:rgba(0,0,0,0.5); display:block; content:''; z-index:1; opacity:0;}
.aboutArea .row [class^="col"]:nth-child(2):before{opacity:0.2;}
.aboutArea .row [class^="col"]:nth-child(3):before{opacity:0.4;}
.aboutArea .row [class^="col"] > div{position:relative; z-index:5; padding:60px 10% 25px;}
.aboutArea .row [class^="col"] h4{font-size:22px;}
.aboutArea .row [class^="col"] h4 i{margin-right:5px;}
.aboutArea .row [class^="col"] a big{font-size:42px; font-weight:400;}
.aboutArea .row [class^="col"] a{font-weight:600; color:#fff; display:block; clear:both; overflow:hidden; font-size:14px;}
.aboutArea .row [class^="col"] a i{margin-right:5px;}
.aboutArea .row [class^="col"] a:hover{background:none; color:var(--yellow);}
.aboutArea .row [class^="col"] ul{display:block; margin:0; padding:0; list-style-type:none;}
.aboutArea .row [class^="col"] ul li{display:block; padding:5px 0;}
.aboutArea .row [class^="col"] ul li i{margin-right:5px;}
.aboutArea img{position:relative; max-width:100%; display:block; clear:both; width:800px; margin:0 auto -100px; z-index:5;}


.highLightText, .innerBannerArea{text-align:center;display:block; overflow:hidden; position:relative; padding:220px 20px 50px; margin:-220px 0 0; background:var(--sky) no-repeat url('../images/waterbg.jpg') center top fixed; background-size:cover; background-blend-mode:multiply; color:#fff; font-size:20px; line-height:1.2;}
.highLightText > svg{fill:#fff; position:absolute; left:0; right:0; top:-2px;}
.highLightText h3{font-size:42px;}
.highLightText h3 + p{margin-bottom:40px;}
.highLightText > div{z-index:10; position:relative;}
.highLightText .row + a{font-size:24px; animation: wiggle 1.5s infinite; border-color:#fff; background:var(--blue); color:#fff;}
.highLightText .row + a:hover{background:var(--sky);}
.highLightText .row [class^="col"]{margin-bottom:30px; text-align:left;}
.highLightText .row [class^="col"]:before{position:absolute; display:block; background:#fff; border-top:6px var(--sky) solid; border-radius:15px; content:''; left:15px; right:15px; top:0; bottom:0;
box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 1px, rgba(0, 0, 0, 0.07) 0px 2px 2px, rgba(0, 0, 0, 0.07) 0px 4px 4px, rgba(0, 0, 0, 0.07) 0px 8px 8px, rgba(0, 0, 0, 0.07) 0px 16px 16px;
}
.highLightText .row [class^="col"] > div{position:relative; padding:30px 20px; color:#222; text-align:center;}
.highLightText .row [class^="col"] h4{font-size:20px; margin-bottom:10px;}
.highLightText .row [class^="col"] p{font-size:16px; margin-bottom:0;}
.highLightText .row [class^="col"] img{display:inline-block; margin-bottom:15px; height:200px;}


.whyUsArea{display:block; overflow:hidden;padding:60px 0 45px; background:var(--sky); position:relative; color:#fff;}
.whyUsArea > img{ position:absolute; left:0; top:0; height:100%; width:48%; object-fit:cover;}
.whyUsArea h3{margin-bottom:10px; color:#fff;}
.whyUsArea p{ margin-bottom:30px;}
.whyUsArea input, .whyUsArea textarea{width:400px; max-width:100%; height:40px; padding:0 15px; border:none; margin-bottom:10px;
box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 1px, rgba(0, 0, 0, 0.07) 0px 2px 2px, rgba(0, 0, 0, 0.07) 0px 4px 4px, rgba(0, 0, 0, 0.07) 0px 8px 8px, rgba(0, 0, 0, 0.07) 0px 16px 16px;
}
.whyUsArea textarea{height:80px;}
.whyUsArea input[type="submit"]{text-align:center; font-weight:600; width:200px; background:var(--blue); color:#fff; height:60px;}


.testimonialsArea{display:block; clear:both; overflow:hidden; padding:60px 0 0; text-align:center; position:relative; color:#222;}
.testimonialsArea > div{position:relative;z-index:2;}
.testimonialsArea h2{ font-size:36px;color:var(--blue);}
.testimonialsArea h3{ font-size:20px;}

.testimonialsArea [class^="col-"]{margin: -1px 0px 0px -1px;border: 1px solid rgb(204, 204, 204); text-align:left; line-height:1.3; background:#fff;}
.testimonialsArea [class^="col-"] > div{padding:20px 20px 20px 55px; background:transparent url('../images/quote.png') no-repeat left 10px top 25px;}
.testimonialsArea [class^="col-"] > div span{width:120px; height:24px; display:block; margin-bottom:15px; background:transparent url('../images/stars.png') no-repeat left top;}
.testimonialsArea [class^="col-"] > div span.star-4{background-position:left top -24px;}
.testimonialsArea [class^="col-"] > div span.star-3{background-position:left top -48px;}
.testimonialsArea [class^="col-"] > div span.star-2{background-position:left top -72px;}
.testimonialsArea [class^="col-"] > div span.star-1{background-position:left top -96px;}
.testimonialsArea [class^="col-"] > div h4{font-size:16px; margin-bottom:0;}

.testimonialsArea a > img{ margin-bottom:15px;
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
}



.galleryArea{ padding:0; text-align:center;}
.galleryArea h2{text-align:center; font-weight:600; margin-bottom:30px; color:var(--blue);}
.galleryArea a{display:block; overflow:hidden; padding:1px!important; position:relative;}
.galleryArea a img{width:100%;}
.galleryArea a:before{position:absolute; left:25%; right:25%; top:25%; bottom:25%; content:''; display:block; z-index:5; background:rgba(0,0,0,0.7); opacity:0; transition:all .2s ease-in-out;}
.galleryArea a:hover:before{opacity:1; left:0.5px; right:0.5px; top:0.5px; bottom:0.5px;}
.galleryArea a span{position: absolute; transition:all .5s ease-in-out; opacity:0; text-align: center; z-index: 100; color: #fff; text-shadow: 0px 0px 3px #000000; font-size: 24px; top: 20%; left: 50%; transform: translate(-50%,-50%);}
.galleryArea a:hover span{opacity:1;top: 50%;}


.videoArea{display:block; padding:60px 0 0; text-align:center;}
.videoArea h3{margin-bottom:35px; line-height:1.5;}

.map-container{
  overflow:hidden;
  padding-bottom:38.25%;
  position:relative;
  height:0;
  border:1px #ddd solid;
}
.map-container iframe{
  left:0;
  top:0;
  height:100%;
  width:100%;
  position:absolute;
}

.formBox{position:relative; display:block; text-align:left; padding:20px 40px;}
.formBox:before{background:var(--blue); display:block; content:''; position:absolute; left:0; right:0; top:0; bottom:-150px; z-index:-1;}
.formBox h4{color:#fff;}
.formBox input, .formBox textarea, .formBox select{width:100%; margin-bottom:15px; padding:10px; border:none; background:#fff;}
.formBox input[type="submit"]{background:var(--sky); border:2px var(--sky) solid; color:#fff; text-transform:uppercase;font-weight:700; font-size:17px;}
.formBox input[type="submit"]:hover{ background:#fff; color:var(--sky);}



.waves {
  position: static;
  left: 0px;
  bottom: 0px;
  width: 100%;
  height: 15vh;
  z-index: 1;
  margin-bottom: -8px;
  min-height: 100px;
  max-height: 150px;
}
svg:not(:root) {
  overflow: hidden;
}
.parallax > use {
  -webkit-animation: move-forever 25s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite;
  animation: move-forever 25s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite;
    animation-duration: 25s;
    animation-delay: 0s;
}
.parallax > use:nth-child(1) {
  -webkit-animation-delay: -2s;
  animation-delay: -2s;
  -webkit-animation-duration: 7s;
  animation-duration: 7s;
}
.parallax > use:nth-child(2) {
  -webkit-animation-delay: -3s;
  animation-delay: -3s;
  -webkit-animation-duration: 10s;
  animation-duration: 10s;
}
.parallax > use:nth-child(3) {
  -webkit-animation-delay: -4s;
  animation-delay: -4s;
  -webkit-animation-duration: 13s;
  animation-duration: 13s;
}
.parallax > use:nth-child(4) {
  -webkit-animation-delay: -5s;
  animation-delay: -5s;
  -webkit-animation-duration: 20s;
  animation-duration: 20s;
}


@keyframes move-forever {
0% {
  -webkit-transform: translate3d(90px, 0, 0);
  transform: translate3d(90px, 0, 0);
}
}



.footerArea{background:var(--blue); padding:40px 0 30px; display:block; color:#fff;}
.footerArea ul{margin:0; padding:0; list-style-type:none; text-transform:uppercase;}
.footerArea ul li{margin-bottom:8px;}
.footerArea ul li a{color:#fff; font-size:14px;}
.footerArea ul li a:hover{color:var(--sky);}
.footerArea [class^="col-"] h4{font-size:18px;  margin-bottom:10px;}
.footerArea [class^="col-"] > a{display:block; clear:both; color:#fff; padding:3px 0; font-size:16px;}
.footerArea [class^="col-"] > a i{margin-right:5px;}
.footerArea [class^="col-"] > a:hover{color:var(--sky);}

.footerArea p{ text-align:left; font-size:12px; margin-top:14px;}

ul.social-links{margin:0; padding:5px 0; list-style-type:none; display:block; overflow:hidden; clear:both;}
ul.social-links li{display:inline-block;}
ul.social-links li a{text-align:center; color:#fff; display:block; border:1px #fff solid; width:40px; height:40px; text-align:center; border-radius:50%;}
ul.social-links li a i{font-size:18px; line-height:40px;}
ul.social-links li a:hover{background:var(--sky); color:#fff;}

.footerBottom{background:var(--sky); padding:15px; display:block; font-size:13px; position:relative; color:#fff;}
.footerBottom ul{ float:right; margin:0; padding:0; list-style-type:none;}
.footerBottom ul li{ display:inline-block;}
.footerBottom ul li a{ display:block; padding:0 8px; color:#fff; border-left:1px var(--blue) solid; line-height:1;}
.footerBottom ul li:first-child a{border:none;}
.footerBottom ul li a:hover{color:var(--dark);}



#scroll-icon {
    position:fixed;
    right:10px;
    bottom:60px;
    cursor:pointer;
    width:35px;
    height:35px;
    text-indent:-9999px;
    display:none;
    z-index:99999;
}
#scroll-icon span {
	position:absolute; left:0; top:0;
    height:35px;
    width:35px;
    background:transparent url('../images/arrowup.png') no-repeat center center;
}
#scroll-icon:hover {
    opacity:1;
    filter:"alpha(opacity=100)";
    -ms-filter:"alpha(opacity=100)";
}
#scroll-icon:hover span{ background-image:url('../images/arrowupsolid.png');}


.innerBannerArea{display:block; overflow:hidden; clear:both; padding:80px 0; margin-bottom:40px;}
.innerContentArea{display:block;}
.innerContentArea > div{margin-bottom:50px;}
.innerContentArea h2{border-left:5px var(--sky) solid; color:var(--blue); margin-bottom:25px; padding-left:10px;}
.innerContentArea > img{position:relative; max-width:100%; display:block; clear:both; width:800px; margin:0 auto -180px; z-index:5;}
.innerContentArea + svg + .footerArea{padding-top:120px;}

.contactBox ul{ display:block; margin:0 0 20px; padding:0; list-style-type:none; font-size:18px;}
.contactBox ul li{display:block; margin-bottom:10px; padding-left:30px; position:relative;}
.contactBox ul li i{position:absolute; left:0; top:4px;}
.contactBox .map{border:1px #ddd solid; display:block; overflow:hidden; clear:both;}
.contactBox input, .contactBox textarea, .contactBox select{width:100%; margin-bottom:15px; padding:10px; border:1px #ddd solid; background:#fff;}
.contactBox input[type="submit"]{background:var(--sky); border:2px var(--sky) solid; color:#fff; text-transform:uppercase;font-weight:700; font-size:17px;}
.contactBox input[type="submit"]:hover{ background:#fff; color:var(--sky);}

.innerTestimonials [class^="col-"]{margin: -1px 0px 0px -1px;border: 1px solid rgb(204, 204, 204); text-align:left; line-height:1.3; background:#fff;}
.innerTestimonials [class^="col-"] > div{padding:20px 20px 20px 55px; background:transparent url('../images/quote.png') no-repeat left 10px top 25px;}
.innerTestimonials [class^="col-"] > div span{width:120px; height:24px; display:block; margin-bottom:15px; background:transparent url('../images/stars.png') no-repeat left top;}
.innerTestimonials [class^="col-"] > div span.star-4{background-position:left top -24px;}
.innerTestimonials [class^="col-"] > div span.star-3{background-position:left top -48px;}
.innerTestimonials [class^="col-"] > div span.star-2{background-position:left top -72px;}
.innerTestimonials [class^="col-"] > div span.star-1{background-position:left top -96px;}
.innerTestimonials [class^="col-"] > div h4{font-size:16px; margin-bottom:0;}

.innerTestimonials a{text-align:center; display:block;}
.innerTestimonials a > img{ margin-bottom:15px;
-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
}


.productDisplayBox [class^="col-"]{ margin-bottom:30px;}
.productDisplayBox [class^="col-"] > div{position:relative; padding-left:220px; min-height:180px; border:1px #ddd solid; border-bottom:2px var(--sky) solid; border-radius:15px; display:block; overflow:hidden;}
.productDisplayBox [class^="col-"] > div > div{padding:20px; display:block; overflow:hidden;}
.productDisplayBox [class^="col-"] > div > img{width:220px; position:absolute; left:0; top:10px;}
.productDisplayBox [class^="col-"] h3{font-size:18px; margin-bottom:10px; color:var(--blue); text-transform:uppercase;}


.noteText{display:block; padding:20px; text-align:center; color:#fff; background:var(--sky); border-radius:15px; font-weight:600;}

/*------------------------------------*\
    Media Queries
\*------------------------------------*/

@media (max-width: 1280px){
}

@media (max-width: 991px){
.navArea{height:0;}

.topFixed{border-bottom:2px #fff solid;}
.topFixed .col-12{display:none;}
.topFixed a{font-size:14px; padding:5px;}
.topFixed [class^="col-"]:last-child a{background:var(--sky); color:#fff;}


.project-slider .carousel-control-prev, .project-slider .carousel-control-next{padding:20px 2px; top:25%; display:none; font-size:14px;}


}

@media (max-width: 767px){
.headerTop{ display:none;}
.headerArea{padding:0;}
.headerArea [class^="col-"]:last-child span{display:none;}
.headerArea [class^="col-"]:last-child span + a{padding:10px 15px; font-size:16px; float:right; margin-bottom:25px;}

.headerArea{font-size:15px;}
.text-md-right a{padding:10px 0;}
.text-md-right a i{width: 24px; height: 24px; line-height: 20px; font-size:14px;}

.logo{text-align:center; padding:5px 0;}
.logo img{height:80px;}
.text-md-right:before{left:-25%;}
.text-md-right a:last-child{display:none;}


.aboutArea .row [class^="col"] > div{padding:20px 10%;}
.aboutArea img{margin:0 0 100px;}

.whyUsArea{padding:0 0 40px;}
.whyUsArea > img{position:static; width:100%; margin-bottom:40px;}

.highLightText{padding:140px 0 0!important;}
.highLightText h3{font-size:22px;}
.highLightText .row [class^="col"] > div:before{top:50px; right:0;}
.highLightText .row [class^="col"] img{width:90%; margin:0 5%; position:static;}
.highLightText .row [class^="col"]:hover img{ transform: scaleX(-1);}
.highLightText .row [class^="col"] > div > div{padding:20px 20px 40px;}


.footerArea{ text-align:center;}
.footerArea > div > div > [class^="col-"]{margin-bottom:20px;}
.footerArea ul{margin:10px 0;}

.ourServices:before{width:50%;}

.footerBottom{text-align:center;}
.footerBottom ul{ text-align:center; display:block; float:none; padding-top:10px;}


.testimonialsArea{padding-bottom:30px;}
.testimonialsArea h3 {font-size: 24px;}

.videoArea > div > div > [class^="col-"]:first-child{margin-bottom:30px;}
.videoArea h3{line-height:1.2; font-size:24px;}
.formBox{padding:20px 20px 0;}
.formBox:before{left:-20%; right:-20%;}

.highLightText .row + a{font-size:20px}

.productDisplayBox [class^="col-"] > div{padding:20px 20px 0; height:auto; text-align:center;}
.productDisplayBox [class^="col-"] > div > div{padding:20px 0; display:block; overflow:hidden;}
.productDisplayBox [class^="col-"] > div > img{width:280px; position:static;}
}

@media (max-width: 500px){

}

@media (max-width: 360px){
}


@media screen and (max-width: 1920px) and (min-width: 1240px){
}

@media screen and (-webkit-min-device-pixel-ratio:0)
and (min-resolution:.001dpcm) {
}