﻿@import "https://use.fontawesome.com/releases/v6.2.0/css/all.css";
@import url('https://fonts.googleapis.com/css2?family=Figtree:wght@200;300;400;600;700;800;900&display=swap');
:root {
    --primary: #272727;
    --sliver: #f4f4f4;
    --grey: #efefef;
    --border: #12121214;
    --theme: #354b9c;
    --action: #9da7cf;
    --white: #FFFFFF;
    --lightbg: #f7f9ff;
}
*{-webkit-box-sizing:border-box;box-sizing:border-box;list-style:none;outline:none;margin:0;padding:0;-webkit-transition:none;-o-transition:none;transition:none}
html{-webkit-text-size-adjust:100%}
body {line-height: 1.4;font-family: "Figtree", sans-serif;font-size: 17px;font-weight: 400;position: relative;margin: 0;padding: 0;color: var(--primary);overflow-x: hidden;background: #fff;}
.container{ width: 100%; max-width: 1300px; margin: 0 auto; }
iframe{border:none}
h1,h2,h3,h4,h5,h6{font-weight: 700;margin:0;line-height: 1.2;}
h4{font-size: 22px;}
h3{font-size: clamp(22px, 3.5vmax, 30px);}
a,a:focus,a:hover{outline:medium none;text-decoration:none;/* color: #fff; */}
ul,ol{padding:0;margin:0;list-style:none}
.cuani, a{-webkit-transition: .4s;-moz-transition: .4s;-o-transition: .4s;transition: .4s;}
b, strong{font-weight:600}
::selection {background: #000;color:var(--white); }
::-moz-selection {background:#29175b;color:var(--white);}
.mb-n40 { margin-bottom: -40px;}
.vcenter > .row{align-items: center;display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap;    flex-wrap: wrap;}
.imgdrk{filter: gray;-webkit-filter: grayscale(1);filter: grayscale(1);}
.imgdrk:hover{filter: none; -webkit-filter: grayscale(0);filter: grayscale(0);}
.h100{height:100%;}
.w100{width:100%!important;}


.fixmain {display: flex;}
.fixmain .fix-content{position:sticky;top:100px;}

.radius-10{ border-radius:10px; }
.swbox{background:var(--white);box-shadow: rgb(0 0 0 / 6%) 0px 16px 40px 0px;border-radius: 6px;padding: 20px;}
.automrg{margin: auto;/* text-align: center; */float: none;}
.bgwhite{background:#fff}
.white{color:var(--white)}
.bgsliver{background: var(--lightbg);}
.border-box{position:relative;border: 1px solid #00000030;border-radius: 10px;box-shadow: 0 3px 6px 0 #0106140f;}
.border-box.lightbg{background: #27b7b712;border: none;}
.box-swbox{background-color: var(--sliver);box-shadow: #0000000f 0px 2px 12px 0px;border-radius: 10px;overflow:hidden;}
.box-swbox.bg{background: #f9f6f3;box-shadow:none}
@keyframes slide-down 
{
    0% {opacity: 0;transform: translateY(-100%);-ms-transform: translateY(-100%);-webkit-transform: translateY(-100%);}
    100% {opacity: 1;transform: translateY(0);}
}
.whitebg{background:#fff !important}
.fixmain {display: flex;}
.fixmain .fix-content{position:sticky;top:100px;}

.w100{width:100% !important}
@keyframes slide-down 
{
    0% {opacity: 0;transform: translateY(-100%);-ms-transform: translateY(-100%);-webkit-transform: translateY(-100%);}
    100% {opacity: 1;transform: translateY(0);}
}


.header-main{background: var(--white);transition:all .5s ease;padding:0;position: relative;z-index: 1;}
.header-main .header-wrap{display:flex;justify-content:space-between;max-width:100%;flex-wrap:wrap;float:none;margin:0 auto;list-style:none;display:flex;flex-direction:row;align-items:center}
.logo{float:left;margin-right:0;position:relative;z-index:1}
.logo img{width: 145px;}
.getquote{font-weight:600;font-size:16px;padding: 10px;text-transform:capitalize;border-radius: 6px;background: var(--theme);color:#fff;display:inline-block;margin-left:18px}
.getquote:hover{color:var(--white);background:#000}
.menugetquote{display:none!important}
@media (max-width: 992px) {
.menugetquote{display:inline-block!important}
.getquote{display:none}
.header-main .header-wrap{display:block}
}

body.fixed .header-main{position:fixed;background:var(--white);padding-bottom:0;top:0;left:0;right:0;z-index:9;-webkit-animation:slide-down .7s;-moz-animation:slide-down .7s;-o-animation:slide-down .7s;box-shadow:0 9px 9px #0000001a;height:auto}
body.fixed{padding-top:81px}
body.fixed #cssmenu > ul > li::after{top:16px}
body.fixed #header .main-header{background:transparent}



.htitle{position:relative;display:block;font-size: 40px;color: var(--theme);margin: 0 0 15px 0;}
.htitle.moveleft{text-indent: 220px;}
.htitle.small{font-size: 28px;}
.htitle.white, .htitle.white + p{color:#fff;}
.htitle.center{text-align:center}
.htitle + p{margin: 0;margin-bottom: 25px;font-size: 22px;position: relative;}
.htitle.center + p{text-align:center;margin-left: auto;margin-right: auto;}
@media (max-width: 992px) 
{
    .htitle{font-size: 28px;}
    .htitle + p{width: 100%;}
}




.title-box.white *{color:var(--white)!important}
.title-box{position:relative;display:block;z-index:1}
.title-box h3, .title-box h1, .title-box h2 {position: relative;display: block;font-size: 42px;color: var(--theme);margin: 0;padding-bottom: 15px}
.title-box h4{position:relative;display:inline-block;font-size:15px;padding-bottom:0;color:var(--primary);letter-spacing:.5px;text-transform:uppercase;opacity: 0.5;}
.title-box h3 + p{/* width:70%; *//* text-align:left; */margin:0 0 25px;/* font-size:16px; *//* position:relative; *//* font-weight:400; */}
.title-box.light h3,.title-box.light h4,.title-box.light h3 + p{color:var(--white);}
.title-box.center{text-align:center;margin:0 auto;width:60%}
.title-box.center + p{width:100%;text-align:center;margin:0 auto}
@media (max-width: 992px) {
.title-box h3,.title-box h1{font-size:28px}
.title-box h3 + p,.title-box.center + p{width:100%;font-size:16px}
}


/*------------*/
.section{clip-path: polygon(0 0, 97% 0, 100% 7%, 100% 100%, 0 100%);position:relative;padding:60px 0;background: #ffff;}
.section2{padding:30px 0;position: relative;}
.sectionbg{background: #f4f4f4;padding:60px 0;position: relative;}

.bgbox{background: #f6f3f8;padding: 20px;position: relative;}
.bgbox.nobg{background:none}


.custom,.btn-arrow{position:relative;z-index:1}
.btn-arrow{font-size:15px;line-height:5px;text-transform:uppercase;/* border-radius:0 25px 0 0; */padding:20px 36px 16px 15px;display:inline-block;border:2px solid #eee;/* color:#999; */text-decoration:none;background-color:transparent;transition:all .3s ease;/* position:relative; */}
.btn-arrow span{position:relative;display:inline-block;padding-right:5px;transition:all .3s ease}
.btn-arrow span::after{content:'→';font-size:20px;position:absolute;top:-2px;right:-25px;transition:all .3s ease}

.whyus-fix i{font-size: 35px;color: var(--theme);}

/*----------*/
.page-head{padding: 80px 0 80px 0;position:relative;background: var(--sliver);text-align: center;}
.page-head h1{margin:0;padding: 0px 0 8px 0;font-size: 42px;text-transform: capitalize;color:var(--theme)}
.breadcrumb{padding: 0;margin: 0;display: inline-block;}
.breadcrumb > li{display:inline-block}
.breadcrumb > li + li:before{padding:0 5px;content:"/\00a0"}
.breadcrumb > li,
.breadcrumb > li > a,
.breadcrumb > li + li:before{color: var(--primary);}


/*========= index page =========*/

.content-card{display:flex;flex-direction:column;height:100%;}
.about-image-card{clip-path: polygon(0 0, 91% 0, 100% 9%, 100% 100%, 0 100%);overflow:hidden;height:100%;border-radius:20px;}
.about-image-card img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.about-image-card:hover img{transform:scale(1.05)}
.about-card{clip-path: polygon(0 0, 87% 0, 100% 8%, 100% 100%, 0 100%);background: var(--theme);padding: 40px 40px;color:#fff;display:flex;flex-direction:column;border-radius:20px;}
.about-card-label{ color: var(--action);}
.about-card-divider{width:100%;height:1px;background:#fff3;margin: 20px 0;position:relative;z-index:2}

@media (max-width: 991px) {
.content-card{padding:30px 0;margin-bottom:30px}
.about-image-card{min-height:350px;margin-bottom:30px}
.about-card{min-height:400px;padding:40px 30px}
}
@media (max-width: 767px) {
.content-card{padding:20px 0;margin-bottom:25px}
.about-image-card{min-height:300px;margin-bottom:25px}
.about-card{min-height:350px;padding:35px 25px}
.about-card-divider{margin:30px 0}
}
@media (max-width: 575px) {
.about-card{padding:30px 20px}
}


.highlight2{position:relative;padding: 60px 60px;background: url(../images/highlight.jpg) var(--theme) center center / cover no-repeat fixed;border-radius:10px;overflow:hidden;color: var(--white);}
.highlight2:before{content:' ';position:absolute;left:0;right:0;top: 0;bottom: 0;background:var(--primary);opacity:0.8}
.highlight2 a{font-size:80px;font-weight:400;color:transparent;-webkit-text-stroke: 1px var(--action);text-decoration:none;transition:all .3s ease;display:inline-block;line-height:1}
.highlight2 a:hover{color: var(--theme);-webkit-text-stroke:1px transparent}
.highlight2 a i{transform:rotate(-45deg);transition:transform .5s ease}
.highlight2 a:hover i{transform:rotate(0)}
.highlight2 .btn-arrow{position:absolute;bottom:0;opacity:.6}
@media (max-width: 992px) {
.highlight2{padding:60px 20px;text-align:center}
.highlight2 .btn-arrow{display:none}
.highlight2 a{font-size:48px;margin-top:16px}
}

/*----------*/
.feature-box{position:relative;height:480px;overflow:hidden;border-radius:16px}
.feature-image{position:absolute;inset:0;opacity:0;transition:opacity .5s ease}
.feature-image.active{opacity:1;z-index:1}
.feature-image img{width:100%;height:100%;object-fit:cover;clip-path:polygon(0 9%,5% 0,100% 0,100% 100%,0 100%);}
.feature-image::after{background: linear-gradient(to bottom, #37354200 24%, #0662ae00 33%, #0662ae1a 43%, #00000000 57%, #00000078 75%, #0000009e 92%, #000000cc 100%);content:'';position:absolute;inset:0;clip-path:polygon(0 9%,5% 0,100% 0,100% 100%,0 100%)}
.feature-text{position:absolute;bottom: 0px;left: 0;z-index:2;color:#fff;padding: 0 20px;}
.feature-list{/* margin-top:32px; */}
.feature-item{padding: 15px 0;border-bottom:1px solid #ddd;cursor:pointer;transition:.3s}
.feature-item.active h4,.feature-item:hover h4{color: var(--theme);}
.feature-item .progress-bar-wrap{height:2px;background:#eee;border-radius:2px;margin-top:10px;overflow:hidden;display:none}
.feature-item.active .progress-bar-wrap{display:block}
.feature-item .progress-fill{height:100%;background:var(--accent);width:0;border-radius:2px;animation:fillBar 4s linear forwards}
@keyframes fillBar {
to{width:100%}
}
@media (max-width: 991px) {


.feature-box{height:300px;border-radius:12px}
.feature-right{margin-top:24px}
}
@media (max-width: 576px) {
.feature-box{height:240px}

}
/*-------------*/
/*funfect*/
.stat-box{clip-path: polygon(0 0, 88% 0, 100% 10%, 100% 100%, 0 100%);background: var(--lightbg);padding:50px 40px;border-radius:12px;position:relative;transition:.3s ease}
.stat-header{margin-bottom:40px;}
.stat-number{font-size: 60px;font-weight:700;}
.stat-icon{font-size: 50px;}
.stat-box p{margin:0}
.box-tittle {gap: 20px;display: flex;flex-direction: row;text-align: center;align-items: center;}
.box-tittle img {filter: invert(29%) sepia(47%) saturate(1134%) hue-rotate(197deg) brightness(92%) contrast(92%);width: 65px;}
@media (max-width: 768px) {
.stat-number{font-size:56px}
}


.box6{padding: 15px;background: var(--sliver);border: 1px solid var(--border);border-radius: 10px;overflow: hidden;}
.box6.white{background:#fff}
.box6 .box-img {position: relative;overflow: hidden;border-radius: 6px;}
.box6 .box-text{position:relative;padding: 20px 0;color: #161616;text-align: left;}
.box6 .box-text h4{color: var(--theme);margin-bottom: 15px;}

@media (max-width:767px) {
    .box6 .box-text {padding: 15px}
}

/*-----------*/
.home-product .owl-nav{margin:20px 0}
.home-product .owl-nav button{background: transparent;margin-right: 15px;font-size: 18px;color: #fff;cursor: pointer !important;position: relative;right: 0;border: none;width: 65px;height: 65px;background: var(--theme);border-radius: 100%;}

.owl-stage{display: flex;flex-wrap: wrap;}
@media screen and (max-width: 1060px){
    .owl-theme .owl-controls .owl-prev{left:0 !important;    }
    .owl-theme .owl-controls .owl-next{right:0 !important}
}




.vision-box{border: 1px solid var(--grey);padding: 45px;margin-top: 0;background: #f5f7fd;cursor:pointer;transition:all .4s ease-in-out}
.vision-box .img-box{padding-bottom: 20px;}
.vision-box .img-box h4{color: var(--theme);margin-left: 15px;}
.vision-box .img-box img{width: 60px;display:none}
.vision-box p{margin:0}




/*========= contact page =========*/

.themebg {background: var(--theme); clip-path: polygon(0 6%, 7% 0, 100% 0, 100% 100%, 0 100%);}
.contact-item h4{margin-bottom: 10px;color: var(--theme);text-transform: capitalize;}
.contact-item {/* padding: 10px 0; */}
.contact-item + hr{background-color: #c6c6c6;}


/*------*/
.address{}
.address li{margin: 10px 0;}
.address li a{color:var(--primary)}
.address h4{font-size: 24px;font-weight: 700;letter-spacing: .5px;padding-bottom: 6px;margin-bottom: 13px;display: inherit;color: #e31822;}
.address > li > i{display:inline-block;vertical-align:top;margin-top: 4px;width: 20px;text-align: center;font-size: 17px;margin-right: 10px;}
.address p{display:inline-block;text-align:left!important;margin:0;/* font-size: 14px; */line-height: 25px;}



/*--------------*/
.cenq{display:none}
.form label{font-weight:600;}
.form button{margin-top:30px}
.form textarea.text-field{height:80px}
.form .select{margin:0!important;font-size:15px!important}
.form  input[disabled],.form .text-field{background: #f6f6f6;/* border: 0; *//* color: #222d35; *//* font-size: 16px; */margin: 0 0 18px;padding: 15px;width:100%;border-radius: 5px;border: 1px solid #e4e4e4;}
.form .text-field:focus,.form .text-field:hover{/* border-color: #c3002f; */box-shadow:none;/* border-width:1px; */background: #fff;}
.errorbox,.errorbox span,.errorbox li{color:#147280}
.errorbox .sucmsg{color:#046310}

.custbtn{border-radius: 0;padding: 15px 30px;background: var(--theme);position:relative;display:inline-block;border-radius: 5px;font-size:16px;font-weight: 600;margin-top: 0;border: 1px solid #ffff;color:#fff;text-transform:uppercase;transition:400ms all;-webkit-transition:400ms all;}
.custbtn:hover,.custbtn:focus,.custbtn:active{text-decoration:none;background: #000000;color: #fff;}

.capcha{background:transparent !important}
.capcha + input{width:200px !important;margin-top:5px !important}

/*-------------*/
#download{position:fixed;top:50%;right:0;font-size: 26px;color: #ffffff;background-color: #d11a1e;padding: 10px 18px;border-radius:30px 3px 3px 30px;z-index: 1;}
#download:hover{cursor:pointer;-webkit-box-shadow:0 8px 6px -6px #999;-moz-box-shadow:0 8px 6px -6px #999;box-shadow:0 8px 6px -6px #999}
#download > a{color:#0E0E0E}


/*--------------*/
.fix-penal{position: fixed;bottom: 10px;right: 10px;z-index:21}
.fix-penal .whatsapp,.fix-penal .callus{text-align: center;width: 50px;height: 50px;display: block;color: #FFFFFF;border-radius: 10px;background-color: #25D366;}
.fix-penal .callus{margin-bottom:10px;background:#f8b000;color: var(--primary);}
.fix-penal i{font-size: 32px;margin-top: 9px;}




/*-----------*/
.social li a i.white {
}
.social{list-style-type:none;padding:10px 0 0;margin:0}
.social li{display:inline-block}
.social a{margin-right:5px;cursor:pointer;display:block;width:40px;height:40px;text-align:center;text-decoration:none;background:transparent;border-radius:50%;border: 1px solid var(--theme);line-height:initial;font-size:20px;color: #000 !important;}
.social a i{line-height:40px;color: var(--theme);}
.social a:hover{background: var(--theme);color:var(--white)}
.social a:hover i{color:#fff}
/*-----------*/

.footer{padding-top:60px;color: var(--primary);position:relative;background: var(--grey);background-repeat:no-repeat}
.footer p,.footer a{font-weight:500}
.footer .ftcontact{border-top: 1px solid var(--border);padding-top:45px;margin-top: 26px;}
.footer .ftcontact i{}
.footer h4{margin-bottom:30px;text-transform:uppercase;color: var(--theme);}
.footer .ftcontact h5{font-size:15px;font-weight:400;margin-bottom:20px;color:#ffffff7d}
.footer .ftcontact a{font-weight:500;line-height:24px;margin-top:0;display:inline-block;color: var(--primary);}
.footer img{width: 250px;padding:10px 0 15px;display:inline-block}
.footer .social{text-align:right}

@media (max-width: 768px) {
.vcenter > .row{display:inherit;display:initial}
}

.copyrights{padding:21px 0;overflow:hidden;margin-top:45px;border-top: 1px solid var(--border);}
.copyrights p,.copyrights a{margin:0;color: var(--primary);}

@media (max-width: 992px) 
{
    .header-main{position:inherit;padding:0;height: auto;background: #fff;}
    .header-main .container{width:100%}
    .logo{margin-right:0;float:none!important;position: inherit;padding: 5px 0;}
    .logo img{margin: 10px 0;filter: inherit;width: 155px;}
    .page-head h1, .page-head .breadcrumb  {float:none}
    .page-head h1{}
    .page-head {/* margin-top: 56px; */padding: 15px 0;text-align:center;/* min-height: 35vh; */}
  .footer{text-align:left}
    .footer h3{margin-bottom:7px;margin-top:20px;padding-bottom:4px;text-align:left}
    .footer .address p{text-align:left!important}
    .footer .textright{text-align:left}
    .footer .social{text-align:left}
    #cssmenu > ul > li > a:before,#cssmenu > ul > li.active > a:before{bottom:0!important}
    .footer,footer .textright,.footer .social,.footer .address p{text-align:left!important}
    #cssmenu > ul > li > a:before, #cssmenu > ul > li.active > a:before{bottom: 0 !important;}
}
@media (max-width: 768px) 
{
     .vcenter > .row{display: inherit;}
}
