/* De Hoeskamer theme: Menu (menukaart) plugin as the paper book (replaces public/assets/css/plugins/Menu.css).
   Legacy Plugins/Menu/Templates/Front/page.html.twig + Menu.css (.menuGroup): 30px script group titles, Merienda
   14px #666 text with a white glow, rows of 12px/15px cell padding, descriptions 12px under the product; the book frame
   and pages are .hk-book in css/style.css. */
.plugin--Menu .menu-cover { text-align: center; }
.plugin--Menu .menu-logo { display: inline-block; width: auto; max-width: 100%; height: auto; margin-top: 40px; }
.plugin--Menu .menu-title { margin: 20px 0 0; }
.plugin--Menu .menu-intro { margin-top: 60px; }
.plugin--Menu .menu-intro h2 { margin: 0 0 10px; }
.plugin--Menu .menu-intro p { margin: 0 0 25px; }

.plugin--Menu .menu-index ul { list-style: none; margin: 0; padding: 0; }
.plugin--Menu .menu-index li { margin: 0; padding: 12px 0 3px; font-family: var(--hk-hand); font-size: 14px; line-height: 1.6; text-shadow: 0 1px 2px #fff; }
.plugin--Menu .menu-index li:first-child { padding-top: 0; }
.plugin--Menu .menu-index a { font-weight: 700; }

.plugin--Menu .menu-group { scroll-margin-top: 6rem; }
.plugin--Menu .menu-group-content p { margin: 0 0 10px; }
.plugin--Menu table.menu-products { width: 100%; margin: 0; border: 0; border-collapse: collapse; background: transparent; }
.plugin--Menu table.menu-products td {
  padding: 12px 15px;
  border: 0;
  background: transparent;
  vertical-align: top;
  font-family: var(--hk-hand);
  font-size: 14px;
  line-height: 1.6;
  color: #666;
  text-shadow: 0 1px 2px #fff;
}
.plugin--Menu table.menu-products td:first-child { padding-left: 0; }
.plugin--Menu table.menu-products td:last-child { padding-right: 0; }
.plugin--Menu table.menu-products td.menu-product { width: 90%; }
.plugin--Menu table.menu-products td.menu-currency { width: 3%; }
.plugin--Menu table.menu-products td.menu-price { width: 7%; white-space: nowrap; }
.plugin--Menu table.menu-products tr.has-description td { padding-bottom: 0; }
.plugin--Menu table.menu-products tr.menu-description td { padding-top: 0; font-size: 12px; }
.plugin--Menu table.menu-products tr.menu-note td { padding-top: 12px; }

.plugin--Menu .menu-allergens { text-align: center; }
.plugin--Menu .menu-allergens img { display: inline-block; width: 142px; height: 142px; }

@media (max-width: 767px) {
  .plugin--Menu .menu-logo { margin-top: 10px; }
  .plugin--Menu .menu-intro { margin-top: 30px; }
  .plugin--Menu .menu-allergens img { width: 100px; height: 100px; }
}