/*! normalize.css v2.0.1 | MIT License | git.io/normalize */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary { display: block; }
audio, canvas, video { display: inline-block; }
audio:not([controls]) { display: none; height: 0; }
[hidden] { display: none; }
html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { margin: 0; }
a:focus { outline: thin dotted; }
a:active, a:hover { outline: 0; }
h1 { font-size: 2em; }
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
dfn { font-style: italic; }
mark { background: #ff0; color: #000; }
code, kbd, pre, samp { font-family: monospace, serif; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: "\201C" "\201D" "\2018" "\2019"; }
small { font-size: 80%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
img { border: 0; }
svg:not(:root) { overflow: hidden; }
figure { margin: 0; }
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }
legend { border: 0; padding: 0; }
button, input, select, textarea { font-family: inherit; font-size: 100%; margin: 0; }
button, input { line-height: normal; }
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; }
button[disabled], input[disabled] { cursor: default; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; }
table { border-collapse: collapse; border-spacing: 0; }

/* Image slider (lightweight, responsive cross-fade carousel) */
#slider {
  position: relative;
  width: 100%;
  max-width: 700px;
  margin: 0 auto;
  aspect-ratio: 700 / 400;
  background: #fff;
  overflow: hidden;
  box-shadow: 0px 1px 5px #999999;
}
#slider img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: none;
  opacity: 0;
  transition: opacity 0.8s ease-in-out;
}
#slider img.active { opacity: 1; }

.slider-dots {
  display: flex;
  justify-content: center;
  gap: 10px;
  padding: 14px 0 0;
}
.slider-dots button {
  width: 12px;
  height: 12px;
  padding: 0;
  border: 1px solid #0B6D3C;
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
}
.slider-dots button.active { background: #0B6D3C; }

/* Main styles */
.main-header-container { background-color: #9C3210; }
.main-header { width: 100%; max-width: 990px; min-width: 530px; display: block; margin-left: auto; margin-right: auto; }
.menu { background-color: #0B6D3C; margin: 0 0; padding: 8px 0; text-align: center; list-style: none; }
.menu > li { display: inline-block; margin: 0 40px; }
.menu > li > a { font-size: 20px; color: white; }
.content { background-color: #CEA068; padding-top: 20px; margin-left: auto; margin-right: auto; }
.centered { max-width: 600px; margin-left: auto; margin-right: auto; }
.description { padding: 0 10px; margin-top: 55px; }
.bold { font-weight: bold; }
a { color: #9C3210; text-decoration: none; }
.footer { margin-top: 40px; background-color: #0B6D3C; color: white; padding: 20px 0; text-align: center; }
.footer a { color: white; }
.order { margin-bottom: 30px; }
.order-iframe { background-color: transparent; border: 0px none transparent; display: block; margin: 5px auto 40px auto; padding: 0px; }

/* ==========================================================================
   Responsive / mobile
   ========================================================================== */

/* Never let any element force horizontal scrolling */
html, body { max-width: 100%; overflow-x: hidden; }
img { max-width: 100%; }

@media (max-width: 720px) {
  /* Header image should shrink with the viewport instead of forcing 530px */
  .main-header { min-width: 0; }

  /* Tighter, wrap-friendly nav */
  .menu { padding: 10px 0; }
  .menu > li { margin: 0 14px; }
  .menu > li > a { font-size: 18px; }

  /* The slider is fluid by default (max-width:700px, aspect-ratio), so it
     already adapts here — no overrides needed. */

  /* Order form should use the full width on phones */
  .order-iframe { width: 95% !important; height: 520px; }
}

@media (max-width: 400px) {
  .menu > li { margin: 0 8px; }
  .menu > li > a { font-size: 16px; }
  .description { margin-top: 30px; }
}