.burger{ 
    display: none;
}
.badge {
    border-radius: 9px;
    position: absolute;
    background: #df00ff;
    color: white;
    top:9px;
    right: 9px;
    font-size: 11px;
    padding: 3px 4px;
  }

@media screen and (max-width: 1100px) {
    .labels {
        text-align: center;
        width: 98%;
        margin: 23px 0px;
        border-radius: 33px;
        background: #c1c1c1;
        color: white;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        box-shadow: 0px 0px 11px #654d67;
    }
    .ordernow{
        text-align: center;
        width: 98%;
        padding: 2px;
        border-radius: 35px;
        background: #e835e9;
        color: white;
        font-size: 23px;
        display: flex;
        justify-content: center;
        align-items: center;
        box-shadow: 0px 0px 11px #654d67;
    }
    .text-small {
        font-size: 14px;
    }
    .rightNavinp {
        padding: 3px 24px;
        width: 30%;
        text-align: right;
        /* background-color: blue; */
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .text-big {
        font-size: 23px;
        margin-bottom: 7px;
    }

    .paras {
        padding: 0;
    }
    .section {
        height: 326px;
        display: flex;
        align-items: center;
        justify-content: center;
        max-width: 100%;
        margin: auto;
        font-family: 'Ubuntu', sans-serif;
        font-family: 'Bree Serif', serif;
    }
    .productDescription {
        width: 100%;
        margin: 9px 0px;
        padding: 0px 24px;
        font-size: 23px;
        font-family: 'Roboto Slab';
    }
}

.burger {
    position: absolute;
    cursor: pointer;
    /* right: 93%; */
    left: 3%;
    top: 6px;
}

.line {
    width: 33px;
    background-color: white;
    height: 3px;
    margin: 5px 3px;
}
.golden-s {
    color:#80ccea;
    font-family: 'FontAwesome';
    width: 80px;
    font-size: 29px;
}
@media only screen and (max-width:1070px) {
    .productdescriptionimage{
        display: flex;
        justify-self: center;
        align-items: center;
        flex-direction: column;
      
      }
      .pdi-image{
        width: 92%;
      }
      
    .toplogo{
        
        visibility: hidden;
        opacity: 0;
        display: none;
        
    }
  
        .toplogohide {
            display: block; 
            visibility: visible;
            opacity: 1;
            color: #cec5ca;
            text-shadow: 2px -2px 5px #c55796;
            width: 125px;
            font-family: 'FontAwesome';
            font-size: 20px;
            margin: auto;
        }   
    .badge {
        border-radius: 9px;
        position: absolute;
        background: #df00ff;
        color: white;
        top: 3px;
        right: 2px;
        font-size: 10px;
        padding: 3px 4px;
      }
      
    
.btn-srch {
    cursor: pointer;
    border: none;
    margin: 10px 3px;
    background: none;
    color: white;
    font-size: 25px;
  
  }
    #search-input {
        padding: 6px;
        width: 135px;
        font-size: 14px;
    }


    .burger{
        display: table;
    }

    .firstSection{
        height: 90vh;
    }
    .secondHalf{
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .secondHalf img {
        width: 60%;
        border-radius: 140px;
        display: block;
        margin: auto 32px;
        padding: 0px 19px;
    }

    .box-main{
        height: 90%;
    }

    .nav-list {
        flex-direction: column;
        height: 218px;
    }

    .navbar {
        height: 340px;
        flex-direction: column;
        transition: all 0.6s ease-out;
    }

    .rightNav {
        text-align: center;
    }

    #search {
        width: 100%;
    }
    * {
        box-sizing: border-box;
      }
      
      /* Style the search field */
      form.example input[type=text] {
        padding: 10px;
        font-size: 17px;
        border: 1px solid grey;
        float: left;
        width: 80%;
        background: #f1f1f1;
      }
      
      /* Style the submit button */
      form.example button {
        float: left;
        width: 20%;
        padding: 10px;
        background: #2196F3;
        color: white;
        font-size: 17px;
        border: 1px solid grey;
        border-left: none; /* Prevent double borders */
        cursor: pointer;
      }
      
      form.example button:hover {
        background: #0b7dda;
      }
      
      /* Clear floats */
      form.example::after {
        content: "";
        clear: both;
        display: table;
      }
      
    .burger {
        position: absolute;
        cursor: pointer;
        left: 3%;
        top: 6px;
    }
    .h-nav-resp{
        height: 53px;
    }
    .v-class-resp{
        opacity: 0;
        visibility: hidden;
        display: none;

    }
    .line {
        margin: 7px 0px;
        padding: 1px 4px;
        height: 3px;
        width: 31px;
    }
    .box-main{
        flex-direction: column-reverse;
        max-width: 100%;
    }
    .form{
        max-width: 98%;
    }
    .section{
        flex-direction: column-reverse;
        height: 680px;
    }
    .text-small{
        text-align: center;
    }
    
    .text-big{
        text-align: center;
    }
    .buttons{
        text-align: center;
    }
    .paras{
        padding: 0;
    }
    .secondHalf{
        width: 65%;
    }
}
.mail{
    color: white;
    text-decoration: none;
}


/* Its jusst for contact us making responsive  */

@media only screen and (max-width:985px) {
    .cashondelivery {
        display: flex;
        width: 88%;
        margin: 28px auto;
        height: 560px;
    }

    .placeorder {
        margin: 8px 12px;
    }
    .faa{
        width: 16%;
    }
    .company-details {
        display: flex;
        font-size: 13px;
        flex-direction: column-reverse;
        width: 75%;
        margin: auto;
    }
    .top-image {
        width: 315px;
        height: 351px;
    }

}




@media only screen and (max-width:755px) {
    .productbutton{       
        visibility: visible;
        opacity: 1;
        z-index: 1;
        display: block;
        color: rgb(255, 253, 253) !important;
        background-color: #021621!important;
        font-family: 'system-ui';
        font-size: 15px;
        font-family: 'Roboto Slab', serif;
        padding: 12px 0px;
        margin: 0px 0px;
        border-radius: 0px;
        background: none;
        color: rgb(0, 0, 0);
        cursor: pointer;
        font-size: 18px;
        position: fixed;
        bottom: -2px ;
        width: 102%;
        left: -2px;
    }
    .firstSection{
        height: 80vh;
    } 
.categories-head {
    margin: 6px 19px;
    font-size: 16px;
    font-family: 'Franklin Gothic Medium';
}

.categories-para{
    font-size: 14px;
}

.description{
    width: 100%;
    margin: 0px -15px;
    justify-content: left;
    align-items: self-start;

}
    }

    @media only screen and (max-width:730px) {
  
        .swiper-display{
            visibility: visible;
            display: block;
            opacity: 1;
          }
  
        
        
        .btn {
            font-family: 'Bree Serif', serif;
            font-family: 'Heebo', sans-serif;
            font-family: 'Playball', cursive;
            font-family: 'Roboto Slab', serif;
            padding: 9px 20px;
            margin: 7px 3px;
            border: 2px solid #c55796;
            border-radius: 8px;
            background: none;
            color: white;
            cursor: pointer;
            font-size: 15px;
        }

        .rightNav {
            padding: 3px 0px;
            width: 45%;
        }
        .productCard{
            align-items: center;
            flex-direction: column;
        }
        .heading{
            width: 95%;
        }

        #imagedisplay {
            display: block;
            margin: 2px 0px;
            visibility: visible;
        }
        
        .imageslist{
            display: none;
        }
        .categories{
            flex-wrap: wrap;
        }
        .categories-card{
        margin: 10px;
        justify-content: center;
        align-items: center;
        width: 39%;
    }
    .categories-card img{
        margin: 10px;
        justify-content: center;
        align-items: center;
        width: 90%;
    }
    



    }

    @media only screen and (max-width:650px) {
        .product-card{
            width: 250px;
        }
        .product-description {
            font-weight: bold;
            margin: 10px 0;
            font-family: 'Merriweather', serif;
            margin: 0;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            font-size: 14px;
        }
        .product-title {
            font-size: 16px;
            margin: 0;
            text-align: left;
        }
        .firstSection{
            height: 70vh
        };;
    }
    
@media only screen and (max-width:550px) {
    #search-input {
        padding: 6px;
        width: 110px;
        font-size: 14px;
    }
   
    .sale {
        justify-content: center;
        position: absolute;
        background-color: #133760;
        border-radius: 41px;
        font-size: 13px;
        color: rgb(255 255 255);
        display: flex;
        height: 38px;
        left: 17px;
        margin: -174px -2px;
        width: 38px;    
        border: 1px solid rgb(255 206 22);
        box-shadow: 0 0 5px rgb(255 206 22);
        align-items: center;
    }

  .secondHalf img{
    margin:  auto;
    width: 90%;
  }
  .product-image img {
    cursor: pointer;
    width: 70%;
    height: 115px;
    object-fit: cover;
}

.product-image img:hover {
    transition: all ease 0.3s;
    width: 85%;
    height: 115px;
    object-fit: cover;
}

    .product-card{
        width: 45%;
        margin: 8px 5px;
    }
    .adressheading {
        font-size: 23px;
        margin: 30px auto;
        background-color: #c55796;
        padding: 12px;
        color: white;
        font-family: system-ui;
        width: 100%;
        text-align: center;
    }
    .descriptionData li{
        font-size: 16px;
        margin: 4px;
        font-family: 'Roboto Slab', serif;
    }
  
}



@media only screen and (max-width:450px){
 
    .subnav-content a {
        font-family: 'Roboto Slab', serif;
        float: left;
        font-size: 11px;
        color: white;
        text-decoration: none;
    }
    
    .product-title{
        font-size: 15px;
    }
    
    .nvbr a {
        padding: 14px 8px;
    }
    .subnav .subnavbtn {
        font-size: 12px;
        padding: 9px 8px;
    }
    .product-description {
        font-weight: bold;
        margin: 10px 0;
        font-family: 'Merriweather', serif;
        margin: 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 12px;
    }
    .product-price{
        font-size: 1rem;
    }
    .add-to-cart{
        font-size: 13px;
    }
    .imglist{
        margin: 0 auto;
    }
}


@media only screen and (max-width:398px){
    
    footer {
        font-size: 13px;
    }
    .placeorder{
        font-size: 17px;
        height: 36px;
    }
    .rightNav {
        padding: 3px 0px;
    }
    .product-description {
        font-weight: bold;
        margin: 10px 0;
        font-family: 'Merriweather', serif;
        margin: 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 11px;
    }
    
    .sale{
        margin: -174px -6px !important;
    }

}





@media only screen and (max-width:365px){
    .adressheading {
        font-size: 21px;
    }
    .placeorder {
        font-size: 16px;
        font-weight: bold;
        height: 35px;
        margin:  0;
    }
    .imageslist .imglist img:hover {
        margin: 1px 6px;
        width: 65px;
        height: 90px;
    }
 
}



@media only screen and (max-width:353px) {
    .golden-s {
        width: 35px;
    }
    .sale{
        margin: -174px -8px !important;
    }
    .product-title {
        font-size: 15px;
    }

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

    .text-big {
        font-size: 20px;
        margin-bottom: 10px;
    }
    .golden-s{
        width: 34px;
    }
    .imageslist .imglist img {
        margin: 1px 6px;
        height: 85px;
        width: 59px;
    }
    .top-image {
        width: 280px;
        height: 330px;
    }
    .description{
     width: 90%;
    font-size: 15px;
    }

}