* {
    margin: 0;
    padding: 0;
    outline: none;
    box-sizing: border-box;
    font-family: 'Inter', sans-serif;
}

body {
    background: #f2f2f2;
}

nav {
    background: #1D1D7D;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    height: 120px;
    padding: 0 100px;
}

.searchplaceholder::placeholder{
    font-size: 16px;
}


    nav .logo {
        color: #fff;
        font-size: 30px;
        font-weight: 600;
        letter-spacing: -1px;
    }

    nav .nav-items {
        display: flex;
        flex: 1;
        padding: 0 0 0 40px;
        /* border:2px red solid; */
        display: flex;
        justify-content: center;
    }

        nav .nav-items li {
            list-style: none;
            padding: 0 15px;
            /* margin:0 3px; */
            /* border:2px red solid; */
        }

            nav .nav-items li a {
                color: #fff;
                font-size: 18px;
                font-weight: 500;
                text-decoration: none;
            }

                nav .nav-items li a:hover {
                    color: white;
                }

    nav form {
        display: flex;
        height: 40px;
        padding: 2px;
        background: white;
        min-width: 18% !important;
        border-radius: 2px;
        border: 1px solid rgba(155,155,155,0.2);
    }

        nav form .search-data {
            width: 100%;
            height: 100%;
            padding: 0 10px;
            color: black;
            font-size: 17px;
            border: none;
            font-weight: 500;
            background: none;
        }

        nav form button {
            padding: 0 15px;
            color: white;
            font-size: 17px;
            background: #1D1D7D;
            border: none;
            border-radius: 2px;
            cursor: pointer;
        }

            nav form button:hover {
                background: #1d1d7def;
            }

    nav .menu-icon,
    nav .cancel-icon,
    nav .search-icon {
        width: 40px;
        text-align: center;
        margin: 0 50px;
        font-size: 18px;
        color: #fff;
        cursor: pointer;
        display: none;
    }

        nav .menu-icon span,
        nav .cancel-icon,
        nav .search-icon {
            display: none;
        }

@media (max-width: 1253px) {
    nav {
        padding: 0 50px;
    }
}

@media (max-width: 1154px) {
    nav {
        padding: 0px;
    }

        nav .logo {
            flex: 2;
            text-align: center;
        }

        nav .nav-items {
            position: fixed;
            z-index: 99;
            top: 120px;
            width: 100%;
            left: -100%;
            height: 100%;
            padding: 10px 50px 0 50px;
            text-align: center;
            background: #3838B4;
            display: inline-block;
            transition: left 0.3s ease;
        }

            nav .nav-items.active {
                left: 0px;
            }

            nav .nav-items li {
                line-height: 40px;
                margin: 30px 0;
            }

                nav .nav-items li a {
                    font-size: 20px;
                }

        nav form {
            position: absolute;
            top: 120px;
            right: 50px;
            opacity: 0;
            pointer-events: none;
            transition: top 0.3s ease, opacity 0.1s ease;
        }

            nav form.active {
                top: 75px;
                opacity: 1;
                pointer-events: auto;
            }

            nav form:before {
                position: absolute;
                content: "";
                top: -13px;
                right: 0px;
                width: 0;
                height: 0;
                z-index: -1;
                border: 10px solid transparent;
                border-bottom-color: #1e232b;
                margin: -20px 0 0;
            }

            nav form:after {
                position: absolute;
                content: '';
                height: 40px;
                /* padding: 2px; */
                /* background: #1e232b; */
                border-radius: 2px;
                min-width: calc(100%);
                z-index: -2;
                left: 50%;
                top: 50%;
                transform: translate(-50%, -50%);
            }

        nav .menu-icon {
            display: block;
        }

            nav .search-icon,
            nav .menu-icon span {
                display: block;
            }

                nav .menu-icon span.hide,
                nav .search-icon.hide {
                    display: none;
                }

        nav .cancel-icon.show {
            display: block;
        }
}

.content {
    position: absolute;
    top: 50%;
    left: 50%;
    text-align: center;
    transform: translate(-50%, -50%);
}

    .content header {
        font-size: 30px;
        font-weight: 700;
    }

    .content .text {
        font-size: 30px;
        font-weight: 700;
    }

.space {
    margin: 10px 0;
}

nav .logo.space {
    color: red;
    padding: 0 5px 0 0;
}

@media (max-width: 980px) {
    nav .menu-icon,
    nav .cancel-icon,
    nav .search-icon {
        margin: 0 20px;
    }

    nav form {
        right: 30px;
    }
}

@media (max-width: 768px) {
    nav form.active {
        top: 120px;
        opacity: 1;
        pointer-events: auto;
    }
}

@media (max-width: 350px) {
    nav .menu-icon,
    nav .cancel-icon,
    nav .search-icon {
        margin: 0 10px;
        font-size: 16px;
    }
}

.content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

    .content header {
        font-size: 30px;
        font-weight: 700;
    }

    .content .text {
        font-size: 30px;
        font-weight: 700;
    }

    .content .space {
        margin: 10px 0;
    }










    body {
    }
    
    h2 {
        color: #1D1D7D;
        font-weight: 800;
        font-size: 38px;
    }
    
    #homebody{
        background:url('../images/home/homebg.png');
        background-repeat:no-repeat;
        background-size:cover;
    }
    
    .knowus{
        margin-top:40px;
        text-align:center;
        display:flex;
        flex-wrap:wrap;
        justify-content:space-evenly;
        /*gap:3%;*/
    }
    
    .know{
        width:250px;
        height:300px;
        /*border:2px red solid;*/
    }
    
    .products {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 5%;
        margin-top:40px;
    }
    
    .product{
        width:320px;
        height:350px;
        /*border:2px red solid;*/
        background-color:white;
        display:flex;
        justify-content:center;
    }
    
    .productbox {
        height: 80px;
        width: 290px;
        margin: auto;
        background-color: #1D1D7D;
        display: flex;
        justify-content: center;
        align-items: center;
        transform: translateY(-30px);
        font-size: 22px;
        font-weight: 550;
        color: white;
        border-radius: 12px;
        box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.4);
    }
    
    .reviews {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items:center;
        gap:3%;
        width:90%;
        margin:auto;
        
        
    }
    
    .review {
        padding: 0px 35px 0px 35px;
        width: 420px;
        height: 270px;
        /*border: 2px red solid;*/
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
        background-color:white;
        margin-top:30px;
        margin-bottom:5px;
    }
    
    
    
    @media only screen and (max-width: 480px){
        .review {
            margin:auto;
            width:85%;
            height:auto;
    margin-top:30px;
    padding-bottom:35px;
        }
    }
    
    
    .footer-section {
        padding: 50px 0 20px;
        background: #1D1D7D;
    }
    
    .footer-about a {
        display: inline-block;
        margin: 0 0 20px;
        width: 120px;
    }
    p{
        color:white;
    }
    .footer-about img{
        width:200px;
    }
    
    .footer-links h4 {
        font-weight: 700;
        color: white;
        font-size: 22px;
        letter-spacing: 0.7px;
        padding: 0 0 10px;
        margin: 0 0 15px;
        position: relative
    }
    
    .footer-links ul{
        padding:0;
    }
    
    .footer-links ul li {
        /*margin: 0 0 5px;*/
        list-style: none;
        margin:0px 0px 10px;
        color:white;
    }
    
        .footer-links ul li a {
            color: white;
            font-size: 15px;
            text-decoration: none;
        }
    
            .footer-links ul li a:hover {
                color: #EDEADE;
            }
    
    /*.footer-links h4:after {
        content: "";
        height: 3px;
        width: 30px;
        background: #D26626;
        position: absolute;
        left: 0;
        bottom: 0px;
        border-radius: 10px;
    }*/
    
    .copyright-section {
        border-top: 1px solid #c5c5c5;
        padding: 30px 0 10px
    }
    
    .footer-bottom-menus ul li a {
        font-weight: 500;
        font-size: 15px;
        text-decoration: none;
        color: #707070;
    }
    
    .footer-bottom-menus ul li.list-inline-item {
        padding: 0 40px 0 0;
        margin: 0;
        position: relative;
    }
    
        .footer-bottom-menus ul li.list-inline-item:last-child {
            padding: 0
        }
    
        .footer-bottom-menus ul li.list-inline-item:after {
            content: "";
            position: absolute;
            width: 6px;
            height: 6px;
            background: #333;
            border-radius: 10px;
            top: 9px;
            right: 16px;
        }
    
        .footer-bottom-menus ul li.list-inline-item:last-child:after {
            display: none;
        }
    
    
    
    
    
    
    @media only screen and (max-width:991px) {
        .copyrighttext {
            margin:auto;
        }
    }
    
    
        @media only screen and (max-width:575px) {
            .footer-links ul, .footer-links h4 {
                width: 75% !important;
                margin: auto !important;
                text-align: center !important;
            }
    
                .footer-links ul li {
                    display: flex;
                    justify-content: center;
                }
                .div2gapp{
                    margin-left:0%!important;
                }
                .div1gapp{
                    padding-left:0%!important;
                }
    
            #mailspan{
                display:none!important;
            }
        }
    
        .div1gapp {
            padding-left: 10%;
        }
    
        .div2gapp {
            margin-left: 15%;
        }





        body {
            padding:0;
            margin:0;
        }
        
        
        h2 {
            color: #1D1D7D;
            font-weight: 800;
            font-size: 38px;
            text-align:center;
        }
        
        
        #productslider {
            height: 400px;
            /*border: 2px red solid;*/
            background: url('../images/product/productslider.jpg');
            background-repeat:no-repeat;
            background-size:cover;
            display:flex;
            flex-direction:column;
            justify-content:center;
            align-items:center;
        }
        
        
        #productbody {
            background: url('../images/product/productbg.png');
            background-repeat: no-repeat;
            background-size: cover;
        }
        
        .proddiv {
            display: flex;
            flex-wrap: wrap;
            justify-content:center;
            gap:2%;
        }
        
        .imgdiv {
            width: 40%;
            /*border: 2px red solid;*/
        }
        
        .descriptiondiv {
            width: 40%;
            /*border: 2px red solid;*/
            font-weight: 600;
            color:black;
            display:flex;
            justify-content:center;
            flex-direction:column;
        }
        .uldiv{
            width:110px;
        }
        
        @media only screen and (max-width:1024px) {
            .imgdiv {
                width: 50%;
                margin-bottom: 20px;
            }
            .uldiv {
                margin:auto;
            }
                .descriptiondiv {
                width: 75%;
                text-align: center;
            }
            ul{
                text-align:left;
            }
        }
        
        @media only screen and (max-width:768px) {
            .imgdiv {
                width: 75%;
                margin-bottom: 20px;
            }
            .descriptiondiv {
                width: 85%;
                text-align: center;
            }
            #productslider p {
                width: 80% !important;
            }
        
        }
        
        
        







        h2 {
            color: #1D1D7D;
            font-weight: 800;
            font-size: 38px;
            text-align: center;
        }
        
        
        @media only screen and (max-width:570px) {
            #emailsubmitdiv {
                width: 20% !important;
            }
        
            #enteremaildiv {
                width: 70% !important;
            }
        }
        
        
        ::placeholder {
            font-size: 1.32rem;
        }
        






        body {
            padding: 0;
            margin: 0;
        }
        
        
        h2 {
            color: #1D1D7D;
            font-weight: 800;
            font-size: 38px;
            text-align: center;
        }
        
        #aboutslider {
            height: 400px;
            /*border: 2px red solid;*/
            background: url('../images/about/aboutslider.jpg');
            background-repeat: no-repeat;
            background-size: cover;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }
        
        #aboutbody {
            background: url('../images/product/productbg.png');
            background-repeat: no-repeat;
            background-size: cover;
            /*display:flex;*/
            /*flex-wrap:wrap;*/
        }
        
        
        #body1div{
            display:flex;
            flex-wrap:wrap;
            justify-content:center;
            gap:2%;
        }
        #intro{
            width:50%;
            display:flex;
            justify-content:center;
            flex-direction:column;
        }
        #pic1 {
            width: 30%;
        }
        
        @media only screen and (max-width:1024px){
            #pic1 {
                width: 40%;
            }
        }
        
        @media only screen and (max-width:866px) {
        
            #intro {
                text-align:center!important;
                width:80%;
            }
            #intro h2 {
                text-align: center !important;
            }
                #pic1 {
                width: 50%;
            }
        }
        
        @media only screen and (max-width:500px) {
        
            #aboutslider p{
                width:75%!important;
            }
        
            #intro {
                text-align: center !important;
                width: 80%;
            }
        
            #intro h2 {
                font-size:32px;
            }
        
            #pic1 {
                width: 70%;
            }
            #textdiv {
                width:85%!important;
                
            }
            }
        @media only screen and (max-width:338px){
            #textdiv {
                width: 95% !important;
            }
        }
        
        #body2div {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            background-color: #1D1D7D;
            gap: 10px;
            padding:15px 0px 15px 0px;
        }
        
        #paradiv {
            width: 50%;
            /*border: 2px red solid;*/
            padding-top:25px;
            padding-bottom:25px;
            display:flex;
            flex-direction:column;
            justify-content:center;
        }
        
        #pic2 {
            width: 30%;
            /*border: 2px red solid;*/
            padding-top:30px;
            padding-bottom:30px;
        }
        
        @media only screen and (max-width:1220px) {
            #pic2 {
                width: 37%;
            }
            }
        
        @media only screen and (max-width:1100px) {
            #pic2 {
                width: 40%;
            }
        }
        @media only screen and (max-width:980px) {
            #pic2 {
                width: 48%;
            }
        }
        @media only screen and (max-width:890px) {
            #paradiv {
                width:70%;
                padding-bottom:10px;
            }
                #pic2 {
                width: 50%;
                padding-top:0px;
            }
        }
        
        @media only screen and (max-width:650px) {
            #paradiv {
                width: 80%;
            }
        
            #pic2 {
                width: 65%;
            }
        }
        
        @media only screen and (max-width:400px) {
        
        
            #pic2 {
                width: 75%;
            }
        }
        
        
        
        
        
        
        
            #body3div {
                display: flex;
                flex-wrap: wrap;
                justify-content: center;
                /*border: 2px red solid;*/
            }
        
            #textdiv {
                width: 70%;
                /*border:2px red solid;*/
            }
            /*#textdiv h2{
            text-align:left;
        }*/
        
            /*#pic3 {
            width: 30%;
            border: 2px red solid;
              padding-top:35px;
        
        }*/
        
        body {
            padding: 0;
            margin: 0;
        }
        
        
        h2 {
            color: #1D1D7D;
            font-weight: 800;
            font-size: 38px;
            text-align: center;
        }
        
        #contactslider {
            height: 400px;
            /*border: 2px red solid;*/
            background: url('../images/contact/contactslider.jpg');
            background-repeat: no-repeat;
            background-size: cover;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }
        
        #contactbody {
            background: url('../images/product/productbg.png');
            background-repeat: no-repeat;
            background-size: cover;
            /*display:flex;*/
            /*flex-wrap:wrap;*/
        }
        
.contactplaceholdersize::placeholder{
    font-size:16px;
}

.textboxplaceholder::placeholder{
    font-weight: 450;
}


        #maincontactdiv{
            display:flex;
            flex-wrap:wrap;
            justify-content:center;
            gap:2%;
        }
        
        #texttdiv{
            padding-top:70px;
            width:40%;
            /*border:2px red solid;*/
        }
        
        #formdiv {
            width: 40%;
            /*border:2px red solid;*/
            background-color: white;
            box-shadow: 0 0 8px rgba(0, 0, 0, 0.25);
            border-radius:10px;
        }
        
        .inputtag {
            border: 0.3px #828282 solid;
            margin: 10px;
            margin-left: 0px;
            margin-right: 0px;
            padding: 10px;
            background-color: #F9F9F9;
        }
        
        @media only screen and (max-width:930px) {
            #texttdiv {
                padding-top: 0px;
                width: 60% !important;
                margin-bottom: 50px;
            }
        
            #formdiv {
                width:60% !important;
            }
        }
        @media only screen and (max-width:768px) {
            #texttdiv {
                width: 80% !important;
                margin-bottom: 50px;
            }
        
            #formdiv {
                width: 80% !important;
            }
        }
        @media only screen and (max-width:500px) {
            #texttdiv {
                width: 90% !important;
                margin-bottom: 50px;
            }
        
            #formdiv {
                width: 90% !important;
            }
        }
        
        @media only screen and (max-width:550px) {
        
                h2{
                    font-size: 30px !important;
                }
        }  

        @media only screen and (max-width:450px) {
        
            h2{
                font-size:26px!important;
            }
    }  

    @media only screen and (max-width:370px) {
        
        h2{
            font-size: 24px!important;
        }
}  

        @media only screen and (max-width:415px) {
        
            #smallscreenmaildiv {
                display: block !important;
            }
        
            #bigscreenmaildiv {
                display: none !important;
            }
        }