body{
    background-color: black;
    overflow: hidden;
}
.side-nav-black-div{
    position: absolute;
    background-color: black;
    left: -250px;
    top: 0;
    bottom: 0;
    width: 250px;
    
}
.below-text{
    position: absolute;
    top: 85%;
}

.side-nav-white-div{
    position: absolute;
    left:250px ;
    top: 0;
    bottom: 0;
    width: 55px;
    background-color: white;
}
ul{
    display: none;
}
ul li{
    cursor: pointer;
}
.loadingscreen{
    background-color: black;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 99999999999;
    display: flex;
    align-items: center;
    justify-content: center;
}
.loadingscreen2{
    background-color: black;
    position: fixed;
    top: 0;
    left: 55px;
    right: 0;
    bottom: 0;
    z-index: 99999999999;
    display: flex;
    align-items: center;
    justify-content: center;
    
}
.food-img{
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
}
.food-img-layer{
    display: flex;
    align-items: center;
    top: 110%;
    transition: top 0.5s;
    cursor: pointer;
}
.food-img:hover .food-img-layer{
  top: 0;
}
.icon-change{
    cursor: pointer;
}
.side-nav-black-div{
    z-index: 999999;
}
.allArea{
    cursor: pointer;
}
.allIngredients{
    cursor: pointer;
}

::placeholder {
    color: grey !important
    
  }
input{
    color: white !important
}
input:focus {
    color: white;
}
/*****************************************meal Details************************************************/
.mealDetailsLayer li{
    
    background-color: beige;
    border-radius: 10px;
}


.btndiv{
    width: 100px;
}

.form input{
    color: black !important
}
.form input:focus {
    color: black;
}