*{
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
body{    
    overflow-x: hidden;
}
nav{
    padding: 10px;
    background-color: #053B06;
    color: white;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    box-shadow: 0 2px 5px darkslategray;
}
nav a{
    text-decoration: none;
    color: white;
}
nav div{
    display: flex;
    gap: 25px;   
    align-items: center; 
}
nav div a{
    color: white;
    text-decoration: none;
    font-weight: bold;
}
nav div a:hover{
    color: yellow;
}
.bigmenu{
    display: flex;
}
.mobmenu{
    display: none;
}
.menucontent{
    display: none;
}
nav .location{
    display: flex;
    gap: 5px;
    align-items: center;
    justify-content: center;
}
nav .location img{
    background-color: transparent;
    margin-top: 0px;
}
.navcart{
    position: relative;
}
.navcart img{
    width: 35px;
    background-color: white;
    padding: 3px;
    border-radius: 5px;
}
.navcart img:hover{
    background-color: yellow;
}
.navcart .counter{
    position: absolute;
    top: -5px;
    right: -10px;
    padding: 2px;
    padding-left: 8px;
    padding-right: 8px;
    background-color: yellow;
    color: black;
    border-radius: 20px;   
}
.navcart .cartview{
    position: absolute;
    top: 35px;
    left: -50px;
    background-color: white;
    padding: 10px;
    box-shadow: 0 0 5px lightgray;
    border-radius: 5px;
    color: black;
    display: flex;  
    flex-direction: column;
    min-width: 125px;  
    visibility: hidden;    
    z-index: 10;
    min-width: 150px;
}
.navcart:hover .cartview{
    visibility: visible;
}
.indicart{
    display: flex;  
    border: 0.5px solid lightgray;
    border-radius: 5px;  
    padding: 5px;
    gap: 10px;
    position: relative;
    background-color: #053B06;
    color: white;
    width: 100%;
    box-shadow: 2px 2px 3px lightgray;
}
.indicart div{
    display: block;
}
.indicart div p:first-child{
    font-weight: bold;
}
.indicart img{
    padding: 0px;
}
.indicart .remcart{
    background-color: red;
    color: black;
    padding: 3px;
    border-radius: 50px;
    text-decoration: none;
    position: absolute;
    top: -5px;
    right: -5px;
    padding-top: 0px;
}
.btnlink{
    background-color: yellow;
    color: black;
    border-radius: 50px;
    padding: 5px;
    display: inline-block;
}
.btnlink:hover{
    border: 2px solid whitesmoke;
    padding: 3px;
    color: #053B06;
}
.loginbox{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    background-color: #053B06;
    color: white;
    text-align: center;
    padding: 30px;
    border-radius: 20px;
}
.loginbox input{
    padding: 10px;
    margin: 10px;
    width: 300px;
    border-radius: 50px;
    border: none;
    box-shadow: inset 0 0 5px black;
}
.loginbox input:hover{
    box-shadow:inset 0 0 8px black;
}
.loginbox select{
    padding: 10px;
    margin: 10px;
    width: 300px;
    border-radius: 50px;
    border: none;
    box-shadow: inset 0 0 5px black;
} 
.loginbox input[type='checkbox']
{
    width: auto;
}
.loginbox button{
    padding: 10px;
    margin: 10px;
    width: 100px;
    font-weight: bold;
    border-radius: 50px;
    border: none;
    background-color: yellow;
    color: #053B06;
}
.loginbox button:hover{
    box-shadow: inset 0 0 5px black;
}
.loginbox a{
    text-decoration: none;
    color: white;
}
.loginbox p{
    font-size: 0.8rem;
}
.loginbox a:hover{
    font-weight: 500;
    color: yellow;
}
.loginbox .btnlink{
    color: #053B06;
    font-weight: bold;
    display: inline-block;
    margin-left: 50px;
    padding: 12px;
}
.loginbox .btnlink:hover{
    background-color: #053B06;
    color: white;
}
.errspan p{
    font-size: 0.8rem;
    color: red;
}
.slider{
    max-height: 94vh;
    width: 100vw; 
    overflow: hidden;  
}
.slider img{
    width: 100%;
}
.hiddenelement{
    display: none;
}
nav .prof{
    padding-right: 20px;
    gap: 15px;
}
nav .prof img{
    width: 30px;
    border-radius: 25px;
    background-color: white;
}
nav .prof hr{
    height: 30px;
}
nav .prof p{
    font-weight: bold;
    text-transform: uppercase;
    font-size: 1.1rem;
}
nav .profdropdown{
    position: absolute;
    top: 90%;
    right: 0px;
    background-color: white;
    display: none;
    flex-direction: column;    
    border-radius: 5px;
    padding: 5px;
    gap: 5px;
    box-shadow: 0 0 5px black;
    z-index: 10;
}
.profdropdown a{
    padding: 10px;
    background-color: #053B06;
    width: 100%;
    text-align: center;
    border-radius: 5px;
}
.profdropdown a:hover{
    background-color: #053B06;
    color: yellow;
    font-weight: bold;   
    text-shadow: 2px 2px 3px gray; 
    box-shadow: 0 0 3px black;
}
.divheader{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 5px;
}
.errormsgboard{
    position: absolute;
    top: 30px;
    right: 30px;
    padding: 5px;
    border-radius: 5px;    
    background-color: coral;
    color: white;
}
.msgboard{
    position: absolute;
    top: 50px;
    right: 30px;
    padding: 5px;
    border-radius: 5px;    
    background-color: #053B06;
    color: white;
}
.fixedmsgboard{
    position: fixed;
    top: 20px;
    right: 10px;
    padding: 5px;     
}
.fixedmsgboard div{
    padding: 5px;
    border-radius: 5px; 
    color: white;
}
.searchdiv{
    margin: 10px;
    padding: 10px;
    position: relative;
}
.searchinp{
    display: flex;
    border: 0.5px solid lightgray;
    border-radius: 25px;
    overflow: hidden;
    align-items: center;
    background-color: whitesmoke;
}
.searchdiv input{
    width: 100%;
    padding: 8px;       
    border: none;
}
.searchdiv img{    
    height: 20px;
    margin-right: 20px;
    margin-left: 20px;    
}
.searchresult{
    position: absolute;
    top: 50px;
    left: 20px;
    background-color: white;    
    border-radius: 10px;
    box-shadow: 0 0 5px lightgray;
    display: none;
    width: 50%;
    z-index: 8;
    padding: 5px;
}
.searchresult .items{
    display: flex;
    justify-content: space-between;
    background-color: whitesmoke;
    border-radius: 5px;
    padding: 5px;
    align-items: center;
}
.items div{
    display: flex;
    flex-direction: column;    
}
.items a{
    text-decoration: none;
    color: black;
}
.searchresult .items button{
    background-color: #053B06;
    border: none;
    border-radius: 5px;
    padding: 5px;
    margin: 5px;    
    text-align: left;
    color: white;
}
.searchresult .items button:hover{
    background-color: yellowgreen;
    box-shadow: inset 0 0 5px lightgray;
    color: white;
}




/*homepage*/
.about{       
    padding: 40px;
    padding-left: 15%;
    padding-right: 15%;
    text-align: center; 
    background-color: #053B06;
    color: white;
}
.shop{
    background-color: white;
    padding: 20px;   
}
.shopcontent{
    margin: 10px auto;
    max-width: 75%;
}
.shopcontent .divheader{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 5px;    
}
.shopcontent .divheader a{
    background-color: yellow;
    color: black;
    text-decoration: none;
    padding: 5px;
    font-weight: bold;
}
.contact{    
    padding: 30px;    
    display: flex;
    justify-content: space-evenly;
    background-color: #053B06;
    color: white;
}
.links{
    display: flex;
    flex-direction: column;
    align-items: start;
}
.links a{
    display: inline-block;
    text-decoration: none;
    color: white;
    margin: 2px;    
}
.links a:hover{
    text-decoration: underline;
}
.enquiry {
    text-align: center;
}
.enquiry input{
    padding: 5px;
    border-radius: 5px;
    margin: 5px;
    width: 250px;
}
.enquiry textarea{
    padding: 5px;
    border-radius: 5px;
    margin: 5px;
    width: 250px;
    height: 100px;
}
.enquiry button{
    margin: 5px;
    padding: 5px;
    font-weight: bold;
    border-radius: 5px;
    border: none;
    background-color: yellow;
    color: black;
}
.flexprodhold{
    display: flex;
    justify-content: stretch;
    flex-wrap: wrap;
    padding: 5px;
    margin: 5px;
    overflow: auto;
    row-gap: 15px;
}
.flexprodhold .product{
    width: 220px;
    margin: 5px;
    padding: 5px;
    border: 0.5px solid lightgray;
    border-radius: 5px;
    text-align: center;
    position: relative;
}
/* .flexprodhold:hover
{
    box-shadow: inset -3px 0 5px lightgray;
    border-radius: 5px;
} */
.product p{
    text-align: center;
    font-weight: bold;
}
.product .price{
    margin: 8px;
    padding: 5px;
    background-color: #053B06;
    color: yellow;
    border-radius: 5px;
}
.product img{
    width: 200px;
    height: 200px;
    border: 1px solid black;
    border-radius: 5px;
}
.product a{
    margin: 10px;
    margin-top: 15px;
    text-align: center;
    padding: 10px;
    border-radius: 5px;
    border: none;
    background-color: #053B06;
    color: white;    
    font-size: 1.05rem;
    width: 80%;
    text-decoration: none;
    display: inline-block;
    font-weight: bold;
}
.product button{
    margin: 10px;
    margin-top: 15px;
    text-align: center;
    padding: 10px;
    border-radius: 5px;
    border: none;
    background-color: #053B06;
    color: white;    
    font-size: 1.05rem;
    width: 80%;  
    font-weight: bold;
}
.product button:hover{
    background-color: #053B06;    
    color: yellow;
}
.product a:hover{
    background-color: #053B06;
    color: yellow;
}
.product:hover{
    box-shadow: 0 0 5px gray;
}
/*homepage*/










/*shop page*/
.shopsec{
    margin: auto auto;
    max-width: 1200px;
    height: 80vh;    
    
    padding: 10px;
}
.filterbtn{
    display: none;
}
.filterbtn{
    display: flex; 
    gap: 10px;   
    flex-wrap: wrap;    
}
.filterbtn button{
    display: flex;
    gap: 5px;
    align-items: center;
    padding: 5px;
    margin: 5px;
    border-radius: 5px;  
    background-color: #053B06;    
    border: none;  
    color: white;
}
.filterbtn img{
    width: 30px;
    background-color: white;
    padding: 5px;
    border-radius: 5px;
} 
.filterbtn h4{
    font-size: 20px;
}
.filter{
    display: none;
    border: 0.5px solid black;
    border-radius: 10px;
    overflow: hidden;
    background-color: rgb(255, 255, 255);
    text-align: center;
    position: absolute;
    left: 10px;
    width: 200px;
    z-index: 5;
}
.filtheader{
    display: flex;
    justify-content: space-between;
    padding: 8px;
    background-color: #053B06;
    color: white;
    border-bottom: 0.5px solid black;
}
.filtheader p{
    font-weight: bold;    
}
.filtheader button{
    border-radius: 50px;
    padding: 3px; 
    border: none;  
    box-shadow: 0 0 5px lightgray; 
}
.filtheader button:hover{
    box-shadow: none;
    background-color: yellow;
}
.filtheader img{
    width: 15px;
    height: 12px;
}
.filtcont{
    padding: 10px;
    display: none;
    text-align: left;
    /* max-height: 100px; */
    box-shadow: inset 0 0 5px grey;
    border-bottom: 0.5px solid black;
    overflow: auto;
}
.filtbtn{
    padding: 10px;
    margin: 5px;
    width: 80%;
    background-color: #053B06;
    color: white;
    border-radius: 5px;
    font-weight: 500;
    border: none;
    box-shadow: 0 0 5px grey;
}
.filtbtn:hover{
    box-shadow: none;
    font-weight: 700;
    color: yellow;
}
.filtcont table{
    width: 100%;
}
.filtcont td{
    text-align: center;
}
.filtcont input{
    padding: 5px;
    width: 80%;
    border-radius: 8px;
    border: none;
    box-shadow: inset 0 0 5px grey;
}
.filtcont select{
    padding: 5px;
    width: 100%;
    border-radius: 8px;
    border: none;
    box-shadow: inset 0 0 5px grey;
}
.filtcont input[type='checkbox']
{
    width: auto;    
    margin: 5px;
}
.filteredpara{
    display: flex;
    flex-wrap: wrap;
}
.filtflex{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 5px;
    margin: 5px;
    border-radius: 5px;
    padding-right: 5px;
    padding-left: 5px;
    background-color: #053B06;
    color: white;
}
.filtflex a{
    text-decoration: none;
    background-color: lightgray;
    padding: 3px;
    border-radius: 5px;
    border: none;
    color: black;
    font-weight: 500;
    font-size: 0.8rem;
}
.clearfilter{
    display: none;
}
.emptyproductholder{
    text-align: center;
}
.emptyproductholder img{
    margin: 10px;
    padding: 10px;
    width: 350px;
    filter: opacity(0.5);
}
.prodholder{
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    padding: 10px;        
}
.prodholder .product{    
    text-align: center;
    padding: 10px;
    width: 220px;
    height: max-content;
    border-radius: 5px;
    border: 0.5px solid lightgray;
    position: relative;
    background-color: white;
}
.prodholder .product p{
    text-align: left;
    font-weight: bold;
}
.prodholder .product img{
    width: 190px;
    border: 1px solid black;
    border-radius: 5px;
}
.prodholder .product .prodact{
    padding:5px;
}
.prodholder .product a{
    margin: auto;
    margin-top: auto;    
    text-align: center;
    padding: 5px;
    border-radius: 5px;
    border: none;
    background-color: #053B06;
    color: white;    
    font-weight: 500;
    width: 80%;
    text-decoration: none;
    display: inline-block;
}
.prodholder .product button{
    margin: auto;
    margin-top: auto;
    text-align: center;
    padding: 5px;
    border-radius: 5px;
    border: none;
    background-color: #053B06;
    color: white;
    width: 80%;  
    font-weight: 500;
}
.prodholder .product button:hover{
    background-color: #053B06;
    font-weight: bold;
    font-weight: 700;
    color: yellow;
}
.prodholder .product a:hover{
    background-color: #053B06;
    font-weight: bold;
    font-weight: 700;
    color: yellow;
}
.prodholder .product:hover{
    box-shadow: 0 0 5px gray;
}
.product form{
    display: flex;  
    align-items: center;    
    gap: 5px;
}
.product form input{
    padding: 5px;
    width: 80px;
    border-radius: 5px;    
}
.prodholder .product form button{
    padding: 5px;    
}
.prodholder .product form button:hover{
    font-weight: bold;
    padding: 5px;
    background-color: #053B06;
}
.prodholder .product .stock{
    font-weight: 200;
    font-size: 0.9rem;
}
.product .farmdet{
    display: flex;
    gap: 10px;
    margin: 10px;
    align-items: baseline;
}
.product .farmdet img{
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: none;
}
.product .farmdet a{
    background-color: transparent;
    color: black;
    padding: 0px;
}
.product .farmdet a .stock{
    font-size: 1rem;
}
.product .farmdet a .stock:hover{
    text-decoration: underline;
    color: black;
}
.product .farmdet a:hover{
    background-color: transparent;
    font-weight: 500;
    padding: 0px;
    text-decoration: underline;
}
.product .org{
    position: absolute;
    top: 15px;
    right: 0px;
    border-bottom-left-radius: 20px;
    border-top-left-radius: 20px;
    background-color: #053B06;
    color: yellow;
    padding: 5px;
    padding-left: 20px;
}

.productbox .pagination{
    background-color: transparent;
    display: flex;
    gap: 20px;
    width: 100%;
    justify-content: center;
    align-items: center;
}
.productbox .pagination a{
    text-decoration: none;
    color: white;
    background-color: #053B06;
    padding: 8px;
    border-radius: 5px;    
    align-items: center;
}
/*shop page*/









/*farmerdetail page*/
.farmerdetailpage{
    margin: 20px auto;
    max-width: 800px;
}
.farmprof{
    padding: 10px;
    text-align: center;
    border-radius: 10px;
    box-shadow: 0 0 5px lightgray;
}
.farmprof img{
    width: 180px;
    border-radius: 50%;
    border: 5px solid #053B06;
}
.farmslot{
    margin-top: 30px;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 0 5px lightgray;
}
/*farmerdetail page*/








/*cart page*/
.cartpage{
    margin: 20px auto;
    max-width: 1000px;
    
}
.cartcont{
    display: grid;
    grid-template-columns: 65% 35%;
}
.cartholder{
    display: grid;
    grid-template-columns: 70% 30%;
    border: 0.5px solid lightgray;
    border-radius: 5px;
    margin: 10px;
    box-shadow: 0 0 5px lightgray;
}
.cartholder .indicart{
    border: none;
    border-right: 2px solid lightgray;
    margin: 10px;
    border-radius: 0px;
    background-color: transparent;
    color: black;
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;
    box-shadow: none;
}
.cartholder .indicart img{
    width: 130px;
}
.cartholder .indicart div{
    padding: 10px;
}

.cartholder .cartact{
    padding: 20px;
    text-align: center;
}
.cartact input{
    padding: 5px;
    border-radius: 5px;
    margin: 5px;
    width: 100%;
}
.cartact button{
    padding: 5px;
    border-radius: 5px;
    margin: 5px;
    font-weight: 500;
    font-size: 15px;
    width: 100%;
    background-color: #053B06;
    color: white;
    border: none;
    font-weight: bold;
}
.cartact button:hover{    
    color: yellow;
}
.cartact a{
    text-decoration: none;
    padding: 5px;
    margin: 5px;
    border-radius: 5px;
    background-color: #053B06;
    color: white;
    display: inline-block;
    font-weight: 500;
    font-size: 15px;
    width: 100%;
    text-align: center;
    font-weight: bold;
}
.cartact a:hover{    
    color: yellow;
}
.totsec{
    padding: 10px;
}
.totsec div{
    background-color: white;
    box-shadow: 0 0 5px lightgray;
    border-radius: 5px;
    text-align: right;
    
    padding: 10px;    
}
.totsec a{
    text-decoration: none;
    padding: 10px;
    margin: 5px;
    border-radius: 5px;
    background-color: #053B06;
    color: white;
    display: inline-block;
    font-weight: bold;
    font-size: 1.25rem;
    width: 100%;
    text-align: center;
}
.totsec a:hover{
    color: yellow;
}
/*cart page*/






/*checkout page*/
.checkoutpage{
    margin: 10px auto;
    max-width: 1200px;
    padding: 10px;
}
.checkoutcont{
    display: grid;
    grid-template-columns: 60% 40%;
}
.shipdet{
    padding: 20px;
}
.shipdet table{
    width: 100%;
}
.shipdet tr{
    vertical-align: top;
}
.shipdet table td input{
    width: 100%;
    padding: 5px;
    margin: 5px;
    border-radius: 5px;
    border: 0.5px solid gray;
}
.shipdet table td select{
    width: 100%;
    padding: 5px;
    margin: 5px;
    border-radius: 5px;
}
.shipdet table td textarea{
    width: 100%;
    height: 100px;
    border-radius: 5px;
    padding: 5px;
    margin: 5px;
}
.shipdet .addtype{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px;
    border: 0.5px solid lightgray;
    border-radius: 5px;
}
.shipdet .addtype div{
    display: flex;
    align-items: center;
    gap: 10px;
}
.shipdet input[type='radio']{
    height: 25px;
    width: 25px;
    margin: 5px;
}
.chadd{
    display: none;
}
.adadd{
    display: none;
}
.chadd .addresslist{
    box-shadow: inset 0 0 5px lightgray;
    padding: 5px;
    border-radius: 5px;
    overflow: auto;
}
.chadd .address{
    box-shadow: 0 0 5px lightgray;
    padding: 5px;
    margin: 5px;
    border-radius: 5px;   
    position: relative;    
}
.chadd .address tr{
    vertical-align: top;
}
.chadd .address td{    
    padding: 2px;
    text-align: left;
    font-size: 0.9rem;
}
.chadd .address th{
    padding: 2px;
    text-align: left;
    font-size: 0.8rem;
}
.chadd .addressact{
    position: absolute;
    top: 5px;
    right: 5px;
    visibility: visible;
}
.paydet{
    padding: 25px;
}
.paydet .pricedet{
    padding: 20px;
    border: 0.5px solid lightgray;
    border-radius: 5px;
    box-shadow: 0 0 3px lightgray;
    text-align: right;
}
.paymeth .meth{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px;
    margin: 5px;
    border: 0.5px solid lightgray;
    border-radius: 5px;
    box-shadow: 0 0 3px lightgray;
}
.paydet input[type='radio']{
    height: 25px;
    width: 25px;
    margin: 5px;
}
.paydet button{
    background-color: #053B06;
    color: white;
    font-weight: bold;
    width: 100%;
    padding: 10px;
    border: none;
    border-radius: 5px;
}
.paydet button:hover{
    color: yellow;
}
/*checkout page*/








/*payment page*/
.paymentpage{
    margin: 25px auto;
    max-width: 700px;
    text-align: center;
}
.paymentpage img{
    margin: 20px;
    border-radius: 20px;
    width: 400px;
}
.paymentpage input{
    padding: 5px;
    margin: 5px;    
    border-radius: 5px;
    border: 0.5px solid lightgray;
    width: 250px;
}
.paymentpage button{
    padding: 10px;
    margin: 5px;
    border-radius: 5px;
    border: none;
    background-color: #053B06;
    color: white;
    font-weight: bold;
}
.paymentpage button:hover{
    color: yellow;
}
/*payment page*/







/*orderplaced page*/
.orderplacedpage .loginbox a{
    color: #053B06;
    padding: 5px;
    margin: 5px;
    border-radius: 5px;
    font-weight: bold;
    width: 150px;
    text-decoration: none;    
}
.orderplacedpage h4{
    margin: 10px;
}
.orderplacedpage .loginbox a:hover{
    background-color: #053B06;
    color: white;
    border: 1px solid white;
}
/*orderplaced page*/









/*orderpage*/
.orderpage{
    margin: 20px auto;
    max-width: 1000px;
}
.orderpage .curorder{
    padding: 10px;
}
.orderpage .curorder .tableholder{
    border-radius: 15px;
    overflow: hidden;
}
.orderpage table{
    width: 100%;
    border-collapse: collapse;
}
.orderpage th{
    background-color: #053B06;
    color: white;
    padding: 5px;
}
.orderpage td{
    padding: 5px;
    text-align: center;
}
.orderpage .tableholder table{
    background-color: white;
}
.orderpage td table{
    border: 2px solid black;
}
.orderpage .tableholder td th{
    background-color: transparent;
    color: black;
}
.orderpage .tableholder tr:nth-child(odd){
    background-color: ghostwhite;
}
.orderpage .tableholder tr:nth-child(even){
    background-color: rgb(241, 241, 241);
}
.orderpage .tableholder td td{
    border: 0.5px solid white;
}
.orderpage .tableholder td tr:first-child{
    border: 1px solid black;   
}

/* .orderpage .tableholder td button{
    margin: 5px;
    border-radius: 5px;
    border: 0.5px solid black;
} */
.orderpage .tableholder td button{
    background-color: #053B06;
    color: white;
    padding: 3px;
    border: none;
    border-radius: 5px;
    box-shadow: 2px 2px 5px lightgray;
    margin: 5px;
    font-weight: bold;
}
.orderpage .tableholder td button:hover{
    color: yellow;
}
.orderpage .orddet{
    position: absolute;
    top: 50px;
    right: 5px;
    border-radius: 10px;
    background-color: white;
    box-shadow: 0 0 5px lightgray;
    width: 450px;
    height: 90%;
    padding: 15px;
    display: block;
}
.orderpage .order th{
    background-color: transparent;
    border-bottom: 2px solid black;
    color: black;
}
.orderpage .deldet td{
    text-align: left;
}
.orderpage .deldet th{
    background-color: transparent;
    border-bottom: none;
    color: black;
    vertical-align: top;
    text-align: left;
}
.orderpage .status table{
    
    width: auto;
    border-collapse: separate;
}
.orderpage .status th{
    background-color: white;
    color: black;
    text-align: left;
}
.orderpage #cancelord{
    z-index: 6;
    background-color: white;
}
.indiorder{
    text-align: center;
}
.indiorder button{
    padding: 5px;
    margin: 10px;
    width: 80%;
}
/*orderpage*/









/*settings page*/
.settingspage{
    display: grid;
    grid-template-columns: 15% 85%;
    height: 90vh;
}
.settingstab{    
    border-right: 1px solid gray;    
    display: flex;
    flex-direction: column;    
}
.settingspage .formelement a{
    width: auto;
    padding: 4px;
}
.settingspage a{
    display: inline-block;
    width: 100%;
    text-align: left;
    text-decoration: none;
    font-weight: bold;
    padding: 10px;
    border-bottom: 1px solid gray;
    background-color: white;
    color: #053B06;
}
.settingspage a:hover{
    box-shadow:inset 1px 1px 5px black;
}
.settingscontent{
    padding: 10px;
}

/*settings page*/







/*profile page*/
.profilecontent{
    box-shadow: 2px 2px 5px black;
    border-radius: 5px;
    padding: 10px;
    position: relative;
}
.profilecontent .divheader a{
    background-color: yellow;
}
.profilecontent a{
    border-radius: 5px;
    background-color: #053B06;
    color: white;
    padding: 5px;
    font-weight: 500;
}
.profilecontent a:hover{
    color: yellow;
}
.profilecontent a img{
    width: 25px;
}
.profilecontent table{
    padding: 10px;
}
.profilecontent td{
    padding: 10px;
}
.profile img{
    width: 100px;
}
.notveri p{
    background-color: red;
    display: inline-block;
    padding: 5px;
    margin-top: 5px;
    border-radius: 5px;
    color: white;
}
.notveri a{
    width: auto;
}
.profile .veri{
    background-color: olivedrab;
    color: white;
    display: inline-block;
    padding: 5px;
    margin-top: 5px;
    border-radius: 5px;
}
/*profile page*/









/*address page*/
.addresslist{
    display: flex;
    overflow: auto;
}
.address{
    box-shadow: 0 0 5px lightgray;
    padding: 5px;
    margin: 5px;
    border-radius: 5px;
    
    position: relative;
    
}
.address tr{
    vertical-align: top;
}
.address td{    
    padding: 5px;
    text-align: left;
    font-size: 0.9rem;
}
.address th{
    padding: 5px;
    text-align: left;
    font-size: 0.8rem;
}
.address a{
    text-align: center;
}
.addressact{
    position: absolute;
    top: 10px;
    right: 10px;
    visibility: hidden;
}
.addressact button{
    border-radius: 5px;
    padding: 5px;
    border: 0.5px solid lightgray;
    background-color: yellow;
}
.addressact button:hover{
    transform: translateY(-5px);
}
.addressact button img{
    width: 20px;
}
.address .btnlink{
    background-color: yellow;
    color: black;    
    text-decoration: none;
    border-radius: 5px;
    border: 0.5px solid lightgray;
    display: inline-block;
    width: auto;
}
.addressact .btnlink:hover{
    transform: translateY(-5px);
    box-shadow: none;
}
.addressact a img{
    width: 20px;
}
.address:hover .addressact{
    visibility: visible;
}
/*address page*/






/*slotpage*/
.slotholder{
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.slot{    
    border-radius: 5px;
    overflow: hidden;
    padding: 20px;
    margin: 10px;
    text-align: center;
    box-shadow: 0 0 5px gray;
    position: relative;
}
.slot img{
    width: 220px;
    height: 220px;
}
.slot p{
    text-align: left;
    font-weight: bold;
}
.slot input{
    padding: 5px;
    width: 50px;
    margin: 10px;
}
.slot button{
    padding: 5px;
    border-radius: 5px;
    width: 35px;
    border: none;
    font-weight: bold;
    font-size: 20px;
    border: 0.5px solid lightgray;
    background-color: #053B06;
    color: white;
}
.slot button:hover{
    color: yellow;
}

.slotact{
    position: absolute;
    top: 5px;
    right: 10px;
    align-items: baseline;
    padding: 10px;
    gap: 10px;
    justify-content: center;
    display: none;
}
.slotact button{
    padding: 7px;
    background-color: yellow;
}
.slotact button:hover{
    transform: translateY(-5px);
    color: yellow;
}
.slotact .btnlink{
    background-color: yellow;
    color: black;   
    width: 35px;
    padding: 10px; 
    text-decoration: none;
    border-radius: 5px;
    border: 0.5px solid lightgray;
    display: inline-block;    
}
.slotact .btnlink:hover{
    transform: translateY(-5px);
    box-shadow: none;
}
.slotact a{
    display: block;
}
.slotact a img{
    width: 15px;
    height: 15px;
}
.slotact img{
    width: 15px;
    height: 15px;
}
.slot:hover .slotact{
    display: flex;
    z-index: 5;
}
.slot .organic{
    position: absolute;
    top: 40px;
    right: 0px;
    background-color: #053B06;
    color: yellow;
    padding: 5px;
    border-bottom-left-radius: 20px;
    border-top-left-radius: 20px;
    box-shadow: -2px 2px 5px grey;
}
.organic p{
    padding: 5px;
}
/*slotpage*/






/*farmer order page*/
.farmorderpage{
    padding: 10px;
}
.farmorderpage table{
    width: 100%;
    border-collapse: collapse;
}
.farmorderpage th{
    background-color: #053B06;
    color: white;
    padding: 5px;
}
.farmorderpage td{
    padding: 5px;
    text-align: center;
}
.farmorderpage .tableholder table{
    background-color: white;
}
.farmorderpage .tableholder td th{
    background-color: transparent;
    color: black;
}
.farmorderpage .tableholder tr:nth-child(odd){
    background-color: rgb(230, 230, 230);
}
.farmorderpage .tableholder tr:nth-child(even){
    background-color: rgb(247, 247, 247);
}
.farmorderpage .tableholder td tr:nth-child(odd){
    background-color: white;
    border-bottom: 2px solid black;
}
.farmorderpage .tableholder td tr:nth-child(even){
    background-color: white;
}
.farmorderpage .tableholder td button{
    margin: 5px;
    border-radius: 5px;
    border: 0.5px solid black;
}
.farmorderpage td button{
    background-color: #053B06;
    color: white;
    padding: 3px;
    border: none;
    border-radius: 5px;
    box-shadow: 2px 2px 5px black;
    margin: 5px;
}
#accorcan{
    margin: 20px auto;
    max-width: 600px;
}
#accorcan p{
    font-size: 0.8rem;
    margin: 5px;
}
/*farmer order page*/







/*farmrevenue page*/
.farmrevenue{
    padding: 10px;
}
.stat{
    display: flex;
    justify-content: space-evenly;
    padding: 10px;
    margin: 10px;
}
.stat div{
    text-align: center;
    background-color: #053B06;
    padding: 10px;
    margin: 10px;
    border-radius: 10px;
    width: 200px;
    color: white;
    box-shadow: 2px 2px 5px black;
}
.salrev{
    display: grid;
    grid-template-columns: auto auto;
    gap: 25px;
}
.salrev .tableholder{
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 2px 2px 5px lightgray;
}
.salrev .tableholder table{
    width: 100%;
    border-collapse: collapse;
    
}
.salrev .tableholder table th{
    background-color: #053B06;
    color: white;
    padding: 5px;
    padding-top: 10px;
    padding-bottom: 10px;
}
.salrev .tableholder table td{
    padding: 5px;
    text-align: center;
}
/*farmrevenue page*/






/*trackorder*/
.trackorderpage{
    margin: 20px auto;
    max-width: 600px;
    text-align: center;
    border: 0.5px solid black;
    padding: 15px;
    border-radius: 5px;
}
.trackorderpage input{
    padding: 5px;
    margin: 5px;
    border-radius: 5px;   
}
.trackorderpage button{
    padding: 5px;
    margin: 5px;
    border-radius: 5px;
    background-color: #053B06;
    color: white;
    border: none;
    width: 120px;
} 
.trackorderpage .order table{
    width: 50%;
    border-collapse: collapse;
}
.trackorderpage .order td{
    padding: 5px;
}
.trackorderpage .order th{
    padding: 5px;
}
/* .trackorderpage .orddet{
    position: absolute;
    top: 50px;
    right: 5px;
    border-radius: 10px;
    background-color: white;
    box-shadow: 0 0 5px lightgray;
    width: 450px;
    height: 90%;
    padding: 15px;
    display: block;
} */
.trackorderpage .order th{
    background-color: transparent;
    border-bottom: 2px solid black;
    color: black;
}
.trackorderpage .deldet td{
    text-align: left;
}
.trackorderpage .deldet th{
    background-color: transparent;
    border-bottom: none;
    color: black;
    vertical-align: top;
    text-align: left;
}
.trackorderpage .status table{
    
    width: auto;
    border-collapse: separate;
}
.trackorderpage .status th{
    background-color: white;
    color: black;
    text-align: left;
}
.trackorderpage #cancelord{
    z-index: 6;
    background-color: white;
}
.indiorder{
    text-align: center;
}
.indiorder button{
    padding: 5px;
    margin: 10px;
    width: 80%;
}
/*trackorder*/


/*transaction page*/
.transaction a{
    text-align: center;
    padding: 5px;
    border-radius: 5px;
    background-color: #053B06;
    color: white;
}
.transaction a:hover{
    color: yellow;
}
.transaction .flextd{
    display: flex;
    gap: 5px;
    align-items: center;
}
.transaction td img{
    width: 20px;
}
/*transaction page*/





























/*admin dashboard*/
nav a img{
    height: 30px;
    background-color: white;
    padding: 5px;
    margin-top: 10px;
    border-radius: 5px;
}
.btnholder{
    margin-top: 20px;
    display: flex;   
    gap: 10px; 
    overflow: auto;
    padding: 5px;
}
.btnholder a{
    display: block;
    background-color: rgb(231, 231, 231);
    padding: 5px;
    padding-left: 25px;
    padding-right: 25px;
    border-radius: 5px;
    text-decoration: none;
    color: black;
    border: 0.5px solid grey;
    text-align: center;
    position: relative;
}
.btnholder a p{
    position: absolute;
    top: -5px;
    right: -5px;
    background-color: #053B06;
    color: white;
    padding: 5px;
    border-radius: 5px;
}
.adminmaincontent{
    background-color: whitesmoke;    
    border: 0.5px solid grey;
    padding: 10px;
    margin: 5px;
    border-radius: 5px;
}
.adminmaincontent .divheader{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 5px;
}
.divheader button{    
    padding: 5px;    
    border-radius: 5px;
    border: 0.5px solid lightgray;
    font-weight: bold;
    font-size: 1.2rem;
    background-color: yellow;
}
.divheader button img{
    width: 15px;
}
.hiddenformelement
{
    display: none;
}
.formelement{
    padding: 10px;
    margin: 5px;
    border: 0.5px solid lightgray;  
    border-radius: 5px;  
    box-shadow: 2px 2px 3px grey;
    position: relative;
    background-color: white;
}
.formelement td{
    padding: 5px;
}
.formelement td img{
    width: 100px;
}
.formelement input{
    padding: 5px;
    width: 200px;
    border-radius: 5px;
    border: 0.5px solid grey;
}
.formelement input[type='file']
{
    border: none;
}
.formelement input[type='checkbox']
{
    width: 50px;
}
.formelement select{
    padding: 5px;
    width: 200px;
    border-radius: 5px;
    border: 0.5px solid grey;
}
.formelement button{
    padding: 5px;    
    border-radius: 5px;
    border: 0.5px solid black;
    font-weight: bold;    
    background-color: #053B06;
    color: white;
}
.formelement button:hover{
    box-shadow: 0 0 5px black;  
    color: yellow; 
}
.formelement .btnlink{
    background-color: #053B06;
    color: white;
    font-weight: bold;
    text-decoration: none;
    border-radius: 5px;
}
.formelement .errormsgboard{
    position: absolute;
    top: 30px;
    right: 30px;
    padding: 5px;
    border-radius: 5px;    
    background-color: coral;
    color: white;
}
.formelement .msgboard{
    position: absolute;
    top: 30px;
    right: 30px;
    padding: 5px;
    border-radius: 5px;    
    background-color: #053B06;
    color: white;
}
/*admin dashboard*/



 

/*admin place*/
.flexholder{
    display: flex;
    padding: 5px;
    gap: 10px;   
    border: 0.5px solid lightgray;
    box-shadow: inset 0 0 5px; 
    border-radius: 5px;
}
.flexholder .place{
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    padding: 5px;
    border-radius: 5px;
    gap: 5px;
    background-color: #053B06;
    color: white;
}
.place a{
    text-decoration: none;
    color: white;
}
.placeact a{
    text-decoration: none;
    display: inline-block;
    background-color: skyblue;
    padding: 3px;
    border-radius: 5px;
}
.placeact a img{
    width: 15px;
}
.placeact button{
    padding: 3px;
    border-radius: 5px;
}
.placeact button img{
    width: 15px;
}
.place p{
    font-size: 1.2rem;
}
.flexholder .place .placeact{
    display: none;
}
.flexholder .place:hover .placeact{
    display: flex;
    gap: 10px;
}
.flexholder .delbtn{
    background-color: coral;    
}
.arealist{
    padding: 5px;
    margin: 10px;
    border: 0.5px solid lightgray;
    box-shadow: inset 0 0 5px; 
    border-radius: 5px;
}
.area{
    display: flex;
    padding: 8px;
    margin: 5px;
    align-items: center;
    border-radius: 5px;
    background-color: white;
    justify-content: space-between;    
}
.area:hover{
    box-shadow: 2px 2px 5px lightgray;
}
.area div{
    display: flex;
    gap: 10px;
    align-items: center;
}
.area div hr{
    height: 20px;
}
.area div button{
    padding: 5px;
    border-radius: 5px;
    border: 0.5px solid lightgray;
    background-color: rgb(241, 241, 241);
}
.area div button img{
    width: 18px;
}
.area .btnlink{
    background-color: rgb(241, 241, 241);
    color: black;    
    text-decoration: none;
    border-radius: 5px;
    border: 0.5px solid lightgray;
}
.area .btnlink img{
    width: 18px;
}
.area img{
    width: 40px;
}

.districtholder{
    display: grid;
    grid-template-columns: 30% 30% 30%;
    gap: 10px;
    justify-content: space-evenly;
    background-color: white;
    border: none;
    padding: 10px;
}
.districtholder .district{
    background-color: whitesmoke;
    padding: 5px;
    border-radius: 5px;
}
/*admin place*/



/*farmer reach*/
.padder{
    margin-left: 20px;
    padding: 5px;
    border-radius: 5px;
}
/*farmer reach*/



/*admincred*/
.credcontent{
    position: relative;
}
.errormsgboard{
    position: absolute;
    top: 30px;
    right: 30px;
    padding: 5px;
    border-radius: 5px;
    background-color: yellowgreen;
    color: white;
}
.credlist{      
    border-radius: 10px;
    overflow: hidden;
    margin: 10px;
}
.credlist table{
    width: 100%;
    border-collapse: collapse;
}
.credlist th{
    background-color: #053B06;
    padding: 8px;
    color: white;
    text-align: left;
}
.credlist td{
    padding: 5px;
}
.credlist td button{
    padding: 2px;
    border-radius: 5px;
    border: 0.5px solid lightgray;    
}
.credlist td button img{
    width: 18px;
}
.credlist a{
    background-color: rgb(241, 241, 241);
    color: black;    
    text-decoration: none;
    border-radius: 5px;
    border: 0.5px solid lightgray;
    padding: 2px;    
    display: inline-block;
}
.credlist a img{
    width: 18px;
}
.credlist tr:nth-child(even){
    background-color: rgb(236, 255, 236);
}
.credlist tr:nth-child(odd){
    background-color: rgb(245, 255, 245);
}
/*admincred*/




/*adminorder*/
.adminorderpage{
   
    background-color: white;
    padding: 8px;
    border-radius: 10px;
}
.adminorderpage .tableholder{
    border-radius: 20px;
    overflow: hidden;
    
}
.adminorderpage table{
    width: 100%;
    border-collapse: collapse;
}
.adminorderpage th{
    background-color: #053B06;
    color: white;
    padding: 5px;
}
.adminorderpage td{
    padding: 10px;
    text-align: center;
}
.tableholder tr:nth-child(even){
    background-color: rgb(246, 246, 246);
}
.tableholder tr:nth-child(odd){
    background-color: rgb(235, 235, 235);
}
.adminorderpage td button{
    background-color: #053B06;
    color: white;
    padding: 3px;
    border: none;
    border-radius: 5px;    
    margin: 5px;
}
.adminorderpage td button:hover{
    box-shadow: 2px 2px 5px gray;
}
.adminorderpage td a{
    text-decoration: none;
    background-color: #25d366;
    color: white;
    font-weight: bold;    
    border-radius: 5px;
    padding: 5px;
}
.adminorderpage td a:hover{
    box-shadow: 2px 2px 5px gray;
}
.adminorderpage td .farmname{
    background-color: transparent;
    color: black;
    font-weight: 400;
    text-transform: capitalize;
}
.adminorderpage td .farmname:hover{
    box-shadow: none;
    text-decoration: underline;
}
/*adminorder*/





/*admin phone*/
.phoneverify{
    margin: 20px auto;
    max-width: 700px;
    padding: 10px;
    background-color: white;
    border-radius: 10px;
}
.phoneverify table{
    width: 100%;   
}
.phoneverify th{
    text-align: left;
    background-color: #053B06;
    color: white;
    padding: 5px;
}
.phoneverify td{
    text-align: left;
    padding: 5px;
}
.phoneverify td img{
    width:50px;
}
.phoneverify tr:nth-child(even){
    background-color: rgb(236, 255, 236);
}
.phoneverify tr:nth-child(odd){
    background-color: rgb(245, 255, 245);
}
.phoneverify a{
    text-decoration: none;
    background-color: #053B06;
    color: white;
    display: inline-block;
    border-radius: 5px;
    border: none;
    padding: 5px;
    margin: 5px;
}
.phoneverify button{
    text-decoration: none;
    background-color: #053B06;
    color: white;
    display: inline-block;
    border-radius: 5px;
    border: none;
    padding: 5px;
    margin: 5px;
}
/*admin phone*/




/*admin farmer*/
.farmerlist{
    border-radius: 10px;
    overflow: hidden;
}
.farmerlist table{
    width: 100%;
    border-collapse: collapse;
}
.farmerlist th{
    background-color: #053B06;
    color: white;
    padding: 8px;
    text-align: left;
}
.farmerlist tr:nth-child(even){
    background-color: rgb(236, 255, 236);
}
.farmerlist tr:nth-child(odd){
    background-color: rgb(245, 255, 245);
}
.farmerlist table td{    
    padding: 5px;    
}
.farmerlist td p{
    display: inline;
    padding: 3px;
    border-radius: 5px;
}
.farmerlist td img{
    width: 30px;
}
.farmerlist td .checker{
    width: 15px;
}
/*admin farmer*/











/*delivery dashboard*/
.delinav{
    margin: auto auto;
    max-width: 500px;
}
.delicontent{
    margin: auto auto;
    max-width: 500px;
    box-shadow: 0 0 5px lightgray;
    min-height: 90vh;
}
.toptabs{
    width: 100%;
    display: grid;
    grid-template-columns: auto auto;
    
}
.toptabs a{
    border: 0.5px solid lightgray;
    padding: 10px;
    text-align: center;
    text-decoration: none;
    font-weight: bold;
    color: #053B06;
}
.toptabs a:hover{
    box-shadow: inset 0 0 5px lightgray;
}
.maindelicontent{
    padding: 5px;
}

/*delivery dashboard*/










/*deliverypickup*/
.dropcontent{
    position: relative;   
}
.clearfilt button{
    margin: 10px;
    padding: 5px;
    background-color: #053B06;
    color: white;
    border-radius: 5px;
    font-weight: bold;
}
.pickfilt{
    padding: 5px;
    background-color: rgb(250,250,250);
    border: 0.5px solid lightgray;
    margin: 5px;
    border-radius: 5px;
}
.pickuplist .indiorder{
    margin: 10px;
    padding: 10px;
    border: 0.5px solid lightgray;
    border-radius: 10px;
    position: relative;
    box-shadow: 0 0 5px lightgray;
}
.indiorder .paymeth{
    position: absolute;
    top: 5px;
    right: 5px;
    background-color: #053B06;
    color: white;
    font-weight: bold;
    padding: 5px;
    border-radius: 5px;
}
.indiorder button{
    background-color: #053B06;
    color: white;
    border: none;
    border-radius: 5px;
    font-weight: bold;
}
.pickuplist table{
    width: 100%;    
}
.pickuplist table th,td{
    text-align: left;
}
.order table{
    border-collapse: collapse;
}
.order th{
    border-bottom: 2px solid black;
}
.deldet table{
    text-align: left;
}
.deldet th{
    border-bottom: none;
    padding: 5px;
}
.overlaypopup{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 10;
    background-color: rgba(0, 0, 0, 0.544);
}
.overlaypopup .formelement{
    margin: 50% auto;
    max-width: 90%;
    text-align: center;
}
/*deliverypickup*/














@media only screen and (max-width: 1100px)
{
    nav h1{
        font-size: 1.75rem;
    }
    nav .location{
        gap: 0px;
        width: 25%;
    }
    nav .prof{
        padding-right: 8px;
    }
}


@media only screen and (max-width: 950px)
{
    nav h1{
        font-size: 1.25rem;
    }
    nav .location p{
        font-size: 0.8rem;
    }
    nav div{
        gap: 12px;
    }
    nav .prof{
        gap: 8px;
        padding-right: 0px;
    }
}


@media only screen and (max-width: 760px)
{
    nav .location p{
        font-size: 0.65rem;
    }
}














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


    /*navbar*/
    nav{
        padding: 5px;
    }    
    nav h1{
        font-size: 1rem;
    }
    nav .location p{
        display: none;
    }

    .bigmenu{
        display: none;
    }
    .mobmenu{
        display: flex;       
        margin: 5px;   
        gap: 5px;
        align-items: center;     
    }
    .mobmenu img{
        width: 30px;
        padding: 5px;
        border-radius: 5px;
        background-color: #053B06;
        box-shadow: 0 0 5px lightgray;
    }
    .mobmenu .prof{
        padding-right: 3px;
    }
    .mobmenu .prof img{
        width: 30px;
        padding: 5px;
        border-radius: 50%;
    }
    .menucontent{
        display: none;
        width: 100%;
        margin-bottom: 5px;
        padding: 3px;
    }
    .menucontent a{
        display: block;
        width: 100%;
        background-color: #053B06;
        color: white;
        text-decoration: none;
        margin-top: 3px;
        padding: 5px;
        border-radius: 5px;
        position: relative;
    }
    .menucontent a p{
        position: absolute;
        right: 5px;
        top: 0px;
        background-color: white;
        padding: 5px;
        font-size: 11px;
        font-weight: bold;
        border-radius: 20%;
        color: #053B06;
    }
    .navcart{
        padding: 5px;
    }
    .navcart p{
        font-size: 0.8rem;
    }
    .navcart .counter{
        top: 0px;
        right: 0px;
    }
    .navcart img{
        width: 30px;
        height: 30px;
        padding: 5px;
        background-color: white;
    }
    /*navbar*/



    




    /*homepage*/
    .contact{
        flex-direction: column;
        gap: 25px;
    }
    .shopcontent{
        max-width: 100%;
    }
    .about{
        padding: 20px;
    }
    .about p{
        font-size: 0.8rem;
    }
    .flexprodhold .product{
        text-align: center;
        width: 150px;
        margin: 0px;
    }
    .product img{
        width: 140px;
        height: 140px;
    }
    /*homepage*/







    /*shoppage*/
    .shopsec{
        display: block;
        margin: auto auto;
        height: auto;
        padding: 5px;
    }
    .filterbox{
        position: relative;
    }
    .filterbox hr{
        display: none;
    }
    .filterbtn{
        display: flex; 
        gap: 10px;   
        flex-wrap: wrap;    
    }
    .filterbtn button{
        display: flex;
        gap: 5px;
        align-items: center;
        padding: 5px;
        margin: 5px;
        border-radius: 5px;  
        background-color: #053B06;    
        border: none;  
        color: white;
    }
    .filterbtn img{
        width: 22px;  
        background-color: white;   
        padding: 5px;   
        border-radius: 5px;
    }    
    .filter{
        display: none;
        margin-left: 30px;
        margin-right: 30px;    
        z-index: 5;    
    }
    .clearfilter{
        display: block;
    }
    .filtflex p{
        font-size: 0.8rem;
    }
    .filtflex a{
        font-size: 0.5rem;
    }
    .emptyproductholder img{
        width: 200px;
    }
    .prodholder{
        gap: 5px;
        padding: 0px;
        justify-content: space-evenly;
    }
    .prodholder .product{
        width: 150px;
        padding: 5px;
    }
    .product p{
        text-align: center;
    }
    .prodholder .product img{
        width: 140px;
    }
    .prodholder .product .prodact{
        padding-left: 0px;
        padding-right: 0px;
    }
    .product .farmdet{
        align-items: center;
    }
    .product .farmdet img{
        width: 25px;
        height: 25px;
    }
    .product form input{
        width: 50%;
    }
    /*shoppage*/







    /*cart page*/
    .cartcont{
        display: block;
    }
    .cartholder{
        display: block;
    }
    .cartholder .indicart{
        border-right: none;
    }
    /*cart page*/




    /*checkout page*/
    .checkoutcont{
        display: block;
    }
    /*checkout page*/



    /*payment*/
    .paymentpage img{
        width: 80%;
    }
    /*payment*/





    /*orderplace*/
    .orderplacedpage .loginbox{
        width: 85%;
    }
    /*orderplace*/




    /*myorder*/
    .orderpage .curorder .tableholder{
        overflow: auto;
    }
    /*myorder*/




    /*farmer dashboard*/
    .settingspage{
        display: block;
    }
    .settingspage .settingstab {
        display: flex;
        gap: 5px;
        flex-direction: row;
        overflow: auto;
        padding: 5px;
        box-shadow: inset 0 0 5px lightgray;
    }
    .settingspage .settingstab a{
        width: auto;
        background-color: #053B06;
        color: white;
        border-radius: 5px;

    }
    .slotholder{
        gap: 5px;
        flex-wrap: wrap;
    }
    .slot{
        padding: 5px;
        margin: 5px;
    }
    .slot img{
        width: 140px;
        height: 140px;
    }
    .slotact{
        top: 3px;
        right: 3px;
        padding: 0px;
    }
    .slotact button img{
        width: 15px;
        height: 15px;
    }
    .slot button{
        padding: 5px;
    }
    .farmorderpage .tableholder{
        overflow: auto;
    }
    /*farmer dashboard*/


    /*trackpage*/
    .trackorderpage{
        width: 90%;
    }
    /*trackpage*/

}





@media only screen and (max-width: 400px)
{    
    .product img{
        width: 135px;
    }
    .enquiry{
        text-align: left;
    }
    .about h1, h2{
        font-size: 1.2rem;
    }
}








@media only screen and (max-width: 400px)
{
    /*loginpage*/
    .loginbox{
        position: relative;
        transform: translate(-50% ,0%);
        margin-top: 30px;
        padding: 15px;
        
    }
    /*loginpage*/

    nav h1{
        font-size: 0.8rem;
    }


    

}