.searchbtn{
    width:32px;
    height:32px;
}

.search-img{
    width:32px;
    height:32px;
}
.search-content{
    display: none;
}

@media (max-width:782px){
    .search-content {
        position: fixed;
        /* margin-top: 30px; */
        height: 60px;
        width: 300px;
        margin-left: 20%;
        top: 20px;
        /* margin: 10px auto; */
    }
    .searchbtn{
        position: absolute;
        right:10px;
        margin-top: 20px;
    }
    .searchInput {
        width: 250px;
        height: 30px;
        font-size: 14px;
        border: 1px solid #ccc;
        border-radius: 4px;
        color: #000;
    }
    .searchbtn2 {
        position: absolute;
        width: 32px;
        height: 32px;
    }
    .category {
        height: 30px;
        width: 30px;
        background: url(../images/category.png);
        background-size: contain;
        position: absolute;
        margin-top: 20px;
        margin-left: 10px;
    }
    
    .closeBtn {
        background-image: url(../images/chahao.png);
        width: 32px;
        height: 32px;
        position: absolute;
        right: 0;
    }
    .category-list{
        position: absolute;
        top: 60px;
        width:250px;
        height:314px;
        background-color: #0099FF;
        z-index: 999;
        border-top: 1px solid #000; /* Add a border around the entire list */
    }

    .category-content{
        height:200px;  
        margin-top: 10px;  
        
 
    }
    .item{

        font-size: 30px;
        color:black;
        display: flex;
        align-items: center; /* Vertically center content */
        border-bottom: 1px solid #000; /* Add a bottom border to each item */
        padding: 10px; /* Add padding to each item */   
    }
    .item-content{
        display: flex;
        align-items: center; /* Vertically center the content */
    }
    .page{
        padding: 5px;

    }

    
    .item-img {
        background-image: url(../images/sprite.png);
        background-repeat: no-repeat;
        display: inline-block;
        margin-top: 5px;
    }
   
} 
@media (min-width:782px){
        .search-content {
            position: relative;
            height: 60px;
            width: 300px;
            right: 20px;
            top: 10px;
        }
        .search-img{
            position: fixed;
            top:15px;
        }
        .searchInput {
            width: 250px;
            height: 30px;
            font-size: 14px;
            border: 1px solid #ccc;
            border-radius: 4px;
            color: #000;
        }
}