/* STYLES OF EACH PAGE OF DISHES */
   #mainDish, #dessert, #streetfood, #beverage, #aboutUs, #feedback {
      padding-top: 40px;
   }

   .heder {
      font: normal 600 6rem "Dancing Script", cursive;
      color: #505316;
      text-align: center;
   }

   .caption {
      font: normal 500 1.7rem "Solway", serif;
      text-align: center;
      margin-right: 85px;
      letter-spacing: 5px;
      color: #493535;
      font-weight: bold;
   }

   .category {
      padding-right: 101px;
   }

   #md, #des, #sf, #bev {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
   }

   #dishes img:hover, #md img:hover, #des img:hover, #sf img:hover, #bev img:hover {
      transform: scale(1.2);
      transition: 0.5s;
   }

   #md div, #des div, #sf div, #bev div {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 260px;
    height: 390px; 
    margin-top: 20px;
    padding: 0 5px;
   }

   #md img, #des img, #sf img, #bev img {
    width: 260px;
    height: 390px;
    border-radius: 20px;
    object-fit: cover;
   }

   #md .neym, #des .neym, #sf .neym, #bev .neym {
    font: normal 400 1.2rem "Sour Gummy", serif;
    background-color: #FF5757;
    color: black;
    padding: 5px 10px;
    border-radius: 10px;
    position: absolute;
    top: 350px;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
   }

   .container {
      display: flex;
      align-items: flex-start;
      justify-content: flex-start;
      margin: 100px 200px 100px 150px;
      padding-top: 50px;
   }

   .recipe-photo {
      width: 550px;
      height: 673px;
   }

   .text-section {
      flex: 1;
      padding-left: 20px;
   }

   .text-section h1 {
      display: grid;
      font: normal 500 5rem "DM Serif Display", serif;
      color: #597cff;
      margin: 50px 0 -10px 60px;
   }

   #twoSection {
      display: inline !important;
      
   }

   .text-section h2 {
      padding-left: 150px;
      display: block;
      font: normal 500 2.5rem "Fraunces", serif;
      margin-left: 80px;
      letter-spacing: 5px;
      margin-bottom: 35px;
   }

   .text-section p {
      margin: 20px 0 0 30px;
      font: normal 400 17px "Solway", serif;
      line-height: 1.1;
      letter-spacing: 1.5px;
      text-align: justify;
   }

   .mdRep, .desRep, .sfRep, .bevRep {
      background-color: #ffd230;
      margin: 250px 250px 0 250px;
      justify-items: center;
      padding: 150px;
      display: grid;
      grid-template-columns: 1fr;
      height: 1800px;
   }

   .whitebg {
      background-color: rgb(249, 242, 242);
      height: 1750px;
      width: 990px;
      left: 262px;
      margin-top: 60px;
      position: absolute;
   }
   
   .bungee-regular {
      font-family: "Bungee", serif;
      font-weight: 500;
      font-style: normal;
      text-align: center;
      position: relative;
      top: -30px;
      font-size: 35px;
   }

   .whitebg p{
      font: normal 400 2rem "Port Lligat Slab", serif;
      padding: 6.2rem 0 0 6.25rem;
   }

   .whitebg h2{
      font: normal 400 2rem "Port Lligat Slab", serif;
      padding: 6.2rem 0 0 6.25rem;
   }

   .top-photo img {
      margin-left: 650px;
      margin-top: 50px; 
      border-radius: 100%;
      width: 200px;
      height: 200px;
      position: absolute;
   }

   .ingredients {
      display: inline-flex;
      flex-direction: column;
      padding: 2rem 0 0 12rem ;
      font: normal 1.5rem "Open Sans", "serif";
   }

   .vid{
      justify-content: center;
      margin:50px 230px 0 160px ;
   }

   .steplist ul{
      list-style: none; 
      font: normal 400 1.2rem "Oswald", serif;
      margin: 35px 0 10px 175px;
   }

   .steplist p{
      list-style: none;
      text-align: justify; 
      font: normal 400 0.9rem "Arapey", serif;
      margin: -85px 0 10px -100px;
      width:660px
   }


   /* gawing important yung sa two pics sa ilalim(3/2) */
    #md img, #des img, #sf img, #bev img {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      grid-auto-rows: 1fr 1fr;
      padding-top: 20px;
      border-radius: 40px;
      width: 260px;
      height: 390px;
    }