*{
    margin: 0;
    padding: 0;
    border: 0;
    font-family: proxima-nova, Arial, Helvetica, sans-serif;
}
@font-face {
    font-family: 'proxima nova', serif;
    src: url(Proxima-Nova-300.eot);
}

a{
    text-decoration: none;
}
.main{
    width: 100%;
}
.header{
    display: flex;
    background-color: yellow;
    align-items: center;
    justify-content: center;
    padding-left: 30px;
    padding-right: 20px;
}
.header ul{
    align-items: center;
    display: flex;
    
}
.header ul li{
    align-items: center;
    justify-content: center;
    display: flex;
    list-style: none;
    margin-right: 15px;
    padding:10px 15px;
}
.header ul li a{
    align-items: center;
    justify-content: center;
}

.noon-logo img{
    height: 28px;
}
.uae-flag a{
    display: flex;

}
.search-bar input{
    background-color: white;
    border: 10px;
    padding: 10px;
    border-radius: 5px;
}

.sign a{
    align-items: center;
    justify-content: center;
    padding-bottom: 5px;
    display: flex;
}
.cart a{
display: flex;
}
.nav-bar{
    align-content: center;
    justify-content: center;
}

.nav-bar ul{
    display: flex;
    align-content: center;
    justify-content: center;
    background-color: rgb(252, 251, 244);
    font-weight: bold;
    font-size: 15px;
    
}

.nav-bar ul li{
    display: flex;
    padding-right: 10px;
}

.nav-bar ul li a{
    color: black;
    padding: 5px;
    padding-top: 10px;
    padding-bottom: 0;
    
}
.nav-bar ul li a:hover{
    border: 10px;
    background-color: white;
    box-shadow: 2px;
    border-color: black;
}
.grocery {
    width: 110px;

} 

.all-categories a{
    width: 190px;
    display: flex;
    
}
.all-categories a img{
    padding-left: 30px;
}

.navbar-1 img{
    width: 1349px;
}
.navbar-2{
    display: flex;
    
}
.navbar-2-1 img{
    width: 955px;
}

.navbar-2-2 {
    display: flex;
}
.navbar-2-2 img{
    width: 203px;
} 
.navbar3{
    
    padding-bottom: 10px;
}
.navbar3 ul {
    display: flex;
    margin: 10px;
}
.navbar3 ul li{
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    padding: 2px;
}
.navbar3 li a img{
    width: 107px;
}

.main-deals{
    background-color:rgb(241, 244, 253);
}
.deals{
    display: flex;
    margin-left: 5px;
    padding: 10px;
    
}
.deals img{
    width: 186px;
}
.in-focus{
    background-color: white;
    padding-left: 15px;
    margin-right: 15px;
    width: 645px;
    padding-top: 10px;
}
.mega-deals{
    width: 645px;
    background-color: white;
    margin-right: 15px;
    padding-left: 15px;
    padding-top: 10px;
}

.more-reasons{
    width: 645px;
    padding-left: 15px;
    background-color: white;
    margin-right: 15px;
    padding-top: 10px;
}

.recommended{
    display: flex;
    padding: 10px;
    background-color: rgb(241, 244, 253); 
}

.recommended img{
    width: 191px;
}
.recommended .box {
    margin: 8px;
    border: 7px solid white;
    background-color:rgb(241, 244, 253);
}
.express img{
    width: 59px; 
}

.best-seller span{ 
    position: absolute;
    background-color: rgb(64, 69, 83); 
    color: white;
    margin-top: 8px;
    margin-left: 8px;
    border: 3px solid rgb(64, 69, 83);
    border-radius: 10px;
}

.price{
    padding: 10px;
}
.naming{
    /* padding: 10px; */
    font-size: small;
    background-color: white;
}
.amount{
    font-weight: bold;
    font-size: large;
}
.express{
    margin-right: 60px;
}
.rating{
    background-color: rgb(130, 174, 4);
    width: 35px;
    border: 2px solid rgb(130, 174, 4);
    border-radius: 10px;
}

.lower-naming{
    display: flex;
}
.title-recommend{
    padding-left: 20px;
    background-color: rgb(241, 244, 253);
}

.christmas ul{
    display: flex;
}
.christmas ul li{
    margin: 4px;
    list-style: none;
}

.deals-on-noon-name{
    background-color:rgb(204, 220, 255) ;
    margin-top: 10px;
}
.deals-on-noon{
    display: flex;
    background-color: rgb(204, 220, 255);
    padding: 5px;
    padding-top: 0px;
}
.deals-on-noon img{
    width: 321px;
    margin: 7px;
}
.yellow-deals{
    display: flex;
    background-color:rgb(204, 220, 255) ;
}
.yellow-deals img{
    width: 429px;
    margin: 0 10px 10px 10px;
}
.advertise img{
    width: 1349px;
}

.noon-brands-title{
    margin: 20px;
}
.noon-brands-name{
    font-weight: bold;
    font-size: 30px;
}
.view-all{
    margin-left: 950px;
    padding: 5px;
    border: 2px solid black;
}

 .noon-brands{
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
 }
.noon-brands .product img{
    width: 191px;
}

.noon-brands .product{
    margin: 10px;
}
.noon-brands-flex{
    display: flex;
    background-color: rgb(219, 219, 219);
    padding: 10px;
}
.noon-brands-flex img{
    width: 670px;
}
.noon-brands-flex-2{
    display: flex;
}
.noon-brands-flex-2 img{
    width: 335px;
}

.categories ul{
    display: flex;
    
}
.categories ul li{
    list-style: none;
    margin: 8px;
}
.categories ul li img{
    width: 177px;
}

.category-name img{
    width: 1349px;
    
}

.footer-flex{
    display: flex;
    background-color: rgb(251,251,251);
    padding: 10px;
}

.footer-flex ul{
    margin: 20px;
}
.footer-flex ul li{
    list-style: none;
    padding: 7px 5px 7px 0;
    font-size: 14px;
    font-weight: 500;
    color: rgba(0, 0, 0, 0.596);
}
.footer-flex ul h3{
    font-size:18px ;
    font-weight: bold;
    padding-bottom: 10px;
}
.left-flex{
    display: flex;
    margin-left: 200px;
}
.right-flex{
    margin-left: 550px;
}
.left-flex-text{
    margin-left: 250px;
    
}
.right-flex-text{
    margin-left: 625px;
}
.footer-last ul{
    display: flex;
    text-align: center;
    align-items: center;
    justify-content: center;
    width: 100%;
    background-color: rgb(240, 240, 240);
    padding-top: 15px;
    padding-bottom: 70px;
}

.footer-last ul li{
    margin: 10px;
    list-style: none;
    
}
.footer-last ul li a{
     color: rgba(0, 0, 0, 0.596);
    font-size: small;
}
.footer-last ul li a:hover{
    text-decoration: underline;
}

.footer-start{
    display: flex;
    margin: 20px;
}
.footer-start-part2{
    display: flex;
    margin-left: 500px;
}
.footer-start-1{
    margin-left: 20px;
}
.footer-start-2{
    margin-left: 10px;
    margin-right: 20px;
}
.footer-start-3{
    margin-left: 10px;
}
.sub{
    font-size: smaller;
    color: rgba(0, 0, 0, 0.596);
}