

@import url('https://fonts.googleapis.com/css2?family=Piazzolla:ital,opsz,wght@0,8..30,100..900;1,8..30,100..900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');


body {font-family: "Poppins", serif;
float: left;
width: 100%;
color: #000;font-weight: 300;
background-attachment: fixed; background-size: 40%;
padding-right: 0 !important;
   -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
}
.modal-open {
padding-right: 0!important;
overflow: hidden;
}
::-moz-selection {
color: #000;
background: #d7c07f;
}
::selection {
color: #000;
background: #d7c07f;
}
.btn{ box-shadow: none; outline: none;}
button{ box-shadow: none; outline: none;}
:focus {
outline: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
color: #000;  
}
p {
color: #000;
line-height: 30px;
font-size: 16px; font-weight: 300;-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
a{text-decoration: none;}
a:hover{color: #0e2c18;}
ul li,
ul li a,
ol li,
ol li a {
color: #161616;
font-size: 14px; font-weight: 300;
line-height: 26px;text-decoration: none;
}
a:hover,
a:focus {
text-decoration: none;
outline: none;
}
:focus {
outline:Ãƒâ€š none;
}
img{max-width:100%;height:auto;}

/* banner */
.swiper {
    width: 100%;
    height: 100%;
    
   
  }
  .swiper-slide  .pro-ico img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 27px;
    position: relative;
    background: #fff;
    
}
.pro-area{position: absolute;top:50%;right: 35px;z-index: 999;transform: translateY(-50%);display: grid;grid-template-columns: repeat(2,1fr); gap: 1rem;}
.pro-ico{width: 100px;height: auto;border-radius: 27px;}
.pro-sec{    display: flex ;
      flex-direction: column;
      gap: 1rem;justify-content: space-between;}

  /* header .navbar{padding: 0;} */

  .swiper-slide {
    background-position: center;
    background-size: cover;
    position: relative;
    height:100%;
    /* background: u; */
  }
  .bannerul li img{width: auto;height: auto;object-fit: unset;display: inline-block;top:unset;left: unset;object-fit: unset;position: relative;z-index: 9;}

  .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
  object-fit: cover;
  object-position: left bottom;
  position: absolute;
  top:0;
  left:0;
  z-index:-1
 
  }

  :root{--primary:#E32734;
         --secondary:#0E4681}



  header .nav-link{font-size: 15px;font-weight:600;text-transform: capitalize; color: var(--secondary) !important;       padding-right:0 !important;
    padding-left: 4rem !important;}
    .mainBanner{display: flex;align-items: flex-start;height: 570px;}
    .banner-content{flex-shrink: 0;}
  /* header{position: absolute;top: 0;left: 0;width: 100%;z-index:999;background: transparent;} */
  header .navbar-nav .nav-link.active,header .navbar-nav .nav-link.show {
    color: var(--primary) !important;
    
}

/* .swiper-slide::before{content: '';position: absolute;left: 0;top: 0;height: 100%;width: 100%;background-image:linear-gradient(to right, #0e4681, #0e468100);z-index: 9;} */

.container-custom{margin-left: calc((100% - 1140px)/2);    padding-left: calc(var(--bs-gutter-x)* .5);margin-top: 4rem; 
     --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;margin-right: -18rem;z-index:9}
  @media (min-width: 1400px) {
    .container-custom{margin-left: calc((100% - 1320px)/2);  }.slider-div{max-width: 1210px !important;}
}

.container-custom-right{margin-right: calc((100% - 1140px)/2); position: relative;   padding-right: calc(var(--bs-gutter-x)* .5);
     --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;z-index:9}
  @media (min-width: 1400px) {
    .container-custom-right{margin-right: calc((100% - 1320px)/2);  }
}
  h1{font-size: 45px;font-weight: 600;color: #fff;margin-bottom: 2rem;margin-top: 0;font-family:'Poppins';text-transform: capitalize;}
  .banner-content .cta span{color: #fff;}
  .banner-content .cta svg{stroke: #fff;}
  .swiper-pagination{bottom: 30px !important;margin-left: 10rem;}
  .swiper-pagination-bullet{background: #fff ;opacity: 1;}
  .swiper-pagination-bullet-active{background: var(--primary);}
  .banner-content.container-custom{margin-top: 0;}
  .banner-content{z-index: 9;position: relative;}

  /* From Uiverse.io by alexmaracinaru */ 
.cta {
  position: relative;
  margin: auto;
  padding: 9px 18px;
  transition: all 0.2s ease;
  border: none;
  background: none;
  cursor: pointer;
}

.cta:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  border-radius: 50px;
  background: var(--primary);
  width: 45px;
  height: 45px;
  transition: all 0.3s ease;
}

.cta span {
  position: relative;
 
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.05em;
  color: var(--secondary);
  text-transform: capitalize;
}

.cta svg {
  position: relative;
  top: 0;
  margin-left: 10px;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke: #234567;
  stroke-width: 2;
  transform: translateX(-5px);
  transition: all 0.3s ease;
}

.cta:hover:before {
  width: 100%;
  background: var(--primary);
}

.cta:hover svg {
  transform: translateX(0);
}

.cta:active {
  transform: scale(0.95);
}

.sub-tit h2{font-size: 28px;font-weight: 400;font-family: 'Poppins';text-transform: capitalize;color: #fff;}
.sub-tit{margin-top: 24px;}


.bannerul{margin: 3rem 0 0;padding: 0;list-style: none;display: flex;gap: 2rem;}
.bannerul h3{font-size: 15px;font-weight: 500;color: #fff;text-transform: capitalize;margin-top: 15px;}
.bannerul li{text-align: center;}
.title{font-size: 35px;font-weight: 700;margin-bottom: 2rem;color:var(--secondary)}
.services .title{text-align: center}
.s-card h3{font-size: 15px;color: transparent;background: linear-gradient(to right, #E32734,#0E4681);background-clip: text;text-transform: uppercase;font-weight: 500;margin-top: 15px;}
.s-icio{border-bottom: 1px solid #cdcdcd;margin-bottom: 10px;position: relative;z-index: 2;}
.s-cont p{color: rgba(0, 0, 0, 0.75);font-size: 13px;font-weight: 500;line-height: 20px;margin-bottom: 8px;}
.s-card{background: #fff;position: relative;padding: 1rem;border-radius: 1rem;min-height: 350px;margin: 15px ;}
.s-card::after{position: absolute;left: 50%;top: 50%;width: 101%;height: 101%;background: linear-gradient(to bottom ,#0E4681 ,#E32734 );content: '';z-index: -1;transform: translate(-50% , -50%);border-radius: 1rem;}
.rm{font-size: 11px;text-transform: capitalize;color: #000;}
.rm i{width: 15px;height: 15px;background:  linear-gradient(to right, #E32734,#0E4681);border-radius: 50%;display: inline-flex;align-items: center;justify-content: center;color: #fff;font-size: 10px;margin-left: 5px;}
.s-card:hover::after{z-index: 1;}
.s-cont{position: relative;z-index: 2;}
.s-card:hover h3{color: #fff;}
.pro-img {height:350px}
.pro-img img{width:100%;height:100%;object-fit:cover}
.s-card:hover p{color: rgba(255, 255, 255, 0.75);}
.s-card:hover a{color: rgba(255, 255, 255, 0.75);}
.s-card img{border-radius:6px;}
.s-card img{width: auto !important;}
.slider-div{max-width: 1040px;margin: auto;}
.slide-btn{text-align: right;margin-top: 1rem;margin-bottom: 2rem;}

.abt{padding: 3rem 0;background:  linear-gradient(to bottom,#0E4681, #E32734);margin: 0 0;}
.abt .title{color: #fff;}
.abt p{color: #fff;}
.abt .cta span{color: #fff;}
.abt .cta svg{stroke: #fff;}
.abt ul{padding: 0;margin: 0;list-style: square;margin: 2rem 0;list-style-position: inside;}
.abt ul li{font-size: 14px;color: #fff;margin:3px 0;}
.abt ul li::marker{color: var(--secondary);}
.abt ul li:last-child{margin-bottom: 0;}
.ab-img{position: absolute;top: 0;left: 0;top: -20px;}
.prod .title{text-align: center;}
.prod{padding:4rem 0 2rem;}
.services{padding: 10rem 0 0;}
.pro-img img{border-radius: 5px;}
.prod-card h3{    font-size: 16px;
  color: transparent;
  background: linear-gradient(to right, #E32734, #0E4681);
  background-clip: text;
  text-transform: uppercase;
  font-weight: 700;
  margin: 15px 0;
}

.grad-btn{border-image: linear-gradient(to right, #E32734, #0E4681) 1;
 
  border-width: 1px;
  border-style: solid;
  padding: 0px 25px;background: #fff;transition: all 0.3s linear;display: inline-flex;justify-content: center;align-items: center;}
  .grad-btn span{background: linear-gradient(to right, #E32734, #0E4681) ;line-height: 30px;
    background-clip: text;color: transparent;font-weight: 500;font-size: 12px;text-transform: capitalize;transition: all 0.3s linear}

  .grad-btn:hover{background:  linear-gradient(to right, #E32734, #0E4681);}
  .grad-btn:hover span{color: #fff;}
  .accordion-button:not(.collapsed){background: #fff;}
  .accordion-button{box-shadow: none !important;background: transparent !important;font-size: 16px;font-weight: 500;color: #fff !important;text-transform: capitalize;}
  .accordion{background:  linear-gradient(to bottom,#0E4681, #E32734);--bs-accordion-border-color:none;border-radius: 10px;margin-bottom: 2rem;}

  .accordion-item{background: transparent;}
  .accordion-item p{color: rgba(255, 255, 255, 0.75);line-height: 25px;font-size: 14px;border-bottom: 1px solid #a4a4a4;
    padding-bottom: 1rem;
    margin: 0;}
  .accordion-button::after{filter: invert();}
  .form-area h3{font-size: 25px;color: var(--secondary);text-transform: capitalize;margin-bottom: 1.5rem;}


  .input-wrapper {
    position: relative;
    display: block;
    padding: 1.6px 1.6px; /* Adjust based on border width */
    border-radius: 9px; /* Adjust based on border radius */
    margin-bottom: 1rem;
  
}

.gradient-border-input {
  width: 100%;
    padding: 15px;
    font-weight: 100;
    border: none;
    border-radius: 9px; /* Match the border radius of the wrapper */
    outline: none;
    background: #fff;
    position: relative;
    z-index: 1;
    font-size: 13px;
}

.input-wrapper::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to bottom,#0E4681, #E32734); /* Gradient color */
    border-radius: 4px; /* Match the border radius of the wrapper */
    z-index: -1;
    background-clip: border-box;
    padding: 0.5px 0.5px; /* Adjust based on border width */
    border-radius: 10px;
}
/* .form-area{padding-left: 3rem;} */

.contact .grad-btn span{font-weight: bold;font-size: 16px;}
.contact{padding-bottom: 3rem;}
.rat .checked {
  color: gold;
}
.p-detial .prod-card{margin-bottom: 2rem;}
.rat span:not(checked){color: #cdcdcd;}
.r-pro img{width: 38px;height: 38px;border-radius: 50%;}
.r-pro{display: flex;gap: 1rem;align-items: center;}
.r-box h3 {
  font-size: 15px;
  color: transparent;
  background: linear-gradient(to right, #E32734, #0E4681);
  background-clip: text;
  text-transform: uppercase;
  font-weight: 500;
  margin:0;
}
.r-head{display: flex;justify-content: space-between;align-items: center;padding-bottom: 10px;border-bottom: 1px solid #cdcd;margin-bottom: 10px;}
.rat span{font-size: 10px;}
.r-body p{font-size: 12px;line-height: 25px;}
.r-box::after {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 101%;
  height: 101%;
  background: linear-gradient(to bottom, #0E4681, #E32734);
  content: '';
  z-index: -1;
  transform: translate(-50%, -50%);
  border-radius: 1rem;
}
.r-box{    background: #fff;
  position: relative;
  padding: 1.5rem;
  border-radius: 1rem;}
  .rating{padding: 1rem 0 4rem;}
  .log {width :120px;;}
  .sub-header .log{width:110px;}
  .conn-box{display: flex;justify-content: space-between;align-items: center;}
  .conn-box h2{font-size: 36px;font-weight: 500;color: var(--secondary);}
  .gs{font-size: 17px;color:#fff;padding: 5px 25px;background: var(--primary);text-transform: capitalize;border-radius: 4px;}
  footer{background: linear-gradient(to bottom,#E32734,#0E4681);padding: 9rem 0 0;}
  footer *{color:#fff}
  .f-logo{margin-bottom: 2rem;}
  .f-ul li{margin: 0.3rem 0;}
  .f-ul{margin: 0;padding: 0;list-style: none}
  .f-title{font-size: 18px;margin-bottom: 1.5rem;}
  .f-ul li a{font-size: 13px;color: #fff !important ;font-weight: 200;margin-bottom: 15px;}
  .f-logo + p{padding-right: 4rem;}
  .fb-ul{padding: 0;margin: 0;list-style: none;display: flex;}
  .fb-ul li a{padding: 0 10px;font-size: 12px;color: #fff;border-right: 1px solid #fff;}
  .fb-ul li:last-child a{border: none;}
  .f-bottom p{font-size: 12px;margin: 0;}
  .form-area{padding-left: 3.5rem;}
  .f-bottom{display: flex;justify-content:space-between;padding: 2rem 0;}
  .connect{margin-bottom: -60px;}
  .conn-box{background: #fff;position: relative;z-index: 3;padding: 2rem 5rem;border-radius: 1rem;}
.sub-header{position: relative;}
.sub-header .nav-link{color: var(--secondary) !important;}
.sub-cont h1{font-size: 55px;color: #fff;margin: 0;text-transform: capitalize;}
.sub-cont {position: absolute;top: 50%;left: 50%;transform: translate(-50% , -50%);text-align: center;}
.sub-banner{position: relative;height: 320px;padding: 0;}
.sub-banner::before{display: none;}
.breadcrumb-item a,.breadcrumb-item.active{color: #fff;font-size: 14px;text-transform: uppercase; }
.breadcrumb-item+.breadcrumb-item::before{color: #fff}
.breadcrumb{justify-content: center;margin-top: 0.5rem;}
.abt-detail{padding: 3rem 0 4rem;}
.ab-d-ul{padding: 0;margin: 0;list-style: none;display: flex;gap: 2rem;margin-top: 2rem;}
.ab-d-ul li h3{font-size: 26px;font-weight: 600;color:var(--secondary);}
.ab-d-ul h6{font-size: 11px;color: var(--secondary);}
.qa{text-align: center;margin: 2rem 0 4em;}
.vis-card h3{font-size: 18px;color: #fff;text-transform: uppercase;padding: 0.5rem 0;}
.vis-card{background: linear-gradient(to bottom,  #0E4681,#E32734);border-radius:10px;padding: 1rem 2rem;text-align: center;height: 100%;}
.vis-ico{border-bottom: 1px solid #cdcd;margin-bottom: 10px;}
.vis-card p{line-height: 25px;color: #fff;font-size: 13px;font-weight: 100;}
.abs-img{position: absolute;top: 0;right: 0;z-index: -1;}
.service-detial .abs-img{right: unset;left: 0;}
.sd-ul{padding: 0;margin: 0;list-style: upper-alpha;list-style-position: inside;}
.vms{padding: 3rem 0 1rem;margin: 3rem 0;background: rgba(14, 70, 129, 0.05);}
.sd-ul p{display: inline;}
.p-detial{padding-top: 5rem;}
.prod-list-sec{padding: 3rem 0 0;}
.float{
	position:fixed;
	width:60px;
	height:60px;
	bottom:40px;
	right:40px;
	background-color:#25d366;
	color:#FFF !important;
	border-radius:50px;
	text-align:center;
  font-size:30px;
	box-shadow: 2px 2px 3px #999;
  z-index:100;
}

.my-float{
	margin-top:16px;
}
.prod-list-sec .title{text-align: center;}
.pl-box .grad-btn{display: block;width: 100%;margin-top: 1rem;text-align:center;}
.pl-box .grad-btn span{font-size: 14px;text-transform: uppercase;  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;  
  overflow: hidden;}
.contact-top,.contact-bottom{padding: 3rem 0;}
.c-ico{width: 70px;margin-right: 0;margin-bottom: 0.5rem;flex-shrink: 0;}
.c-box{display: flex;gap: 10px;margin: 1rem 0;}
.c-box h3{font-size: 18px;color: var(--secondary);text-transform: capitalize;margin-bottom: 10px;}
.contact-top{display: block;justify-content: space-between;}
.c-box{flex-basis: 450px;text-align: left;}
.c-box p{font-size: 14px;line-height: 23px;}
.flex-area{display: flex;gap: 1.5rem;}
.flex-area div{flex-grow: 1;}
.map{margin-bottom: -65px;}
.map .title{text-align: center;}
.sub-img img{width: 100%;height: 100%;object-fit: cover;}
.sub-img{width: 100%;height: 100%;}
.s-card p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.ser-ul{padding: 0;list-style: auto;list-style-position: inside;}
.ser-ul h3{font-size: 20px;display: inline;color: #ab2f48;}
.ser-ul li{margin-bottom: 1rem;}
.pl-img img{width: 100%;height: 100%;object-fit: contain;}
.pl-img{height: 200px;}


.au h3{font-size: 16px;font-weight: 500;}
.au p{color: rgba(0, 0, 0, 0.5);font-size: 12px;line-height: 21px;margin: 0;}
.au{padding: 1rem;box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;;border-radius: 6px;margin: 1rem 0;}
.au-img {display: inline-block;vertical-align: middle;margin-right: 1rem;}
.au-grp{display: flex;gap: 1rem;align-items: center;margin-bottom: 2rem;}

.au-img-area{flex-shrink: 0;}



/* media query for mobile portrait */
/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 780px) {
     .swiper-slide {
    background-position: center;
    background-size: cover;
    position: relative;
    height:100%;
    .sub-tit h2{font-size: 15px;}
    /* background: u; */
  }
  .au-img-area{display: none;}

  .au h3{font-size: 13px;}
  .ser-ul h3{font-size: 14px;}
  header{position: relative;}
  .log{width: 110px;}
  .navbar-toggler:focus{box-shadow: none;}
  .navbar-collapse .navbar-nav{background: var(--secondary);border-radius: 3px;padding: 15px;}
  header .nav-link{font-size: 13px;padding: 0.5rem 0 !important;color: #fff !important;}
  .mainBanner{align-items: flex-start;margin-bottom: 2rem;}
  h1{font-size: 20px;margin-top: 0;}
  .container-custom{margin-left: 1rem;margin-right:75px;}
  .services{padding: 3rem 0;}
  .cta span{font-size: 12px;}
  .cta:before{width: 35px;height: 35px;}
  .cta{padding: 4px 18px;}
  .bannerul h3{font-size: 11px;}
  .bannerul li img{width: 20px;margin: auto;}
  .bannerul{flex-direction: column;gap: 0rem;}
  .swiper-pagination{display: none;}
  .title{font-size: 18px;}
  .bannerul li{text-align: left;}
  .s-card h3{font-size: 13px;}
  .ab-img{display: none;}
  .container-custom-right{margin-right: 1rem;margin-left: 1.5rem;}
  .abt p{font-size: 12px;}
  .abt div[class*='col']{width: 100%;}
  .abt ul li{font-size: 12px;}
  .s-card{min-height: 270px;}
  .prod{padding: 2rem 0;}
  .prod-card h3{font-size: 13px;}
  .contact div[class*='col']{width: 100%;}
  .accordion-button{font-size: 13px;}
  .accordion-item p{font-size: 12px;}
  .form-area{padding: 0;}
  .form-area h3{font-size: 15px;}
  .gradient-border-input{padding: 9px;}
  .contact .grad-btn span{font-size: 13px;}
  .rating div[class*='col']{width: 100%;}
  .r-box h3{font-size: 13px;}
  .rat span{font-size: 8px;}
  .rating .slider-div{max-width: 100%;margin:0 1.5rem;}
  .r-box{margin-bottom: 1rem;}
  .conn-box{display: block;padding: 1.5rem;text-align: center;}
  .conn-box h2{font-size: 21px;}
  .gs{font-size: 14px;}
  .rating{padding-bottom: 2rem;}
  footer .col-6{width: 100%;}
  .f-logo + p{font-size: 12px;}
  footer .col-4{width: 100%;}
  footer .col-2{width: 50%;}
  .f-ul li a{font-size: 12px;}
  .f-title{font-size: 13px;margin-bottom: 1rem;}
  footer .g-5,footer .gy-5 {
    --bs-gutter-y: 1rem;
}
.f-bottom{display: block;text-align: center;}
.fb-ul{justify-content: center;}
footer{padding: 7rem 0 0;}
.sub-banner{height: 150px;}
.sub-cont h1{font-size: 20px;}
.breadcrumb-item a, .breadcrumb-item.active{font-size: 11px;}
.abt-detail div[class*='col']{width: 100%;}
.abs-img{display: none;}
p{font-size: 12px;}
.ab-d-ul li h3{font-size: 15px;}
.vis-card h3{font-size: 15px;}
.vis-card p{font-size: 12px;}
.col-4:has(.vis-card){margin-bottom: 1rem;}
.qa{margin-bottom: 2rem;}
.sub-header .nav-link{color: #fff !important;}
.prod.p-detial div[class*='col']{width: 100%;}
.p-detial .col-4:has(.prod-card){margin-bottom: 1.5rem;}
.contact-top{display: block;padding: 1rem 0;}
.c-box{text-align: left;}
.c-ico{width: 45px;margin-left: 0}
.c-box h3{font-size: 15px;}
.c-dt{display: none;}
.breadcrumb{display: none;}
html,body{width: 100%;overflow-x: hidden;}
.vms{margin-top: 0;}
.col-3:has(.pl-box){width: 100%;}
.pl-img img{display: block;margin: auto;}
.pl-box .grad-btn span{font-size: 12px;}
.prod-list-sec{padding: 2rem 0;}
.abt-detail{padding-top: 2rem;}
.swiper-slide .pro-ico img{border-radius: 10px;}
.pro-ico{width: 50px;}
.pro-area{right: 15px;display: block;}
.swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center bottom;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
.pro-sec{margin:1rem 0;}
  }


  .c-l-img{position: absolute;left: 0;z-index: -1;}
