/* Reconstructed Bij Izzy storefront layout */
* { box-sizing: border-box; }
html { min-height: 100%; background: #f6f2e8; }
body {
  margin: 0 !important;
  min-width: 320px;
  color: #4b4a43;
  background:
    radial-gradient(circle at 15% 5%, rgba(240, 113, 141, .13), transparent 28rem),
    radial-gradient(circle at 90% 20%, rgba(121, 181, 100, .16), transparent 32rem),
    #f7f4ec !important;
  font: 13px/1.55 Arial, Helvetica, sans-serif;
}
a { color: #b64167; text-decoration: none; }
a:hover { color: #7e9c3c; text-decoration: underline; }
#Main {
  width: min(1120px, calc(100% - 28px)) !important;
  margin: 22px auto 42px !important;
  overflow: visible !important;
  background: #fff;
  border: 1px solid #e4dfd2;
  border-radius: 18px;
  box-shadow: 0 18px 48px rgba(76, 64, 44, .14);
}
#TopBar {
  min-height: 38px;
  padding: 0 18px;
  background: #718f45;
  border-radius: 17px 17px 0 0;
}
#TopBarContent { width: auto !important; max-width: none !important; }
#CleanMenu {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none;
}
#CleanMenu li { display: block !important; color: rgba(255,255,255,.38); }
#CleanMenu a {
  display: block;
  padding: 10px 9px 9px;
  color: #fff !important;
  font-size: 12px;
  font-weight: 700;
}
#CleanMenu a:hover { background: rgba(255,255,255,.13); text-decoration: none; }
#Top { position: relative; height: 190px !important; overflow: hidden; }
#TopContent {
  position: relative;
  width: 100% !important;
  height: 190px !important;
  cursor: pointer;
  background:
    radial-gradient(circle at 78% 30%, #fff7a8 0 7px, transparent 8px),
    radial-gradient(circle at 83% 62%, #f39cb1 0 10px, transparent 11px),
    linear-gradient(115deg, #f8c5d0 0%, #fff2d7 46%, #dce9bd 100%);
}
#TopContent img { display: none !important; }
#TopContent:before {
  content: "Bij Izzy";
  position: absolute;
  left: 58px;
  top: 35px;
  color: #b43d67;
  font: italic 700 58px/1 Georgia, serif;
  text-shadow: 0 2px 0 #fff;
}
#TopContent:after {
  content: "hip • eco • fairtrade • uniek";
  position: absolute;
  left: 64px;
  top: 108px;
  color: #688740;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}
#Container {
  display: grid !important;
  grid-template-columns: 220px minmax(0, 1fr) 220px;
  gap: 20px;
  width: auto !important;
  padding: 24px;
  background: #fff;
}
#Left, #Content, #Right {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}
.WindowTop {
  margin: 0 !important;
  padding: 10px 14px !important;
  color: #fff !important;
  background: #e46f8e !important;
  border-radius: 10px 10px 0 0;
  font-size: 15px !important;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .6px;
}
.Window {
  margin: 0 0 18px !important;
  padding: 8px !important;
  background: #fbfaf6 !important;
  border: 1px solid #e9e2d5;
  border-top: 0;
  border-radius: 0 0 10px 10px;
}
.LinkButton { border-bottom: 1px solid #ece7dc; }
.LinkButton:last-child { border-bottom: 0; }
.LinkButton a {
  display: block !important;
  padding: 8px 9px 8px 20px !important;
  color: #565248 !important;
  background: none !important;
  font-size: 12px;
  line-height: 1.3;
  position: relative;
}
.LinkButton a:before {
  content: "›";
  position: absolute;
  left: 7px;
  color: #86a34f;
  font-size: 18px;
  line-height: 14px;
}
.LinkButton a:hover { color: #b64167 !important; background: #fff !important; text-decoration: none; }
.ContentWindow {
  min-height: 600px;
  padding: 24px 30px !important;
  overflow: hidden;
  background: #fff;
  border: 1px solid #e8e2d7;
  border-radius: 12px;
  box-shadow: 0 4px 16px rgba(80,70,50,.06);
}
.ContentWindow p { margin-top: 0; }
.ContentWindow img {
  max-width: 100% !important;
  height: auto !important;
  border-radius: 8px;
}
.ContentWindow img[src*="static.securearea.eu"],
.ContentWindow img[src*="photobucket.com"] {
  min-height: 80px;
  background: linear-gradient(135deg, #f9d6df, #e8f0d2);
}
#Right .Banners, #Right .Bannerstext {
  width: 100% !important;
  margin: 0 0 14px !important;
  padding: 14px 10px !important;
  overflow: hidden;
  background: #fbfaf6;
  border: 1px solid #e9e2d5;
  border-radius: 10px;
}
#Right .Banners:has(img[src*="static.bij-izzy.nl"]) { display: none; }
#Right img { max-width: 100%; height: auto; }
#ShoppingCartTitle a {
  display: block;
  padding: 8px;
  color: #5c594f;
}
.HeightSpace { height: 4px !important; }
#Footer {
  clear: both;
  margin: 0 !important;
  padding: 24px !important;
  color: #fff;
  background: #718f45;
  border-radius: 0 0 17px 17px;
}
#Footer a { color: #fff; }
.BottomBar { background: #4f6934 !important; color: #fff; }
@media (max-width: 900px) {
  #Container { grid-template-columns: 210px minmax(0, 1fr); }
  #Right { display: none; }
}
@media (max-width: 680px) {
  #Main { width: 100% !important; margin: 0 !important; border-radius: 0; }
  #TopBar { border-radius: 0; }
  #CleanMenu li:nth-child(even) { display: none !important; }
  #Top { height: 145px !important; }
  #TopContent { height: 145px !important; }
  #TopContent:before { left: 24px; top: 30px; font-size: 46px; }
  #TopContent:after { left: 27px; top: 90px; font-size: 12px; letter-spacing: 1px; }
  #Container { display: block !important; padding: 14px; }
  #Left { margin-bottom: 18px !important; }
  .ContentWindow { padding: 18px 14px !important; }
}
