/* ------------------------------ */
/* ----- Typography / Colors ---- */
/* ------------------------------ */

@font-face {
  font-family: 'Nunito';
  font-weight: normal;
  font-style: normal;
  src: url('/wp-content/themes/veganwebagency_child/fonts/nunito-regular.woff') format('woff');
  font-display: swap;
}

@font-face {
  font-family: 'Nunito';
  font-weight: bold;
  font-style: normal;
  src: url('/wp-content/themes/veganwebagency_child/fonts/nunito-bold.woff') format('woff');
  font-display: swap;
}


@font-face {
  font-family: 'Merienda';
  font-weight: bold;
  font-style: normal;
  src: url('/wp-content/themes/veganwebagency_child/fonts/merienda-bold.woff') format('woff');
  font-display: swap;
}



/* ------------------------------ */
/* ---------- Variables --------- */
/* ------------------------------ */

:root {
  /* Brand Fonts */
  --brand-font: 'Nunito';
  --brand-font-headline: 'Merienda';

  /* Brand Colors*/
  --brand-brown: #473816;
  --brand-white: #ffffff;
  --brand-green-dark: #3AAA35;
  --brand-green-light: #A2C617;
  --brand-beige: #EDE8DC;
  --brand-orange: #EC9A29;
  --brand-red: #BF3100;

  /* Additional Colors */
  --brand-gradient-green: linear-gradient(143deg, var(--brand-green-light) 0%, var(--brand-green-dark) 48.31%);
  --brand-gradient-brown: linear-gradient(180deg, rgba(71, 56, 22, 0.8) 0%, rgba(71, 56, 22, 0) 100%);
  --brand-gradient-brown-2: linear-gradient(135deg, #5E4A1D 0%, #473816 55%);
  --border-color: rgb(71 56 22 / 15%);
  --box-shadow: 0px 0px 20px 0px var(--border-color);
  
  /* Font Styling */
  --font-size-8: 60px;
  --font-size-7: 44px;
  --font-size-6: 36px;
  --font-size-5: 30px;
  --font-size-4: 24px;
  --font-size-3: 19px;
  --font-size-2: 18px;
  --font-size-1: 16px;
  --font-size-standard: 21px;
  --line-height-2: 1.4;
  --line-height-1: 1.7;

  /* Hover & Transition */
  --opacity-2: .7;
  --opacity-1: .55;
  --transition-delay: .15s;
  --transition-4: 1s;
  --transition-3: .75s;
  --transition-2: .5s;
  --transition-1: .25s;

  /* Spacing */
  --spacing-13: 240px;
  --spacing-12: 180px;
  --spacing-11: 140px;
  --spacing-10: 120px;
  --spacing-9: 100px;
  --spacing-8: 80px;
  --spacing-7-5: 70px;
  --spacing-7: 60px;
  --spacing-6: 50px;
  --spacing-5: 40px;
  --spacing-4: 30px;
  --spacing-3: 25px;
  --spacing-2: 20px;
  --spacing-1: 15px;
  --spacing-0: 10px;

  /* Layout */
  --height-header: 74px;
  --width-content: 1000px;
  --width-text: 845px;
  --border-radius: 15px;
  --border-radius-small: 10px;
}


/* ------------------------------ */
/* ----------- General ---------- */
/* ------------------------------ */

::selection {
  background: var(--brand-brown);
  color: var(--brand-white);
}

::-moz-selection {
  background: var(--brand-brown);
  color: var(--brand-white);
}

.section--brown ::selection {
  background: var(--brand-white);
  color: var(--brand-brown);
}

.section--brown ::-moz-selection {
  background: var(--brand-white);
  color: var(--brand-brown);
}


html {
  font-size: 20px;
}

body {
  font-family: var(--brand-font);
  font-size: var(--font-size-standard);
  line-height: var(--line-height-1);
  color: var(--brand-brown);
  -webkit-tap-highlight-color: transparent;
}

.site_wrapper {
  background-color: var(--brand-white);
}

h1, h2, h3, h4, .typography--h1, .typography--h3, .typography--h4 {
  font-family: var(--brand-font-headline);
  font-weight: bold;
}

h2:first-child, h3:first-child, h4:first-child, .section > .section__title:first-child h2, .section > .section__title:first-child h3, .section > .section__title:first-child h4 {
  margin-top: 0;
}

h1, .typography--h1, h2, .typography--h2 {
  line-height: 1.3;
}

h1, .typography--h1 {
  font-size: var(--font-size-8);
  margin-top: 0;
}

h2, .typography--h2 {
  font-size: var(--font-size-7);
}

h3, .typography--h3, h4, .typography--h4 {
  line-height: var(--line-height-2);
}

h3, .typography--h3 {
  font-size: var(--font-size-6);
}

h4, .typography--h4 {
  font-size: var(--font-size-5);
  margin-bottom: var(--spacing-1);
}

h4, .section__title h4, .section__text + .section__text h4:first-child {
  margin-top: var(--spacing-6);
}

.entry__teaser__content h4:nth-child(n+2) {
  margin-top: var(--spacing-5);
  margin-bottom: var(--spacing-0);
}

h5, .typography--h5 {
  font-size: var(--font-size-4);
  font-weight: bold;
  line-height: var(--line-height-2);
}

h3 + h4 {
  margin-top: 0;
}

.section--header h1:last-child, .section--header h2:last-child, .section--header h3:last-child {
  margin-bottom: 0;
}

.typography--copy, .typography--copy-bold {
  font-size: var(--font-size-standard);
}

.typography--hint {
  font-size: var(--font-size-2);
}

.typography--bold {
  font-weight: bold;
}

.typography--xs {
  font-size: var(--font-size-1);
}

a {
  color: var(--brand-brown);
  text-decoration: none;
}

a.full {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  max-width: 100%;
  text-indent: -30000px;
  z-index: 10;
  text-decoration: none;
  text-align: left;
}

a.full > span {
  position: absolute;
  height: 1px;
  width: 1px;
  clip: rect(1px,1px,1px,1px);
  border: 0;
  overflow: hidden;
}

a.full::before, a.full::after {
  display: none;
}

section p > a:not(.full), section p > span > a, section li > a:not(.full), footer p > a:not(.full), .responsibility_sanctuary__info__detail a, .accordion--pre_owner a, 
.form_preview__preowner a, .fake_table__cell--contact a, .fake_table__cell--mail a, .fake_table__cell--phone a, main ul li a {
  position: relative;
  border-bottom: 2px dashed;
  line-height: 1.2;
  -webkit-transition: var(--transition-2);
  -o-transition: var(--transition-2);
  transition: var(--transition-2);
}

.no-touchevents section p > a:not(.full):hover, .no-touchevents section p > span > a:hover, .no-touchevents section li > a:not(.full):hover, .no-touchevents .accordion--pre_owner a:hover,
.no-touchevents .form_preview__preowner a:hover, .no-touchevents main ul li a:hover { 
  opacity: var(--opacity-2);
}

p:last-child, ul:last-child {
  margin-bottom: 0;
}

b, strong {
  font-weight: bold;
}

main p + ul {
  margin-top: calc(var(--spacing-0) * -1);
}

main ul li {
  position: relative;
  padding-left: 20px;
}

main ul li + li {
  margin-top: var(--spacing-1);
}

.transfarmation_list {
  margin-bottom: var(--spacing-5);
}

main .transfarmation_list ul li + li, main ul.sitemap li + li, main ul.sitemap ul {
  margin-top: 8px;
}

main ul.sitemap ul {
  margin-bottom: var(--spacing-2);
}

main ul li::before {
  content: "";
  position: absolute;
  left: 0;
  width: 10px;
  height: 2px;
  background-color: var(--brand-brown);
}

strong, b {
  font-weight: bold;
}

span[class$="--hide-text"] {
  position: absolute;
  height: 1px;
  width: 1px;
  clip: rect(1px,1px,1px,1px);
  border: 0;
  overflow: hidden;
}

h1, h2, h3, h4, main p, main ul, main a, main span {
  max-width: var(--width-content);
}

.section--fullwidth h1, .section--fullwidth h2, .section--fullwidth h3, .section--fullwidth h4, main .section--fullwidth p, main .section--fullwidth ul, main .section--fullwidth a, main .section--fullwidth span {
  max-width: 100%;
}

.section--color {
  background-color: var(--brand-beige);
}

.section--brown a {
  color: var(--brand-white);
}

main .section--brown ul li::before {
  background-color: var(--brand-white);
}

.margin-bottom-0 {
  margin-bottom: 0 !important;
}



/* Visually hidden */
a.visually-hidden:not(.skip-link):focus-visible, a.visually-hidden:not(.skip-link):focus {
  position: static !important;
  display: block;
  overflow: visible;
  clip: auto;
  height: auto;
  width: auto;
  margin: var(--spacing-0) 0;
  text-decoration: underline;
}

a.skip-link:focus-visible, a.skip-link:focus {
  overflow: visible;
  clip: auto;
  width: auto;
  height: auto;
  z-index: 10000;
  font-size: var(--font-size-2);
  font-weight: 500;
  color: var(--brand-white);
  background-color: var(--brand-brown);
  padding: 5px 12px;
  outline: 2px solid !important;
}


/* Focus visible */
a:focus-visible, button:focus-visible {
  outline: 2px solid !important;
  transition: unset !important;
}


/* Focus visible form */
input:focus-visible, textarea:focus-visible, select:focus-visible, .select2-container--focus span.select2-selection__rendered {
  outline: 2px solid !important;
  transition: unset !important;
}



/* ------------------------------ */
/* ----------- Layout ----------- */
/* ------------------------------ */

.section {
  position: relative;
  padding-top: var(--spacing-12);
}

.section--white {
  max-width: 1920px;
  margin-right: auto;
  margin-left: auto;
}

.section.section--popup {
  padding-top: 0;
}

.section.section--small-gap {
  padding-top: var(--spacing-10);
}

.section.section--color, .section.section--light {
  padding-bottom: var(--spacing-12);
}

.section.section--color, .section.section--light {
  margin-top: var(--spacing-12);
}

.section.section--color.section--small-gap, .section.section--light.section--small-gap {
  margin-top: var(--spacing-10);
  padding-bottom: var(--spacing-12);
}

.section.section--color.section--no-gap, .section.section--light.section--no-gap {
  margin-top: var(--spacing-7);
}

.section.section--color + .section.section--light, .section.section--color + .section.section--color,
.section.section--light + .section.section--color, .section.section--light + .section.section--light {
  margin-top: 0;
}

.header--cover-map + main .section:first-child {
  padding-top: var(--spacing-11);
}

.section:last-child:not(.section--color) {
  padding-bottom: var(--spacing-11);
}

.header--cover-small + main .section:first-child {
  padding-top: var(--spacing-9);
}

.section > div:not(.popup), .inside {
  margin: 0 auto;
  max-width: 1920px;
}

.section > div.section__table:not(.popup) {
  padding-top: var(--spacing-7);
}

.section > div:not(.popup):first-child, .section__row > .row > div > div:first-child {
  padding-top: 0;
}

.section > div:not(.popup):last-child, .section__row > .row > div > div:last-child {
  padding-bottom: 0;
}


/* Center */
.section > div[class*="--center"].text-align-center h1, .section > div[class*="--center"].text-align-center h2, .section > div[class*="--center"].text-align-center h3, 
.section > div[class*="--center"].text-align-center h4, .section > div[class*="--center"].text-align-center p, .section > div[class*="--center"].text-align-center ul {
  margin-right: auto;
  margin-left: auto;
}

.section > div[class*="--center"] ul {
  white-space: pre-line;
  line-height: 0;
}

.section > div[class*="--center"] ul li {
  display: inline-block; 
  line-height: var(--line-height-1);
}

body.hide-scrollbar {
  overflow: hidden;
}



/* Width */
.width--big, .width--medium, .width--small, .width--extra-small {
  margin-right: auto;
  margin-left: auto;
}

.width--big {
  max-width: 1400px;
}

.section__notice.width--big {
  max-width: 1680px !important;
}

.width--medium {
  max-width: var(--width-content) !important;
}

.width--small {
  max-width: var(--width-text);
}

.width--extra-small {
  max-width: 640px;
}



/* ------------------------------ */
/* ---------- Animation --------- */
/* ------------------------------ */

.intro-animation {
  -webkit-transform-origin: center;
  -ms-transform-origin: center;
  transform-origin: center;
} 


.intro-animation.intro-animation--visible {
  opacity: 1;
  -webkit-transition: opacity .5s;
  -o-transition: opacity .5s;
  transition: opacity .5s;
  will-change: opacity;
}



/* ------------------------------ */
/* ------------ Media ----------- */
/* ------------------------------ */

/* Images */
.picture_container {
  position: relative;
  display: block;
  overflow: hidden;
  line-height: 0;
}

.picture_container--cover img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.picture_container--cover, .picture_container--cover picture {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

@media (max-width: 413.98px) {

  .picture_container:not(.picture_container--cover) img {
    width: 100%;
  }

}


/* Position */
.picture_container--left img {
  -o-object-position: left center;
     object-position: left center;
}

.picture_container--right img {
  -o-object-position: right center;
     object-position: right center;
}

/* Overlay */
.picture_container--overlay::before {
  content: "";
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 0;
  height: 25%;
  width: 100%;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(66, 66, 65, 0)), to(rgba(66, 66, 65, 0.8)));
  background: -o-linear-gradient(top, rgba(66, 66, 65, 0) 0%, rgba(66, 66, 65, 0.8) 100%);
  background: linear-gradient(180deg, rgba(66, 66, 65, 0) 0%, rgba(66, 66, 65, 0.8) 100%);
}


/* Copyright */
.picture_container__copyright {
  position: absolute;
  z-index: 15;
  right: 0;
  bottom: 0;
  padding: 10px;
}

.picture_container__copyright a {
  position: relative;
  z-index: 10;
  display: block;
  font-size: 13px;
  font-weight: bold;
  line-height: 1;
  color: var(--brand-white);
  opacity: .9;
  transition: var(--transition-2);
}

.no-touchevents .picture_container__copyright a:hover {
  opacity: .7;
}

.picture_container__copyright::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -130px;
  width: 240px;
  height: 240px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);
  transform: rotate(-45deg);
  opacity: 1;
}



/* Videos */
.section > div.section__text + .section__vimeo {
  padding-top: var(--spacing-7);
}

.video_container {
  position: relative;
  display: block;
  overflow: hidden;
  line-height: 0;
}

.video_container--embed {
  position: relative;
  overflow: hidden;
  aspect-ratio: 1340 / 720;
}

.section__youtube .video_container--embed, .section__vimeo .video_container--embed {
  background-color: var(--brand-beige);
}

.video_container--embed iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.video_container--cover iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.video_container--cover video{
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: 100%;
}

/* Video thumbs */
.video_container--cover {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}


/* Tutorials */
.section > div.section__text + .section__videos {
  padding-top: var(--spacing-5);
}

.section__videos .video_container {
  border: 1px solid var(--brand-beige);
}


/* iFrames */
.iframe_container {
  position: relative;
  overflow: hidden;
}

.iframe_container iframe {
  max-width: 100%;
}



/* ------------------------------ */
/* ------------ Title ----------- */
/* ------------------------------ */

.section__title {
  padding-top: 0 !important;
}

.section__title + div {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.section__title + .section__title {
  padding-top: var(--spacing-5) !important;
}


/* ------------------------------ */
/* ------- Header no cover ------ */
/* ------------------------------ */

.header--no-cover + main {
  margin-top: calc(-1 * var(--height-header));
}

.header--no-cover + main > .section:first-child.section--brown {
  background: var(--brand-brown);
  background: var(--brand-gradient-brown-2);
  color: var(--brand-white);
}

.header--no-cover + main > .section:first-child.section--brown + .section--white {
  padding-top: var(--spacing-11);
} 



/* ------------------------------ */
/* ------------- Box ------------ */
/* ------------------------------ */

.section > div.section__box + .section__box {
  padding-top: var(--spacing-5);
}

.box {
  box-shadow: var(--box-shadow);
  display: inline-block;
  min-width: 250px;
  border-radius: var(--border-radius);
}

.box h4 {
  margin-bottom: 0;
}



/* ------------------------------ */
/* ------------ Notice ---------- */
/* ------------------------------ */

.section__notice:not(.section__notice--left) {
  text-align: center;
}

.section > div.section__notice + .section__login {
  padding-top: 0;
}

.section > div.section__notice + .section__notice {
  padding-top: var(--spacing-5);
}

.notice__container {
  max-width: var(--width-text);
  margin: 0 auto;
  text-align: left;
}

.notice {
  display: inline-block;
  font-size: var(--font-size-3);
  border-left: 5px solid;
  background-color: var(--brand-white);
  box-shadow: var(--box-shadow);
  text-align: left;
}

.notice--error, .notice--error a {
  color: var(--brand-red);
  border-left-color: var(--brand-red);
}

.notice--success {
  border-left-color: var(--brand-green-dark);
}

.notice--small {
  max-width: var(--width-text);
}



/* ------------------------------ */
/* ------------ Icons ----------- */
/* ------------------------------ */

.icon--brown {
  fill: var(--brand-brown);
}

.icon--white {
  fill: var(--brand-white);
}

.icon--green {
  fill: var(--brand-green-dark);
}

.icon--green-light {
  fill: var(--brand-green-light);
}

.icon--arrow {
  width: 26px;
  height: 14px;
}

.icon--arrow-small {
  width: 21px;
  height: 11px;
}

.icon--play {
  width: 16px;
  height: 16px;
  stroke: var(--brand-white);
}

.icon--circle {
  fill: none;
  stroke:var(--brand-white);
  stroke-linecap: round;
  stroke-dasharray: 10,10;
}

.icon--dragonflies {
  width: 52px;
  height: 96px;
  fill-rule: evenodd;
  clip-rule: evenodd;
}

.icon--bird {
  width: 94px;
  height: 72px;
}

.icon--cow {
  width: 236px;
  height: 180px;
}

.icon--wheat {
  width: 70px;
  height: 84px;
}

.icon--reason-animal {
  width: 80px;
  height: 62px;
}

.icon--reason-market {
  width: 60px;
  height: 60px;
}

.icon--reason-future {
  width: 68px;
  height: 44px;
}

.icon--reason-potential {
  width: 50px;
  height: 64px;
}
 
.icon--reason-possibilities {
  width: 64px;
  height: 56px;
}

.icon--phone {
  width: 32px;
  height: 32px;
}

.icon--mail {
  width: 40px;
  height: 28px;
}

.icon--download {
  width: 22px;
  height: 20px;
  top: 3px;
}

.icon--pin {
  width: 36px;
  height: 36px;
}

.icon--pin-small {
  width: 23px;
  height: 23px;
}



.icon--arrow-back {
  width: 26px;
  height: 14px;
}

.icon--map {
  width: 32px;
  height: 22px;
}

.icon--farm, .icon--heart, .icon--info {
  width: 22px;
  height: 20px;
}

.icon--heart-medium {
  width: 22px;
  height: 20px;
}

.icon--heart-small {
  width: 19px;
  height: 17px;
}

.icon--list {
  width: 22px;
  height: 18px;
}

.icon--filter, .icon--link, .icon--copy {
  width: 20px;
  height: 20px;
}

.icon--arrow_down {
  width: 20px;
  height: 10px;
}

.icon--arrow_down_big {
  width: 30px;
  height: 16px;
  stroke-width: 0.5;
}

.icon--pen, .icon--archive {
  width: 18px;
  height: 18px;
}

.icon--pen-small, .icon--cross {
  width: 16px;
  height: 16px;
}

.icon--bin, .icon--plus, .icon--user {
  width: 18px;
  height: 20px;
}

.icon--eye {
  width: 28px;
  height: 18px;
}

.icon--eye-closed {
  width: 28px;
  height: 22px;
}





.icon--cross.icon--brown, .icon--arrow_down_big.icon--brown, .icon--plus.icon--brown, .icon--copy.icon--brown {
  stroke: var(--brand-brown);
}

.icon--cross.icon--white, .icon--arrow_down_big.icon--white, .icon--question.icon--brown, .icon--plus.icon--white, .icon--copy.icon--white {
  stroke: var(--brand-white);
}

.icon--star {
  width: 19px;
  height: 19px;
}

.icon--question {
  width: 16px;
  height: 22px;
}

.icon--faq {
  width: 12px;
  height: 22px;
}


/* Profile */
.section--tiles .section__title h2 {
  max-width: unset;
  text-align: center;
}




/* ------------------------------ */
/* -------- Media Queries ------- */
/* ------------------------------ */

@media all and (min-width: 576px) {

  p {
    margin: 0 0 var(--spacing-2);
  }

  main ul {
    margin: 0 0 var(--spacing-3);
  }

}


@media all and (min-width: 768px) {

  h2, .section__title h2, .section__text + .section__text h2:first-child {
    margin-top: var(--spacing-9);
  }

  h1 + h2 {
    margin-top: var(--spacing-7);
  }

  h3, .section__title h3, .section__text + .section__text h3:first-child {
    margin-top: var(--spacing-7);
  }

  h2 + h3 {
    margin-top: var(--spacing-5);
  }

  main ul li::before {
    top: 12px;
  }

  .box {
    padding: var(--spacing-4);
  }

  .notice {
    padding: 12px 15px;
  }

}


@media all and (min-width: 992px) {

  .section > div.section__title--center.text-align-center {
    text-align: center;
  }

}


@media all and (min-width: 1240px) {

  h1, .typography--h1 {
    margin-bottom: var(--spacing-4);
  }

  h2 {
    margin-bottom: var(--spacing-4);
  }

  h3, .typography--h3 {
    margin-bottom: var(--spacing-2);
  }

  .section > div[class*="--center"] h1, .section > div[class*="--center"] h2, .section > div[class*="--center"] h3, .section > div[class*="--center"] h4, .section > div[class*="--center"] p, .section > div[class*="--center"] ul {
    margin-right: auto;
    margin-left: auto;
  }

}


@media all and (min-width: 1400px) {

  .section > div:not(.popup), .section__row > .row > div > div {
    padding-top: var(--spacing-8);
  }

  .header--no-cover + main > .section:first-child.section--brown {
    padding: calc(var(--height-header) + var(--spacing-9)) 0 var(--spacing-11);
  }

  .header:not(.header--cover-small):not(.header--cover-map) + main .section:first-child {
    padding-top: var(--spacing-10);
  }

}


@media all and (min-width: 1900px) {

  .section > div:not(.popup), .inside, .footer__inside  {
    padding-right: var(--spacing-11);
    padding-left: var(--spacing-11);
  }

}


@media all and (max-width: 1899.98px) and (min-width: 1600px) {

  .section > div:not(.popup), .inside, .footer__inside  {
    padding-right: var(--spacing-8);
    padding-left: var(--spacing-8);
  }

}


@media all and (max-width: 1599.98px) and (min-width: 1400px) {

  :root {
    --font-size-8: 58px;
    --font-size-7: 42px;

    --spacing-12: 140px;
  }

  .section > div:not(.popup), .inside, .footer__inside  {
    padding-right: var(--spacing-7);
    padding-left: var(--spacing-7);
  }

}


@media all and (max-width: 1399.98px) {

  .section > div:not(.popup), .section__row > .row > div > div {
    padding-top: var(--spacing-7);
  }

  .icon.icon--wheat {
    transform: scale(.7);
  }

}


@media all and (max-width: 1399.98px) and (min-width: 1240px) {

  :root {
    --font-size-8: 52px;
    --font-size-7: 40px;
    --font-size-6: 34px;
    --font-size-5: 28px;
    --font-size-4: 22px;

    --spacing-12: 140px;
    --spacing-11: 120px;
  }

  .section > div:not(.popup), .inside, .footer__inside {
    padding-right: var(--spacing-6);
    padding-left: var(--spacing-6);
  }

  .header--no-cover + main > .section:first-child.section--brown {
    padding: calc(var(--height-header) + var(--spacing-8)) 0 var(--spacing-11);
  }

  .header:not(.header--cover-small):not(.header--cover-map) + main .section:first-child {
    padding-top: var(--spacing-9);
  }

  .icon--arrow_down_big {
    width: 28px;
    height: 15px;
  }

}


@media all and (max-width: 1239.98px) and (min-width: 992px) {

  .section > div:not(.popup), .inside, .footer__inside {
    padding-right: var(--spacing-5);
    padding-left: var(--spacing-5);
  }

}



@media all and (max-width: 1239.98px) and (min-width: 768px) {

  :root {
    --spacing-12: 120px;
    --spacing-11: 110px;
    --spacing-10: 90px;
    --spacing-9: 80px;
    --spacing-8: 65px;

    --font-size-8: 50px;
    --font-size-7: 38px;
    --font-size-6: 34px;
    --font-size-5: 30px;
    --font-size-4: 22px;

    --height-header: 64px;
    --font-size-standard: 20px;
  }

  .header--no-cover + main > .section:first-child.section--brown {
    padding: calc(var(--height-header) + var(--spacing-7)) 0 var(--spacing-11);
  }

  h2 {
    margin-bottom: var(--spacing-3);
  }

  h3, .typography--h3 {
    margin-bottom: var(--spacing-1);
  }

  h1, .typography--h1 {
    margin-bottom: var(--spacing-3);
  }

  .icon--arrow_down_big {
    width: 26px;
    height: 14px;
  }

  .header:not(.header--cover-small):not(.header--cover-map) + main .section:first-child {
    padding-top: var(--spacing-8);
  }

  .entry__teaser__content h4:nth-child(n+2) {
    margin-top: var(--spacing-4);
  }

}


@media all and (max-width: 991.98px) {

  :root {
    --font-size-3: 18px;
    --font-size-2: 17px;
    --font-size-1: 15px;
  }

  html {
    margin-top: 0 !important;
  }

  .header.header--cover-small + main .section:first-child {
    padding-top: var(--spacing-8);
  }

  .width--extra-small {
    margin-right: 0;
    margin-left: 0;
  }

  .box h4 {
    margin-bottom: 5px;
  }

}


@media all and (max-width: 991.98px) and (min-width: 768px) {

  :root {
    --spacing-7: 55px;
    --spacing-0: 8px;
    
    --font-size-8: 44px;
    --font-size-7: 38px;
    --font-size-6: 32px;
    --font-size-5: 28px;
    --font-size-4: 22px;

    --box-shadow: 0px 0px 15px 0px var(--border-color);
  }

  .section > div:not(.popup), .inside, .footer__inside {
    padding-right: var(--spacing-4);
    padding-left: var(--spacing-4);
  }

  .header--cover-map + main .section:first-child {
    padding-top: var(--spacing-10);
  }

  h3, .typography--h3 {
    margin-bottom: var(--spacing-0);
  }

}


@media all and (max-width: 767.98px) and (min-width: 576px) {

  :root {
    --font-size-8: 38px;
    --font-size-7: 31px;
    --font-size-6: 27px;
  }

}


@media all and (max-width: 767.98px) {
/* @media all and (max-width: 767.98px) and (min-width: 576px) { */

  :root {
    --spacing-12: 100px;
    --spacing-11: 90px;
    --spacing-10: 70px;
    --spacing-9: 60px;
    --spacing-8: 50px;
    --spacing-7: 45px;
    --spacing-6: 40px;
    --spacing-5: 35px;
    --spacing-0: 8px;
    
    --font-size-5: 25px;
    --font-size-4: 20px;
    --font-size-3: 18px;
    --font-size-standard: 19px;
    --line-height-1: 1.55;
    --box-shadow: 0px 0px 12px 0px var(--border-color);

    --height-header: 60px;
  }

  .section > div:not(.popup), .inside, .footer__inside {
    padding-right: var(--spacing-3);
    padding-left: var(--spacing-3);
  }

  .section > .section__vimeo, .section > .section__youtube {
    padding-right: 0;
    padding-left: 0;
  }

  .header--no-cover + main > .section:first-child.section--brown {
    padding: calc(var(--height-header) + var(--spacing-7)) 0 var(--spacing-11);
  }

  h1, .typography--h1 {
    margin-bottom: var(--spacing-2);
  }

  h2, h3 {
    margin-top: var(--spacing-7);
  }
  
  .section__title h2, .section__title h3, .section__text + .section__text h2:first-child, .section__text + .section__text h3:first-child {
    margin-top: var(--spacing-6);
  }
  
  h2 {
    margin-bottom: var(--spacing-1);
  }
  
  h3, .typography--h3 {
    margin-bottom: var(--spacing-1);
  }

  h1 br, h2 br, h3 br {
    content: "";
  }

  h1 br::after, h2 br::after, h3 br::after {
    content: " ";
  }

  .section:last-child:not(.section--color) {
    padding-bottom: var(--spacing-10);
  }

  main ul li::before {
    top: 14px;
  }

  .header:not(.header--cover-small):not(.header--cover-map) + main .section:first-child, .header--cover-map + main .section:first-child {
    padding-top: var(--spacing-7);
  }

  .box {
    padding: var(--spacing-2);
  }

  .box > .button {
    margin-right: 0;
    margin-bottom: 0;
  }

  .icon--arrow_down_big {
    width: 23px;
    height: 12px;
  }

  .notice {
    padding: var(--spacing-1) var(--spacing-2);
  }

  section p > a:not(.full), section p > span > a, section li > a:not(.full), footer p > a:not(.full), .responsibility_sanctuary__info__detail a, 
  .accordion--pre_owner a, .quform-page-progress-tab.quform-current-tab, .form_preview__preowner .box a, .fake_table__cell--contact a, .fake_table__cell--mail a, .fake_table__cell--phone a, main ul li a {
    line-height: 1.1;
  }
  
  .picture_container__copyright a {
    font-size: 12px;
  }

  .entry__teaser__content h4:nth-child(n+2) {
    margin-top: var(--spacing-2);
  }

  .section > .section__accordion + .section__title {
    padding-top: var(--spacing-1) !important;
  }

}


@media all and (max-width: 575.98px) {

  :root {
    --font-size-8: 34px;
    --font-size-7: 29px;
    --font-size-6: 27px;
  }

  .header.header--cover-big + main .section:first-child {
    padding-top: var(--spacing-10);
  }

  p, main ul {
    margin: 0 0 var(--spacing-2);
  }

  main ul li { 
    padding-left: 20px;
  }

  .icon.icon--wheat {
    transform: scale(.6);
  }

}


@media all and (max-width: 389.98px) {

  .section > div:not(.popup), .inside, .footer__inside {
    padding-right: var(--spacing-2);
    padding-left: var(--spacing-2);
  }

  .header.header--cover-big + main .section:first-child {
    padding-top: var(--spacing-9);
  }

  .header.header--cover-small + main .section:first-child {
    padding-top: var(--spacing-6);
  }

}