*{
    box-sizing: border-box;
  }
  
  body{
      background-color: rgb(47, 31, 15);
      color: white;
      font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
      
  }
  
  .container{
      display:flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      margin-top: 20px;
  }
  .form_class, .main_div{
      display:flex;
      margin-top: 10px;
  }
  input, button{
      border: 1px;
      border-top-left-radius: 4px;
      border-bottom-left-radius: 4px;
      font-size: 14px;
      padding: 8px 10px;
      margin-bottom: 20px;
      
  }
  #search_input{
      width: 300px;
  }
  .search_btn_class{
      cursor: pointer;
      border-radius:0px;
      margin-right:10px; 
      border-top-right-radius: 4px ;
      border-bottom-right-radius: 4px;;
  }
  #shuffle_btn_id{
      cursor: pointer;
      border-radius: 4px;
      width:40px;
  }
  
  .meals{
      display:grid;
      grid-template-columns: repeat(4,1fr);
      grid-gap: 20px;
      grid-top:20px;
  }
  .meal{
      cursor:pointer;
      position: relative;
      height: 180px;
      width:180px;
      text-align:center;
      
  }
  
  .meal img{
      width: 100%;
      height: 100%;
      border: 4px #fff solid;
      border-radius: 2px;
  }
  
  .meal_infoDiv{
      position: absolute;
      top:0px;
      left:0px;
      height: 100%;
      width:100%;
      background: rgba(0,0,0,0.7);
      display:flex;
      align-items: center;
      justify-content: center;
      transition: opacity 0.2s ease-in;
      opacity: 0;
  }
  .meal:hover .meal_infoDiv{
      opacity: 1;
  }
  @media(max-width:800px){
      .meals{
  
          grid-template-columns: repeat(4, 1fr);
      }
      .meal{
          height: 150px;
          width:150px;
      }
      
  
  }
  @media(max-width:700px){
     .meals{
      grid-template-columns: repeat(4, 1fr);
     }
     .meal{
         height: 100px;
         width:100px;
     }
     .meal_infoDiv{
         font-size: 14px;
     }
      
  }
  