﻿@import url(https://fonts.googleapis.com/css2?family=Bai+Jamjuree:wght@400;600;700&display=swap);
html{margin:0;padding:0;overflow-x:hidden}
body{font-family:'Bai Jamjuree',sans-serif;font-weight:400;padding:0 1%;color:#666;font-weight:400;overflow-x:hidden;font-size:15px;line-height:1.4}
img{border:0}
*{box-sizing:border-box}
a{color:var(--brown);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!important;color:var(--blue)}
h1,h2,h3,h4,h5{margin:0 0 15px;padding:0;font-weight:700}

:root{--blue:#0497d1!important;--dark:#161b47!important; --shade:linear-gradient(0deg, var(--blue) 0%, var(--dark) 100%);}

@keyframes wiggle{
0%{transform:rotate(0)}
80%{transform:rotate(0)}
85%{transform:rotate(5deg)}
95%{transform:rotate(-5deg)}
100%{transform:rotate(0)}
}
.container{width:1280px;max-width:100%}
.container-fluid{width:1400px!important; max-width:100%}

.modal .modal-dialog{max-width:900px}
.modal-content{border:none;position:relative;padding:0!important;font-size:14px;border-radius:0;-webkit-box-shadow:0 10px 34px -15px rgba(0,0,0,.24);-moz-box-shadow:0 10px 34px -15px rgba(0,0,0,.24);box-shadow:0 10px 34px -15px rgba(0,0,0,.24)}
.modal-content .modal-header{padding:0;border:none}
.modal-content button.close{position:absolute;top:0;right:0;padding:0;margin:0;width:40px;height:40px;z-index:1;text-shadow:none;background:var(--blue);color:#fff;opacity:1}
.modal-content .modal-body{border:none;position:relative;z-index:0}
.modal-content .row [class^=col-]:first-child{background:transparent url('../images/bg-1.jpg') no-repeat center center;background-size:cover}
.modal-content .modal-body h2{font-weight:700;text-transform:uppercase;font-size:42px}
.modal-content .modal-body h2 span{font-weight:400}
.modal-content .modal-body h4{text-transform:uppercase;font-size:15px}
.modal-content .modal-body .form-control{margin-bottom:10px}
.modal-content .modal-body .btn-primary{color:#fff!important;text-transform:uppercase;letter-spacing:1px;font-size:14px;background:var(--blue)!important;width:100%;margin-top:10px;border:none!important}
.modal-content .text{position:relative;z-index:0}
.modal-content .text:after{position:absolute;top:-30px;left:-30px;right:-30px;bottom:-30px;content:'';border:1px solid rgba(0,0,0,.1);z-index:-1}

.header-topArea{float:left;width:100%;color:#fff;position:relative;z-index:1000;background:var(--dark);display:block;padding:0px;}
.header-topArea img{height:50px;}
.header-topArea ul{margin:0;padding:0;list-style-type:none; margin-bottom:-6px;}
.header-topArea ul li{display:inline-block;width:155px;text-align:left;font-weight:700;margin-left:-4px}
.header-topArea ul li a{background:#fff;color:var(--dark);display:block;overflow:hidden;padding:8px 15px;font-size:18px}
.header-topArea ul li:last-child a{background-color:var(--blue); color:#fff;}
.header-topArea ul li a small{display:block;clear:both;padding-bottom:0;font-size:12px}
.header-topArea ul li a:hover{background:var(--shade); color:#fff;}

#myHeader{margin:0;position:relative;z-index:100;float:left;width:100%;clear:both;z-index:999;margin-top:0;background:#fff}
.logo{position:relative;display:block}
.logo img{height:130px;transition:all .2s ease-in-out;padding:20px 0}
#myHeader.sticky{position:fixed;left:0;right:0;top:0;margin-top:0;padding:0 2%;width:100%;background:#fff;-webkit-box-shadow:0 3px 5px 0 rgba(0,0,0,.2);-moz-box-shadow:0 3px 5px 0 rgba(0,0,0,.2);box-shadow:0 3px 5px 0 rgba(0,0,0,.2)}
#myHeader.sticky .logo img{height:100px}
.callBox{position:relative;padding-left:50px;color:#fff}
.callBox i{position:absolute;left:0;font-size:42px;color:var(--blue)}
.callBox a{display:block;font-weight:700;margin-bottom:0;line-height:1.1;color:#fff}
ul.topBox{margin:0;padding:0;list-style-type:none;background:var(--blue);padding:10px 20px;margin-bottom:20px;float:right;border-bottom-left-radius:20px;border-bottom-right-radius:20px}
ul.topBox li{display:inline-block;margin-right:20px}
ul.topBox li a{padding:0 5px;color:#fff;font-weight:600}
ul.topBox li i{color:#fff}
ul.topBox li a:hover{color:var(--dark)}

.project-slider{position:relative; display:block; clear:both; overflow:hidden;}
.project-slider img{width:100%;}
.project-slider .content{position:absolute;text-align:center;left:50%;bottom:10%;transform:translate(-50%,0);z-index:100; width:97.2%; padding:25px; border-radius:0;
background:var(--dark);
backdrop-filter: saturate(180%) blur(10px);}
.project-slider .content h3{color:#fff;font-size:30px;margin-bottom:0;font-weight:700; background: -webkit-linear-gradient(#fff, var(--blue)); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}

.bannerSideBox{display: flex;flex-direction: column;width: 100%; height:100%; justify-content: space-between;}
.bannerSideBox > a{background:var(--blue); color:#fff; height:30%; padding:17.5% 15px; text-align:center;}
.bannerSideBox > a h3{font-weight:700; font-size:24px;}
.bannerSideBox > a:hover{color:#fff; background:var(--dark);}

.welcomeArea{display:block;overflow:hidden;clear:both;padding:60px 0;position:relative; text-align:center;}
.welcomeArea h2{font-size:36px;font-weight:700;color:var(--dark); padding:10px 0; background: -webkit-linear-gradient(var(--blue), var(--dark)); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.welcomeArea p{margin:0 auto 25px;font-size:16px;line-height:1.7}
.welcomeArea a{display:inline-block;padding:10px 30px;background:var(--blue);color:#fff;font-size:16px;text-transform:uppercase;margin-bottom:30px}
.welcomeArea a:hover{background:var(--dark);color:#fff}
.welcomeArea > div > p{width:800px; max-width:100%; margin:0 auto 15px; line-height:1.5;}

#prg-counter [class^=col-]>div>div{font-size:60px; font-weight:700; color:var(--blue); line-height:1.2; text-shadow: 4px 4px 0px rgba(4,151,209,0.3);}
#prg-counter h3{font-size:16px; color:var(--blue);}
#prg-counter p{font-size:15px; line-height:1.4;}


.serviceArea{text-align:center; padding:0;}
.serviceArea h2{font-weight:700; margin-bottom:30px;}
.serviceArea a h3{font-size:20px; font-weight:700;}
.serviceArea [class^=col-]{background:#222; border:0.5px #fff solid;}
.serviceArea [class^=col-]>a{padding:80px 10% 65px; display:block; overflow:hidden; position:relative; height:100%;}
.serviceArea [class^=col-]>a img{position:absolute; left:0; top:0; width:100%; height:100%; object-fit:cover; mix-blend-mode:soft-light;}
.serviceArea [class^=col-]>a *{position:relative; z-index:1; color:#fff;}
.serviceArea [class^=col-]:hover{background:var(--dark);}
.serviceArea [class^=col-]:last-child{background:var(--blue);}
.serviceArea [class^=col-]:last-child >a{ padding:25% 0;}
.serviceArea [class^=col-]:last-child >a span{border:2px #fff solid; color:#fff; padding:15px; font-weight:600; text-transform:uppercase;}



.flip{transform:scaleX(-1)}
.whyUs{display:block;overflow:hidden;padding:60px 0 30px;position:relative;text-align:center}
.whyUs:before{position:absolute;z-index:-1;content:'';display:block;left:0;right:0;top:0;bottom:30%;background:var(--dark)}
.whyUs h2{font-size:42px; font-weight:700; text-transform:uppercase; color:#fff;margin-bottom:10px; background: -webkit-linear-gradient(#fff, var(--blue)); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.whyUs h2+p{font-size:16px;margin:0 auto 30px;color:#fff}
.whyUs .row{position:relative;z-index:100}
.whyUs [class^=col-]{position:relative}
.whyUs [class^=col-]:before{position:absolute;z-index:1;content:'';display:block;left:15px;right:15px;top:0;bottom:0; border-radius:10px; background:#fff;box-shadow:rgba(50,50,93,.25) 0 6px 12px -2px,rgba(0,0,0,.3) 0 3px 7px -3px}
.whyUs [class^=col-]>div{padding:25px 20px 10px;display:block;overflow:hidden;position:relative;z-index:5}
.whyUs [class^=col-]>div img{height:100px;margin-bottom:20px}
.whyUs [class^=col-]>div h3{font-size:17px;color:var(--blue); font-weight:700;}

.testimonialsArea{background:#333 no-repeat center center fixed;background-size:cover;padding:120px 0;position:relative}
.testimonialsArea>div{width:800px;max-width:90%;display:block;margin:0 auto;background:rgba(255,255,255,.7);padding:30px; border-radius:15px; text-align:center;backdrop-filter:saturate(180%) blur(10px);box-shadow:rgba(50,50,93,.25) 0 6px 12px -2px,rgba(0,0,0,.3) 0 3px 7px -3px}
.testimonialsArea h3{font-weight:700;color:var(--dark);margin-bottom:20px!important; background: -webkit-linear-gradient(var(--blue), var(--dark)); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.testimonialsArea p{font-size:20px;margin-bottom:0;display:inline-block}
.testimonialsArea a{font-weight:700;font-size:26px;color:#222;margin-bottom:0;display:inline-block}
.testimonialsArea a i{background:var(--blue);color:#fff;padding:15px;border-radius:50%;font-size:20px}
.testimonialsArea input,.testimonialsArea select,.testimonialsArea textarea{width:100%;display:block;margin-bottom:20px;background:#fff;border-radius:0;border:1px #ccc solid;height:40px;padding:0 10px}
.testimonialsArea textarea{height:100px;padding:10px}
.testimonialsArea input[type=submit]{background:var(--dark);border:none;width:100%;color:#fff;margin-bottom:30px;float:right;border-radius:0;font-weight:700}
.testimonialsArea input[type=submit]:hover{background:var(--blue)}



.testimonialsArea .wpforms-container-full .wpforms-form .wpforms-field {
    padding: 5px 0;
    clear: both;
}


.testimonialsArea .wpforms-container-full .wpforms-form button[type=submit], div.wpforms-container-full .wpforms-form .wpforms-page-button {background:var(--dark)!important;border:none!important;width:100%;color:#fff!important;margin-bottom:30px;float:right;border-radius:0;font-weight:700}


.testimonialsArea .wpforms-container-full .wpforms-form textarea.wpforms-field-large {
    height: 120px;
}


.highlightArea{background:#fff!important;clear:both;overflow:hidden;padding:30px 0 0;position:relative;text-align:center;}
.highlightArea>div{position:relative;z-index:100;}
.highlightArea h4{display:block;clear:both;font-weight:700;font-size:48px;color:var(--blue);
background: -webkit-linear-gradient(var(--blue), var(--dark)); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.highlightArea p{margin-bottom:30px; font-size:18px;}
.highlightArea a{display:inline-block;padding:10px 30px;background:var(--blue);color:#fff;font-size:16px;text-transform:uppercase;margin-bottom:80px;  border-radius:30px;}
.highlightArea a:hover{background:var(--dark);color:#fff}

.footerArea{background:var(--blue);background-size:cover;background-blend-mode:overlay;padding:50px 25px 30px;display:block;text-align:center;position:relative}
.footerArea>svg{position:absolute;top:0;left:0;width:250%;fill:#fff}
.footerArea img{height:120px;margin-bottom:15px;filter: grayscale(1) brightness(1.75);}
.footerArea>div>a{display:inline-block;clear:both;padding:3px 10px;color:#fff; font-size:18px; font-weight:600;}
.footerArea>div>a i, .footerArea p i{color:var(--dark);margin-right:5px}
.footerArea p{display:inline-block;margin:10px 0 20px; color:#fff;}
.footerArea>div>a:hover{color:var(--dark);}
ul.social-links{margin:0 0 15px;padding:15px 0;list-style-type:none;display:block;overflow:hidden;clear:both}
ul.social-links li{display:inline-block;margin-right:5px}
ul.social-links li a{text-align:center;color:#fff;display:block;border:2px #fff solid;width:36px;height:36px;text-align:center;border-radius:50%}
ul.social-links li a i{font-size:17px;line-height:30px}
ul.social-links li a:hover{background:var(--dark);color:#fff}
.footerArea ul.social-links li a i{font-size:25px;line-height:45px}
.footerArea ul.social-links li a{width:50px;height:50px}
.footerArea ul+a img{height:auto!important;margin-bottom:0}

.footerBottom{background:var(--dark);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(--blue)}
#scroll-icon{position:fixed;right:10px;bottom:10px;cursor:pointer;width:30px;height:30px;background-color:var(--blue);text-indent:-9999px;display:none;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;z-index:99999}
#scroll-icon span{position:absolute;top:50%;left:50%;margin-left:-8px;margin-top:-12px;height:0;width:0;border:7px solid transparent;border-bottom-color:#fff}
#scroll-icon:hover{background-color:var(--dark);opacity:1;filter:"alpha(opacity=100)";-ms-filter:"alpha(opacity=100)"}


/* --- Inner Area --- */
.innerArea{display:block; overflow:hidden; clear:both; padding:0; position:relative;top:-150px; margin-bottom:-150px;}
.innerArea > div{background:#fff; padding:50px; border-top-left-radius:20px; border-top-right-radius:20px; box-shadow: rgba(50, 50, 93, 0.25) 0px 2px -1px 5px, rgba(0, 0, 0, 0.3) 0px 1px -1px 3px;}
.innerArea h1{display:block; overflow:hidden; text-transform:uppercase; font-weight:600; font-size:30px;}
.innerArea ul.breadcrumb{list-style-type:none; margin:0 0 30px; padding:0 0 10px; border-bottom:2px var(--dark) solid; background:none; border-radius:0; position:relative;}
.innerArea ul.breadcrumb li{display:inline-block; margin-right:15px; position:relative;}
.innerArea ul.breadcrumb li:after{content:'⤑'; margin-left:15px;}
.innerArea ul.breadcrumb li:last-child:after{display:none;}
.innerArea ul.breadcrumb:before{position:absolute; left:0;width:100px; bottom:-2px; height:2px; background:var(--blue); content:''; display:block;}
.innerArea h2{font-size:24px; color:var(--blue); margin-bottom:30px;}

.careerListing{display:block; overflow:hidden;clear:both; margin:0; padding:0;}
.careerListing li{padding:20px; border:1px var(--dark) dotted; border-top:1px var(--blue) solid; margin-bottom:20px;}
.careerListing li span{display:block; margin-bottom:10px; color:#666;}
.careerListing li h3{font-size:22px; font-weight:600;}
.careerListing li a{display:inline-block;padding:8px 15px; background:var(--blue);color:#fff; text-transform:uppercase; font-size:12px; font-weight:700;}

.innerDownColorArea{padding:60px 0;background:var(--blue) url('../images/map-anim-optimized-cropped.gif') no-repeat center center; background-blend-mode:multiply; color:#fff;display:block;overflow:hidden;clear:both;z-index:100;position:relative}
.innerDownColorArea>svg{position:absolute;top:0;width:250%;fill:#fff}
.innerDownColorArea h1{font-size:42px;text-align:center;margin-bottom:10px;font-weight:700}
.innerDownColorArea h1+p{text-align:center;font-size:20px;margin-bottom:40px}
.innerDownColorArea + .footerArea > svg{fill:var(--blue)!important;}

.formArea{width:600px; max-width:100%; margin:0 auto;}
.formArea [class^=col-]{margin-bottom:15px;}
.formArea label{display:block; overflow:hidden; clear:both;}
.formArea textarea, .formArea input{background:#fff; border:none; padding:0 10px; min-height:40px; display:block; width:100%;
box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;}
.fileUploadBox{display:block; overflow:hidden;padding:35px; border:1px #ddd dashed; text-align:center; position:relative;}
.fileUploadBox>input{display:block; position:absolute; left:0; right:0; top:0; bottom:0; text-align:center; opacity:0; cursor:pointer;}
.fileUploadBox:hover strong{color:#ff0;}
.formArea input[type="submit"]{background:var(--dark); border:2px #fff solid; color:#fff; text-transform:uppercase; font-weight:700; min-height:60px;}
.formArea input[type="submit"]:hover{background:#fff; color:var(--dark);}


/* -- Inner Area -- */

.nxtbannerarea{ display:block; overflow:hidden; position:relative; clear:both; margin:0 auto;  }
.nxtbannerarea:before{ display:block; overflow:hidden; position: absolute; top: 0; left: 0; content: ''; z-index:0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3);
  backdrop-filter: blur(2px);}
.nxtbannerarea .inner-header{ text-align: center; color:#fff; padding:0 30px 10px; position:absolute; bottom:20%; left:50%; transform: translate(-50%, -50%); }
.nxtbannerarea .inner-header h1{ font-size:50px; color:#fff}
.nxtbannerarea .inner-header ul.breadcrumb-list { display:block; padding:0!important; margin:0!important; list-style-type:none!important; text-align: center;}
.nxtbannerarea .inner-header ul.breadcrumb-list li{ display:inline-block!important; padding:0 10px 0 0!important; margin:0!important; font-size:14px!important; color:#fff; position:relative; }
.nxtbannerarea .inner-header ul.breadcrumb-list li:before{ content:'/'!important; position:absolute!important; top:0!important; left:-8px!important;}
.nxtbannerarea .inner-header ul.breadcrumb-list li a{ color:#fff; background:none!important; font-weight:400!important;}
.nxtbannerarea .inner-header ul.breadcrumb-list li a:hover{ color:#ffe87d;}
.nxtbannerarea .inner-header ul.breadcrumb-list li:first-child:before{ display:none; padding:0; }
.nxtbannerarea .grass{ position:absolute; left:50%; transform: translate(-50%, -50%); width:100%; bottom:0!important; z-index:2;}


.midarea{ display: block; padding: 50px 0;}
.nxtwelcomeArea h2{color:var(--skyblue);}
.nxtwelcomeArea p{margin-bottom:10px;}

.nxtwelcomeArea{ float:left; width:100%; clear:both; padding:60px 0; color:#111; background:#fff url('../images/Glass-2-1.png') no-repeat center center; background-size:cover; position:relative; z-index:10;}
.nxtwelcomeArea h2 strong{clear:both; display:block; color:var(--skyblue);}
.nxtwelcomeArea p{margin-bottom:30px;}


.nxtwelcomeArea input, .nxtwelcomeArea textarea{width:100%; border:1px #ccc solid; height:50px; padding:5px 10px; margin-bottom:15px;}
.nxtwelcomeArea textarea{height:200px;}
.nxtwelcomeArea input[type="submit"]{border:none; background:var(--red); color:#fff; font-weight:600; margin-bottom:0px;}
.nxtwelcomeArea input[type="submit"]:hover{cursor:pointer; background:var(--skyblue);}
.nxtwelcomeArea > div > .row > [class^="col-"] > div{background:var(--blue); display:block; overflow:hidden; padding:40px; color:#222; position:relative; top:-125px; margin-bottom:-125px; border-radius:10px;
-webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.75);
box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.75);
}

.nxtwelcomeArea .wpforms-container-full .wpforms-form .wpforms-field {    padding: 5px 0;    clear: both;}
.nxtwelcomeArea .wpforms-container-full .wpforms-form button[type=submit], div.wpforms-container-full .wpforms-form .wpforms-page-button {background:var(--dark)!important;border:none!important;width:100%;color:#fff!important; margin-bottom:30px;float:right;border-radius:0;font-weight:700}
.nxtwelcomeArea .wpforms-container-full .wpforms-form textarea.wpforms-field-large {    height: 120px;}

ul.welcomeAreaimg li{ display:inline-block; padding:10px 5px 10px; width:30%; margin:40px 10px 10px; text-align:center; background:var(--blue); color:#fff; border-radius:10px; text-transform:uppercase; letter-spacing:1px; font-weight:700; font-size:14px;
-webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.75);
box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.75);
}
ul.welcomeAreaimg li i{display:block;width:100%;margin-bottom:15px; font-size:36px;}
ul.welcomeAreaimg li h4{display:block;font-size:20px; padding-top: 20px;}
ul.welcomeAreaimg li:hover{background:var(--light)!important; color: #111;}

.nxtwelcomeArea [class^=col-md-5] h2{font-size:25px; color:#fff!important; font-weight: 700; }

.nxtwelcomeArea [class^=col-md-7] h2{font-size:25px; font-weight: 700; background: radial-gradient(circle at center center, #0092D2 0%, #151C48 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent; }

.contactArea{ display: block; padding: 50px 0;}
.contactArea > div{ border: 2px solid rgba(211,224,240,1); padding: 40px; border-radius: 50px; background: rgb(255,255,255);
background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(211,224,240,1) 100%);}
.contactArea > div h2{ font-size:25px;  }
.contactArea ul{ margin: 0; padding: 0; list-style-type: none!important;}
.contactArea ul li{padding:5px 0 5px; display: block;}
.contactArea ul li h3{ font-size:20px!important; text-transform:uppercase; display:block; margin-top: 5px; margin-bottom:8px!important; }
.contactArea ul li p{ font-size: 18px; }
.contactArea ul li a{ border:1px solid var(--dark); padding:10px 20px; display:block; color: #fff; margin-bottom:10px; background: var(--dark); display:inline-block; border-radius:50px; font-size: 18px; }
.contactArea ul li a:hover{ border:1px solid var(--blue); color: #fff; background: var(--blue);}
.contactArea .wpforms-container-full .wpforms-form .wpforms-field {    padding: 5px 0;    clear: both;}
.contactArea .wpforms-container-full .wpforms-form button[type=submit], div.wpforms-container-full .wpforms-form .wpforms-page-button {background:var(--dark)!important;border:none!important;width:100%;color:#fff!important; margin-bottom:30px;float:right;border-radius:0;font-weight:700}
.contactArea .wpforms-container-full .wpforms-form textarea.wpforms-field-large {    height: 120px;}




.contactAreasp{display:block; padding:60px 0 50px; background:transparent url('../images/parallax-img-01.jpg') no-repeat center bottom fixed; text-align:center; position: relative; background-size:cover; clear: both}
.contactAreasp:before {
    display: block;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    z-index:0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(2px);
}

.contactAreasp h3{margin-bottom:20px; line-height:1.5;  position: relative;  z-index: 1; font-weight:700; font-size:36px; color: #fff}
.contactAreasp .container{}
.contactAreasp p{color: #fff; position: relative;  z-index: 1;}
.contactAreasp a{ background:var(--yellow); padding: 15px 25px; display: inline-block; border-radius: 10px; font-weight: 600; color: #fff; position: relative;  z-index: 1; }
.contactAreasp a:hover{ background:var(--dark); color: #fff}


ul.areaListing{ display:block; padding:0!important; margin:25px 0 0 0!important; list-style-type:none!important;}
ul.areaListing li{ display: inline-block; padding:10px 20px 16px 20px; overflow: hidden; margin:0 10px; border:1px var(--blue) solid; text-align:left;background:var(--dark); vertical-align: middle}
ul.areaListing li a{position:relative; display: block; font-size:20px; color:#fff; line-height:50px; font-weight: 600px; }

.sub-menu-toggle{ display: none!important;}

.nxtgalleryArea{ padding:30px 0 30px; text-align:center;}
.nxtgalleryArea > [class^="col-"] > div{display:block; overflow:hidden; clear:both; overflow:hidden; /*height:300px;*/ background:#fff; padding:10px 10px; margin:10px 0; position:relative; /*border:1px #d7efea solid;*/ -webkit-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.17);
-moz-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.17);
box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.17); }
.nxtgalleryArea h2{text-align:center; font-weight:600; margin-bottom:30px; color:var(--main);}
.nxtgalleryArea a{background:#fff; display:block; overflow:hidden; padding:0.5px; position:relative; height:300px;}
.nxtgalleryArea a img{width:100%; height:300px;}
.nxtgalleryArea 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;}
.nxtgalleryArea a:hover:before{opacity:1; left:0.5px; right:0.5px; top:0.5px; bottom:0.5px;}
.nxtgalleryArea 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%);}
.nxtgalleryArea a:hover span{opacity:1;top: 50%;}

.nxtgalleryArea h4{ font-size:13px; font-weight:600; color:#111; line-height:1.3; padding-top:10px; margin-bottom:0; padding-bottom:0}

/*--------------------------------------------------------------------------------------------------------*/

@media (max-width:991px){
.logo img{margin-bottom:0;max-width:100%;transition:.5s ease-in-out;height:120px;padding:10px 0}
ul.topBox{padding:10px;border-radius:10px;text-align:center;margin-bottom:-10px;position:relative;z-index:100}
ul.topBox li:first-child{display:none}
ul.topBox li{margin:0 5px!important}
.header-area{margin:0;padding:0 0}
#myHeader.sticky{position:fixed}
#myHeader.sticky .logo img{height:90px}
#myHeader,.topBox{width:100%}
#main-nav{background:var(--dark);padding:0}
.footerArea:before{top:50%;left:0}
.footerArea [class^=col-]>div{display:block;overflow:hidden}
.serviceArea [class^=col-]{margin-bottom:2px}
.serviceArea{padding-bottom:0}
.highlightArea{padding:0}
.scheduleLesson h3{text-align:center;font-size:30px;margin-bottom:100px}
.scheduleLesson .row [class^=col-]:first-child{padding-right:15px}
.scheduleLesson:before{bottom:50%;right:0}
.scheduleLesson .row [class^=col-]:last-child{padding-left:15px;padding-top:80px;text-align:center}
.scheduleLesson>img{top:45%}
.welcomeArea h2{font-size:36px}
.serviceArea h2{font-size:36px}
.serviceArea ul li{display:inline-block;margin:10px 5px}
.footerArea [class^=col-] h4 i{position:static}

.project-slider .content{position:static; transform:translate(0,0); width:100%;}
.project-slider .content h3{font-size:24px; padding:0 5px;}

.bannerSideBox > a{height:32%; padding:10px;}
}
@media (max-width:767px){
.header-topArea{padding:10px 0 5px}
.header-topArea h2{display:none}
.header-topArea ul{bottom:0;text-align:center}
.header-area{margin-top:.5px;background:#fff}
#myHeader.sticky .stellarnav>ul>li>a{color:#fff!important}
ul.topBox li a{font-size:12px}


.projectsArea [class^=col]{ margin-bottom:25px}
.serviceArea h2 img{display:none}
.serviceArea::before{bottom:0;}
.serviceArea [class^=col-]>div h4{font-size:22px}
.serviceArea .row{margin-bottom:20px}
.serviceArea .row:last-child{margin-bottom:0}
.whyUs [class^="col-"]{margin-bottom:5px;}
.testimonialsArea>div{text-align:center}
.testimonialsArea h3{font-size:32px}
.testimonialsArea .carousel-item{padding:30px}
.testimonialsArea .carousel-item p{font-size:16px}
.runnignCarArea{padding:0 0 30px}
.runnignCarArea:before{top:30%;bottom:-50px}
.carBox{transform:translate(-22%,25%) scale(.45)}
.headerCall>ul{display:none}
.headerCall .mobileCallArea{display:block;margin-bottom:0;border-top:2px var(--brown) solid;width:100%;text-align:left}
.headerCall .mobileCallArea li{width:auto;margin-right:15px}
.highlightArea h4,.highlightArea h4 strong{font-size:30px;line-height:1.2;padding:5px 0 10px}
.highlightArea [class^=col-]{margin-bottom:30px}
.footer [class^=col-]{text-align:center;margin-bottom:10px}
.footer h4{text-align:center}
.footerArea > div > a{font-size:14px;}
.footer .w-50{width:auto!important}
.footer .service-link li{display:block;clear:both;overflow:hidden}
.footer .text-sm-right{font-size:11px;margin-top:15px}
.footerArea [class^=col-]{text-align:center;margin-bottom:25px}
.footerBottom{text-align:center}
.footerBottom ul{text-align:center;display:block;float:none;padding-top:10px}

.innerArea > div{padding:25px;}
.innerBanner{height:60vh;}
.innerBanner img{height:60%; object-fit:cover;}
	
.nxtwelcomeArea h2 {clear:both; display:block; font-size: 22px;}	
.nxtwelcomeArea > div > .row > [class^="col-"] > div{display:block; padding:30px;  top:0; margin-bottom:25px; }
.nxtwelcomeArea a{ display:block; padding:10px 5px 10px; width:90%; margin:3% auto; clear: both; text-align: center  }
	
}