@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap');

 :root{
    --si-color-one:#121214;
    --si-color-two:#f0f6ff;
    --si-color-three:#4c9cb4;
    --si-color-four:#85c4df;
    --si-color-five:#ffffff;
    --si-color-six:#dcf3ff;
    --si-color-seven:#176f93;
    --si-color-eight:#497c02;
    --si-color-nine:#4c9307;

 }

 .si-primary-color{
    color: var(--si-color-one);
 }

 .si-primary-bg-color{
    background-color: var(--si-color-four);
 }

 .body{
    font-family: "Poppins", sans-serif;
 }

 h1,h2,h3,h4,h5,h6{
    font-family: "Oswald", sans-serif;
 }
/*sticky watsup instagram css start*/
.sticky-watsup .float {
  position: fixed;
  width: 45px;
  height: 45px;
  bottom: 90px;
  right: 10px;
  background-color:transparent;
  border-radius: 50px;
  text-align: center;
  font-size: 30px;
  z-index: 100;
}
.sticky-watsup .my-float{
  height:33px;
  width: 33px;
}

/*sticky watsup instagram css end*/
/*sticky-up css start*/
.back-to-top {
  position: fixed;
  width: 45px;
  height: 45px;
  bottom: 40px;
  right: 10px;
  background-color: var(--si-color-two);
  border-radius: 50px;
  text-align: center;
  font-size: 30px;
  box-shadow: 2px 2px 3px #999;
  z-index: 100;
}
.back-to-top .icon__arrow-up{
  height:25px;
  width: 25px;
}
/*sticky-up css start*/
 /*navbar menu css start*/
 .navbar-menu{
    background-color: var(--si-color-seven);
 }
 .callno{
    background-color:transparent;
    padding: 5px 7px;
    border-radius:30px;
    border: 3px solid #ffffff94;
    background-color: var(--si-color-seven);
 }
 .callno:hover{
    background-color: var(--si-color-two);
    color: var(--si-color-one);
    box-shadow: 1px 1px 1px #4c9cb4;
 }
 .callno a{
    text-decoration: none;
    color: var(--si-color-two);
    font-weight: 600;
    font-size: 17px;  
 }
 .callno:hover a{
    color: var(--si-color-one); 
 }
 .callno:hover .cicon{
    content: url('../image/icon/customer-service-black.png')!important;
 }


 /* .callno-new{
  background-color:transparent;
  padding: 5px 7px;
  border-radius:30px;
  border: 3px solid #ffffff94;
  background-color: var(--si-color-seven);
  width: 180px;
}
.callno-new:hover{
  background-color: var(--si-color-two);
  color: var(--si-color-one);
  box-shadow: 1px 1px 1px #4c9cb4;
}
.callno-new a{
  text-decoration: none;
  color: var(--si-color-two);
  font-weight: 600;
  font-size: 17px;  
}
.callno-new:hover a{
  color: var(--si-color-one); 
}
.callno-new:hover .cicon{
  content: url('../image/icon/customer-service-black.png')!important;
} */

 .cicon{
    height: 30px;
    width: 30px;
 }
 .navbar-menu .nav-link,.dropdown-item{
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--si-color-two);
 }
 .navbar-menu .nav-link:hover{
    background-color: rgba(255, 255, 255, 0.288);   
 }
 .navbar-menu .nav-link.active{
    color: var(--si-color-two)!important;
 }
 .navbar-menu .dropdown-item{
    transition: all 0.4s;
    background-color: transparent;
 }
 .navbar-menu .dropdown-item:hover{ 
    color: var(--si-color-five);
    background-color: rgba(255, 255, 255, 0.288);
 }
 .navbar-menu .nav-item{
    padding: 0px 5px;
 }

 .navbar-menu .dropdown-menu{
    background-color: var(--si-color-seven);
 }
 .navbar-menu .dropdown-toggle{
    color: var(--si-color-two)!important;
 }
.navbar-toggler{
    background-color: var(--si-color-two);
}


 /*navbar menu css end*/
/*about css start*/
.about-section{
    margin: 45px 0px;
}
.heading h2{
    font-size: 35px;
    margin: 5px 0px 20px;
    
}
.heading h4{
    font-size: 25px;
    opacity: .6;
    color: var(--si-color-nine);
}
.ice-icon{
    height: 20px;
    width: 20px;
}
.list-about ul li{
margin:10px 0;
}
.list-about ul{
    padding: 0px;
}
.list-about-1 ul li{
  margin:10px 0;
  }
  .list-about-1 ul{
      padding: 0px;
  }
/*about css end*/
/*button css start*/

  .all-button .all-sec-btn{
    border-radius: 1px;
    background-color: var( --si-color-nine);
    box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
    border: none;
    margin: 30px 0px;
  }
  .all-button .all-sec-btn:hover{
    background-color: var(--si-color-eight);
    box-shadow: rgba(253, 253, 253, 0.25) 0px 50px 100px -20px, rgba(255, 255, 255, 0.3) 0px 30px 60px -30px, rgba(255, 255, 255, 0.35) 0px -2px 6px 0px inset;
  }
  .contact-button  .all-sec-btn{
    border-radius: 1px;
    background-color: var(--si-color-nine);
    box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
    border: none;
  }
  .contact-button .all-sec-btn:hover{
    background-color: var(--si-color-eight);
    box-shadow: rgba(253, 253, 253, 0.25) 0px 50px 100px -20px, rgba(255, 255, 255, 0.3) 0px 30px 60px -30px, rgba(255, 255, 255, 0.35) 0px -2px 6px 0px inset;
  }
  .product-button .all-sec-btn{
    border-radius: 1px;
    background-color: var( --si-color-nine);
    box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
    border: none;
    margin: 10px 0px;
  }

  .product-button {
    text-align: center;
  }

  .slick-next:before, .slick-prev:before{
    color: #000!important;
    font-size: 28px!important;
  }

  .product-button .all-sec-btn:hover{
    background-color: var(--si-color-eight);
    box-shadow: rgba(253, 253, 253, 0.25) 0px 50px 100px -20px, rgba(255, 255, 255, 0.3) 0px 30px 60px -30px, rgba(255, 255, 255, 0.35) 0px -2px 6px 0px inset;
  }
/*button css end*/
/*choose us start*/
.choose-us-section{
    padding: 45px 0px;
}
.choose-us-section{
    background-image: linear-gradient(rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.7)),url('../image/bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.txt p{
  color: var(--si-color-one);
}

/*choose us end*/
/*feature start*/
.feature-section{
    margin: 45px 0px;
}
.heading-feature{
    margin-bottom: 30px;
}
.feature-card{
    height: 320px;
    width: 100%;
    border-radius: 1px;
    /* background-color: var(--si-color-two); */
    border: 1px solid #dcf3ff;
    transition: transform 10s;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    background-image: url('../image/bg-full.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.feature-img-1{
    background-image: url('../image/2.jpg');
    background-repeat: no-repeat;
    background-position: center;
    height:320px;
    width: 100%;
    background-size: 100% 100%;
  -moz-transition: all .8s;
    -webkit-transition: all .8s;
    transition: all .8s;
    border-radius: 0px 1px 1px 0px;
}

.feature-img-2{
    background-image: url('../image/globe.jpg');
    background-repeat: no-repeat;
    background-position: center;
    height:320px;
    width: 100%;
    background-size: 100% 100%;
    -moz-transition: all .8s;
    -webkit-transition: all .8s;
    transition: all .8s;
    border-radius: 0px 1px 1px 0px;
}
.feature-img-3{
    background-image: url('../image/hyegine.jpg');
    background-repeat: no-repeat;
    background-position: center;
    height:320px;
    width: 100%;
    background-size: 100% 100%;
    -moz-transition: all .8s;
    -webkit-transition: all .8s;
    transition: all .8s;
    border-radius: 0px 1px 1px 0px;
}
.feature-img-4{
    background-image: url('../image/innovation-1.jpg');
    background-repeat: no-repeat;
    background-position: center;
    height:320px;
    width: 100%;
    background-size: 100% 100%;
    -moz-transition: all .8s;
    -webkit-transition: all .8s;
    transition: all .8s;
    border-radius: 0px 1px 1px 0px;
}
.feature-card:hover .feature-img-1{
    background-size: 90% 90%;
}
.feature-card:hover .feature-img-2{
    background-size: 90% 90%;
}
.feature-card:hover .feature-img-3{
    background-size: 90% 90%;
}
.feature-card:hover .feature-img-4{
    background-size: 90% 90%;
}
.feature-card:hover{
    background-color: #85c4df93;
}
.feature-card-title{
    font-size: 25px;
    color: var(--si-color-seven);
}
/*feature end*/

/*contact start*/
.contact-section{
    background-image: url('../image/c-bg.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 56px 0px 0px;
    background-attachment: fixed;
}
.contact form{
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5));
    padding: 20px 40px;
    box-shadow: rgba(255, 255, 255, 0.24) 0px 3px 8px;
    border-radius: 3px;
}
.heading-contact .h4{
    color: var(--si-color-five)
}
/*contact end*/
/*client start*/
.client-section {
    background-image: url('../image/bg-full.jpg');
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: cover;
    color: #e2e2e2;
    padding: 30px 0;
  }

  .heading-client h2{
    color: var(--si-color-one);
  }
/*client end*/
/*testimonial start*/
.testimonials-section{
    margin: 45px 0px;
}

.swiper-container {
    border-radius: 3px;
    width: 70vw;
    overflow: hidden;
    height: fit-content;
    height: fit-content;
    font-size: 50px;
    position: relative;
    padding-bottom: 50px;
  }
  
  .swiper-slide {
    width: auto;
    height: fit-content;
    display: flex;
    height: auto;
    border-radius: 5px;
    overflow: hidden;
    align-items: flex-start;
    flex-direction: column;
    padding: 0px;
    background-color: white;
  
  }
  
  .swiper-slide .ImgHolder {
    background-color: var(--si-color-seven);
    display: flex;
    width: 100%;
    height: auto;
    padding: 30px;
    border-bottom-left-radius: 20px;
  
  }
  
  .ContentHolder::before {
    background-color: var(--si-color-four);
    content: '';
    width: 50px;
    height: 50px;
    position: absolute;
    top: -5px;
    z-index: -1;
    right: 0px;
  }
  
  .ContentHolder {
    position: relative;
    padding: 10px;
    background-color: white;
    border-top-right-radius: 20px;
  }
  
  .swiper-pagination-bullet {
    background-color: white;
    opacity: 1;
    border: 1px solid var(--si-color-four);
  }
  
  .swiper-pagination-bullet-active {
    background-color: var(--si-color-four);
  }
  
  .swiper-button {
    border: 1px solid white;
  }
  
  .swiper-slide img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    margin: auto;
    object-fit: cover;
    border: 3px solid var(--si-color-four);
    outline: 2px solid white;
  }
  
  .swiper-slide h3 {
    font-size: 1.1rem;
    text-align: center;
    font-weight: bold;
  }
  
  .swiper-slide p {
    font-size: 0.9rem;
    padding: 5px;
  }
  
  @media (max-width:638px) {
    .swiper-container {
      width: 100%;
    }
  }
  
  @media (max-width:500px) {
    .swiper-container {
      width: 70vw;
    }
  }
  
  @media (max-width:300px) {
    .swiper-container {
      width: 100%;
    }
  
    .swiper-slide {
      border-radius: 0px;
    }
  
    .swiper-container .ImgHolder {
      border-radius: 0px;
    }
    .ContentHolder{
      border-radius: 0px;
    }
  }
/*testimonial end*/
/*faq start*/
.faq-section{
    margin: 45px 0px;
}
.faq-btn{
    background-color: var(--si-color-four);
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
}
.accordion-collapse{
    background-image: url('../image/faq-bg.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.accordion-header .faq-q{
    font-weight: 700;
}
/*faq end*/
/*product card*/
.product{
    margin: 45px 0px;
}
.product-card{
    background-image: url('../image/bg-full.jpg');
    border: none;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    margin: 10px;
}

/*product card*/
/*footer start*/
.footer{
   background-image: linear-gradient(rgba(23, 111, 147, 0.7), rgba(23, 111, 147, 0.7)),url('../image/t-bg.jpg');
   background-position: center;
   background-repeat: no-repeat;
   background-size: cover;
   padding: 80px 0px;
}

.f-txt{
    color: var(--si-color-five);
    font-size: 16px;
    font-weight: 500;
    margin-top: 20px;
}
.heading-footer h4{
    color: var(--si-color-five);
}
.link-icon{
    height: 25px;
    width: 25px;
    margin: 0px 5px;
}
.lists{
    margin-top: 20px;
}
.lists ul{
    padding: 0px;
}
.lists ul li{
    line-height: 25px;
    
}
.lists ul li a{
    text-decoration: none;
    color: var(--si-color-five);
    font-size: 16px;
    font-weight: 600;
}
.info-footer{
    margin-top: 20px;
    line-height: 25px;
}
.info-footer p{
    color: var(--si-color-five);
}
.social-icons{
    margin-top: 30px;
}
.social-img{
    height: 30px;
    width: 30px;
    margin: 0px 5px;
}

/*footer end*/
.copyright{
    background-color: var(--si-color-seven);
    color: #fff;
    text-align: center;
    padding: 10px 0px;
}
.copyright a{
    color: #fff;
    text-decoration: none;
}
/*copyright end*/

/*about page css start*/
.about-banner{
  background-image: url('../image/about-banner.jpg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 300px;
}
.about-section .txt p{
  color: var(--si-color-one);
} 
/*mission vision*/
.mission-vision{
  margin: 45px 0px;
}
.mission-vision-card{
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}
.mission-vision-card:hover{
  box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
}
.mission-vision-body{
  text-align: center;
  padding: 20px;
}
.mission-vision-card{
  background-image: url('../image/5ce68d9aec.jpg');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
/*about page css end*/
/*contact page css start*/
.contact-banner{
  background-image: url('../image/contact-banner.jpg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 300px;
}
.frm-cntct{
  background-image: url('../image/bg-full.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  padding: 15px 240px 50px 30px;
  box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;
}

.contact-heading{
  padding-bottom: 25px;
}

.detail{
  background-image: linear-gradient(rgba(76, 156, 180, 0.8), rgba(76, 156, 180,0.8)),url('../image/Ice\ cubes\ are\ scattered\ with\ water\ drops\ scattered\ on\ a\ blue\ background_.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;

}
.detail h1{
  color: var(--si-color-two);
  padding: 50px 30px 20px;
}
.detail-flex{
  display: flex;
  align-items: flex-start;
}
.d-icon{
  height: 30px;
  width: 30px;
  margin-left: 20px;
  margin-top: 20px;
}
.detail-flex p{
  color: var(--si-color-two);
  font-size:17px;
  padding: 20px;
}
.detail h5{
  color: var(--si-color-two);
  padding: 10px 30px;
}
.fab-w{
  color: var(--si-color-two);
}

.contact-form {
  padding: 50px 0;
}
  
.contact-form-sec {
  width: 900px;
  width: 1000px;
    z-index: 0;
    position: relative;
}

.contact-info-sec {
  width: 400px;
  width: 492px;
    z-index: 0;
    margin-top: 55px;
    margin-left: -200px;
    /* position: absolute;*/
}

.detail-flex-icon{
  display: flex;
  align-items: flex-start;
  margin: 10px 25px;
  padding-bottom:30px ;
}

.social-icon{
  height: 27px;
  width: 27px;
  margin-left: 10px;
}
.form-flex{
  display: flex;
}
/*contact page css end*/
/*enquiry page css start*/
.enquiry-banner{
  background-image: url('../image/enquiry-banner-new.jpg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 300px;
}
.enquiry-section{
  background-image: url('../image/bg-full.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: bottom;
  
}
.enquiry-form{
  margin: 45px 0px;
  background-color: rgba(133, 196, 223, 0.15);
  padding: 40px;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
}
/*enquiry page css end*/
/*feature page css start*/
.features-part{
  margin: 45px 0px;
}
.feature-banner{
  background-image: url('../image/feature-banner.jpg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 300px;
}
.feature-part-card-bg-1{
  background-image: url('../image/2.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  height: 300px;
  transition: transform .10s;
  clip-path: polygon(0 0, 85% 0, 100% 100%, 0% 100%);
  border-radius: 1px;
}
.feature-part-card-bg-1:hover{
  transform: scale(0.98); 
}

.feature-part-card-bg-2{
  background-image: url('../image/global-1.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  height: 300px;
  transition: transform .10s;
  clip-path: polygon(15% 0, 100% 0, 100% 100%, 0% 100%);
  border-radius: 1px;
}
.feature-part-card-view{
  display: block;
}
.feature-part-card-view-1{
  display: none;
}
.feature-part-card-bg-2:hover{
  transform: scale(0.98); 
}
.feature-part-card-bg-3{
  background-image: url('../image/hyegien-2.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  height: 300px;
  transition: transform .10s;
  clip-path: polygon(0 0, 85% 0, 100% 100%, 0% 100%);
  border-radius: 1px;
}
.feature-part-card-bg-3:hover{
  transform: scale(0.98); 
}
.feature-part-card-bg-4{
  background-image: url('../image/innovation-1.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  height: 300px;
  transition: transform .10s;
  clip-path: polygon(15% 0, 100% 0, 100% 100%, 0% 100%);
  border-radius: 1px;
}
.feature-part-card-bg-4:hover{
  transform: scale(0.97); 
}
.feature-part-card{
  border: none;
  box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
  border-radius: 1px;
}
.feature-part-card-view{
  border: none;
  box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
  border-radius: 1px;
}
/*feature page css end*/
/*product detail page css start*/
#product-detail-section{
  margin: 45px 0px;
}
.product-banner{
  background-image: url('../image/product-banner.jpg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 300px;
}
#product-detail-section{
  margin: 45px 0px;
}
#product-detail-section .carousel-indicators button.thumbnail {
  width: 100px;
}
#product-detail-section .carousel-indicators button.thumbnail:not(.active) {
  opacity: 0.7;
}
#product-detail-section .carousel-indicators {
  position: static;
}

/*product detail page css end*/ 

/*thankyou page css start*/
.thank-you-msg{
  padding: 60px 0px;
}

.thank-you-img img{
  height: 80px;
  width: 80px;
}
.thank-you-header h1{
  text-align: center;
  font-weight: 700;
  padding-top: 20px;
}
.thank-you-header h5{
  padding: 10px 0px;
}
/*thankyou page css end*/


 /*media query*/
 @media only screen and (max-width: 600px){

  .feature-card {
    height: 500px;
    margin: 45px 0px;
}
    .heading{
        margin: 20px 0px;
    }
    .social-icons{
      margin-top: 20px;
  }
  .footer{
    
    padding: 40px 0px;
 }
 .heading-footer{
  margin: 20px 0px;
}
 .list-about-1 ul{
  margin-top: -15px;
 }
 .contact-form-sec{
  width: 100%!important;
}
.frm-cntct{
  padding: 10px;
}
.form-flex{
  display: block;
}
.contact-info-sec{
  width: 100%!important;
  margin-left: 0px;
} 
.contact-banner{
  height: 80px;
}
.about-banner{
  height: 80px;
}
.enquiry-banner{
  height: 150px;
}
.product-banner{
  height: 80px;
}
.feature-banner{
  height: 80px;
}
.feature-part-card-bg-1{
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
}
.feature-part-card-bg-2{
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
}
.feature-part-card-bg-3{
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
}
.feature-part-card-bg-4{
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
}
.feature-part-card-view{
  display:none;
}
.feature-part-card-view-1{
  display: block;
}
.callno{
  display: none;
}
 }

 @media screen and (min-width: 760px) and (max-width: 800px) {
  .callno{
    display: none!important;
  }

  
  .contact-banner{
    height: 174px;
  }
  .about-banner{
    height: 174px;
  }
  .enquiry-banner{
    height: 174px;
  }
  .product-banner{
    height: 174px;
  }
  .feature-banner{
    height: 174px;
  }
 }

 @media screen and (min-width: 992px) {
  #product-detail-section .carousel {
    max-width: 70%;
    margin: 0 auto;
  }
}