@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&display=swap');
 *, 
*::after, 
*::before, 
body{
     margin:0;
     padding:0;
     box-sizing:border-box;
}
 body{
     background-color: white;
}
 html{
     font-size:62.5% 
}
container{
    padding: 0 10rem;
 
}
/* .scrolled-down{
    transform:translateY(-100%); transition: all 0.3s ease-in-out;
  }
  .scrolled-up{
    transform:translateY(0); transition: all 0.3s ease-in-out;
  } */
 @media only screen and (min-width:475px)  { 
    container {
        padding: 0rem 10rem;
    }
 }

 @media only screen and (max-width: 75em){
     html{
         font-size:56.25% 
    }
}
 @media only screen and (max-width: 56.25em){
     html{
         font-size:50% 
    }
}
 @media only screen and (min-width: 112.5em){
     html{
         font-size:62.5% 
    }
}
 body,p,a,ul,li{
     font-family:"Roboto";
     padding:0;
     margin:0 auto;
     font-weight:300;
     font-size:1.5rem;
     text-decoration: none;
}
 h1,h2,h3,h4,h5,h6{
     font-family:"Roboto";
     padding:0;
     margin:0 auto;
     font-weight:500;
}
 h1{
     font-size:4.6rem;
 }
 h2{
     font-size:3.6rem;
}
 h3{
     font-size:2.8rem;
}
 h4{
     font-size:2.4rem;
}
 h5{
     font-size:1.8rem; 
}
 h6{
     font-size:1.6rem; 
}
 h1 , h2 {
     font-weight: 700;
}
 li{
     font-size: 1.6rem;
     font-weight: 500;
}
 .py-large {
     padding: 7.5rem 0;
}
.py-8 {
    padding-top: 7rem !important;
    padding-bottom: 2rem !important;
}
 .header {
     background-color: #1c2d56;
}

.first-section img{
    width: 100%;
    height: auto;
    
}
 .header .navbar{
     background-color: #1c2d56;
}
.navbar .form-control {
    width: 100%;
    border-radius: 0.5rem;
    border: 1px solid #000073 ;
    background-color: transparent;
}
.modal .demo-form label{
    margin-left: -120px;
    color: #00024e;
}
.modal{
    --bs-modal-width: 75%;
}
.modal-content{
    border-radius: 0;
    height: 50rem;
    position: relative; 
    color: none;
    border: none;
}
.modal-title{
    font-size: 2.8rem;
    margin-left: -63px;
    color: #00024e;
}
.navbar .demo-form  input::placeholder {
    font-size: 12px;
    color: rgba(153, 153, 153, 0.627);
}
/* .navbar .demo-form input[type="text"]:focus,
.navbar .demo-form input[type="email"]:focus,
.navbar .demo-form input[type="tel"]:focus  {
    box-shadow: 0 0 5px #555;
    color: rgba(255, 255, 255, 0.567);
} */
.navbar .demo-form input[type="text"],
.navbar .demo-form input[type="email"],
.navbar .demo-form input[type="tel"] {
    /* background-color: #ffffff; */
    padding: 12px;
    font-size: 14px;
    font-family: 'Open Sans', sans-serif;
}
.navbar .modal-body{
    padding: 0;
}
.navbar .close{
    border: none;
    font-size: 2.6rem;
    background-color: rgba(255, 255, 255, 0);
    color: #000000;
    position: absolute;
    right: 0.8rem;
    top: 0;
}
.navbar .demo-form{
    display: flex;
    align-items: center;
    padding: 0rem 4em;
    height: 50rem;
}
.navbar .demo-image{
    background-image: url(/assets/images/service-page/service-part-1.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.navbar .btn{
    background-color: #f8645c;
    color: #fff;
    padding: 12px 40px;
    font-size: 1.6rem;
    border-radius: 10px;
    cursor: pointer;
    border: 2px solid #f8645c;
    margin-left: -50px;
}

.navbar-nav{
     display: flex;
     font-size: 1.6rem;
     font-weight:500;
     position: relative;
     padding-top: 2rem;
     text-indent: 6rem;
     align-items: baseline;
}
 .navbar-nav .nav-item a {
     color: #fff;
     font-size: 1.6rem;
}
 .navbar-brand img{
     width: 8rem;

}

 .navbar-expand-lg .navbar-nav .nav-link.active{
     color: #fff;
}
.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler-icon:focus {
    outline: none;
    box-shadow: none;
}
 .btn-nav{
     background-color: #f8645c;
     color: #fff;
     padding:12px 40px;
     font-size:1.6rem;
     line-height:1.3333333;
     border-radius:10px;
     text-align:center;
     cursor:pointer;
     border:2px solid #f8645c;
     font-weight:500;
     display:inline-block;
     margin: 4px 2px;
}

.btn-nav:hover{
        background-color: white;
        color: #1c2d56;
        border: 2px solid #fff;   
}

 @media screen and (max-width: 768px) {
     .navbar-collapse {
         
         background:#1c2d56;
         padding-top: 1rem;
         padding-bottom: 3rem;
         
         
    }
     .navbar-expand-lg .navbar-nav .nav-link.active{
         color: #fff;
         padding-top: 1rem;
         text-align: center;
    }
     .navbar-nav{
         display: flex;
         font-size: 1.6rem;
         font-weight:500;
         position: relative;
         padding-top: 2rem;
         text-indent: 0rem;
         align-items: center;
         padding-bottom: 2rem;
    }
}
/* ------nav bar toggler------ */
 .navbar-toggler {
     background-color: transparent;
     border: none;
     padding: 10px 6px;
     z-index: 1;
     outline: none;
}
 .navbar-toggler:hover {
     background-color: transparent;
     border: none;
     padding: 10px 6px;
     z-index: 1;
     outline: none;
}
 .navbar-toggler span{
     display: block;
     width: 35px;
     height: 2px;
     border: 1px;
     background-color: #fff;
     margin-bottom: 7px;
}
 .navbar-toggler span + span {
     margin-top: 4px;
     width: 35px;
     margin-right: 1px;
}
 .navbar-toggler span + span + span {
     width: 35px;
     margin-right: 1px;
}
/* end nav bar toggler */
/* section part-2 */
 .section-first{
     position: relative;
     background-color: #1c2d56;
}
 .first-content h1 {
     color: white;
     font-size: 4.6rem;
     font-weight: 500;
}
 .first-content p{
     font-size: 1.6rem;
     text-align: center;
}
 .get-app {
     padding-top: 5rem;
     padding-bottom: 3rem;
}
.owl-carousel .owl-stage {
    display: flex;
    align-items: center;
  }
  
 .section-first-carousel .owl-carousel {
     width: 100%;
}
 .section-first-carousel .first-slide {
     width: 100%;
     height: 75vh;
     position: relative;
     background-size: cover;
     background-repeat: no-repeat;
     background-position: center center;
}
 .section-first-carousel .first-slide::before {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     width: 50%;
}

.section-first-carousel  .first-slide-content {
     text-align: center;
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
     color: #fff;
     padding: 0 1%;
     font-size:1.5rem;
     text-align: center;
}
 .section-first-carousel .first-slide-content .get-app img{
     width: 100%;
}
 .image-content .first-image img{
     width: 65%;
     display: block;
     margin-left: auto;
     margin-right: auto;
}
 @media (min-width: 576px) {
     .image-content .first-image img{
         width: 90%;
    }
}
 @media only screen and (min-width: 992px){
     .first-content h1 {
         text-align: left;
         font-size: 6.6rem;
    }
     .first-content p {
         text-align: left;
         padding-top: 25px;
    }
}
/* Our product part */
 .product {
     background-color: #e8f6f9;
     padding: 0 1%;
}
 @media (min-width: 1200px) {
     .product-wrap{
         width: 12% !important;
    }
}
 .product-img-con{
     padding: 2.5rem;
     background-color:#fff;
     box-shadow: rgba(0, 0, 0, 0.09) 0px 3px 12px;
}
.product-img-con img{
     width: 70%;
     height: 4rem;
}
@media (min-width: 576px) {
   .product-img-con img{
       width: 70%;
       height: 8rem;
  }
}
 .product-img-content h3 {
     font-weight: 700;
     color: #1c2d56;
     padding-top: 20px;
     font-size: 1.5rem;
}
/* Index Service part */
 .section-three {
     background-color: #fff;
     padding: 0 1%;
}
 .section-four{
     background-color: #1c2d56;
     padding: 0 1%;
}
 .section-four .service-content h1 {
     color: #fff;
     font-weight: bold;
     padding-bottom: 10px;
     
}
 .section-four .service-content p{
     color: #fff;
     font-family: Roboto;
     padding-bottom: 4rem;
     opacity: 0.7;
}
 .service-content h1{
     color: #1c2d56;
     font-weight: bold;
     padding-bottom: 10px;
}
 .service-content h2 {
     font-size: 2rem;
     color: #f8645c;
     font-weight: 700;
     padding-bottom: 1.7rem;
}
 .service-content p{
     color: black;
     padding-bottom: 4rem;
}
 .service-section img {
     width: 75%;
     padding-top: 10px;
}
 .order-first .service-section {
     text-align: end;
}
 .service-section {
     padding-top: 10px;
     text-align: center;
}
/* section three-four button */
 .btn-service {
     background-color: white;
     color: #1c2d56;
     font-weight: 600;
     font-size: 1.6rem;
     border: 2px solid #1c2d56;
     border-radius: 0.7rem;
     padding: 12px 40px;
     margin: 4px 2px;
     transition: 0.6s;
     text-align: center;
     cursor:pointer 
}
 .btn-service:hover {
     background-color: #FF4C56;
     color: white;
     border: 2px solid #FF4C56;
    
}
 /* .service-btn{
    background-color: #fff;
    
     color: #1c2d56;
     font-weight: 600;
     font-size: 1.6rem;
     border: 2px solid black;
     border-radius:0.7rem;
     padding: 12px 40px;
     margin: 4px 2px; 
     transition: 0.6s;
     text-align: center;
     cursor:pointer;
}
 .service-btn:hover {
  
     background-color: #FF4C56;
     color: #fff;
     border:2px solid #FF4C56;
   
} */

 .service-content {
     text-align: center;
}
 .service-content p {
     text-align: center;
}
 @media screen and (min-width:768px) {
     .service-content {
         text-align:left;
    }
     .service-content p {
         text-align:left;
    }
}
/* our-brands */
 .brands-section {
     padding: 0 1%;
}
 .our-brands {
     background-repeat: no-repeat;
     background-image: url(/assets/images/home-page/brands/bg-img.png);
     background-size: contain;
     background-position: center;
     position: relative;
}
.brand-carousel nav {
    display: none;
}
 .brand-carousel .item img {
    box-shadow: rgb(17 17 26 / 5%) 0px 0px 10px 2px, rgb(17 17 26 / 2%) 0px 0px 32px 3px;
     background-color: white;
     width: 90%;
}
 .brand-carousel-2 .item img {
     box-shadow: rgb(17 17 26 / 5%) 0px 0px 10px 2px, rgb(17 17 26 / 2%) 0px 0px 32px 3px;
     background-color: white;
     width: 80%;
     display: none;
}


 @media (min-width: 576px) {
     .brand-carousel-2 .item img{
         display: block;
    }
   
}

.owl-carousel .owl-stage-outer {
    position: relative;
    overflow: inherit;
    /* -webkit-transform: translate3d(0,0,0); */

}
 .our-brands h1{
     color: #1c2d56;
     font-size: 4.5rem;
     text-align: center;
     font-weight: bold;
     padding-top: 2rem;
     padding-bottom: 6rem;
}
/* Testimonials */
 .white-heading h1{
     color: #ffffff;
     font-size: 4.5rem;
     text-align: center;
}
/* Testimonial CSS Code Start */
/* background */
 .carousel-bg{
     position: relative;
     background-color: #1c2d56;
     /* height: 50vh; */

     /* height: 40vh; */
}
 .carousel-bg:after{
     content: "";
     display: inline-block;
     width: 100%;
     height: 100%;
     position:absolute;
     top:0;
     left:0;
     background-image: url('/assets/images/home-page/testimonial/q-img.png');
     background-repeat: no-repeat;
     background-position: center;
     opacity: 0.06;
}

@media (min-width: 992px) {

    .carousel-bg:after{
        content: "";
        display: inline-block;
        width: 100%;
        height: 100%;
        position:absolute;
        top:0;
        left:0;
        background-image: url('/assets/images/home-page/testimonial/q-img.png');
        background-repeat: no-repeat;
        /* background-position-x: 25%;
        background-position-y: 25% ; */
        background-position: 25% 25%;
   
        /* background-position: center; */
        opacity: 0.06;
   }
   

 }


 .testimonial-icon img{
     position: relative;
     opacity: 0.06;
     width: 16%;
}
 .owl-carousel {
     width: 100%;
}
 .slide {
     width: 100%;
     height: 20vh;
     position: relative;
     background-size: cover;
     background-repeat: no-repeat;
     background-position: center center;
}
 .slide::before {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     width: 50%;
}
 .slide-content {
     text-align: center;
     position: absolute;
     /* top: 25%; */
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     color: #fff;
     font-size:1.6rem;
     line-height:20px;
}


.testimonial-carousel .owl-dots {
    text-align: center;
    padding-top: 15px;
  }
 .testimonial-carousel .owl-dots button.owl-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
    background: #989898;
    
   
    margin: 0 3px;
  }
 .testimonial-carousel .owl-dots button.owl-dot.active {
    background-color: #fff;
  
  }
 .testimonial-carousel .owl-dots button.owl-dot:focus {
    outline: none;
  }

 .owl-dots span {
     width: 100px !important;
     height: 100px !important;
}
 .owl-dots button {
     border: none !important;
     outline: none !important;
}
 


 @media (min-width: 768px) {
     .testimonial-carousel .owl-prev,    
     .testimonial-carousel .owl-next{
         position: absolute;
         top: 15%;        
    }
   
    .owl-carousel .nav-btn{
        height:65px;
        position: absolute;
        width: 100px;
        cursor: pointer;
        
      }
    
      .owl-carousel .prev-slide{
       background: url(/assets/images/home-page/testimonial/arrow1.svg) no-repeat scroll 0 0;
       left: -10rem;
       bottom: -8.5rem;
      }
      .owl-carousel .next-slide{
        background: url(/assets/images/home-page/testimonial/arrow2.svg) no-repeat scroll 0 0;
        right: -10rem;
        bottom: -8.5rem;
      }    
}

 .testimonial-carousel .owl-prev {
     left: 15%;
}
 .testimonial-carousel .owl-next {
     right: 15%;
}

 

 @media screen and (min-width:992px) {
     /* .carousel-bg:before{
         background-position: 20rem 8rem;
    } */

    .testimonial-carousel .owl-prev {
        left: 25%;
   }
    .testimonial-carousel .owl-next {
        right: 25%;
   }
   
}

 .slide-content .testinomial-footer ,h5{
     font-size: 1.6rem;
     padding-top: 3rem;
}
 .slide-content .testinomial-footer ,h6{
     opacity: 0.5;
     font-size: 1.2rem;
}
 .slide-content p{
     text-align: center;
}
/* newsletter */
 .signup{
     display: none;
     position: relative;
}
 @media only screen and (min-width: 992px) {
     .signup{
         display: block;
    }
     .signup-content{
         background-color: #F1655D;
         border-radius: 1.5rem;
         margin-bottom: -13rem;
         padding: 40px;
    }
}
 .subscribe-form .form-control {
     height: 45px;
     border-color: #ffffff;
     border-radius: 0.6rem;
}
 .subscribe-form .form-control:focus {
     box-shadow: none;
     border-radius: 0.6rem;
}
 .newsletter-btn button {
     border-radius:0.6rem;
     background:#fff;
     color: #F1655D;
     font-weight:700;
     border: none;
     padding: 12px 40px;
}
 .signup .content h1{
     color: white;
     font-size: 4.5rem;
     font-weight: bold;
     font-family: Roboto;
}
/* Footer */
 .footer{
     background-color: #e8f6f9;
     padding: 0 3%;
}
 .footer-logo-panel img {
     padding-top: 25px;
     width: 8rem;
}
 .content-footer{
     padding-top: 20px;
}

 .get-app-footer img{
     width: 30%;
     padding-bottom: 8px;
}



 @media only screen and (min-width: 992px) {
    .get-app-footer img{
        width: 80%;
        padding-bottom: 8px;
   }
}
 .copywrite .copywrite-con p,a {
     font-size: 1.2rem;
     text-align: center;
     padding-bottom: 10px;
}

/* social list bg */
 .footer-widget-2 .title-footer h5{
     font-size: 1.6rem;
     color: #1c2d56;
     font-weight: 650;
}
 .footer-widget-ul li ,a{
     list-style: none;
     position: relative;
     margin-bottom: 1.6rem;
     text-decoration: none;
}
 .footer-widget-ul li a{
     color: black;
     font-weight: 500;
}


 .copywrite-con p, .copywrite-con a{
     color:#a4b2c2;
}
 .social-list{
     text-align: left;
}
 .social-list-ul{
     flex-direction: row;
     justify-content: start;
     padding: 0;
     list-style: none;
     display: inline-flex;
     flex-wrap: wrap;
     gap: 15px;
}
 .social-list-ul li {
     margin: 0.5rem;
     text-decoration: none;
}
 .social-list-ul li a i{
     width: 2.5rem;
     height: 2.5rem;
     display: flex;
     justify-content: center;
     align-items: center;
     background-color:#1c2d56;
     font-size: 1.6rem;
     border-radius: 0.6rem;
     color: #fff;
}
 .fa-facebook-f ,.fa-linkedin ,.fa-instagram {
     color: white;
}
 @media only screen and (min-width: 992px) {
     .footer-widget-2 .title-footer h5{
         font-size: 0.8rem;
         color: #1c2d56;
         font-weight: 700;
         margin-top:0.5rem;
    }
     .footer-widget-2 .footer-widget-ul li{
         color:#000;
         font-weight: 400;
    }
     .footer-widget-2 .title-footer h5{
         font-size: 1.6rem;
         color: #1c2d56;
         font-weight: 700;
    }
     .footer-widget-ul li ,a{
         list-style: none;
         position: relative;
         margin-bottom: 1.6rem;
         text-decoration: none;
    }
}

 .footer-widget-ul .footer-img img{
width:20%;
}
.footer-widget-ul .footer-image img{
    width:60%;
    }
    

.footer-area .quick-link {
    display: none;
}
@media (min-width: 576px) { 

    .footer-area .quick-link {
        display: block;
    }
    .footer-widget-ul .footer-img img{
        width:100%;
        }
        .footer-widget-ul .footer-image img{
            width:100%;
            }
}

/* about-us page */

 .about-us-first{
     padding-top: 5rem;
}
 .about-content p{
     color: white;
     font: 1.6rem;
}
 .about-content h1{
     font-size: 4.5rem;
     color: #fff;
}

 .first-description p{
     color: black;
     font-family: roboto;
     font-size: 1.6rem;
     line-height: 1.6;
     text-align: justify;
}
 .first-img img{
     width: 90%; 
}
.sec-img img {
    width: 55%;
}
.content-part  {
    text-align: center;
    color: #1c2d56;
    padding: 2rem;
}

.content-part  p{
    font-size: 1.6rem;
}
.content-part h1{
    font-size: 5.6rem;
    padding-bottom: 3rem;
    padding-top: 5rem;
}
.heading-content {
    line-height: 1.7;
    /* text-align: justify; */
}

 @media only screen and (min-width: 768px) {
     .first-description p{
         padding-bottom: 1rem;
         text-align: left;
    }

    .content-part {
        text-align:left;   
    }
}   

/* service-page */
 .first-description  {

    padding: 0 5rem;
}
.service-page .first-description h1{
    text-align: center;
    color: #1c2d56;
    padding-bottom: 20px;
   
}
.first-description .about-us-heading h1{
    color: #1c2d56;
    font-size: 4.5rem;
    text-align: center;
    padding-top: 2rem;
    padding-bottom: 2rem;
}  
.contact-item h3 {
    text-align: center;
}
.contact-item p {
    text-align: center;
}
 @media only screen and (min-width: 576px) {
    .service-page .first-description h1{
        text-align: left;
   }   
}

/* contact-page */
.contact-img img {
    width: 20%;
   
}
.contact-img{
    text-align: center;
}
 
 @media only screen and (min-width: 576px) {
    .contact .form .form-txt h1{
        text-align: left;
   }
 
    .form .form-txt h3 {
        font-size:1.6rem;
        margin: 10px 0;
        color: black;
   }
   .about-us-heading {
       display: none;
  }
   .contact-item h3 {
       text-align: left;
  }
  .contact-item p {
      text-align: left;
 }
 
.contact-img img{
   width: 100%; 
}
.contact-img {
   text-align: left;

}   
.contact .form .contact-details {
    text-align: center;
} 
         
}

 .form-details h1{
     color: #1c2d56;
}
 .form-details h2{
  
     color: #1c2d56;
     padding-bottom: 1rem;
}
 .form {
     justify-content: space-between;
}
 .form .form-txt h1{
     text-align: center;
     font-size: 4.5rem;
     font-weight: 600;
     color: #1c2d56;
     margin-bottom: 10px;
}
 .form .form-txt h3 {
     font-size:1.6rem;
     color: black;
}
 .form .form-txt p {
     color: #1c2d56;
     font-size: 14px;
     font-weight: 700;
}
 .form-details .form-control {
     width: 100%;
     border-radius: 0.5rem;
     border: 1px solid #000073 ;
     background-color: transparent;
}
 .form .form-details input, .form {
     padding: 10px 20px;
     color: #000026;
     outline:none;
     margin:0 0 20px 0px;
     font-size: 14px;
}
 .form .form-details textarea {
     padding: 10px 20px;
     margin: 0 0 20px 0px;
     color: #1c2d56;
     outline: none;
     font-size: 14px;
     resize: none;
     width: 100%;
     max-width: 100%;
}
 .form .form-details button {
     padding: 8px 40px;
     color: #1c2d56;
     font-weight: 600;
     outline: none;
     font-size: 1.6rem;
     cursor: pointer;
     border:1.5px solid #1c2d56;

}
.form .form-details button:hover {
   
    color:white;
    border:1.5px solid #FF4C56;

}

.section-one-content{
    position: absolute;
    bottom: 1.5rem;
    color: white;
    text-align: justify;
    
}

.first-section{
    position: relative;
    color: white;
}


@media (min-width: 768px) { 


    .section-one-content{
        position: absolute;
        bottom: 10rem;
        color: white;
        text-align: justify;
        
    }
    
    .first-section{
        position: relative;
        color: white;
    }
    
 }


/*Starting Style for Whatsapp*/
.float{
                          position:fixed;
                          width:60px;
                          height:60px;
                          bottom:40px;
                          right:40px;
                          background-color:#25d366;
                          color:#FFF;
                          border-radius:50px;
                          text-align:center;
                          font-size:30px;
                          box-shadow: 2px 2px 3px #999;
                          z-index:100;
                      }

.my-float{
    margin-top:16px;
}


/*Ending Style for Whatsapp*/