body {
   /* color: grey; */
   font-family: Arial, Helvetica, sans-serif;
   /* 12 px nodig voor menu-font */
   font-size: 12px;
}

main {
   /* background: #ffffff; */
   color: #111;
   font-size: 15px;
   line-height: 1.3;
}

td {
   padding: 0.3rem;
}

.buffetmnk-kop-tekst {
   margin-left: 20px;
   margin-bottom: 10px;
   letter-spacing: 0.02em;
   font-size: 16px;
}

.buffetmnk-menukaart-blz1 {
   background-image: url("../images/Achtergr1.jpg");
   background-position: center;
   background-size: cover;
   /* display: none; */
}

.grip-container-buffet {
   display: grid;
   grid-template-columns: repeat(5, 200px);
   grid-template-rows: repeat(2, 150px);
   row-gap: 10px;
   column-gap: 10px;
   max-width: 1040px;
   /* Centreren */
   margin: 0 auto;
}

.blok-tbl {
   border-radius: 5px;
   background-color: #f4f4f4;
   text-align: left;
   grid-column: 1 / 5;
   grid-row: 2 / 4;
   height: 150px;
}

.buffetmnk-tabel {
   width: 100%;
   margin-right: 20px;
   font-size: 15px;
   opacity: 0.7;
}

.buffetmnk-img-fig {
   display: block;
   width: 100%;
   height: 100%;
   /* height: 90%; */
}

.buffetmnk-figbijschrift {
   background-color: black;
   color: white;
   font-style: italic;
   text-align: center;
   /* width: 100%; */
}

.buffetmnk-accent {
   display: block;
   height: 25px;
   width: 35px;
   float: right;
}

.buffetmnk-categorie {
   font-size: 25px;
   color: orange;
}

.buffetmnk-gerecht {
   font-size: 16px;
   color: rgba(17, 17, 205, 0.913);
   font-weight: 400;
}

.buffetmnk-prijs {
   vertical-align: top;
   text-align: right;
   
   width: 75px;
}

.buffetmnk-alergenen {
   vertical-align: super;
   font-size: x-small;
}

.buffet-video-container {
   position: relative;
   height: 50vh;
   width: 50vw;
}

@media only screen and (min-width: 775px) and (max-width: 1070px) {
   .grip-container-buffet {
      grid-template-columns: repeat(3, 185px);
      grid-template-rows: repeat(2, 140px);
      /* 3x185 + 3x10 = 585 */
      max-width: 585px;
   }

   .blok-tbl {
      grid-column: 1 / 4;
      grid-row: 2 / 4;
   }
}

@media (max-width: 700px) {
   .buffetmnk-kop-tekst {
      margin-left: 10px;
   }
}

@media only screen and (min-width: 580px) and (max-width: 775px) {

   .grip-container-buffet { 
      grid-template-columns: repeat(3, 165px);
      grid-template-rows: repeat(1, 170px);
      gap: 9px;
      /* 3x165 + 2*9 = 513 */
      max-width: 513px;
     /* margin: 0 auto; */
   }

   .blok-tbl {
      grid-column: 1 / 4;
      grid-row: 2 / 4;
   }
  
   .buffetmnk-gerecht {
      font-size: 15px;
   }

   .buffetmnk-accent {
      height: 20px;
      width: 30px
   }

   .buffetmnk-categorie {
      font-size: 20px;
   }

   .buffetmnk-prijs {
      padding-right: 5px;
      width: 60px;
   }
}

@media only screen and (max-width: 579px) {

   .grip-container-buffet {
      max-width: 340px;
      grid-template-columns: repeat(2, 165px);
      grid-template-rows: repeat(2, 170px);
      gap: 7px;
   }

   .blok-tbl {
      grid-column: 1 / 3;
      grid-row: 3 / 6;
   }

   .buffetmnk-gerecht {
      font-size: 15px;
   }

   .buffetmnk-accent {
      height: 20px;
      width: 30px;
   }

   .buffetmnk-categorie {
      font-size: 20px;
   }

   .buffetmnk-prijs {
      padding-right: 5px;
      width: 60px;
   }

}