*{
    margin: 0;
    font-family: Arial;
     padding: 0;
 

} 
.navbar
{
    height: 60px;
    background-color: #0f1111;
    color: white;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
}
.nav-logo
{
    height: 50px;
    width: 100px;
}
.logo{
    background-image: url("l.PNG");
    background-size:cover ;
    height: 50px;
    width: 100%;
}
.border{
    border:1.5px solid transparent;
}
.border:hover{
    border:1.5px solid white ;
}
.add-x{
    color: #cccccc;
    font-size: 0.85rem;
    margin-left: 10px;

}
.add-y{
    color: white;
    font-size: 1rem;

}
 .address-icon{
    display:flex;
    align-items:center ;
 }
 .nav-search{
    display: flex;
    justify-content: space-evenly;
    width: 640px;
    height: 40px;
 
 }
.search-all
{
    background-color: #f3f3f3 ;
    width: 50px;
    text-align: center;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
    border: none;

}
.search-input
{
    width: 100%;
    border: none;
    font-size: 1ren;

}
.search-icon
{
    width: 45px;
    background-color: #febd68;
    display: flex;
    justify-content: center;
    align-items: center;
    border: none;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    font-size: 1.2rem;
    color: #0f1111;
}
 
.fir
{
font-size: 0.75rem;
}
.sec
{
font: size 0.85em; 
font-weight: 700;
}
.nav-search:hover
{
    border:2px solid orange
}
.nav-cart i
{
font-size: 2rem;
}
.nav-cart{
    font-size:1rem;
    font-weight: 700;

}
.pannel
{
    display: flex;
    height: 40px;
    background-color: #222f3d;
    color: white ;
    align-items: center;
    justify-content: space-evenly;
 
}
.pannel-option{
    width: 70%;
    font-size: 0.85rem;

}
.pannel-option a{
    margin-left: 15px;
}
.deals
{
font-size: 0.9rem;
font-weight: 700;
}
.hero-sec{
    background-image: url("hero_image.jpg");
    height: 380px;
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: flex-end;


}
.hero-msg
{
color: black;
background-color: white  ;
height: 40px;
display: flex;
align-items: center ;
justify-content: center;
font-size: 0.85rem;
 width: 95%;
 margin-bottom: 55px;

 
}
.hero-msg a
{
    color: #007185;
}
.shop
{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    background-color: #e2e7e6;

}
.box
{
    height: 380px;
    width: 23%;
     background-color: rgb(255, 255, 255);
    padding: 20px 0px 15px;
    margin-top: 15px;
    border-radius: 10px;



}
.box-img
{
    height: 300px;
    background-size:cover;
    margin-top: 1rem;
    margin-bottom: 1rem;
}
.box-contant
{
margin-left:1rem ;
margin-right: 1rem;
}
.box-contant p
{
    color:black ;
}
footer
{
    margin-top: 0px;
    border-top-right-radius:5px ;
    border-top-right-radius:5px ;
    
}
.foot-p1
{
    display: flex;
    justify-content: center;
    align-items: center; 
    height: 50px;
    background: #37475a;
    color: white;
    font-size: 1rem;
    font-weight: 700;
}
.foot-p2
{
    background-color: #222f3d;
    color: white ;
    height: 400px;
    display:flex;
    justify-content: space-evenly   ;
    
 }
 ul
 {margin-top: 100px;}
ul a
{
    display:block;
    margin-top: 5px;
    color:#dddddd ;
    font-size: 1rem;
    
}
.foot-p3
{
    background-color: #222f3d;
    color: white;
    border: 0.5px solid white;
    height: 70px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.logo{
    background-image: url("l.PNG");
    background-size:cover ;
    height: 50px;
    
width: 100px;
}