html {
  box-sizing: border-box;
  font-family: ivymode, sans-serif;
  letter-spacing: 0.05em;
  overflow-x: hidden;
}
*,
:after,
:before {
  box-sizing: inherit;
}
body {
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto auto auto auto;
  grid-template-areas: "header" "banner" "main" "footer";
  color: #5e2900;
}
.footer,
.header,
.main,
.slider,
body {
  width: 100%;
}
.header {
  z-index: 1;
  grid-area: header;
  display: grid;
  grid-template-columns: 1fr minmax(0, 1200px) 1fr;
  grid-template-rows: 1fr;
  grid-template-areas: ". wrapper .";
  box-shadow: 0 5px 20px 3px rgba(0, 0, 0, 0.3);
  padding: 0 30px;
}
.header__wrapper {
  grid-area: wrapper;
  display: grid;
  grid-template-columns: 2fr 8fr;
  grid-template-rows: 80px;
  grid-template-areas: "logo nav";
  margin: 20px 0;
}
.header__wrapper--topnav {
  grid-template-columns: 2fr 8fr;
  grid-template-rows: 30px 50px;
  grid-template-areas: "logo topnav" "logo nav";
}
.header__logo {
  grid-area: logo;
  align-self: center;
  justify-self: center;
}
.header__logo img {
  width: auto;
  height: 100px;
}
.header__topnav {
  z-index: 1000;
  grid-area: topnav;
  justify-self: end;
  align-self: center;
}
.header__topnav .nav {
  display: flex;
  margin: 0;
  padding: 0;
}
.header__topnav .nav .item {
  margin: 0 15px;
  padding: 5px;
  font-size: 110%;
  color: #222;
}
.header__topnav .nav .item .clicked {
  color: #f9f9f9;
}
.header__nav {
  grid-area: nav;
  align-self: center;
  justify-self: end;
}
.header__nav .nav {
  display: flex;
  margin: 0;
  padding: 0;
}
.header__nav .nav .item {
  padding: 5px 25px;
}
.header__nav .nav .item.item--current {
  font-weight: bold;
}
.header__nav .nav .item:hover .subnav {
  display: block;
}
.header__nav .nav .subnav {
  display: none;
  position: absolute;
  padding-left: 0;
  background-color: #fff;
}
.header__mobilenav-button {
  z-index: 1000;
  grid-area: mobilenav-button;
  justify-self: center;
  align-self: center;
  display: none;
  width: 20px;
  height: 20px;
  cursor: pointer;
}
.header__mobilenav-button:after,
.header__mobilenav-button:before,
.header__mobilenav-button div {
  background-color: #333;
  border-radius: 5px;
  content: "";
  display: block;
  height: 3px;
  margin: 3px 0;
  transition: all 0.2s ease-in-out;
}
.header__mobilenav-button.clicked:before {
  background-color: #f9f9f9;
  transform: translateY(6px) rotate(135deg);
}
.header__mobilenav-button.clicked:after {
  background-color: #f9f9f9;
  transform: translateY(-6px) rotate(-135deg);
}
.header__mobilenav-button.clicked div {
  transform: scale(0);
}
.mobilenav {
  z-index: 1;
  display: none;
  position: absolute;
  width: 100vw;
  height: 100vh;
  background-color: #fff;
  font-size: 1.2rem;
}
.mobilenav__header {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 70px;
  background-color: #5e2900;
}
.mobilenav img {
  width: auto;
  height: 50px;
  opacity: 0.8;
  filter: grayscale(1) invert(1);
}
.mobilenav__nav {
  margin: 0;
  padding: 20px 0 0;
}
.mobilenav__nav a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 80px;
}
.mobilenav__nav .subnav {
  z-index: 2;
  position: absolute;
  top: 70px;
  left: 100vw;
  height: calc(100vh - 70px);
  width: 100vw;
  background-color: #fff;
  opacity: 0;
  transition: all 0.3s ease-out;
}
.mobilenav__nav .subnav__back {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  height: calc(100vh - 70px);
  width: 50px;
  background-color: #eee;
}
.mobilenav__nav .subnav .subnav {
  top: 0;
}
.slider {
  position: relative;
  grid-area: banner;
}
.main,
.slider {
  height: auto;
}
.slider div#n2-ss-2 .n2-ss-slider-4 {
  height: 50%;
  place-self: end;
}
.slider div#n2-ss-2 .n2-ss-slider-4 .n2-ss-slide-3 {
  letter-spacing: -1px;
  background-color: rgba(0, 0, 0, 0.5);
  height: auto !important;
}
.slider div#n2-ss-2 .n-uc-GW9c9Udzy3xT-inner {
  margin-top: -40px;
}
.slider div#n2-ss-2 .n2-font-577e3e94d392c80545fffaf7623e9404-hover {
  font-family: ivymode, sans-serif;
  font-weight: bold;
  margin: 10px 0;
}
.slider div#n2-ss-2 h1 {
  font-size: 48px;
}
.slider div#n2-ss-2 h2 {
  font-size: 36px;
}
.main {
  grid-area: main;
  display: grid;
  background-image: url(../images/bg-body.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  grid-template-columns: 1fr minmax(0, 1200px) 1fr;
  grid-template-areas: ". wrapper .";
  padding: 30px;
  width: 100vw;
}
.main__wrapper {
  grid-area: wrapper;
  padding: 50px;
  background-color: #fff;
  box-shadow: 3px 5px 20px rgba(0, 0, 0, 0.3);
}
.main__incontent .blog-featured {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr));
  gap: 30px;
}
.main__incontent .blog-featured .item__card {
  display: block;
  box-shadow: 1px 3px 25px 0 rgba(0, 0, 0, 0.2);
  transition: box-shadow 0.2s ease-out;
  background-color: #fff;
}
.main__incontent .blog-featured .item__card figure {
  margin: 0;
}
.main__incontent .blog-featured .item__card .btn {
  transition: margin-left 0.2s ease-out;
}
.main__incontent .blog-featured .item__card:hover {
  box-shadow: 1px 3px 30px 0 rgba(0, 0, 0, 0.3);
}
.main__incontent .blog-featured .item__card:hover .btn {
  margin-left: 10px;
}
.main__incontent .blog-featured .item__card__content {
  padding: 0 25px 10px 25px;
  text-align: center;
}
.main__incontent .blog-featured .item__card .item-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.main__incontent p {
  line-height: 1.8;
}
.main__news {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 50px;
  width: 100%;
}
.main__news .item {
  margin: 20px 0;
  width: 75%;
}
.main__news .item__card {
  display: flex;
  flex-direction: row;
  width: 100%;
  box-shadow: 1px 3px 25px 0 rgba(0, 0, 0, 0.2);
  transition: box-shadow 0.2s ease-out;
  background-color: #fff;
}
.main__news .item__card:hover {
  box-shadow: 1px 3px 30px 0 rgba(0, 0, 0, 0.3);
}
.main__news .item__card__image {
  width: 30%;
  overflow: hidden;
}
.main__news .item__card__image img {
  width: 100%;
  height: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
}
.main__news .item__card__content {
  padding: 30px;
  width: 65%;
}
.main__incontent .item-image {
  margin: 0;
}
.main__incontent .item-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 7/3;
  object-fit: cover;
}
.main__incontent .item-page--image-none .item-text {
  justify-self: center;
  width: 80%;
}
.news .main__incontent {
  justify-self: center;
  width: 75%;
}
.footer {
  grid-area: footer;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto auto;
  grid-template-areas: "zusatz" "bottom";
}
.footer__zusatz {
  display: grid;
  grid-area: zusatz;
  grid-template-columns: 1fr minmax(0, 1200px) 1fr;
  grid-template-rows: 1fr;
  grid-template-areas: ". wrapper .";
  padding: 20px 15px;
  background-color: #4b2100;
  color: #f5f5f5;
  box-shadow: inset 0 0 200px rgba(0, 0, 0, 0.5);
}
.footer__zusatz__wrapper {
  grid-area: wrapper;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.footer__zusatz__elem {
  padding: 15px;
}
.footer__zusatz__elem--1 {
  width: 50%;
}
.footer__zusatz__elem--2,
.footer__zusatz__elem--3 {
  width: 25%;
}
.footer__zusatz__elem--2 {
  text-align: center;
}
.footer__zusatz__elem--3 {
  text-align: right;
}
.footer__bottom {
  grid-area: bottom;
  display: grid;
  grid-template-columns: 1fr minmax(0, 1200px) 1fr;
  grid-template-rows: 1fr;
  grid-template-areas: ". wrapper .";
  padding: 20px 30px;
  background-color: #2f1500;
  color: #f9f9f9;
  box-shadow: inset 0 0 200px rgba(0, 0, 0, 0.6);
}
.footer__bottom__wrapper {
  grid-area: wrapper;
  display: grid;
  grid-template-columns: 1fr 2fr;
  grid-template-rows: 1fr 1fr;
  grid-gap: 20px;
  grid-template-areas: "logo sitemap" "copyright impressum";
}
.footer__bottom__logo {
  grid-area: logo;
  display: flex;
  text-align: center;
  align-items: center;
}
.footer__bottom__logo img {
  width: 75%;
  opacity: 0.5;
  filter: grayscale(1) invert(1);
  transition: opacity 0.2s ease-out;
}
.footer__bottom__logo img:hover {
  transition: opacity 0.2s ease-in;
  opacity: 0.8;
}
.footer__bottom__sitemap {
  display: flex;
  grid-area: sitemap;
  align-items: center;
}
.footer__bottom__sitemap ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-end;
  margin: 0;
  padding: 0;
  width: 100%;
}
.footer__bottom__sitemap .item {
  font-weight: 700;
  margin-left: 50px;
}
.footer__bottom__sitemap .item--default {
  display: none;
}
.footer__bottom__sitemap .item .subnav {
  flex-direction: column;
}
.footer__bottom__sitemap .item .subnav li {
  margin: 0;
  padding: 0;
  font-weight: 400;
}
.footer__bottom__copyright {
  grid-area: copyright;
  justify-self: center;
  text-align: center;
}
.footer__bottom__impressum {
  grid-area: impressum;
  justify-self: end;
}
.footer__bottom__impressum ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.footer__bottom__impressum li:nth-child(n + 2) {
  margin: 0 0 0 10px;
}
h1 {
  font-size: 46px;
}
h2 {
  font-size: 34px;
}
h3 {
  font-size: 24px;
  margin-top: 0;
}
p {
  margin-top: 0;
}
.newseinleitung,
.newstitel {
  text-align: center;
  margin: 0;
}
li {
  list-style-type: none;
}
a {
  text-decoration: none;
  color: inherit;
}
hr {
  margin: 2em 0;
  border: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.open-child {
  align-self: flex-end;
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100px;
  height: 50px;
}
.alternate {
  width: 80%;
  border-top: 10px solid #5e2900;
  border-collapse: collapse;
  margin-bottom: 15px;
}
.alternate thead tr {
  background-color: #5e2900 !important;
}
.alternate thead th {
  padding: 4px;
  text-align: left;
  color: #fff;
}
.alternate tr {
  transition: background-color 0.2s linear;
}
.alternate tr:nth-child(odd) {
  background-color: #efe9e5;
}
.alternate tr:nth-child(2n) {
  background-color: #fff;
}
.alternate tr:hover {
  background-color: #bfa999;
}
.alternate td {
  padding: 5px;
  width: 50%;
  hyphens: auto;
}
.alternate--form {
  border-top: 0;
}
.noscroll,
.noscroll body {
  overflow: hidden;
}
.fadingOut {
  transition: opacity 0.6s linear;
  opacity: 0;
}
.bullet {
  z-index: 1100;
  background: url(../html/slider/bullets.png) no-repeat 0 0 !important;
}
.bullet.selected {
  background: url(../html/slider/bullets.png) no-repeat 0 100% !important;
}
.form--contact .componentheading {
  color: #fff;
  font-weight: 700;
  margin-bottom: 15px;
  margin-top: 1em;
  line-height: 170%;
}
.kontaktformular__form__elem {
  margin-bottom: 15px;
  display: grid;
  grid-template-columns: 1fr 1fr 100px 200px;
  grid-template-rows: 1fr;
  grid-template-areas: "produkt kilo menge portion";
  grid-gap: 10px;
}
.kontaktformular__form__elem span {
  align-content: center;
}
.kontaktformular__form__elem span:first-of-type {
  grid-area: produkt;
}
.kontaktformular__form__elem span:nth-of-type(2) {
  grid-area: kilo;
}
.kontaktformular__form__elem input:first-of-type {
  grid-area: menge;
}
.kontaktformular__form__elem input:nth-of-type {
  grid-area: portion;
}
.kontaktformular__form__elem--paket {
  display: grid;
  grid-template-columns: 1fr 150px;
  grid-template-rows: 1fr auto;
  grid-template-areas: "text menge" "table table";
  grid-gap: 10px;
}
.kontaktformular__form__elem--paket p {
  margin: 0;
  grid-area: text;
}
.kontaktformular__form__elem--paket input {
  grid-area: menge;
}
.kontaktformular__form__elem--paket table {
  grid-area: table;
}
.kontaktformular__form__elem--paket input::placeholder {
  opacity: 1 !important;
}
.form--contact input,
.form--contact textarea,
.rsform-submit-button {
  margin: 0;
  padding-left: 5px;
  border: none;
  background-color: #333;
  color: #fff;
  height: 35px;
  font-size: 90%;
}
.rsform-thankyou-button {
  padding: 10px;
  height: auto;
}
.form--contact input::placeholder,
.form--contact textarea::placeholder {
  opacity: 1;
}
#rsform_3_page_1 .kontaktformular__form__elem {
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto;
  grid-template-areas: "produkt menge";
}
#rsform_3_page_1 .kontaktformular__form__elem.lastElem {
  grid-template-areas: "menge produkt";
}
.form--contact textarea {
  height: 70px;
  padding-top: 5px;
}
.form--contact .formError {
  font-size: 80%;
  font-weight: 200;
}
.form--contact input[type="submit"],
.rsform-submit-button {
  background-color: #333;
  transition-property: background-color;
  transition-duration: 0.2s;
  transition-timing-function: ease;
}
.form--contact input[type="submit"]:hover,
.rsform-submit-button:hover {
  background-color: #222;
}
#umbruchNext {
  grid-area: portion;
  line-height: 1.8;
}
fieldset {
  margin: 0;
  padding: 0;
  border: none;
}
@media (max-width: 1200px) {
  .header__wrapper {
    grid-template-columns: 1fr;
    grid-template-rows: 100px 30px;
    grid-template-areas: "logo" "nav";
    margin: 10px 0;
  }
  .header__wrapper--topnav {
    grid-template-columns: 1fr;
    grid-template-rows: 30px 100px 30px;
    grid-template-areas: "topnav" "logo" "nav";
  }
  .header__topnav {
    justify-self: center;
  }
  .header__nav {
    justify-self: center;
  }
  .main {
    grid-template-columns: 1fr 90% 1fr;
    grid-template-rows: 1fr;
    grid-template-areas: ". wrapper .";
  }
  .main__incontent .item-page--image-none .item-text {
    width: 100%;
  }
  .main__news .item {
    width: 100%;
  }
  .main__news .item__card__image {
    width: 45%;
  }
  .news .main__incontent {
    width: 100%;
  }
  .footer__zusatz,
  .footer__bottom {
    grid-template-columns: 1fr 90% 1fr;
    grid-template-rows: 1fr;
    grid-template-areas: ". wrapper .";
  }
  .footer__zusatz__elem--1 {
    width: 100%;
  }
  .footer__zusatz__elem--2,
  .footer__zusatz__elem--3 {
    width: 50%;
  }
  .footer__zusatz__elem--2 {
    text-align: left;
  }
  .footer__bottom__logo {
    display: block;
  }
  .footer__bottom__logo img {
    width: 35%;
  }
  .footer__bottom__sitemap {
    justify-content: center;
  }
  .footer__bottom__sitemap ul {
    justify-content: space-between;
    width: 60%;
  }
  .footer__bottom__sitemap .item {
    margin-left: 0;
  }
  .footer__bottom__wrapper {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto auto;
    grid-template-areas: "logo logo" "sitemap sitemap" "copyright impressum";
  }
  .footer__bottom__copyright {
    justify-self: flex-start;
  }
}
@media (max-width: 750px) {
  .header__wrapper {
    grid-template-columns: 80px 1fr 80px;
    grid-template-rows: 50px;
    grid-template-areas: "mobilenav-button logo .";
  }
  .header__wrapper--topnav {
    grid-template-columns: 80px 1fr 80px;
    grid-template-rows: 50px;
    grid-template-areas: "mobilenav-button logo topnav";
  }
  .header__logo img {
    width: auto;
    height: 75px;
  }
  .header__topnav .nav .item {
    margin: 0 0 0 15px;
  }
  .header__nav .nav {
    flex-direction: column;
  }
  .header__nav {
    display: none;
  }
  .header__mobilenav-button {
    display: block;
  }
  .main__wrapper {
    padding: 25px;
  }
  .main__news .item__card__image {
    width: 100%;
  }
  .main__news .item__card__content {
    width: 100%;
  }
  .main__news .item__card {
    flex-direction: column;
  }
  .main__news .item {
    width: 100%;
  }
  .footer__bottom__logo img {
    width: 50%;
  }
  .main,
  .footer__zusatz,
  .footer__bottom {
    grid-template-columns: 1fr minmax(0, 1200px) 1fr;
  }
  #sendenPrev {
    width: 20%;
  }
  #senden {
    padding: 0 10px;
  }
  .footer__zusatz__elem {
    width: 100%;
    text-align: center;
  }
  .footer__bottom__wrapper {
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr auto auto;
    grid-template-areas: "logo" "sitemap" "copyright" "impressum";
  }
  .footer__bottom__impressum {
    justify-self: center;
  }
  .footer__bottom__impressum ul {
    padding: 0;
  }
  .footer__bottom__sitemap {
    justify-content: center;
    margin-bottom: 15px;
  }
  .footer__bottom__sitemap .item {
    text-align: center;
    margin-left: 0;
  }
  .footer__bottom__sitemap .item .subnav {
    display: none;
  }
  .footer__bottom__copyright {
    justify-self: center;
  }
  .alternate {
    width: 100%;
  }
  .kontaktformular__form__elem {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    grid-template-areas: "produkt kilo" "menge portion";
    margin-bottom: 20px;
    gap: 5px 10px;
  }
  .kontaktformular__form__elem input {
    width: 100%;
  }
  .kontaktformular__form__elem--paket {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    grid-template-areas: "text" "menge" "table";
  }
  .form--contact input::placeholder,
  .form--contact textarea::placeholder {
    opacity: 1;
    color: hsla(0, 0%, 100%, 0.9);
  }
  .noMobile {
    display: none;
  }
  #rsform_3_page_1 .kontaktformular__form__elem {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
    grid-template-areas: "produkt" "menge";
  }
  h1,
  h2,
  h3,
  p {
    hyphens: auto !important;
  }
}
@media (max-width: 650px) {
  .footer__bottom__sitemap li {
    width: 100%;
  }
}
@media (max-width: 420px) {
  .header {
    padding: 0 15px;
  }
  .header__wrapper {
    grid-template-columns: 0.2fr 0.8fr;
    gap: 10px;
  }
  .header__logo img {
    width: 100%;
    height: auto;
    max-height: 75px;
  }
  .slider div#n2-ss-2 .n2-ss-slider-4 {
    height: 75%;
  }
  .main {
    padding: 15px;
  }
  .main__wrapper {
    padding: 15px;
  }
  .main__incontent .blog-featured .item__card__content {
    padding: 0 15px 10px 15px;
  }
  .main__news .item__card__content {
    padding: 15px;
  }
}
@media (max-width: 200px) {
  .slider div#n2-ss-2 .n2-ss-slider-4 {
    height: 100%;
  }
}