* {

    margin: 0px;

    padding: 0px;

    box-sizing: border-box;

    font-family: "Montserrat", sans-serif;

}

  .top-nav{
        background: #008dd2;
    color: white;
    ul{
        display: flex;
        gap: 20px;
               margin: 0px;
         padding: 5px 0px;
         flex-wrap: wrap;
    }
    ul li{
        list-style: none;


    }
    ul li a{
        text-decoration: none;
         color: white;
  
    }
    }

.nav-ul {

    padding: 20px 0px;

}



.nav-ul ul {

    padding-left: 0px;

    margin-bottom: 0px;

    display: flex;

    gap: 30px;

    justify-content: end;

}



.nav-ul ul li {

    list-style: none;

}



.nav-ul ul li a {

    text-decoration: none;

    color: black;

}



nav {

    padding: 20px 0px;

    border-bottom: 4px solid #b4b4b4;

}



.row-nav {

    align-items: center;

    padding: 0px 90px;

}



.hero-s {

    position: relative;

    padding-top: 50px;

    padding-bottom: 0px;

    background-image: linear-gradient(120deg, #ebebeb 0%, #c9e6f468 100%);

}



.hero-s .container {

    z-index: 1;

    position: relative;

}



.hero-s-c h1 {

    text-align: center;

    font-size: 46px;

    line-height: 1.5em;

    text-align: center;

    font-weight: 400;

    letter-spacing: 1px;

}



.hero-s-c p {

    text-align: center;

    font-size: 19px;

}



.hero-s .row {

    justify-content: center;

}



.hero-s-c img {

    width: 100%;

    object-fit: contain;

    display: block;

    margin: auto;

    margin-top: 50px;

}



.vision {

    /* padding: 50px 0px; */

    background-color: black;

    color: white;

}



.vision .container {

    position: relative;

    z-index: 1;

}



.vision .row {

    /* justify-content: center; */

}



.absoute-image {

    position: absolute;

    bottom: -226px;

    width: 100%;

    left: 0px;

    right: 0px;

}



.vision-cola {

    border-left: 2px solid white;

    padding-left: 50px;

    padding-bottom: 100px;

    padding-top: 20px;

}



.vision-cola h4 {

    margin-bottom: 50px;

}



.vision-cola p {

    padding-bottom: 20px;

}



section.why {

    padding: 50px 0px;

    background-image: url(../img/backg.jpg);

    background-position: center;

    background-attachment: fixed;

    background-size: cover;

    width: 100%;

}



.vision {

    padding-bottom: 50px;

}



.div-why {

    background-color: black;

    width: 490px;

    color: white;

    padding: 40px;

    border-radius: 20px;

    padding-top: 60px;

    padding-right: 80px;

}



.div-why-d {

    border-left: 2px solid white;

    padding-left: 45px;

}



.div-why-d h4 {

    font-size: 17px;

    font-weight: 300;

    margin-bottom: 50px;

}



.div-why-d h2 {

    font-weight: 400;

    line-height: 1.8em;

    font-size: 24px;

    margin-bottom: 100px;

}



.btn-readmore {

    color: white;

    border: 1px solid white;

    padding: 8px 16px;

    text-decoration: none;

    margin-top: 20px;

    display: inline-block;

}



.client {

    padding: 60px 0px;

    background-color: black;

    color: white;

}



.client-f {

    border-left: 2px solid white;

    padding-left: 50px;

    padding-right: 50px;

}



.client-f h2 {

    font-weight: 300;

    margin-bottom: 40px;

}



.client-f p {

    line-height: 29px;

}



.heavy {

    text-align: center;

    font-weight: 400;

    line-height: 30px;

}



.client .row {

    justify-content: space-between;

}



.heavy-col {

    align-content: flex-end;

}



.unique {

    padding: 100px 0px;



}



.unique .row {

    justify-content: space-between;

    align-items: center;

}



.unique-col h2 {

    font-size: 20px;

    font-weight: bold;

    letter-spacing: 2px;

}



.tel {

    margin-top: 40px;

    margin-bottom: 30px;

}



.email {

    margin-bottom: 30px;

}



.email-send {

    display: flex;

}



.email-send button {

    background-color: black;

    color: white;

    border: none;

    padding: 4px 10px;

    border-radius: 2px;

}



.email-send input {

    padding: 5px 10px;

    border-radius: 5px 0px 0px 5px;

}



.footer-p p a {

    text-decoration: none;

    color: black;

}



.footer-link ul {

    padding-left: 0px;

    display: flex;

    justify-content: end;

    gap: 50px;

}



.footer-link ul li {

    list-style: none;

}



.footer-link ul li a {

    text-decoration: none;

    color: black;

    font-size: 20px;

}



.close-nav {

    display: none;

}



.menu-open {

    display: none;

}



.about {

    padding-top: 60px;



    .row {

        justify-content: center;

    }



    h1 {

        font-size: 80px;

        font-weight: 300;

        margin-bottom: 40px;

        text-align: center;

    }



    p {

        text-align: center;

        margin-bottom: 40px;

    }

}









.history-section {

    font-family: "Montserrat", sans-serif;

    margin: 0;





    background-color: #000000;



    color: #e0e0e0;



    line-height: 1.6;











    .container {

        max-width: 900px;

        margin: 0 auto;

        padding: 75px 20px;

    }



    h1 {

        font-size: 2.5em;

        color: #ffffff;

        text-align: center;

        margin-bottom: 30px;

        border-bottom: 2px solid #4a90e2;

        padding-bottom: 10px;

    }



    p {

        font-size: 1.1em;

        margin-bottom: 20px;

        text-align: justify;

    }



    .highlight {

        color: #4a90e2;

        font-weight: bold;

    }



    .section {

        background-color: #252525;

        padding: 20px;

        border-radius: 8px;

        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);

        margin-bottom: 20px;

    }

}



.product-card{

    padding: 10px;

        background: #cf000012;

    border-radius: 10px;

    .product-card-img img{

        height: 250px;

        width: 100%;

        object-fit: cover;

        border-radius: 10px;

    }

    .product-c{

        padding: 20px;

        /* padding-top: 15px; */

    }

    .product-c a{

        margin-top: 15px;

        color: black;

        text-decoration: none;

        padding: 10px 20px ;

        border: 1px solid black;

        display: inline-block;

    }

    .product-c h4{

        margin-bottom: 15px;

        font-size: 20px;

    }

}

.row-product{

    row-gap: 20px;

}

.product-detail{

    h1{

        font-size: 40px;

        font-weight: bold;

        margin-top: 25px;

    }

    h1 , p{

    text-align: start;

    }

}

.advantage-div{

    p{

        margin-bottom: 10px;

    }

    ul{

        padding-left: 0px;

    }

    ul li{

        list-style: none;

        display: flex;

        gap: 8px;

    }

}

.table-p1{

    margin-top: 40px;

}

.owl-p {

    img{

height: 600px;

object-fit: contain;

}

    .owl-nav{

        display: none;

    }

}

.c-logo img{

    width: 200px;

    object-fit: contain;

    height: 100px;

}

.client-logo{

    margin-top: 50px;

    display: flex;

    flex-wrap: wrap;

    gap: 32px;

    row-gap: 40px;

    justify-content: center;

}

@media (max-width: 600px) {

    .history-section {

        h1 {

            font-size: 2em;

        }



        p {

            font-size: 1em;

        }



        .container {

            padding: 20px 10px;

        }

    }

}









 #carouselExampleCaptions .carousel-item img{
            height: 700px;
            width: 100%;
            object-fit: cover;
            object-position: center;
        }
         #carouselExampleCaptions .carousel-item h5{
          font-size: 50px;
    font-weight: bold;
    background: #000000;
    background: linear-gradient(90deg, rgb(0 0 0 / 37%) 0%, rgba(171, 166, 166, 1) 52%, rgb(0 0 0 / 37%) 100%);
    width: fit-content;
    margin: auto;
    padding: 26px 34px;
         }
         .dropdown-cm{
            position: relative;
         }
         .dropdown-c{
   position: absolute;
    top: 27px;
   box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    padding-left: 0px;
    padding: 9px 15px !important;
    z-index: 11;
    flex-direction: column;
    gap: 15px !important;
    background-color: white;
    width: max-content;
    display: none!important;
         }
          .dropdown-c li a{
             padding: 6px 0px;
    display: block;
          }
         .dropdown-c.active{
            display: block!important;
         }

  @media only screen and (max-width: 768px) {
        .div-why{
            width: 100%;
        }
        .product-detail {
    h1 {
        font-size: 30px;
        font-weight: bold;
        margin-top: 25px;
    }
}
.about {
    h1 {
        font-size: 32px;
    }
}
    }

@media only screen and (max-width: 575px) {

    .menu-open {

        display: block;

    }



    .close-nav {

        display: block;

        margin-left: auto;

        position: relative;

        right: 14px;

        font-size: 24px;

    }



    .close-nav i {

        cursor: pointer;

    }



    .menu-open i {

        cursor: pointer;

    }



    .menu-open {

        font-size: 30px;

        margin: auto;

        text-align: center;

    }



    .col-md-8.nav-ul {

        padding: 0px;

    }



    .nav-ul ul {

        position: fixed;

        width: 100%;

        background: white;

        height: 100%;

        z-index: 111;

        /* left: 0px; */

        transition: 0.5s all;

        top: 0px;

        flex-direction: column;

        justify-content: start;

        align-items: center;

        padding-top: 23px;

        right: -100%;

    }



    .nav-ul ul.active {

        right: 0%;

    }



    .hero-s-c h1 {

        font-size: 30px;

    }



    .heavy {

        margin-top: 30px;

    }
     .dropdown-c{
        position: inherit!important;
     }

     .nav-ul ul li{
        text-align: center;
     }



}