.topbar{

 height: 50px;

 /* border: 5px solid greenyellow; */

 display: flex!important;

 justify-content: space-evenly;

  align-items: center;

  padding: 10px!important;

}



.topbar-logo-container{

    display: flex;

    justify-content: space-around;

    /* position: relative; */

    z-index: 999;

    padding: 15px;

   }



.topbar-logos{

    width: 50px;

    height: 50px;
    background-color: #602121;
    border-radius: 50%;

    /* padding: 10px; */

    /* border: 1px solid white; */



    /* position: relative; */

}

.topbar-logos img{

    /* z-index: 999; */

    width: 100%;

    height: 100%;

    z-index: 9999;

    /* margin: a; */

 object-fit: contain;

 /* position: absolute; */

 /* top: 15px; */

}



@media (max-width: 768px) {



    .topbar{

       display: none!important;

       }

 

    

}







.welcome-container
{
    border: 2px solid #028ace!important;
}





#spinner {

    opacity: 0;

    visibility: hidden;

    transition: opacity .5s ease-out, visibility 0s linear .5s;

    z-index: 99999;

}



#spinner.show {

    transition: opacity .5s ease-out, visibility 0s linear 0s;

    visibility: visible;

    opacity: 1;

}

/*** Spinner End ***/



.back-to-top {

    position: fixed;

    right: 30px;

    bottom: 30px;

    transition: 0.5s;

    

    z-index: 99;

}



.text-muted{

    color: white!important;

}

.text-muted:hover{

    color:#028ace!important;

    transition:all 0.3s ease-in-out;

}

.hyper-link{

    color: #6e7684!important;;

}



/*** Button Start ***/

.btn {

    font-weight: 600;

    transition: .5s;

}



.btn-square {

    width: 32px;

    height: 32px;

}



.btn-sm-square {

    width: 34px;

    height: 34px;

}



.btn-md-square {

    width: 44px;

    height: 44px;

}



.btn-lg-square {

    width: 56px;

    height: 56px;

}



.btn-xl-square {

    width: 66px;

    height: 66px;

}



.btn-square,

.btn-sm-square,

.btn-md-square,

.btn-lg-square,

.btn-xl-square {

    padding: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    font-weight: normal;

}



.btn.btn-primary {

    color: var(--bs-white);

}



.btn.btn-primary:hover {

    background: var(--bs-secondary);

    border: 1px solid var(--bs-secondary);

}



.btn.btn-secondary {

    color: var(--bs-white);

}



.btn.btn-secondary:hover {

    background: #028ace;

    border: 1px solid #028ace;

}



.btn.btn-light {

    color: #028ace;

}



.btn.btn-light:hover {

    color: var(--bs-white);

    background: #028ace;

    border: 1px solid #028ace;

}



/*** Icon Animation Start ***/

@keyframes icon-animat {

    0%  {border-radius: 67% 33% 29% 71% / 39% 46% 54% 61%;}



    25% {border-radius: 69% 31% 19% 81% / 43% 37% 63% 57%;}



    50% {border-radius: 67% 33% 16% 84% / 57% 37% 63% 43%;}



    75% {border-radius: 77% 23% 61% 39% / 36% 61% 39% 64%;}



    100% {border-radius: 67% 33% 29% 71% / 39% 46% 54% 61%;}

}

/*** Icon Animation End ***/




.mb2
{
    margin-right: 90%;
}
.serve
{
    
    background-color:#f2f2f2;
   
}
.servep
{
    padding: 50px;
}
.servep b
{
    color: black;
}
.serve h1
{
    text-align: center;
    margin-top: 20px;
}

.fpading
{
    padding: 50px 0px;
}
.ftop
{
    margin-top: 50px;
    border: solid 1px lightgray;
    box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;
    height: 380px;
}
.fpading
{
    text-align: center;
    padding-bottom: 20px;
}
.facility
{
  background-color: #f2f2f2;
  margin-top: 100px;
}
.nabldiv
{
    height: 248px;
    width: 100%;
    margin-left: 50px;
    justify-self: center;
}
.ncon
{
    box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
    padding: 70px 15px;
}

.nabldiv img
{
    
    height: 100%;
    width: 100%;
    object-fit: contain;
}

.nabl3
{
    margin-top: 50px;
    color: black;
    text-align: justify;
}

.nablheading
{
    text-align: center;
}
.facility img
{
    height: 300px;
    width: 100%;
}
.cop
{
   padding: 50px; 
   box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
   height: 620px;
   margin-top: 50px;
   margin-bottom: 50px;

}
.read
{
    width: 250px;
    height: 50px;
    border-radius: 10px;
    background-color: #028ace;
    color: white;
    border: none;
   display: flex;
   justify-content: center;
   align-items: center;
   /* margin-left: 40%;
   margin-top: 40px; */
   

    
}
.certificate-read{
    padding-top: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.clientp
{
    padding: ;
}
.cop h1
{
    text-align: center;
}
.certp
{
  height: 400px;
  padding: 10px;
width: 400px;
/* margin-left: 35%; */
justify-self: center;
    box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
    
}

.certp2
{
  height: 400px;
  padding: 10px;
width: 400px;

    box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
    
}
.certp img
{
    width: 100%;
    height: 100%;
}
.certp2 img
{
    width: 100%;
    height: 100%;
}


.serve img
{
    width: 100%;
    height: 100%;
}
.serve p
{
  margin-top: 30px;
  margin-left: 40px;
  
}
.sac
{
    text-align: center;
}
.nabl
{
    margin-top: 100px;
}
.enquiry-top{

 background-color: #028ace!important  ;

}

.enquiry-top:hover{

 background-color: var(--bs-white)!important  ;

 color: #028ace;

}



/*** Navbar Start ***/

.nav-bar {

    background: var(--bs-white);

    /* background-color: yellow; */



}



.sticky-top {

    transition: 1s;

}



.navbar-light .navbar-nav .nav-link {

    position: relative;

    margin-right: 9px;

    padding: 0 7px;

    letter-spacing: 1px;

    color: var(--bs-dark);

    font-size: 17px;

    font-weight: 500;

    outline: none;

    width: max-content;

    /* border:1px solid #028ace; */

    transition: .5s;

}



.sticky-top .navbar-light .navbar-nav .nav-link {

    /* padding: 20px 0; */

    color: var(--bs-dark);

}



.navbar-light .navbar-nav .nav-link:hover,

.navbar-light .navbar-nav .nav-link.active {

    color: #028ace;

}



.navbar-light .navbar-brand img {

    max-height: 60px;
   margin-left: 200px;
    transition: .5s;

}


.about1
{
    color: #028ace;
}
.wac
{
    text-align: center;
}
.sticky-top .navbar-light .navbar-brand img {

    max-height: 100px;

}



.navbar .dropdown-toggle::after {

    border: none;

    content: "\f107";

    font-family: "Font Awesome 5 Free";

    font-weight: 600;

    vertical-align: middle;

    margin-left: 8px;

}



.dropdown .dropdown-menu a:hover {

    background: #028ace;

    color: var(--bs-white);

}



.navbar .nav-item:hover .dropdown-menu {

    transform: rotateX(0deg);

    visibility: visible;

    margin-top: 8px !important;

    background: var(--bs-light);

    transition: .5s;

    opacity: 1;

}



  

.navbar .navbar-brand-superinsul{

    display: flex!important;

    /* border: 2px solid #028ace; */

  }









  .navbar .navbar-brand-superinsul .superinsul-logo{

   /* display: block!important; */

    width: 170px;

   height: 50px;

   /* border: 1px solid black; */

  }





@media (min-width: 992px) {

    .navbar .nav-item .dropdown-menu {

    display: block;

    visibility: hidden;

    top: 100%;

    transform: rotateX(-75deg);

    transform-origin: 0% 0%;

    border: 0;

    border-radius: 10px;

    margin-top: 8px !important;

    transition: .5s;

    opacity: 0;

    }

    .navbar .navbar-brand-superinsul{

        /* display: none!important; */

      }



}



@media (max-width: 991px) {

    .navbar.navbar-expand-lg .navbar-toggler {

        padding: 8px 19px;

        border: 1px solid #028ace;

        color: #028ace;
            margin-top: -100px;
    }



    .sticky-top .navbar-light .navbar-nav .nav-link {

        padding: 12px 18px;

    }



    .navbar-light .navbar-nav .nav-link {

        

        margin-right: 20px;

        

      

    }

    .navbar .navbar-brand-superinsul .superinsul-logo{

      display: none;

    }



    .navbar .navbar-brand-superinsul{

        display: none!important;

      }

}

    





@media (max-width: 768px) {

    .navbar{

        padding: 7px!important;

    }

    .navbar .navbar-brand-superinsul .superinsul-logo{

        display: none!important;

        /* width: 0; */

      }

      .navbar .navbar-brand-superinsul{

        display: none!important;

      }

      .facility img {
    height: 200px !important;
    width: 100%;
}

.ftop {
    margin-top: 50px;
    border: solid 1px lightgray;
    box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;
    height: 283px !important;
}



      .navbar-nav {

        display: flex;

        flex-direction: column;

        padding-left: 0;

        margin-bottom: 0;

        list-style: none;

        margin-top: 10px;

        /* background-color: bisque; */

    }

}



    .carousel .carousel-item,

.carousel .carousel-item img {

    height:auto;

}   

/*** Navbar End ***/



/*** Carousel Header Start ***/

.carousel .carousel-item img {

    /* width: 100%; */

    object-fit: cover!important;

    border-radius: 0%;

    /* width: 90%; */

    

    /* filter: brightness(1.2); */

}



.carousel .carousel-item,

.carousel .carousel-item img {

    height: 625px!important;

    width: 100%;

}   



.carousel-item .carousel-caption {

    position: absolute;

    width: 100%;

    height: 100%;

    left: 0;

    bottom: 0;

    background: rgba(0, 0, 0, .6);

    display: flex;

    align-items: center;

}



.carousel .carousel-indicators {

    left: 75%;

    top: 40%;

    margin-right: 25%;

    z-index: 99;

    transform: translateY(-50%);

    flex-direction: column;

}



.carousel-indicators [data-bs-target] {

    display: flex;

    width: 15px;

    height: 15px;

    border: 6px solid var(--bs-white);

    border-radius: 15px;

    padding: 0;

    margin-top:10px;

    margin-bottom:10px;

    background-color: var(--bs-secondary);

    opacity: 1;

    transition: 0.5s;

}



.carousel-indicators [data-bs-target].active {

    background-color: #028ace;

}





/* General select box styling */

.header-carousel .input-group .custom-select {

    /* font-family: Arial, sans-serif; */

    font-size: 16px;

    /* color: #333; */

    padding: 10px;

    background-color: #f8f9fa;

    border: 1px solid #ccc;

    border-radius: 5px;

    /* appearance: none; Removes default dropdown styling */

    /* -moz-appearance: none; Removes Firefox-specific dropdown styling */

    /* -webkit-appearance: none; Removes Chrome/Safari-specific dropdown styling */

    transition: border-color 0.3s ease;

}

/* Hover effect for the select box */

.custom-select:hover {

    /* border-color: #007bff; */

}



/* Styling the dropdown options */

.header-carousel .input-group .custom-select .option {

    font-size: 17px;

    padding: 15px;

    background-color: #fff;

    /* color: #333; */

}



/* Style for hover effect inside the dropdown - works in some browsers */

.header-carousel .input-group .custom-select .option:hover {

    /* color:orange#028ace; */

    /* color: white; */

}



/* Specific focus styling for select box */

.header-carousel .input-group .custom-select:focus {

    outline: none;

    /* border-color: #007bff; */

}



/* Style the down arrow on the right of the select */

.custom-select::-ms-expand {

    display: none;

}



/* Adding custom arrow to the select */

/* .custom-select {

    background-image: url('data:image/svg+xml;charset=US-ASCII,<svg%20xmlns="http://www.w3.org/2000/svg"%20viewBox="0%200%204%205"><path%20fill="%23333"%20d="M2%200L0%202h4L2%200z"/></svg>');

    background-repeat: no-repeat;

    background-position: right 10px center;

    background-size: 10px;

} */



/* Ensure select dropdown looks good on mobile */

@media (max-width: 768px) {

    .header-carousel .input-group .custom-select {

      

        /* font-size: 10px; */

 

    }



    .carousel .carousel-item,

.carousel .carousel-item img {

    height: auto!important;

}   



    

}



@media (max-width: 992px) {

    .carousel-indicators [data-bs-target] {

        display: none;

    }

}

/*** Carousel Header End ***/



/*** Single Page Hero Header Start ***/

.bg-breadcrumb {

    position: relative;

    overflow: hidden;

    background-color: #1f2e4e;

    background-position: center ;

    background-repeat: no-repeat;

    background-size: cover;

    padding: 80px 0 40px 0;

    transition: 0.5s;
    height: 182px;

}



.bg-breadcrumb .breadcrumb {

    position: relative;

}



.bg-breadcrumb .breadcrumb .breadcrumb-item  {

    font-size: 18px!important;

    

}

/* .bg-breadcrumb .breadcrumb .breadcrumb-item a {

    color: var(--bs-white);

   

} */



.bg-breadcrumb .breadcrumb .breadcrumb-item a {

    color: var(--bs-light);

    text-decoration: none;

}



.bg-breadcrumb .breadcrumb .breadcrumb-item.active {

    color: var(--bs-white); /* Full white for Approvals */

    font-weight: bold; 

}





.bg-breadcrumb h4{

    /* margin: auto; */

    /* font-size:xx-large; */

    /* font-size: 3rem; */

    /* width: fit-conte nt; */

    /* border: 1px solid white; */

    /* text-align: center; */

    /* white-space: nowrap!important; */

    /* word-break:normal; */

}

@media only screen and (max-width: 768px){

    .bg-breadcrumb h4{

    

        /* white-space:unset!important; */

    }

}

/*** Single Page Hero Header End ***/



/*** Features Start ***/

.feature {

    background: var(--bs-light);

}



.feature .feature-item {

    display: flex;

    border-radius: 10px;

}



.feature .feature-item .feature-icon span {

    width: 90px; 

    height: 90px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--bs-secondary);

    background: #028ace;

    border-radius: 67% 33% 29% 71% / 39% 46% 54% 61%;;

    animation-name: icon-animat;

    animation-duration: 5s;

    animation-delay: 1s;

    animation-direction: alternate;

    animation-iteration-count: infinite;

    transition: 0.5s;
    color: white;

}
.feature .feature-item .feature-icon span i {

    color: white;

}



.why-us-logo{

 width: 250px!important;

 margin-bottom: 104px;

 ;

}

@media only screen and (max-width: 768px){



    .feature .feature-item-mobile{

        /* display: flex; */



        flex-direction: row-reverse!important;

    }

}



/*** Features End ***/



/*** About Start ***/

.about .about-item .about-item-inner {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    text-align: center;

    border-radius: 10px;

    background: var(--bs-light);

    transition: 0.5s;

}



.about .about-item .about-item-inner .about-icon {

    width: 90px; 

    height: 90px; 

    border-radius: 67% 33% 29% 71% / 39% 46% 54% 61%;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--bs-secondary);

    background: #028ace;

    animation-name: icon-animat;

    animation-duration: 5s;

    animation-delay: 1s;

    animation-direction: alternate;

    animation-iteration-count: infinite;

    transition: 0.5s;

}



.about .about-img {

    position: relative;

    overflow: hidden;

    width: 100%;

    height: 100%;

    

}



.about .about-img .img-1 {

    height: 85%;

    margin-right: 50px;

}



.about .about-img .img-2 {

    position: absolute;

    width: 100%; 

    bottom: 0; 

    right: 0;

    padding-left: 50px;

    border-radius: 10px;

}

.video-container {



    position: absolute;

    width: 100%; 

    bottom: 0; 

    right: 0;

    padding-left: 50px;

    border-radius: 10px;

    width: 100%;

    

    overflow: hidden;

    

}



.video-container video {

    width: 100%;

    border-radius: 10px;

    height: auto;

    object-fit: cover;

}







.about .about-img::after {

    content: "";

    position: absolute;

    width: 10px;

    height: 98%;

    top: 0;

    right: 0;

    border-radius: 10px;

    background: #028ace;

    z-index: -1;

}



.about .about-item .text-item {

    position: relative;

    padding-left: 25px;

}



.about .about-item .text-item::after {

    content: "";

    position: absolute;

    width: 5px;

    height: 100%;

    top: 0;

    left: 0;

    border-radius: 10px;

    background: var(--bs-secondary);

}

@media (max-width: 768px) {

    

    .video-container video {

        height: auto;

    }

}

/*** About End ***/





/*** Fact Counter Start ***/

.counter {

    background: linear-gradient(rgba(0, 12, 33, 0.9), rgba(31, 46, 78, 0.9)), url(../img/NewImages/banner6.jpg);

    background-position: center center;

    background-repeat: no-repeat;

    background-size: cover;

}

.counter .counter-item h4{

    font-size: 23px;

}



.counter .counter-item .counter-item-icon {

    width: 90px; 

    height: 90px; 

    border-radius: 67% 33% 29% 71% / 39% 46% 54% 61%;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--bs-secondary);

    background: #028ace;

    animation-name: icon-animat;

    animation-duration: 5s;

    animation-delay: 1s;

    animation-direction: alternate;

    animation-iteration-count: infinite;

    transition: 0.5s;

}



/*** Fact Counter End ***/



/*** Services Start ***/

.service .service-item {

    position: relative;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    text-align: center;

    box-shadow: 0 0 45px rgba(0, 0, 0, .1);

    border-radius: 10px;

    background: var(--bs-white);

    transition: 0.5s;

}



.service .service-item:hover {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    text-align: center;

    border-radius: 60px;

    background: var(--bs-light);

}



.service .service-item::after {

    content: "";

    position: absolute;

    width: 100%;

    height: 100%;

    bottom: 0;

    left: 0;

    background: #028ace;

    border-radius: 10px;

    z-index: -1;

    transition: 0.5s;

    opacity: 0;

}



.service .service-item:hover::after {

    opacity: 1;

}



.service .service-item .service-icon {

    width: 90px; 

    height: 90px; 

    border-radius: 67% 33% 29% 71% / 39% 46% 54% 61%;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--bs-secondary);

    background: #028ace;

    animation-name: icon-animat;

    animation-duration: 5s;

    animation-delay: 1s;

    animation-direction: alternate;

    animation-iteration-count: infinite;

    transition: 0.5s;

}

/*** Service End ***/



/*** Cars Categories Start ***/

/* .categories.product-parent:nth-child(even):hover{

    box-shadow: 0 0 50px rgba(243, 226, 69, 0.658);

} */

.categories .categories-item {

    position: relative;

    border: 1px solid var(--bs-secondary);

    border-radius: 10px;

    transition: 0.2s;

}



.categories .categories-item:hover {

    border: 1px solid #028ace;

}



.categories .categories-item .categories-item-inner {

    position: relative;

    overflow: hidden;

    border-radius: 10px;

    transition: 0.2s;

}



.categories .categories-item .categories-item-inner:hover {

    box-shadow: 0 0 50px rgba(234, 0, 30, .3);

}



.categories .categories-item-inner .categories-img {

    background: var(--bs-light);

    height: 200px;

    padding: 20px;

}

.categories .categories-item-inner .categories-img .img {

    height: 100%;

    object-fit: cover;

    filter: brightness(1.2);

    

}



.categories .categories-item-inner .categories-content {

    justify-content: space-around;

    flex-direction: column;

    height: 21rem;

    display: flex;

    border-top: 4px solid var(--bs-white);

    text-align: center;

    background: var(--bs-light);



}

.categories .categories-item-inner h4 {

/* font-size: 1.2rem; */

max-width: 300px;

    word-wrap: break-word;

    font-size: 1.1rem!important;

    /* font-weight: 600; */

    /* text-align:justify; */

    /* border:1px solid black; */

    margin-bottom: 10px;

}





.categories .categories-item-inner .categories-review {

    display: flex;

    align-items: center;

    justify-content: center;

}



.categories-carousel .owl-stage-outer {

    margin-top: 65px;

    margin-right: -1px;

}



.categories-carousel .owl-nav .owl-prev,

.categories-carousel .owl-nav .owl-next {

    position: absolute;

    top: -65px;

    padding: 10px 35px;

    color: var(--bs-white);

    background: #028ace;

    border-radius: 50px;

    transition: 0.5s;

}



.categories-carousel .owl-nav .owl-prev {

    left: 0 !important;

}



.categories-carousel .owl-nav .owl-next {

    right: 0;

}



.categories-carousel .owl-nav .owl-prev:hover,

.categories-carousel .owl-nav .owl-next:hover {

    background: var(--bs-secondary);

    color: var(--bs-white);

}



@media only screen and (max-width: 768px) {

    .categories .categories-item-inner h4 {

        font-size: 0.8rem!important;

    /* font-size: 0.8rem; */

    font-weight: 500;

    margin-top: 10px;

        }

        .categories .categories-item-inner p {

        display: none;

        }

        .categories .categories-item-inner .categories-content {

            justify-content: center;

            align-items: center;

            /* flex-direction: column; */

            /* height: 6rem; */

            /* display: flex; */

            /* border-top: 4px solid var(--bs-white); */

            /* text-align: center; */

            /* background: var(--bs-light);

        }

        .categories .categories-item-inner .categories-img {

            /* background: var(--bs-light); */

            height: 90px;

            padding: 6px;

        }

        .categories .categories-item-inner .btn {

            display: none!important;

            }

            .categories .categories-item-inner .categories-img {

                /* background: var(--bs-light); */

                height: 100px;

                padding: 10px;

            }

        

        }



/*** Cars Categories End ***/





/*** Process Start ***/

.steps {

   background-color: rgb(113, 112, 112);

    background-position: center center;

    background-repeat: no-repeat;

    background-size: cover;

}





.steps .steps-item {

    position: relative;

    background:#028ace;

    border-radius: 10px;

}



.steps .steps-item h5,

.steps .steps-item p {

    color: var(--bs-white);

}



.steps .steps-item .setps-number {

    position: absolute;

    width: 64px;

    height: 64px;

    bottom: 0; 

    right: 40px;

    font-weight: 900;

    border: 1px solid var(--bs-secondary); 

    border-radius: 64px;

    transform: translateY(50%);

    color: var(--bs-secondary);

    background: var(--bs-white);

    display: flex;

    align-items: center;

    justify-content: center;

}

/*** Process End ***/





/*** Blog Start ***/

.blog .blog-item {

    border-radius: 10px;

    transition: 0.5s;

}



.blog .blog-item:hover {

    box-shadow: 0 0 45px rgba(0, 0, 0, .2);

}



.blog .blog-item .blog-img {

    position: relative;

    overflow: hidden;

    border-top-left-radius: 10px;

    border-top-right-radius: 10px;

}



.blog .blog-item .blog-img::after {

    content: "";

    position: absolute;

    width: 100%;

    height: 0;

    bottom: 0;

    left: 0;

    background: rgba(255, 255, 255, 0.3);

    transition: 0.5s;

}



.blog .blog-item:hover .blog-img::after {

    height: 100%;

}



.blog .blog-item .blog-img img {

    transition: 0.5s;

}



.blog .blog-item:hover .blog-img img {

    transform: scale(1.2);

}  



.blog .blog-item .blog-content {

    position: relative;

    background: var(--bs-light);

}



.blog .blog-item .blog-content .blog-date {

    position: absolute;

    top: 0; 

    left: 25px; 

    transform: translateY(-50%);

    padding: 12px 25px;

    border-radius: 10px;

    color: var(--bs-white);

    background: #028ace;

}



.blog .blog-item .blog-content .blog-comment {

    display: flex;

    justify-content: space-between;

}

/*** Blog End ***/





/*** Banner Start ***/

.banner .banner-item {

    position: relative;

    width: 100%;

    height: 25rem;

    border-radius: 10px;

    transition: 0.5s;

    z-index: 1;

}



.banner .banner-item::after {

    content: "";

    position: absolute;

    width: 100%;

    height: 100%;

    top: 0;

    left: 0;

    border-radius: 10px;

    background: rgba(0, 0, 0, .2);

    z-index: 2;

}



.banner .banner-item .banner-content {

    position: absolute;

    width: 100%;

    height: 100%;

    top: 0;

    right: 0;

    margin-left: 0;

    margin-bottom: 0;

    padding: 25px;

    border-radius: 10px;

    display: flex;

    flex-direction: column;

    justify-content: end;

    align-items:center;

    z-index: 5;

}

.banner .banner-item .banner-content h1{

    font-size: 55px!important;

        margin-bottom: 20px;

}

.banner .banner-item .banner-content p {

    font-size: 35px;

    margin-bottom: 20px;

}

.banner-btn{

    display: flex;

    justify-content: center;

    /* align-items: center; */

    /* gap: 10px; */

    width: 100%;



}

.banner .wp,.call,.enq,.email{

    

    border: none;

    padding: 13px 25px ;

    border-radius: 30px;

    text-align: center;

    display: flex;

    justify-content: center;

    align-items: center;

}

.banner .wp{

    background-color: #28a745;

    width: 100%;

}

.banner .wp:hover{

    background-color: #28a746c4;

    border:1px solid  white;

       

}

.banner .call{

    background-color: #2C80D3;

    width: 100%;

}

.banner .call:hover{

    background-color: #2c7fd3e5;

    border:1px solid  white;

       

}

.banner .enq{

    background-color: #ffc107;

    width: 100%;

}

.banner .enq:hover{

    background-color: #ffc107e5;

    border:1px solid  white;

       

}

.banner .email{

    background-color: #d9534f;

    width: 100%;



}

.banner .email:hover{

    background-color: #d9544fe7;

    border:1px solid  white;

       

}



@media (min-width: 992px) {

    .banner{

        height: auto;

    }

    .banner .banner-item .banner-content h2 {

        font-size: 45px;

        margin-bottom: 20px;

    }



    .banner .banner-item .banner-content h1 {

        font-size: 45px;

        margin-bottom: 20px;

    }



    .banner .banner-item .banner-content p {

        font-size: 30px;

        margin-bottom: 20px;

    }





}

@media only screen and (max-width: 768px) {

    .banner{

        height: auto;

    }

    .banner .banner-item {

        /* position: relative; */

        /* width: 100%; */

        height:17rem;

        /* border-radius: 10px; */

        /* transition: 0.5s; */

        /* z-index: 1; */

    }

    .banner .banner-item .banner-content h2 {

        font-size: 30px;

        margin-bottom: 10px;

    }



    .banner .banner-item .banner-content h1 {

        font-size: 25px!important;

        margin-bottom: 10px;

        text-align: center;

    }



    .banner .banner-item .banner-content p {

        font-size:15px;

        margin-bottom: 10px;

    }

    .banner-btn{

     display:inline-flex;

     /* column-gap: 10px; */

     /* padding: 5px 0;    */

     gap: 10px!important;

       flex-wrap: wrap; 

       

        gap: 0px;

    

    }

}

/*** Banner End ***/



/*** Team Start ***/

.team .team-item {

    position: relative;

    text-align: center;

    border-radius: 10px;

    margin-top: 100px;

    background: var(--bs-secondary);

    transition: 0.5s;

    z-index: 1;

}



.team .team-item::after {

    content: "";

    position: absolute;

    width: 100%;

    height: 0;

    bottom: 0;

    left: 0;

    

    border-radius: 10px;

    background: var(--bs-light);

    z-index: 2;

    transition: 0.5s;

}



.team .team-item:hover::after {

    height: 100%;

}



.team .team-item .team-content {

    position: relative;

    z-index: 5;

}



.team .team-item .team-content h4,

.team .team-item .team-content p {

    transition: 0.5s;

    color: var(--bs-light);

}



.team .team-item:hover .team-content h4 {

    color: var(--bs-dark);

}

.team .team-item:hover .team-content p {

    color: var(--bs-dark);

}



.team .team-item .team-img {

    position: relative;

    overflow: hidden;

    top: -100px;

    margin-bottom: -100px;

    border-radius: 10px;

    z-index: 3;

    border: 1px solid #f5f3f3;

}



.team .team-item .team-img img {

    transition: 0.5s;

}



.team .team-item:hover .team-img img {

    transform: scale(1.1);

}



.team .team-item .team-img::after {

    content: "";

    position: absolute;

    width: 100%;

    height: 0;

    top: 0;

    left: 0;

    color: black;

    border-radius: 10px;

    background: rgba(255, 255, 255,0.1);

    z-index: 4;

    transition: 0.5s;

}



.team .team-item:hover .team-img::after {

    height: 100%;

}

/*** Team End ***/



/*** Testimonial Start ***/

.testimonial-carousel .owl-stage-outer {

    margin-right: -1px;

}



.testimonial .testimonial-item {

    position: relative;

    margin-top: 35px;

    border: 1px solid var(--bs-secondary);

    border-radius: 10px;

}



.testimonial .testimonial-item .testimonial-quote {

    position: absolute;

    width: 70px;

    height: 70px;

    top: 0;

    right: 25px;

    transform: translateY(-50%);

    border-radius: 70px;

    color: var(--bs-white);

    background: var(--bs-secondary);

    display: flex;

    align-items: center;

    justify-content: center;

}



.testimonial .testimonial-item .testimonial-inner {

    display: flex;

    align-items: center;

    background: var(--bs-light);

    border-top-left-radius: 10px;

    border-top-right-radius: 10px;

}



.testimonial .testimonial-item .testimonial-inner img {

    width: 100px; 

    height: 100px; 

    border-radius: 100px;

    border: 4px solid var(--bs-white);

}



.testimonial-carousel .owl-dots {

    display: flex;

    justify-content: center;

}



.testimonial-carousel .owl-dots .owl-dot {

    width: 30px;

    height: 30px;

    border-radius: 30px;

    margin: 20px 10px 0 10px;

    background: #028ace;

    transition: 0.5s;

}



.testimonial-carousel .owl-dots .owl-dot.active {

    width: 30px;

    height: 30px;

    border-radius: 30px;

    background: var(--bs-secondary);

    transition: 0.5s;

}



.testimonial-carousel .owl-dots .owl-dot span {

    position: relative;

    margin-top: 50%;

    margin-left: 50%;

    transform: translate(-50%, -50%);

    display: flex;

    align-items: center;

    justify-content: center;

    text-align: center;

}



.testimonial-carousel .owl-dots .owl-dot.active span::after {

    background: #028ace;

}



.testimonial-carousel .owl-dots .owl-dot span::after {

    content: "";

    width: 15px;

    height: 15px;

    border-radius: 15px;

    position: absolute;

    top: 50%;

    left: 0;

    transform: translateY(-50%);

    display: flex;

    align-items: center;

    justify-content: center;

    text-align: center;

    background: var(--bs-white);

    transition: 0.5s;

}

/*** Testimonial End ***/



/*** Contact Start ***/

.contact .contact-add-item {

    border-radius: 10px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: space-around;

    text-align: center;

    height: 280px;

    background: var(--bs-light);

}



.contact .contact-add-item .contact-icon {

    width: 90px; 

    height: 90px; 

    border-radius: 67% 33% 29% 71% / 39% 46% 54% 61%;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--bs-white);

    background: #028ace;

    animation-name: icon-animat;

    animation-duration: 5s;

    animation-delay: 1s;

    animation-direction: alternate;

    animation-iteration-count: infinite;

    transition: 0.5s;

}



/*** Contact End ***/





/*** Footer Start ***/

.footer {

    background: var(--bs-dark);

}



.footer .footer-item a {

    line-height: 35px;

    color: var(--bs-body);

    transition: 0.5s;

}



.footer .footer-item p {

    margin-top: 7px;

    line-height: 30px;

}



.footer .footer-item a:hover {

    letter-spacing: 1px;

    color: #028ace;

}



.footer .footer-item .footer-btn a,

.footer .footer-item .footer-btn a i {

    transition: 0.5s;

}



.footer .footer-item .footer-btn a:hover {

    background: var(--bs-white);

}



.footer .footer-item .footer-btn a:hover i {

    color: #028ace !important;

}



.footer-item img{

    width: 100px;

    height: 70px;

}

/*** Footer End ***/



/*** copyright Start ***/

.copyright {

    border-top: 1px solid rgba(255, 255, 255, 0.08);

    background: var(--bs-dark);

}

/*** copyright end ***/









/* ----MILESTONE---- */

/* Timeline Container */

.timeline {

    position: relative;

    max-width: 1000px;

    margin: 0 auto;

    padding: 40px 0;

}



/* Timeline Item */

.timeline-item {

    display: flex;

    justify-content: flex-start;

    margin-bottom: 50px;

    position: relative;

    width: 100%;

    padding-left: 50px;

}



/* Alternate items should appear on the right side */

.timeline-item:nth-child(even) {

    justify-content: flex-end;

    padding-right: 50px;

    padding-left: 0;

}



/* Timeline Icon */

.timeline-icon {

    position: absolute;

    top: 0;

    left: 0;

    width: 20px;

    height: 20px;

    background-color: #dc3545;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    z-index: 1;

}



/* For alternate items (on the right), adjust icon position */

.timeline-item:nth-child(even) .timeline-icon {

    left: unset;

    right: 0;

}



/* Timeline Content Box */

.timeline-content {

    background: #f8f9fa;

    padding: 20px;

    border-radius: 10px;

    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);

    position: relative;

    width: 100%;

    max-width: 600px;

}



/* Heading inside the Timeline Item */

.timeline-content h4 {

    color: #dc3545;

    font-size: 24px;

    margin-bottom: 10px;

}



/* Paragraph Text */

.timeline-content p {

    margin: 0;

    font-size: 16px;

    color: #333;

}



/* Vertical Line Between the Items */

.timeline::before {

    content: '';

    position: absolute;

    width: 4px;

    background-color: #dc3545;

    top: 0;

    bottom: 0;

    left: 9px;

    margin-left: -2px;

    z-index: 0;

}

.timeline::after {

    content: '';

    position: absolute;

    width: 4px;

    background-color: #dc3545;

    top: 0;

    bottom: 0;

    right: 9px;

    margin-right: -2px;

    z-index: 0;

}



/* Alternate Positioning for the Line */

.timeline-item:nth-child(even)::before {

    left: unset;

    right: 9px;

}



/* Adjust the spacing for smaller screens */

@media (max-width: 768px) {

    .timeline-item {

        padding-left: 0;

        padding-right: 0;

        flex-direction: column;

    }



    .timeline-item:nth-child(even) {

        justify-content: flex-start;

    }



    .timeline-content {

        /* width: auto!important; */

        padding: 15px;

        /* max-width:unset; */

        width: 360px;

    }



    .timeline-icon {

        left: 50%;

        margin-left: -10px;

        top: -10px;

    }



    .timeline::before {

        left: 50%;

        margin-left: -2px;

        height: 90%;

    }



    .timeline-item:nth-child(even)::before {

        left: 50%;

        right: unset;

    }

    .timeline-item:nth-child(even) .timeline-icon {

        left:50%;

        right: 0;

    }

    .timeline::after {

      display: none;

    }

}





/* Process Section Styling */

.process-section {

    background-color: #f8f9fa;

    position: relative;

  }

  

  .process-section h2 {

    font-size: 36px;

    color: #333;

  }

  

  .process-section p {

    font-size: 16px;

    color: #555;

    line-height: 1.7;

  }

  

  .process-list {

    list-style: none;

    padding-left: 0;

  }

  

  .process-list li {

    font-size: 16px;

    color: #333;

    margin-bottom: 10px;

    position: relative;

    padding-left: 20px;

  }

  

  .process-list li::before {

    content: "✔";

    color: #dc3545;

    position: absolute;

    left: 0;

    top: 2px;

    font-size: 18px;

  }

  

  /* Image Container */

  .process-image-container {

    position: relative;

  }

  

  .process-image {

    border-radius: 20px;

    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);

    width: 100%;

  }

  

  .process-shape {

    position: absolute;

    z-index: -1;

    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);

    transition: all 0.5s ease-in-out;

  }

  

  .process-shape.rectangle1 {

    background-color: rgba(220, 53, 69, 0.2);

    width: 200px;

    height: 200px;

    top: -30px;

    right: -30px;

    border-radius: 10px;

  }

  

  .process-shape.rectangle2 {

    background-color: rgba(220, 53, 69, 0.2);

    width: 200px;

    height: 200px;

    bottom: -30px;

    left: -30px;

    border-radius: 10px;

  }

  

  /* Responsive Adjustments */

  @media (max-width: 768px) {

    .process-image-container {

      margin-top: 30px;

    }

  

    .process-shape.square {

      width: 80px;

      height: 80px;

      top: -30px;

      right: -30px;

    }

  

    .process-shape.rectangle {

      width: 120px;

      height: 50px;

      bottom: -20px;

      left: -20px;

    }

  }

  

  /* product-Range */

  .product-table {

    margin: 0 auto;

    background-color: white;

    border-radius: 10px;

    padding: 20px;

    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);

  }



  .table th,

  .table td {

    text-align: center;

    vertical-align: middle;

  }



  .table th {

    background-color:#028ace;

    color: white;

    border: none;

  }



  .table td {

    color: #333;

    border: none;

  }



  .table-responsive {

    overflow-x: auto;

  }



  /* .shape-diagram {

    width: 100px;

    height: 100px;

    border-radius: 50%;

    background-color: #f44336;

    color: white;

    display: flex;

    justify-content: center;

    align-items: center;

    font-size: 24px;

    margin: 0 auto;

  } */



  @media (max-width: 768px) {

    .shape-diagram {

      width: 70px;

      height: 70px;

      font-size: 18px;

    }

  }



  /* product-Properties */

  .product-properties {

    display: flex;

    /* justify-content: space-between; */

    flex-direction: column;

    /* background-color: #f9f9f9; */

    background-color: rgba(220, 53, 69, 0.1)!important;

    position: relative;

    border-bottom-left-radius: 400%;

    border-bottom-right-radius: 0%;

    border-bottom: 1px solid rgb(216, 215, 215);

}

.property-box-1{

    /* height: 22rem; */

}

.property-box-2{

    /* height: 26rem; */

}

.property-box-3{

    display: flex;

    height: 29rem;

    justify-content: space-between;

    flex-direction: column;

}

.property-box-4{

    /* height: 33rem; */

}



.product-properties h2 {

    font-weight: bold;

    position: relative;

    z-index: 1;

}



.property-box {

    background: #fff;

    transition: all 0.3s ease-in-out;

    border-radius: 50px;

    

}



.property-box:hover {

    transform: scale(1.05);

}



.property-box h5 {

    font-size: 1.2rem;

    font-weight: 600;

}



.property-box ul {

    padding-left: 1.2rem;

}



.property-box img {

    /* align-self: flex-end; */

   /* height: auto; */

    max-height: 150px;

    /* border:1px solid black; */

    object-fit: contain;

}



.property-box p {

    font-size: 0.9rem;

}



.property-box ul li {

    font-size: 0.9rem;

    list-style: disc;

}



.shadow {

    box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);

}



@media (max-width: 768px) {

    .product-properties {

        

        border-bottom-left-radius: 0%;

        border-bottom-right-radius: 0%;

      

    }

    .property-box-3{

       

        height: auto;

        justify-content: normal;

     

    }

    .property-box img {

        /* align-self: flex-end; */

       /* height: auto; */

        /* max-height: 150px; */

        width: 100%;

        /* border:1px solid black; */

        object-fit: cover;

    }

  }



  /* --Product_details-- */

  .individual-details {

    border: 1px solid #ddd;

    padding: 10px;

    /* overflow-x: scroll; */

    margin-bottom: 10px;

    background-color: #fff;

    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);

}

  .btn-custom {

    background-color: #028ace;

    color: white;

    border: none;

    margin: 0 10px;

    width: 100%;

    padding: 10px 20px;

    border-radius: 5px;

    transition: all 0.3s ease;

}



.btn-custom:hover {

    background-color: #ff4d6d;

    color: white;

}



.content-container {

    background-color: rgba(216, 215, 215),0.1;

    padding: 20px;

    /* width: max-content; */

    border-radius: 10px;

    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.2);

}

.content-container:hover {

    

    box-shadow: inset 0px 5px 15px rgba(0, 0, 0, 0.2);

}



.content {

    text-align: left;

}

.heading-container{

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

    gap: 10px;

} 

.content-container-Headings{

    color: #028ace;

}



.heading-container p {

    color: #f1f1f1;

}



.product-details-custom-img {

    width: 100%;

    height: 380px;

    object-fit: cover;

  }

  @media (min-width: 768px) {

    .product-details-custom-img {

      height: 280px;

      width: 100%;

    }



    

  } 

  

 @media (max-width: 768px) {

    



    .individual-details {

        overflow-x: scroll!important;

        margin: 15px 8px;

        margin-bottom: 20px;

    }

  }



/* Add fade-in and fade-out animation for content change */

@keyframes fadeIn {

    0% {

        opacity: 0;

        transform: translateY(20px);

    }

    100% {

        opacity: 1;

        transform: translateY(0);

    }

}



@keyframes fadeOut {

    0% {

        opacity: 1;

        transform: translateY(0);

    }

    100% {

        opacity: 0;

        transform: translateY(20px);

    }

}



/* Apply animation for fade-in and fade-out transitions */

.fade-in {

    animation: fadeIn 0.5s ease-in-out forwards;

}



.fade-out {

    animation: fadeOut 0.3s ease-in-out forwards;

}



/* Hide content when not visible */

.d-none {

    display: none;

}



.bullet-list {

    list-style-type: disc;

    /* padding-left: 20px; */

}



.bullet-list li {

    font-size: 1.1rem;

    margin-bottom: 10px;

    line-height: 1.5;

    color: #2c3e50;

}



.bullet-list li::marker {

    color: #2c3e50;

    font-size: 1.3rem;

}





.Product_details .Product_details-item .Product_details-item-inner {

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    text-align: center;

    border-radius: 10px;

    background: var(--bs-light);

    transition: 0.5s;

}



.Product_details .Product_details-item .Product_details-icon {

    

   font-size: 23px;

}

.Product_details-item p{

    font-size: 20px;

    padding: 5px 0;

}

.Product_details-img-1 {

    /* position: relative; */

    width: 100%;

    /* max-width: 550px;  */

    margin: 0 auto;

    overflow: hidden;

    height: 400px;
    
    

    /* border: 1px solid #028ace; */

}
.Product_details-img-2 {

    /* position: relative; */

    width: 100%;

    /* max-width: 550px;  */

    margin: 0 auto;

    overflow: hidden;

    height: 350px;
    
    

    /* border: 1px solid #028ace; */
}

.Product_details-img-3 {

    /* position: relative; */

    width: 100%;

    /* max-width: 550px;  */

    margin: 0 auto;

    overflow: hidden;

    height: 800px;
    
    

    /* border: 1px solid #028ace; */
}

.Product_details-img-4 {

    /* position: relative; */

    width: 100%;

    /* max-width: 550px;  */

    margin: 0 auto;

    overflow: hidden;

    height: 550px;
    
    

    /* border: 1px solid #028ace; */
}



/* Main image styling */

.Product_details-img-1 .main-image {

    width: 100%;

    height: 100%;

    display: block;

    /* border-radius: 10px; Optional for rounded corners */

    /* object-fit: contain; */

    /* border: 1px solid yellow; */

}



@media (max-width: 768px) {

    .Product_details-img-1 .main-image {

        /* width: 100%; */

        /* height: 430px; */

        display: block;

        border-radius:0px !important; /* Optional for rounded corners */

        /* object-fit: cover; */

        /* border: 1px solid yellow; */

    }

    .Product_details .Product_details-item .Product_details-icon {

    

        font-size: 20px;

     }

}



@media (max-width: 480px) {

    .Product_details-img {

        max-width: 100%; /* Full-width for mobile */

    }

    

}

.Product_details .Product_details-item .text-item {

    position: relative;

    padding-left: 25px;

}



.Product_details .Product_details-item .text-item::after {

    content: "";

    position: absolute;

    width: 5px;

    height: 100%;

    top: 0;

    left: 0;

    border-radius: 10px;

    background: var(--bs-secondary);

}



/* .product-details-Applications-section */

.application-section {

    /* margin: 0 10px; */

    background: #f9f9f9; /* Optional: Background color */

    padding: 10px; 

    /* border: 1px solid #ddd; Optional: Border around the section */

}



.application-section h2 {

    margin-top: 0;

}



.application-section ul {

    list-style: none;

    padding: 0;

    margin: 0;

}



.application-section ul li {

    position: relative;

    padding-left: 20px;

    margin-bottom: 10px; /* Adjust spacing as needed */

}



.application-section ul li::before {

    content: "\2022"; /* Unicode character for bullet */

    color: #028ace; /* Bullet color */

    font-weight: bold;

    position: absolute;

    left: 0;

    top: 0;

}



/* .application-card-container {

    perspective: 1000px;

    display: flex;

    justify-content: center;

    align-items: center;

    height: 100vh; 

} */



.application-card {

    /* perspective: 1000px; */

    width: 100%; /* Adjust as needed */

    height: 100%; /* Adjust as needed */

    position: relative;



    transform-style: preserve-3d;

    transition: transform 0.6s;

}



.application-card:hover {

    transform: rotateY(180deg);

}



.application-card-front, .application-card-back {

    position: absolute;

    width: 100%;

    height: 100%;

    backface-visibility: hidden;

}



.application-card-front {

    display: flex;

    justify-content: center;

    align-items: center;

    background: #fff; /* Optional: background color */

}



.application-card-front img {

    width: 100%;

    height: 100%;

    /* object-fit: ; */

}



.application-card-back {

    transform: rotateY(180deg);

    display: flex;

    justify-content: center;

    align-items: center;

    background: #fff; /* Optional: background color */

}



.application-card-back img {

    width: 100%;

    height: 100%

}





   /* product-details--features-section */

.product-details-features-section {

    background-color: #f9f9f9;

    padding: 60px 0;

}

.product-details-feature-item {

    font-size: 1.1rem;

    color: #333;

    margin-bottom: 20px;

}

.product-details-feature-item i {

    color: #028ace;

    margin-right: 10px;

}

.product-details-features-title {

    font-size: 2rem;

    font-weight: bold;

    color: #028ace;

    margin-bottom: 30px;

    text-align: center;

} 



  /* product-details--specification & Standard section */

  .product-details-specification-section {

    background-color: #ffffff;

    padding: 40px;

    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);

    border-radius: 8px;

    margin-bottom: 40px;

}

.product-details-spec-title {

    font-size: 1.8rem;

    font-weight: bold;

    color:#028ace;

    margin-bottom: 30px;

}

.product-details-spec-list {

    font-size: 1.1rem;

    color: #333;

}

.product-details-spec-list i {

    color:#028ace;

    margin-right: 10px;

}

.product-details-spec-list li {

    margin-bottom: 10px;

}

.product-details-spec-image {

    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);

    border-radius: 8px;

    /* height: 200px; */

    width: 100%;

    overflow: hidden;

}

.product-details-spec-image img {

    width: 100%;

    height: auto;

    border-radius: 8px;

}



/* Company-Profile */



.welcome-container {

    margin: 100px auto; 

    display: flex;

    justify-content: center;

    align-items: center;

    height: 350px!important;

    position: relative;

    border: 15px solid #028ace!important;

    border-radius: 10px;

}



.card-wrapper {

    display: flex;

    width: 88%;

    height: 450px;

    background-color: #ffffff;

    background-color:var(--bs-secondary);

    border-radius: 10px;

    overflow: hidden;

    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);

    position:absolute;

    z-index: 99;





}







.card-content {

    display: flex;

    flex-direction: column;

    /* justify-content: center; */

    background-color: #fff;

    padding: 15px 17px;

    margin: 15px;

    /* height: 100%; */

    border-radius: 10px;

    /* overflow-y: scroll!important; */



}



.card-content h1 {

    /* color: #333; */

    font-size: 2rem;

    /* color: #028ace!important; */

    margin-bottom: 20px;

}



.card-content p {

    color: #666;

    font-size: 1rem;

    margin-bottom: 7px;

    line-height: 1.5;

}























.card-wrapper::after {

    width: 50px;

    height: calc(100% + 30px);

    top: -15px;

    left: 50%;

}



@media (max-width: 768px) {

    .card-wrapper {

        flex-direction: column;

        width: 100%;

        

    }



    .card-content, .card-image {

        padding: 15px;

    } 

    

    .card-content {

        overflow-y: scroll;

    }



    .card-wrapper::before, .card-wrapper::after {

        display: none;

    }

    .card-content h1 {

        /* color: #333; */

        font-size: 1.5rem;

        /* color: #028ace!important; */

        /* margin-bottom: 20px; */

    }

}



/* company-profile-mission/vission */

.MV-section-card {

    background: #fff;

    border-radius: 10px;

    padding: 20px;

    height: 350px;

    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);

    transition: box-shadow 0.3s, transform 0.3s;

}

.MV-section-card:hover {

    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);

    transform: translateY(-5px);

}

.MV-section-icon {

    font-size: 3rem;

    color: #028ace;

    margin-bottom: 1rem;

}

.MV-section-title {

    margin-bottom: 1rem;

    font-size: 1.5rem;

    font-weight: bold;

}

.MV-section-content {

    font-size: 1rem;

    text-align: justify;

    line-height: 1.5;

}



.MV-mission-list {

    list-style: disc;

    margin: 0;

    padding-left: 1.5rem;

}

.MV-mission-list li {

    margin-bottom: 0.5rem;

}

@media (max-width: 768px) {

    .MV-section-title {

        font-size: 1.25rem;

    }

    .MV-section-content {

        font-size: 0.875rem;

    }

    .MV-section-card {

       height: auto;

    }

}

/* .mission-vision .content-section {

    padding: 20px;

    background-color: #f9f9f9;

    border-radius: 10px;

    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);

}



.mission-vision .content-box {

    transition: all 0.3s ease-in-out;

}



.mission-vision .content-box h3 {

    font-size: 1.8rem;

    color: #333;

}



.mission-vision .content-box p {

    font-size: 1.2rem!important;

    color: #666;

}

.mission-vision .content-box ul li {

    font-size: 1.2rem!important;

    /* color: #666; */



.content-box:not(.d-none) {

    opacity: 1;

    transform: translateY(0);

}

#mission-content.d-none, #vision-content.d-none {

    display: none;

}



.mission-vision .btn-outline-primary, .btn-outline-success {

    font-size: 1.1rem;

    padding: 10px 20px;

    border-radius: 5px;

    width: 100%;

    

}

.mission-vision .mission-btn{

    color: #028ace!important;

   

    margin: 5px;

}

.mission-vision .vission-btn{

  color: var(--bs-secondary)!important;

   

    border-color: var(--bs-secondary)!important;

    margin: 5px;

}

.mission-vision .mission-btn:hover{

    background-color: #028ace!important;

    color: white!important;



}

.mission-vision .vission-btn{

    color: var(--bs-secondary)!important;

}

.mission-vision .vission-btn:hover{

    

    background-color: var(--bs-secondary)!important;

    color: white!important;

}

.bi {

    margin-left: 5px;

}

.btn-outline-success:active{



    border-color: rgb(219, 83, 94)!important;

} */



/* company-profile companyDetails-Section */

/* Company Details Section */

.profile-company-details {

    /* background-color: #ffffff;; */

    background-color: rgba(220, 53, 69, 0.1);

    color: black;
    
    background-color: #f7f7f7;

}



.profile-big-card {

    /* background-color: #028ace; #028acedish background */

    border: none;

    height: 440px;

    border-radius: 15px;

    box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.1);
    
    background-color: #f7f7f7;

}

.profile-big-card h2 {

   font-size: 1.7rem;

   font-weight: 600;
   margin-left: 120px;

}



.profile-small-card {

    background-color: var(--bs-secondary); /* Dark bluish background */

    border: none;

    border-radius: 15px;

    height: 130px;

    box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.1);

}



.card-title {

    font-size: 1.25rem;

    margin-bottom: 10px;

}





.card-text {

    font-size: 1rem;

}



@media (max-width: 768px) {

    .small-card {

        text-align: center;

    }

    .profile-big-card {

       height: auto;

       border-radius: 0;

    }

}





/* Infrastructure */

.infrastructure-section-title {

    font-size: 2.5rem;

    color: #d9534f; /* #028ace-ish color */

    margin-bottom: 1.5rem;

}



.infrastructure-image-container {

    position: relative;

}



.infrastructure-image-container img {

    width: 100%;

    border-radius: 8px;

}



.infrastructure-shape {

    position: absolute;

    border-radius: 50%;

    opacity: 0.2;

}



.infrastructure-shape1 {

    background-color: #d9534f; /* #028ace-ish color */

    width: 150px;

    height: 150px;

    top: 10%;

    left: 10%;

}



.infrastructure-shape2 {

    background-color: #5bc0de; /* Blue-ish color */

    width: 100px;

    height: 100px;

    bottom: 10%;

    right: 10%;

}



.infrastructure-shape3 {

    background-color: #5bc0de; /* Blue-ish color */

    width: 180px;

    height: 180px;

    top: 10%;

    right: 10%;

}



.infrastructure-shape4 {

    background-color: #d9534f; /* #028ace-ish color */

    width: 120px;

    height: 120px;

    bottom: 15%;

    left: 15%;

}



@media (max-width: 767px) {

    .infrastructure-section-title {

        font-size: 2rem;

    }



    .infrastructure-shape {

        width: 80px;

        height: 80px;

    }



    .infrastructure-shape1, .infrastructure-shape2, .infrastructure-shape3, .infrastructure-shape4 {

        position: static;

        opacity: 0.1;

    }

}



.our-unit .row{



    /* display: flex; */

    justify-content: space-evenly;

    /* padding:  10px 20px; */



}

.unit-card {

    width: 100%;

    height: 630px;

    box-shadow: 0 4px 8px rgba(0,0,0,0.2);

    overflow: hidden;

    margin: 20px auto;

    border: none;

    border-radius: 10px;

    background-color: #028ace;

}

.unit-card img {

    width: 100%;

    height: 45%;

    object-fit: cover;

    transition: scale 0.3s ease;

}

.unit-card img:hover {

   scale: 1.05;

}

.unit-card-title{

 font-weight: 600;

}

.unit-card .unit-card-body {

    height: 53.50%;

    padding: 15px;

    /* display: flex; */

    /* align-items: center; */

    /* justify-content: center; */

    background-color: #f8f9fa;

}

.unit-card .unit-card-title {

    margin-bottom: 8px;

    font-size: 16px;

    text-align: center;

    /* font-weight: 900; */



}

.unit-card p{

    text-align: justify;

}



/* --Quality-- */





.policy-block {

    margin-bottom: 50px;

}



.policy-block h2 {

    margin-bottom: 20px;

    font-size: 2.5rem;

}



.policy-block p {

    font-size: 1.2rem;

}



.policy-block ul {

    font-size: 1rem;

}







.policy-block .text-primary {

    /* color: #007bff !important; */

    color: #dc3545 !important;

}



.policy-block .text-danger {

    color: #dc3545 !important;

}







.img-fluid {

    border-radius: 8px;
    object-fit: cover;

}





/* ---Clients-- */

.clients-section {

    padding: 50px 0;

    text-align: center;

}



.clients-section h2 {

    font-size: 36px;

    font-weight: bold;

    margin-bottom: 40px;

}



.client-logo {

    background-color: white;

    border: 8px solid var(--bs-light);

    /* border-top-left-radius:25px ; */

    /* border-bottom-right-radius:25px ; */

    padding: 0 15px;

    /* border-radius: 8px; */

    height: 150px;

    display: flex;

    

    flex-direction: column;

    gap: 5px;

    justify-content: center;

    align-items: center;

    transition: transform 0.3s;

}



.client-logo h3 {

    color: #028ace;

}



.client-logo img {

    max-height: 120px;

    width: 100%;

    object-fit: contain;

    

}



.client-logo:hover {

    transform: scale(1.05);

}



@media (max-width: 768px) {

    .client-logo {

        height: auto;

    }

    .clients-section h2 {

        font-size: 28px;

    }

}





  

/* ------   */

.productExp1,.productExp2{



    height: 100vh;

    width: 100%;

    border: 2px solid greenyellow;

}



.productExp1{

    width: 85%;

    position:relative;

    background-color: #ebebe6;;

}



.image1st,.image2nd{

    position: absolute;

    /* max-width: 300px; */



}



.image1st{

    bottom: 38px;

    left: 24px;

    height: 260px;

    /* padding: 50px; */

    border: 1px solid #028ace;

    width: 400px;

    background-color: #5bc0de;

    transition: transform 0.3s;

    animation: jump 2s ease-in-out infinite;

}

.image1st img{

width: 100%;

height: 100%;

object-fit: cover;

}

.image2nd{

    top: 100px;

    right: -100px;

    width: 300px;

    /* padding: 50px; */

    border: 1px solid #028ace;

    height: 80%;

    background-color: #5bc0de;

    transition: transform 0.3s;

    animation: jump 2s ease-in-out infinite;

}

.image2nd img{

    width: 100%;

    height: 100%;

    object-fit: cover;

    }



    .proExp-title{

       border: 1px solid black;

       padding: 20px;

       height: 100%;

       width: 75%;

    }

    .proExp-title h4{

       font-size: 3.5rem;

       /* text-align: left; */

    }

    @keyframes jump {

        0% {

            transform: translateY(0);

        }

        50% {

            transform: translateY(-25px);

        }

        100% {

            transform: translateY(0);

        }

    }







    /* ----Our-Clients(HOME PAGE)--- */

    .client-card {

        width: 160px;

        height: 150px;

        margin: 10px;

        background-color: #fff;

        border-radius: 10px;

        box-shadow: 0 4px 8px rgba(0,0,0,0.4);

        overflow: hidden;

        display: flex;

        align-items: center;

        justify-content: center;

        text-align: center;

    }





    .client-card img {

        width: 100%;

        height: 100%;

        object-fit: contain;

        border-radius: 10px;

    }



    @media (max-width: 768px) {

        .client-card {

            width: 170px;

            height: 160px;

        }

    }



    marquee {

        width: 100%;

        white-space: nowrap;

    }



  

 /* ------Certificates---    */



 .gallery-item {

    position: relative;

    cursor: pointer;

    height: 19rem;

    /* margin-left: 5px; */

    box-shadow: 0 4px 8px rgb(0 0 0 / 40%);

    /* border: 1px solid; */

    overflow: hidden;

    width: 240px;

    margin: auto;

}

  .gallery-item .certificate-name {

    /* text-align: center; */

    font-size: 50px!important;

}

  

  

  .gallery-item img {

    transition: transform 0.4s ease;

    width: 100%;

    object-fit: contain;

    height: 100%;

  }

  

  .gallery-item:hover img {

    transform: scale(1.1);

  }

  

  .overlay {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    display: flex;

    justify-content: center;

    align-items: center;

    background: rgba(0, 0, 0, 0.6);

    opacity: 0;

    transition: opacity 0.4s ease;

  }

  

  .gallery-item:hover .overlay {

    opacity: 1;

  }

  

  .overlay i {

    color: white;

    font-size: 2rem;

  }



  .certificate-name p{

   font-size: 15px!important;

  }

  

  /* Full Screen Modal */

  .modal-fullscreen {

    max-height: 100vh;

    /* padding: 20px auto; */

    /* border: 5px solid yellow; */

   

    display: flex;

    justify-content: center;

    align-items: center;

    /* width: 70%; */

    height: 100%;

  }

  

  .modal-content {

    padding: 50px auto;

    position: relative;

  background: transparent;

  width: 70%;

  border: none;

  background-color: white;

  padding: 0;

  }

  

  .modal-dialog {

    margin: 0;

    padding: 0;

    max-width: 100%;

  width: 100%;

  }

  

  .btn-close {

    position: absolute;

    top: 10px;

    right: 10px;

    /* background-color: #028ace; */

    color: whitesmoke;

    border: 3px solid #028ace;

    padding: 10px;



    font-size: 10px;

  }



  .modal-content img {

    width: 100%;

    height: 100%;

    object-fit: contain;

    display: block;

    margin: 0 auto;

  }

  

  

    



.modal-fullscreen .modal-content {

    height: 95vh;

    width: 60%;



}

.modal-content img {

    width: 98%;

    height: 100%;

    object-fit: contain;

   

  }

  @media (max-width: 768px) {

    .modal-fullscreen .modal-content {

        height: 50vh;

    width: 95%;

    }

  }

  

 



/* Product Page- Material Safety section- */

 .material-safety .table-container {

            margin: 50px auto;

            max-width: 90%;

            /* overflow-x: scroll; */

        }



        .material-safety .table th {

            background-color: #f8f9fa;

            font-size: 1.2rem;

            color: #028ace;

        }
        .ndt-image
        {
            width: 100%;
            height: 100%;
        }



        .material-safety .table th, .table td {

            vertical-align: middle;

            text-align: left;

        }



        .material-safety .table-borde#028ace th, .material-safety .table-borde#028ace td {

            border: 1px solid #dee2e6;

        }



        @media (max-width: 768px) {

            .material-safety .table-container {

                width: 100%;

                margin: 20px auto;

                overflow-x: scroll;

            }



            .material-safety .table th, .material-safety .table td {

                font-size: 0.9rem;

            }

        }



/* Product-Page- Product-Datasheet          */

.section-title {

    color: #e74c3c;

    text-transform: uppercase;

    font-weight: bold;

}

.product-datasheet .table-container {

    margin-top: 30px;

    /* width: fit-content!important; */

}

.product-datasheet-table-container{

width: fit-content!important;

margin: 30px auto;

}

.product-datasheet-product-description {

    

    font-size: 1rem;

    margin-bottom: 20px;

}

.product-datasheet .table thead {

    background-color: #f2f2f2;

}

.product-datasheet .table tbody tr {

    animation: fadeIn 1.5s ease-in-out;

}



.product-datasheet .table td {

    /* vertical-align: middle; */

    text-align: center;

}

@keyframes fadeIn {

    0% {

        opacity: 0;

        transform: translateY(20px);

    }

    100% {

        opacity: 1;

        transform: translateY(0);

    }

}



/* --Members-- */

.membership-section {

    padding: 50px 0;

    background-color: #f7f7f7;

  }

  .membership-section h1 {

    text-align: center;

    margin-bottom: 10px;

    font-weight: bold;

    /* color: #333; */

  }

  .membership-section p{

    text-align: center;

  }

  .membership-logos {

    display: flex;

    justify-content: center;

    flex-wrap: wrap;

  }

  .logo-container {

    padding: 8px;

    background-color: white;

    /* border-radius: 8px; */

    margin-bottom: 20px;

    height: 170px;

    box-shadow: 0 4px 8px rgba(0,0,0,0.1);

    transition: transform 0.3s;

    text-align: center;

  }

  .logo-container:hover {

    transform: scale(1.1);

  }

  .logo-container img {

    width: 100%;

    height: 100%;

    object-fit: contain;

  }

/* 

  --Approval-sections-- */



  .approval-logo-section {

    padding: 50px 0;

    background-color: #f7f7f7;

  }

  .approval-logo-section h1 {

    text-align: center;

    margin-bottom: 30px;

    font-weight: bold;

    /* color: #333; */

  }

  

  .approval-logos {

    display: flex;

    justify-content: space-around;

align-items: center;

    flex-wrap: wrap;

  }

  .approval-logo-container {

    /* padding: 8px; */

    /* background-color: white; */

    /* border-radius: 8px; */

    margin-bottom: 20px;

    width: 140px!important;

    height: 140px!important;

    box-shadow: 0 4px 8px rgba(0,0,0,0.1);

    transition: transform 0.3s;

    text-align: center;

  }

  .approval-logo-container:hover {

    transform: scale(1.1);

  }

  .approval-logo-container img {

    width: 100%;

    height: 100%;

    object-fit: contain;

  }







  /* certificate-tabs */

  .tabs-categories {

    display: flex;

    justify-content: space-between;

    /* flex-direction: column; */

    padding-top: 10px;

}



.tabs-category-btn {

    background-color: #028ace;

    color: white;

    border: none;

    padding: 10px;

    width: 370px;

    margin-bottom: 10px;

    cursor: pointer;

    transition: background-color 0.3s;

}



.tabs-category-btn:hover {

    background-color: var(--bs-secondary);

}



.tabs-certificates {

    position: relative;

    /* width: 100%; */

}



.tabs-certificate-section {

    display: none;

    padding: 10px;

    

    opacity: 0;

    /* transition: opacity 0.5s ease; */

    transform: translateY(30px);  /* Start off shifted down */

    transition: opacity 0.5s ease, transform 0.5s ease;  /* Transition both opacity and position */

    display: none;

}





.tabs-certificate-section.active {

    display: block;

    opacity: 1;

    transform: translateY(0);  /* Move up to its normal position */

}



.tabs-certificate-section.hidden {

    opacity: 0;

}



.tabs-certificate-section .btn {

    display: inline-block;

    /* margin-top: 10px; */

    padding: 8px 16px;

    background-color: var(--bs-secondary);

    color: white;

    text-decoration: none;

    border-radius: 4px;

    transition: background-color 0.3s;

}



.btn:hover {

    background-color: #028ace;

}



@media (max-width: 768px) {

    .tabs-categories {

        /* display: flex; */

        justify-content: normal;

        flex-direction: column;

        /* padding-top: 10px; */

    }

    .tabs-certificate-section h3 {

       

        font-size: 1.1rem;

    }

   

}





/* ---product-based-applications-sectyion---- */

/* .product-based-applications-section {

    background-image: url('https://www.transparenttextures.com/patterns/fabric-of-squares.png'); 

    background-size: cover;

    background-position: center;

} */



.product-based-applications-section  {

    display: flex;

    justify-content: center;

    align-items: center;    

}



.product-based-applications-image-container {

    background-color: #fff;

    /* padding: 20px; */

    border-radius: 10px;

    border: 8px solid rgb(248, 246, 246);

    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);

}



.product-based-applications-product-image {

    width: 100%;

    height: auto;

    border-radius: 5px;

}



.product-based-applications-product-details {

    overflow-y: scroll;

    background-color: #f8f9fa;

    border-radius: 10px;

    padding: 20px;

    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);

}



.product-based-applications-product-title {

    font-size: 30px;

    margin-bottom: 20px;

    font-weight: bold;

}



.product-based-applications-section  .table th, .table td {

    /* vertical-align: left; */

    text-align:left;

    

}

.product-based-applications-section  .table th {

   background:none;

   color:inherit;

   /* border: 1px solid inherit!important; */

   /* font-size: 15px; */

    

}

.custom-table {

    border: 1px solid black;

    width: 100%;

}



.custom-table th, .custom-table td {

    border: 1px solid rgb(223, 223, 223);

    padding: 10px;

    text-align: left;

}



.custom-table th {

    background-color: var(--bs-secondary);

    font-weight: bold;

}



/* ----custome-properties-section-table--- */

.custom-properties-table {

    width: 100%;

    border-collapse: collapse;

    margin: 20px 0;

}



.custom-properties-table th,

.custom-properties-table td {

    border: 1px solid rgb(218, 218, 218);

    padding: 12px;

    text-align: center;

}



.custom-properties-table th {

    background-color: #f2f2f2;

    color: #333;

    font-weight: bold;

}



.custom-properties-table .highlight {

    background-color: #028ace; 

    color: white;

}







.product-overview-section-heading {

    /* color: #007bff; */

    /* font-size: 1.8rem; */

    font-weight: bold;

    margin-bottom: 1rem;

  }

  

  .features-section, .benefits-section {

    background-color: #f9f9f9;

    padding: 20px;

    border-radius: 8px;

    height: 300px;

    

    margin-bottom: 1.5rem;

  }

  

  .product-overview-features-list, .product-overview-benefits-list {

    list-style-type: disc;

    padding-left: 1.5rem;

    color: #333;

  }

  

  .product-overview-features-list li, .product-overview-benefits-list li {

    font-size: 1rem;

    margin-bottom: 0.5rem;

  }

  





 

  

  .icon-box {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    width: 60px;

    height: 60px;

    background-color: #1f2e4e;

    color: #fff;

    border-radius: 50%;

    font-size: 1.5rem;

    margin-bottom: 1rem;

  }

  

  .our-commitment .section-title {

    font-size: 1.1rem;

    font-weight: bold;

    color: #333;

    margin-top: 0.5rem;

  }

  

  .rigorous-testing, .continuous-improvement, .customer-focused-approach {

    text-align: center;

    padding: 20px;

    height: 260px;

    /* border: 1px solid black!important; */

    background-color: #f9f9f9;

    border-radius: 8px;

    margin-bottom: 1.5rem;

  }

  

  .rigorous-testing p, .continuous-improvement p, .customer-focused-approach p {

    color: #555;

    text-align: justify;

  }

  



  .conclusion{



    background-color: #f0f8ff; /* Light blue background */

    color: #333; /* Dark text for contrast */

    padding: 20px; /* Add some padding for better spacing */

    border-radius: 8px; /* Rounded corners for a softer look */

  }







@media (max-width: 768px) {

    .custom-properties-table {

        font-size: 14px; /* Smaller font size on mobile */

    }



    .features-section, .benefits-section {

       height: auto;

      }

}







.product-info-section {

    background-color: #f0f8ff; /* Light blue background */

    color: #333; /* Dark text for contrast */

    padding: 20px; /* Add some padding for better spacing */

    border-radius: 8px; /* Rounded corners for a softer look */

}



.product-info p{

    text-align: justify;

}

.product-info{

    padding: 10px 20px;

    text-align: justify;

    /* border:1px solid black; */

}



.t{
    border: 1px solid black;
    border-collapse: collapse;
    width: 80%;
    height: 80%;
    margin-left: 10%;
  }
  th, td
  {
    border: 1px solid black;
    border-collapse: collapse;
  }
  .text-left{
    text-align: left !important ;
    border: none;
  }
  .header-logo{
    width: 340px;
    height: 100px;
    justify-items: center;
    text-align: -webkit-center;
  }



  /* Style the Image Used to Trigger the Modal */
  .gallery-img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    cursor: pointer;
    border-radius: 10px;
    transition: transform 0.3s ease;
}

.gallery-img:hover {
    transform: scale(1.05);
}
.modl
{
    width: 350px;
    height: 400px;
    margin-top: 50px;
    object-fit: contain;
    box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;
}
.modl img
{
    width: 100%;
    height: 86%;
    object-fit: contain;

    
}
.modl1
{
    
}
.mtc
{
    text-align: center;
    color: black;
    font-size: 20px;
    display: flex;
    display: ruby;
}
.sp
{
    padding: 20px;
}
.certificate-modal{
    left: 212px !important;
    width: 100%;
    
}
.certificate-modal-img img{
    width: 60% !important;
}
.top-bg-icon
{
    background-color: #602121;
}
.icn
{
    display: flex;
    gap: 30px;
    margin-right: 20px;

}
.icn i
{
    font-size: 20px;
    color: white;
    background-color:#028ace ;
    border-radius: 50%;
    padding: 6px;
 

}


.icn-futer
{
    display: flex;
    gap: 20px;
    margin-right: 20px;

}
.icn-futer i
{
    font-size: 20px;
    color: white;
    background-color:#028ace ;
    border-radius: 50%;
    padding: 6px;
 

}
@media screen and (max-width: 786px) {
    .certp {
      margin-bottom: 40px !important;
      height: 300px !important;
    }
    .cop{
        height: 1036px !important;
    }
  }


  .Building-material
  {
    width: 90%;
    height: 350px;
    padding: 10px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    margin-bottom: 30px;
    background-color: white;
  }
  .Building-material img
  {
    width: 100%;
    height: 80%;
    

  }
  .testing-padding
  {
    padding:50px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    background-color: rgb(241, 241, 235);
  }
  .bc
  {
    background-color: rgb(241, 241, 235);
  }
  .concret-div
  {
    padding: 50px;
    box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
    margin-bottom: 30px;
  }
  .concret-image-div
  {
    width: 100%;
    height: 250px;
    
  }


  .concret-image-div1
  {
      width: 100%;
      height: 430px;
  }

  .concret-image-div1 img
  {
      width: 100%;
      height: 100%;
  }
  .concret2
  {
    width: 100%;
    height: 350px !important;
  }
  .concret2 img
  {
    width: 100%;
    height: 100% !important;
  }

  .concret3
  {
    width: 100%;
    height: 500px !important;
  }
  .concret3 img
  {
    width: 100%;
    height: 100% !important;
  }


  .concret4
  {
    width: 100%;
    height: 500px !important;
  }
  .concret4 img
  {
    width: 100%;
    height: 100% !important;
  }

  .concret5
  {
    width: 100%;
    height: 370px !important;
  }
  .concret5 img
  {
    width: 100%;
    height: 100% !important;
  }
 .ita-image
 {
   
    width: 100%;
    height: 305px;
 }
 .ita-image img
 {
  
    width: 100%;
    height: 100%;
 }

  .concret-image-div img
  {
    width: 100%;
    height: 100%;
  }
  .Chemical-Analysis li{
    font-size: 18px;
  }
  .text-justify{
    text-align: justify !important;
  }


  .build1
  {
    width: 100%;
    height: 350px !important;
  }
  .buildimg
  {
    width: 100%;
    height: 100% !important;
  }

  .build2
  {
    width: 100%;
    height: 400px !important;
  }
  .build3
  {
    width: 100%;
    height: 400px !important;
  }
  .imgmech
  {
    
    width: 100%;
    height: 500px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
  }
  .imgmech img
  {

    width: 100%;
    height: 100%;
  }
  .imgbuild
  {
    
    width: 100%;
    height: 500px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
  }
  .imgbuild img
  {
    
    width: 100%;
    height: 100%;
    
  }

  .imgndt
  {
    width: 100%;
    height: 350px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
  }

  .imgndt img
  {
    
    width: 100%;
    height: 100%;
    
  }

  .imgchem
  {
    width: 100%;
    height: 600px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
  }

  .imgchem img
  {
    width: 100%;
    height: 100%;
    
  }
  .ftoph4{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-content: center;
    height: 80px;
  
  }
  @media screen and (max-width: 768px) {

   .certp
{
    width: 100% !important;
    
}
.certificate-read
{
    padding-top: 0px;
}
.imgbuild
{
    padding: 20px;
}
.imgmech
{
    padding: 20px;
}
.client-logo
{
    height: 180px;
}
.concret-image-div1
{
    width: 100%;
    height: 250px;

}
.concret-image-div1 img
{
    width: 100%;
    height: 100%;
}
.ftoph4{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  align-content: center;
  height: 80px;

}
.modl
{
    width: 100%;
}
.mq1
{
    margin-top: 30px;
}
.buildimg
{
    height: 250px;
}
.cop
{
    height: 877px !important;
}
.borderq
{
    border-width: 2px;
}

.certificate-modal 
{
    left: 66px !important;
}
.card-content
{
    margin: 2px !important;
}
.certificate-modal-img img
{
    width: 100% !important;
}
.concret-image-div
{
    height: 250px !important;
}
.build1
{
    height: 250px !important;
}
.build2
{
    height: 250px !important;
}
.build3
{
    height: 250px !important;
}

.concret-image-div1
{
    height: 250px !important;
}

.concret-image-div
{
    height: 250px !important;
}


.concret2
{
    height: 250px !important;
}

.concret3
{
    height: 250px !important;
}


.concret4
{
    height: 250px !important;
}


.concret5
{
    height: 250px !important;
}

.py-5 {
    padding-top: 1rem !important;
    padding-bottom: 3rem !important;
}

    
}
.dropdown-menu {
    display: none; /* Hide dropdown initially */
}
.dropdown.show .dropdown-menu {
    display: block; /* Show when dropdown is open */
}
.iconwhite
{
    color: white;
}
.tcolor
{
    color: rgb(68, 68, 68);
}