/*------------------------------------*\
    breakpoint vars
\*------------------------------------*/
/*------------------------------------*\
    breakpoint mixin
\*------------------------------------*/
:root {
  --garden-width: 100mm;
  --garden-height: 100mm;
  --selected-color: #7d9917;
  --ral3000: #a72920;
  --ral5005: #005387;
  --ral6018: #61993b;
  --ral7001: #8c969d;
  --ral7016: #383e42;
  --ral6005: #114232;
  --ral1003: #f9a800;
  --ral2009: #de5307;
  --ral3003: #861a22;
  --ral3020: #cc3300;
  --ral7021: #2f3234;
  --ral7030: #928e85;
  --ral7039: #6B665E;
  --ral9005: #0E0E10;
  --ral9010: #F1EDE1;
  --ral7034: #92886f;
  --ral7037: #7a7b7a;
  --ral7047: #c8c8c7;
  --ral9016: #edede6;
  --ral5002: #00387b;
  --ral5003: #1f3855;
  --ral5011: #1a2b3c;
  --ral5020: #00414b;
  --ral6035: #194d25;
  --ral1006030: #989057;
  --ral0958050: #ddc765;
  --ral1305010: #6f7766;
  --ral2803015: #3d475e;
  --ral0406050: #da7157;
  --ral0908505: #dbd6cb;
  --ral2904045: #4157a2;
  --ral1608005: #bcc8c1;
  --config-accent-color: #b7b7b7;
  --max-zaun-input-width: 375px;
  --attention-color: #ca341c;
  --page-max-width: 100vw;
  --base-font-size: 1.45em;
  --base-h3-size: 3em;
  --base-h2-size: 4em;
  --base-h1-size: 5em;
  --base-h0-size: 6em;
  --base-cta-button-text-size: 2.5em;
  --base-cta-intro-button-text-size: 2.5em;
  --info-h3-size: 2em;
}

@media (min-width: 250px) {
  :root {
    --base-font-size: 1.25em;
    --base-h3-size: 2em;
    --base-cta-intro-button-text-size: 3em;
    --base-h0-size: 3.2em;
    --info-h3-size: 1.7em;
  }
}
@media (min-width: 767px) {
  :root {
    --base-font-size: 1.45em;
    --base-h3-size: 3em;
    --base-cta-intro-button-text-size: 2.5em;
  }
}
@media (min-width: 1080px) {
  :root {
    --base-font-size: 1.5em;
    --base-cta-intro-button-text-size: 2em;
  }
}
@media (min-width: 2560px) {
  :root {
    --base-font-size: 2em;
    --base-h3-size: 3.5em;
    --base-cta-intro-button-text-size: 3em;
  }
}
@media (min-width: 3100px) {
  :root {
    --base-font-size: 2.5em;
    --base-h3-size: 4em;
    --base-cta-intro-button-text-size: 4em;
  }
}
div.RAL3000 {
  background-color: var(--ral3000);
}
div.RAL5005 {
  background-color: var(--ral5005);
}
div.RAL6018 {
  background-color: var(--ral6018);
}
div.RAL7001 {
  background-color: var(--ral7001);
}
div.RAL7016 {
  background-color: var(--ral7016);
}
div.RAL1006030 {
  background-color: var(--ral1006030);
}
div.RAL0958050 {
  background-color: var(--ral0958050);
}
div.RAL1305010 {
  background-color: var(--ral1305010);
}
div.RAL2803015 {
  background-color: var(--ral2803015);
}
div.RAL0406050 {
  background-color: var(--ral0406050);
}
div.RAL0908505 {
  background-color: var(--ral0908505);
}
div.RAL2904045 {
  background-color: var(--ral2904045);
}
div.RAL1608005 {
  background-color: var(--ral1608005);
}
div.RAL6005 {
  background-color: var(--ral6005);
}
div.RAL1003 {
  background-color: var(--ral1003);
}
div.RAL2009 {
  background-color: var(--ral2009);
}
div.RAL3003 {
  background-color: var(--ral3003);
}
div.RAL3020 {
  background-color: var(--ral3020);
}
div.RAL7021 {
  background-color: var(--ral7021);
}
div.RAL7030 {
  background-color: var(--ral7030);
}
div.RAL7039 {
  background-color: var(--ral7039);
}
div.RAL9005 {
  background-color: var(--ral9005);
}
div.RAL9010 {
  background-color: var(--ral9010);
}
div.RAL7034 {
  background-color: var(--ral7034);
}
div.RAL7037 {
  background-color: var(--ral7037);
}
div.RAL7047 {
  background-color: var(--ral7047);
}
div.RAL9016 {
  background-color: var(--ral9016);
}
div.RAL5002 {
  background-color: var(--ral5002);
}
div.RAL5003 {
  background-color: var(--ral5003);
}
div.RAL5011 {
  background-color: var(--ral5011);
}
div.RAL5020 {
  background-color: var(--ral5020);
}
div.RAL6035 {
  background-color: var(--ral6035);
}

.seocontent h3 {
  font-size: 1.75em;
  margin-bottom: 0.5em;
}
.seocontent .doc {
  display: flex;
  flex-direction: row;
  align-content: stretch;
  align-items: stretch;
  justify-content: space-between;
  margin-bottom: 3em;
}
.seocontent .doc p {
  font-size: 1.35em;
  text-align: justify;
  line-height: 1.5em;
}
.seocontent .doc img {
  margin-left: 5%;
}
.seocontent .doc.sec {
  flex-direction: row-reverse;
}
.seocontent .doc.sec img {
  margin-left: unset;
  margin-right: 5%;
}
@media (max-width: 31em) {
  .seocontent .doc {
    flex-direction: column;
  }
  .seocontent .doc img {
    margin: unset;
    margin-bottom: 1em;
  }
  .seocontent .doc.sec {
    flex-direction: column-reverse;
  }
  .seocontent .doc.sec img {
    margin: unset;
    margin-bottom: 1em;
  }
}

.product-image-area {
  border: unset;
  border-radius: unset;
  padding: unset;
}

.product-image {
  border-radius: unset !important;
}

.item-area.type9 {
  padding: 0.5em;
  box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.25) !important;
}
.item-area.type9 .details-area {
  padding: 0.5em;
}
.item-area.type9 .product-image-area {
  margin-bottom: unset;
}
.item-area.type9:hover .product-image-area {
  box-shadow: unset !important;
}

.product-name {
  text-align: left;
}
.product-name a {
  font-size: 1.5rem;
  text-transform: uppercase;
}

.details-area {
  padding-left: 10px;
  padding-right: 10px;
  min-height: 72.2px;
}

.further-variants {
  display: none;
  min-height: 100px;
}

.ias-noneleft {
  margin-top: 25px;
  color: #5f5f5f;
  font-size: 14px;
}

.products-grid {
  margin-top: 5px;
}
@media (max-width: 31em) {
  .products-grid {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
  }
}

.product-view .product-img-box li.etalage_small_thumbs li {
  border: unset;
}
.product-view .product-img-box li.etalage_thumb {
  border: unset;
}

.configure-now {
  cursor: pointer;
}
.configure-now:hover {
  opacity: 0.9;
}

@media screen and (max-width: 480px) {
  .category-products .products-grid li.item .product-image {
    margin-top: -28px;
  }
  .category-products .products-grid li.item .details-area {
    padding-bottom: 0;
    min-height: 144px;
  }
  .category-products .products-grid li.item .details-area .product-name a {
    font-size: 13px;
    font-weight: bold;
  }
  .category-products .products-grid li.item .item-area {
    border-radius: 0.6em;
  }
  .category-products .configure-now {
    text-align: center;
  }
  .category-products .configure-now a {
    color: #5f5f5f;
    text-decoration: unset;
    font-size: 1.2rem;
  }

  .product-name {
    white-space: normal !important;
    margin: 0;
  }
  .product-name a {
    font-size: 1.1rem;
  }

  .products-grid .ratings {
    margin-top: 0;
  }
}