/* ------  Starting hrader responsive code------------*/


@media only screen and (max-width: 900px){
     
    /*  ...... starting header ........ */


    header{
        padding: 0px;
    }
    header {
        padding-top: 0px !important;
    }

    #toggle{
        display: block;
    }
    .menu ul {
        
        margin-left: 0px;
        margin-top: 40px;
        background-color: #ffffff;
    }
    .menu.show {
        background-color: #ffffff;
    }

   

    .menu{
        position: fixed;
        background-color: #92278F;
        top: 108px ;
        right: -100%;
        width: 100%;
        height: 100%;
    }
    .call{
        display: block;
    }
    .menu ul {
        flex-direction: column;
    }
    .call1{
        display: block;
        width: 200px;
    }
    .bh{
        display: none;
    }
    .h-logo img {
        width: 70px;
    }
    .join_us-button{
        display: none;
    }
}


@media (max-width: 991.98px){
    
    /*Header start*/
    
    
    .header {
        padding-top: 10px;
    }
    .social-detail {
        display: inherit;
        color: #62a1ae !important;
        font-weight: 500;
        font-size: 16px;
        text-align: left;
        padding: 15px;
        display: grid;
    }
    
    .social-detail span {
        color: #202020 !important;
        font-weight: 500;
        font-size: 16px;
        text-align: left;
    } 
    .social-detail a {

        color: #202020 !important;
    font-weight: 500;
    font-size: 16px;
        display: block;
        padding: 10px 0px !important;
    }
    .social-detail .btn2  {
        color: #ffffff !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        padding: 10px 30px !important;
    }
    .social-detail .btn2:hover  {
        color: #00ff00 !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        padding: 10px 30px !important;
    }
    .social-detail a:hover {
        font-size: 13px !important;
        font-weight: 500 !important;
        color: #8a8a8a;
        display: block;
        padding: 10px 0px !important;
    }
    
    .social-detail .social_icons a {
        display: inline-block;
        margin-right: 10px;
    } 
    
    .social-detail i {
        color: #ff4328 !important;
        font-weight: 500;
        font-size: 22px;
        text-align: left;
    }
    
    
    .top-header {
        display: none;
    }   
    .get-in-touch{
        display: none;
    }
    .main-header-section {
        width: 100%;
        height: auto;
        padding: 16px 16px !important;
        position: relative;
        top: 0;
        background: transparent;
    }  
    .main-header-section .container-fluid{
        padding-left: 0 !important;
        padding-right: 0 !important;
    }    
    .main-header{
        padding: 0 0;
        justify-content: space-between;
        border-bottom: none;
    }   
        
        
    .get-in-touch-button {
        display: none;
    }    
    .header .social_con {
        display: none;
    }
    .mob-logobox {
        display: block;
    }    
        
    .logobox {
        width: 100%;
    }    
    .navbar-brand {
        max-width: 150px;
        padding: 0 !important;
    }
    .join_us-button{
        display: none;
    }
        
    .cartbox_container {
        display: none;
    }

}

@media (min-width: 1200px){
    .social-detail {
        display: none;
    }
    
}



/* ------ ending hrader responsive code ------------*/

/* ------------------- starting section 1 -------------------*/



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

    
    .sec1{
        padding-top: 70px;
        padding-bottom: 50px;
    }
    .sec1 h2{
        font-size: 28px;
        font-family: "Open Sans", sans-serif;
        font-weight: 800;
        color: #fff;
    }
    .sec1 p {
        color: #fff;
        font-family: "Poppins", sans-serif;
        font-weight: 400;
        padding-bottom: 14px;
        padding-top: 9px;
        line-height: 22px;
        font-size: 14px;
    }
    .bnrbtn1 {
        padding: 10px 28px;
    }
    .bnrbtn2{
        padding: 10px 28px;
    }
}





/*  ---------------------- starting section 2 responsive ---------------------------------   */


@media only screen and (max-width: 440px){
    .sec2 {
        padding: 40px 10px !important;
    }
    .container2-2 {
        padding-left: 0px;
    }
    .container2-2 h4 {
        padding-top: 20px;
    }
    .container2-3 img {
        margin-top: 0px;
        width: 100%;
        margin-left: 0px;
    }
}


@media only screen and (max-width: 900px){
    .sec2 {
        padding: 50px 20px;
    }
    .container2-2 p {
        
        width: 100%;
    }
    .container2-1 h3 {
        font-size: 20px;
    }
    .container2-1 h2 {
        font-size: 18px;
    }
    .container2-1 p {
       font-size: 14px;
       line-height: 22px;
    }
    .container2-2 h4 {
        font-size: 18px;
    }
    .container2-2 h2 {
        font-size: 28px;
    }
    .container2-2 p {
        font-size: 14px;
        line-height: 22px;
    }
    .container2-3 img {
        margin-top: 0px;
        width: 100%;
        margin-left: 0px;
        display: none;
    }
}




/* ---------------------- starting our products or section 5 responsive--------------------------*/


@media only screen and (max-width: 440px) {
    .sec5{
        padding: 15px;
    }
    .sec5 h2{
        font-size: 30px !important;
    }
    .sec5pc{
        margin-bottom: 30px;
    }

}

@media only screen and (max-width: 900px){
    .sec5 h2{
        font-size: 38px;
    }
    .sec5 p {
        width: 90%;
    }
    .sec5box h3 {
        font-size: 20px;
        padding: 15px 5px;
    }
}



/*  -------------------------- starting section 6 blk section responsive----------------------  */




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

}


@media only screen and (max-width: 900px){
    .sec6{
        padding: 40px 10px;
       }
       .sec6 p{
        width: 100%;
       }
       .sec6 h2{
        font-size: 26px;
        padding-top: 40px;
        padding-bottom: 10px;
       }
    
       .sec6conbox h4{
        font-size: 14px;
       }
       .sec6conbox {
        margin: 11px;
        padding: 15px;
       }
       
}





/* ------------------------- startion section 7 or counter section--------------------------------  */




@media only screen and (max-width: 430px){
    .sec7rap h3 {
        font-size: 40px !important;
    }
    
    .sec7rap h5 {
        font-size: 18px;
        padding-bottom: 30px;
    }
    .sec7rap{
        padding: 40px 30px !important;
    }
}

@media only screen and (max-width: 900px){
    .sec7rap h3 {
        font-size: 40px !important;
    }
    
    .sec7rap h5 {
        font-size: 18px;
    }
    .sec7rap{
        padding: 40px 30px !important;
        margin-left: 30px;
        margin-right: 30px;
        margin-top: -4px;
    }
}






/* ------------------------- startion section 8 or counter section--------------------------------  */


@media only screen and (max-width: 430px){
    .sec8 {
       padding-top: 770px !important;
    }
}
@media only screen and (max-width: 900px){
    .sec8 {
        padding-top: 340px;
    }
    .sec8 h2 {
        font-size: 28px;
    }
}


/* ------------------------- startion section 9 or counter section--------------------------------  */




@media only screen and (max-width: 900px){
    
    .sec9 {
        padding: 15px;
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }
    .sec9 p {
        width: 100%;
        font-size: 14px;
        line-height: 22px;
    }
    .sec9 h2 {
        font-size: 28px;
    }
    .dash3 {
        height: 5px;
        background-color: #CB4253;
        width: 130px !important;
        margin-bottom: 27px;
    }
    .form-control {
        height: 56px;
        margin-bottom: 17px;
        font-size: 14px !important;
    }
    .b7 {
        font-size: 13px;
        padding: 13px 31px;
    }
    .sec9c{
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
    form{
        padding-left: 30px !important;
    }
}






/*              starting footer               */

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

@media only screen and (max-width: 900px){
    .fuc {
        padding: 30px;
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    .sec9blb {
        padding: 0px !important;
    }
    .sec9c h4 {
        font-size: 17px;
    }
    .sec9c h5 {
        font-size: 14px;
    }
    .fuc p {
        font-size: 15px;
        font-weight: 400;
        color: #ffffff;
        width: 100%;
    }
}





/*---------------------------------------------------------------End Home Page------------------------------------------------------------*/

/* --------------------------------------starting About Us Page----------------------------------------------*/





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

    .bg-banner-image {
        padding: 200px 0 200px !important;
    }
    .about-content h1 {
        font-size: 36px !important;
        
    }



    .about-content {
        top: 100px;
    }   
    .about_docbox {
        width: 100%;
        height: auto;
        margin-top: 0px;
        margin-left: 0px;
    }   
    
    .csec1 {
        padding: 200px 0px 200px;
    }
}



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

    .bg-banner-image {
        padding: 200px 0 200px !important;
    }
    .about-content h1 {
        font-size: 40px !important;
    }
    .content-heading2 {
        margin-bottom: 0px !important;
    }
    .section1 .left-contentbox-details {
        padding-top: 15px !important;
    }
    .section1 {
        padding-top: 30px !important;
        padding-bottom: 30px !important;
    }



    .aboutpage_section1{
        padding-bottom: 50px;
    }
    .about-content h1 {
        font-size: 22px;
        line-height: 30px;
    }
    .about-content h1 {
        font-size: 22px;
        line-height: 30px;
    }
    .aboutpage_section1{
        padding-top: 50px;
    }    
    .aboutpage_section2 {
        padding-top: 50px;
        padding-bottom: 30px;
    }       
}






@media (min-width: 576px) and (max-width: 767.98px){
    .about_docbox {
        width: 100%;
        height: auto;
        padding: 30px 20px;
        margin-top: 0px;
        margin-left: 0px;
    }  
}

 


@media (min-width: 992px) and (max-width: 1199.98px){
    .about_docbox {
        margin-top: -60px;
        margin-left: 25px;
    } 
}




/*---------------------------------------------------------------End About Us Page------------------------------------------------------------*/



/* ----------------------------------------------- starting product category section --------------------------------------------*/




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


@media only screen and (max-width: 900px){
    .pd {
        padding-left: 10px !important;
    }
    .pccont {
        padding-left: 10px !important;
    }
    .content-heading2 {
        color: #024478;
        font-size:25px;
        margin-top: 20px;
        line-height: 35px;
        margin-bottom: 15px !important;
    }
    .product-code {
       
        padding-bottom: 0px;
    }
    .our-category-section {
        padding: 10px;
        margin-top: 30px;
    }
    .heading-1 {
        font-size: 28px;
        padding-top: 40px;
        padding-bottom: 10px;
    }

    .button-group{
        display: flex;
        flex-wrap: wrap;
    }
    .button-group a {
        margin-bottom: 20px;
    }
    
}


/*-------------------------------------------------starting product detail page-------------------------------------------------- */



@media only screen and (max-width: 900px){
    .ppsec1rap h1 {
        color: #024478;
            font-size:33px;
            margin-top: 20px;
            line-height: 42px;
            margin-bottom: 15px !important;
    }
}