/* Variables */
/* Colors */
/* Fonts */
/* MOBILE FIRST */
/* ------------------------------ LAYOUT ------------------------------ */
*, *:before, *:after {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* Container (contains 12 columns) */
.cont, .container-full-width, .container {
  position: relative;
  margin: 0 auto;
}
.cont:before, .container-full-width:before, .container:before, .cont:after, .container-full-width:after, .container:after {
  content: " ";
  display: table;
  clear: both;
}

.container {
  padding: 1em;
  max-width: 1200px;
}

.container-full-width {
  width: 100%;
}

.row {
  width: 100%;
  content: "";
  display: table;
  clear: both;
}

/* Units */
.s-1, .t-1, .d-1,
.s-2, .t-2, .d-2,
.s-3, .t-3, .d-3,
.s-4, .t-4, .d-4,
.s-5, .t-5, .d-5,
.s-6, .t-6, .d-6,
.s-7, .t-7, .d-7,
.s-8, .t-8, .d-8,
.s-9, .t-9, .d-9,
.s-10, .t-10, .d-10,
.s-11, .t-11, .d-11,
.s-12, .t-12, .d-12 {
  float: left;
  position: relative;
  min-height: 1px;
  width: 100%;
  padding-left: 1.5em;
  padding-right: 1.5em;
}

.content .s-1, .content .t-1, .content .d-1,
.content .s-2, .content .t-2, .content .d-2,
.content .s-3, .content .t-3, .content .d-3,
.content .s-4, .content .t-4, .content .d-4,
.content .s-5, .content .t-5, .content .d-5,
.content .s-6, .content .t-6, .content .d-6,
.content .s-7, .content .t-7, .content .d-7,
.content .s-8, .content .t-8, .content .d-8,
.content .s-9, .content .t-9, .content .d-9,
.content .s-10, .content .t-10, .content .d-10,
.content .s-11, .content .t-11, .content .d-11,
.content .s-12, .content .t-12, .content .d-12 {
  padding-top: 1.5em;
  padding-bottom: 1.5em;
}

/* Small Units */
.s-1 {
  width: calc(100% / 12);
}

.s-2 {
  width: calc(100% / 6);
}

.s-3 {
  width: calc(100% / 4);
}

.s-4 {
  width: calc(100% / 3);
}

.s-5 {
  width: calc(100% * (5/12));
}

.s-6 {
  width: calc(100% / 2);
}

.s-7 {
  width: calc(100% * (7/12));
}

.s-8 {
  width: calc(100% * (8/12));
}

.s-9 {
  width: calc(100% * (9/12));
}

.s-10 {
  width: calc(100% * (10/12));
}

.s-11 {
  width: calc(100% * (11/12));
}

.s-12 {
  width: 100%;
}

.s-hide {
  display: none;
}

/* Medium Units */
@media screen and (min-width: 481px) {
  .s-hide {
    display: block;
  }

  .t-1 {
    width: calc(100% / 12);
  }

  .t-2 {
    width: calc(100% / 6);
  }

  .t-3 {
    width: calc(100% / 4);
  }

  .t-4 {
    width: calc(100% / 3);
  }

  .t-5 {
    width: calc(100% * (5/12));
  }

  .t-6 {
    width: calc(100% / 2);
  }

  .t-7 {
    width: calc(100% * (7/12));
  }

  .t-8 {
    width: calc(100% * (8/12));
  }

  .t-9 {
    width: calc(100% * (9/12));
  }

  .t-10 {
    width: calc(100% * (10/12));
  }

  .t-11 {
    width: calc(100% * (11/12));
  }

  .t-12 {
    width: 100%;
  }

  .t-hide {
    display: none;
  }
}
/* Large Units */
@media screen and (min-width: 961px) {
  .t-hide {
    display: block !important;
  }

  .d-1 {
    width: calc(100% / 12);
  }

  .d-2 {
    width: calc(100% / 6);
  }

  .d-3 {
    width: calc(100% / 4);
  }

  .d-4 {
    width: calc(100% / 3);
  }

  .d-5 {
    width: calc(100% * (5/12));
  }

  .d-6 {
    width: calc(100% / 2);
  }

  .d-7 {
    width: calc(100% * (7/12));
  }

  .d-8 {
    width: calc(100% * (8/12));
  }

  .d-9 {
    width: calc(100% * (9/12));
  }

  .d-10 {
    width: calc(100% * (10/12));
  }

  .d-11 {
    width: calc(100% * (11/12));
  }

  .d-12 {
    width: 100%;
  }

  .d-hide {
    display: none;
  }
}
/* hide spaces for xl devices */
@media screen and (min-width: 1280px) {
  .xl-hide {
    display: none;
  }
}
/* ------------------------------ GENERAL ------------------------------ */
/*
Font size mobile: 		1em = 14px;
Font size > mobile: 	1em = 16px;
*/
/* Highlighting menu links */
.wrapper.start-page header .navigation > #nav-list a.start-page,
.wrapper.offers-page header .navigation > #nav-list a.offers-page,
.wrapper.aboutme-page header .navigation > #nav-list a.aboutme-page,
.wrapper.contact-page header .navigation > #nav-list a.contact-page,
.wrapper.impressum-page footer a.impressum-page {
  font-weight: bold;
}

body {
  background: #f5f5f5;
  /* background-image: url("../images/logo-background.svg"); */
  font-size: 14px;
  font-family: "Raleway", sans-serif;
  line-height: 1.3em;
}
body h1, body h2, body h3, body h4, body h5, body h6 {
  line-height: 1.5;
  font-family: "Comfortaa", cursive;
}
body p {
  line-height: 2;
}
body .wrapper {
  margin: 0 auto;
  width: 100%;
  position: relative;
  height: 100%;
  min-height: 100vh;
}
body img {
  max-width: 100%;
  height: auto;
}
body a {
  color: #3b4501;
}
body button, body .button {
  border: 1px solid #303801;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  font-size: 12px;
  background-color: #303801;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#303801), to(#3B4501));
  background-image: -webkit-linear-gradient(top, #303801, #3B4501);
  background-image: -moz-linear-gradient(top, #303801, #3B4501);
  background-image: -ms-linear-gradient(top, #303801, #3B4501);
  background-image: -o-linear-gradient(top, #303801, #3B4501);
  background-image: linear-gradient(to bottom, #303801, #3B4501);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#303801, endColorstr=#3B4501);
  font-size: 14px;
  font-family: "Raleway", sans-serif;
  color: white;
  padding: 14px 20px;
  margin: 8px 0;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}
body .button:hover, body button:hover {
  background-color: #465201;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#465201), to(#515E01));
  background-image: -webkit-linear-gradient(top, #465201, #515E01);
  background-image: -moz-linear-gradient(top, #465201, #515E01);
  background-image: -ms-linear-gradient(top, #465201, #515E01);
  background-image: -o-linear-gradient(top, #465201, #515E01);
  background-image: linear-gradient(to bottom, #465201, #515E01);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#465201, endColorstr=#515E01);
}
body .right {
  float: right;
}
body .left {
  float: left;
}
body .circle, body .big-circle {
  border-radius: 50%;
  width: 3em;
  height: 3em;
  background: #3b4501;
}
body .big-circle {
  width: 4em;
  height: 4em;
  min-height: 4em;
  min-width: 4em;
}
body .tooltip {
  position: relative;
  display: inline-block;
  padding-left: 1em;
}
body .tooltip img {
  width: 1em;
  height: 1em;
}
body .tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: #3b4501;
  color: white;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  top: 100%;
  left: 50%;
  margin-left: -52px;
  opacity: 0;
  transition: opacity 1s;
}
body .tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent #555 transparent;
}
body .tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}

.clearfix, footer {
  content: "";
  display: table;
  clear: both;
}

header {
  background: white;
}
header .logo-row {
  background: #3b4501;
  text-align: center;
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flexbox;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  /* Burger Button div */
}
header .logo-row > .s-3 {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  margin-top: 0.6em;
  margin-bottom: 0.6em;
}
header .logo-row > .s-3 #toggle-menu {
  background: url(../images/Icons/menu.svg);
  background-size: 35px 35px;
  background-repeat: no-repeat;
  cursor: pointer;
  display: block;
  float: right;
  background-position: center;
  width: 100%;
  height: 100%;
}
header .logo-row #site-logo {
  width: 70%;
  min-width: 170px;
  max-width: 270px;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  float: left;
}
header .container {
  padding: 0;
  /* To make navigation container invisible */
  background: white;
}
header .navigation {
  /* Burger Button */
}
header .navigation > #nav-list {
  display: none;
  height: auto;
  list-style-type: none;
  text-align: center;
  background: white;
  /* make it overlay stage */
  position: absolute;
  left: 0;
  top: 100%;
  width: 100%;
  z-index: 100;
}
header .navigation > #nav-list > li {
  list-style-type: none;
  line-height: 3em;
  border-bottom: 2px solid #f7f7f7;
}
header .navigation > #nav-list > li:last-child {
  border-bottom: none;
}
header .navigation > #nav-list a {
  font-family: "Comfortaa", cursive;
  text-decoration: none;
  font-size: 1em;
}
header .navigation > #nav-list a:active, header .navigation > #nav-list a:hover {
  font-weight: bold;
}
header .separator {
  height: 0.6em;
  background: #e19d3b;
}

.stage {
  width: 100%;
  height: calc(15.6em + 6px);
  background-position: center center;
}

.title-container {
  background-image: url("../images/site-title-pattern.jpg");
  height: 4em;
  color: white;
  text-shadow: 1px 1px #949494;
  box-shadow: 0px 7px 47px -2px rgba(0, 0, 0, 0.05);
}
.title-container > .container {
  height: 100%;
  display: flex;
  align-items: center;
}

.content {
  padding-bottom: 5em;
  /* Background */
  background-image: url("../images/logo-background.svg");
  background-repeat: no-repeat;
  background-size: auto 180vw;
  background-position: -120vw 0;
  /* Grid Manipulation */
}
.content .row {
  display: flex;
  /* Rows in Content = Flexboxes */
  flex-wrap: wrap;
}
.content .row > .right {
  /* Units in Rows go right with class right */
  order: 10;
}
.content .row.right {
  /* Rows with class right order elements beginning at the right */
  flex-direction: row-reverse;
}
.content .inline-picture {
  display: flex;
  align-items: center;
}
.content .inline-picture img {
  border: 0.2em solid white;
}

.start-page .content {
  background-image: url("../images/start.jpg");
  background-size: cover;
  background-position: 45% 50px;
  height: 100vh;
  z-index: -1;
  position: absolute;
  top: 0px;
}
.start-page .content > .row {
  height: 100%;
  display: flex;
  padding-top: 18vh;
}
.start-page .content > .row #start-intro {
  padding: 1em;
  max-width: 500px;
  width: 60%;
  text-align: left;
}
.start-page .content > .row #start-intro > h1 {
  margin-bottom: 1em;
  color: #3b4501;
  font-size: 1.5em;
}
.start-page .content > .row #start-intro > p {
  font-size: 1.25em;
  line-height: 1.5em;
  padding-right: 1em;
}
.start-page .content > .row #start-intro:before {
  opacity: 0.5;
}

.aboutme-page .stage {
  background-image: url("../images/stage/herz_bauch.jpg");
  background-size: cover;
}
.aboutme-page .content > .container {
  padding-top: 3em;
  padding-bottom: 3em;
  background-size: cover;
  background-position: center 0px;
}
.aboutme-page .content > .container > .row > .inline-picture {
  width: 100%;
  align-items: baseline;
}
.aboutme-page .content > .container > .row > .inline-picture #portrait-sm {
  display: none;
}

footer {
  background: #3b4501;
  bottom: 0;
  color: white;
}
footer #scrollTop-arrow {
  float: left;
  height: 1em;
  width: auto;
  cursor: pointer;
}
footer #scrollTop {
  float: left;
  padding-left: 1em;
  cursor: pointer;
}
footer a {
  float: right;
  color: white;
  text-decoration: none;
}
footer a:hover, footer a:active {
  font-weight: bold;
}

#footer-home {
  position: fixed;
  bottom: 0px;
}

/* Media Queries */
@media screen and (min-width: 410px) {
  .start-page .content > .row #start-intro {
    width: 60%;
    background: none;
  }
  .start-page .content > .row #start-intro > p {
    padding-right: 2em;
  }
}
@media screen and (min-width: 381px) {
  .aboutme-page .content > .container > .row .inline-text {
    width: 100%;
  }
  .aboutme-page .content > .container > .row > .inline-picture #portrait-sm {
    display: block;
    width: 100%;
    height: auto;
  }
  .aboutme-page .content > .container > .row > .inline-picture #portrait-sl {
    display: none;
  }
}
@media screen and (min-width: 481px) {
  body {
    font-size: 16px;
  }

  .stage {
    height: 300px;
  }

  .big-circle {
    width: 5em;
    height: 5em;
    min-height: 5em;
    min-width: 5em;
  }

  header .logo-row {
    background: #3b4501;
    text-align: center;
  }
  header .logo-row div:nth-child(2) {
    padding-top: 0.5em;
    padding-bottom: 0.5em;
  }
  header .logo-row #site-logo {
    width: 20%;
    max-width: 270px;
    min-width: 210px;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    float: none;
  }
  header .container {
    padding: 1em;
  }
  header .navigation {
    height: 3em;
  }
  header .navigation .label-toggle {
    display: none;
  }
  header .navigation > #nav-list {
    position: relative;
    display: flex !important;
    justify-content: space-around;
  }
  header .navigation > #nav-list > li {
    list-style-type: none;
    border-bottom: none;
  }
  header .navigation > #nav-list > li > a {
    line-height: 3em;
    font-size: 0.8em;
  }
  header .navigation > #nav-list li:last-child {
    display: none;
  }
  header .navigation > #nav-list li:last-child .separator {
    display: none;
  }

  footer .container span,
footer .container a {
    font-size: 0.8em;
  }

  .start-page .content {
    background-position: 45% 0;
  }
  .start-page .content > .row {
    align-items: center;
    padding-top: 0;
  }
  .start-page .content > .row #start-intro {
    width: 50%;
    margin-top: 0;
    padding: 2em;
  }
}
@media screen and (min-width: 620px) {
  .stage {
    height: 300px;
  }

  .start-page .content > .row #start-intro h1 {
    font-size: 2em;
  }

  header .navigation #nav-list > li > a,
footer .container span,
footer .container a {
    font-size: 1em;
  }
}
@media screen and (min-width: 700px) {
  .aboutme-page .content {
    background-size: auto 200vw;
    background-position: center 0px;
  }
  .aboutme-page .content > .container > .row {
    flex-wrap: nowrap;
  }
  .aboutme-page .content > .container > .row .inline-picture {
    min-width: 300px;
    align-items: baseline;
    width: calc(100% / 3);
  }
  .aboutme-page .content > .container > .row .inline-picture #portrait-sm {
    display: none;
  }
  .aboutme-page .content > .container > .row .inline-picture #portrait-sl {
    display: block;
  }
}
@media screen and (min-width: 940px) {
  .start-page .content {
    background-position: 30% 50px;
  }
  .start-page .content > .row #start-intro {
    width: 60%;
  }
}
@media screen and (min-width: 961px) {
  .stage {
    height: 400px;
  }

  .title-container {
    height: 5.6em;
    /* like navigation */
  }
}
@media screen and (min-width: 1000px) {
  .start-page .content #start-intro {
    margin-left: 10%;
  }

  .aboutme-page .content .inline-picture {
    align-items: center;
    padding: 1.5em;
  }
}
@media screen and (min-width: 1280px) {
  .stage {
    height: 500px;
  }
}
@media screen and (min-width: 1450px) {
  .start-page .content {
    background-position: 30% 50%;
  }
}

/* Contact */
.contact-page .stage {
  background-image: url("../images/stage/aline_bauch.jpg");
  background-size: cover;
  background-position: 30% center;
}
.contact-page .content .contact-box {
  position: relative;
  display: flex;
  align-items: center;
}
.contact-page .content .contact-box p {
  width: 100%;
  text-align: left;
  float: left;
  margin-left: 2em;
}
.contact-page .content .contact-box .big-circle {
  float: left;
  line-height: 5em;
  text-align: center;
}
.contact-page .content .contact-box .big-circle > img {
  height: 40%;
  margin-top: 30%;
}
.contact-page .content .contact-box .contact-text {
  float: left;
}
.contact-page .content .contact-box .contact-text p > span {
  padding-left: 15%;
  white-space: nowrap;
}

@media screen and (min-width: 320px) {
  .contact-page .content .contact-box:last-child .contact-text p > br {
    display: none;
  }
}
@media screen and (min-width: 380px) {
  .contact-page .content .contact-box {
    justify-content: center;
  }
  .contact-page .content .contact-box .contact-text {
    width: 60%;
  }
}
@media screen and (min-width: 481px) {
  .contact-page .content > .container {
    padding-top: 3em;
    padding-bottom: 3em;
  }
  .contact-page .content .row {
    flex-wrap: nowrap;
  }
  .contact-page .content .contact-box {
    padding: 0.5em;
    display: block;
  }
  .contact-page .content .contact-box p {
    text-align: center;
  }
  .contact-page .content .contact-box .big-circle {
    margin-left: calc(50% - 3em);
    margin-bottom: 2em;
    width: 6em;
    height: 6em;
  }
  .contact-page .content .contact-box .contact-text {
    margin-left: 0;
    width: 100%;
  }
  .contact-page .content .contact-box .contact-text p {
    margin-left: 0;
  }
  .contact-page .content .contact-box .contact-text p > span {
    padding-left: 0%;
  }
  .contact-page .content .contact-box:last-child .contact-text p > br {
    display: block;
  }
}
@media screen and (min-width: 700px) {
  .contact-page .content .contact-box {
    padding: 0.5em;
  }
  .contact-page .content .contact-box .contact-text p > span {
    padding-left: 15%;
  }
  .contact-page .content .contact-box:last-child .contact-text p > br {
    display: none;
  }
}
@media screen and (min-width: 961px) {
  .contact-page .content .contact-box {
    padding: 1em;
  }
  .contact-page .content .contact-box .big-circle {
    margin-left: calc(50% - 4em);
    width: 8em;
    height: 8em;
  }
}
/* Offers */
#svgContainer-1, #svgContainer-2 {
  display: none;
}

.offers-page .stage {
  background-image: url("../images/stage/blutdruck.jpg");
  background-size: cover;
  background-position: 15% center;
}
.offers-page .content {
  background: none;
}
.offers-page .content #offers {
  margin-top: 1em;
  margin-bottom: 1em;
  padding-left: 0.5em;
  padding-right: 0.5em;
}
.offers-page .content #offers > .container {
  padding: 0px;
}
.offers-page .content #offers > .container #offer-1 {
  padding-bottom: 0px;
}
.offers-page .content #offers > .container #offer-3 {
  padding-top: 0px;
}
.offers-page .content #offers .offer {
  padding: 1em;
}
.offers-page .content #offers .offer > .offer-header {
  display: inline-flex;
  align-items: center;
  width: 100%;
  cursor: pointer;
  background: #3b4501;
  border-bottom: 1px solid white;
  padding: 1em;
}
.offers-page .content #offers .offer > .offer-header > h2 {
  line-height: 1.5;
  color: white;
  width: 90%;
  font-size: 1.25em;
  padding-right: 0.5em;
}
.offers-page .content #offers .offer > .offer-header .arrow-down {
  background-image: url("../images/Icons/arrow-down.png");
  width: 20px;
  height: auto;
  background-size: cover;
}
.offers-page .content #offers .offer > .offer-header .arrow-up {
  background-image: url("../images/Icons/arrow-up.png");
  width: 20px;
  height: auto;
  background-size: cover;
}
.offers-page .content #offers .offer > p {
  padding-top: 1em;
  padding-left: 1em;
  padding-right: 1em;
  padding-bottom: 2em;
  display: none;
  background: white;
}
.offers-page .content #offers .offer > p > span {
  color: #775f35;
  font-weight: bold;
}
.offers-page .content #offers .white-offer > .container {
  padding: 0;
  margin-left: 1em;
  margin-right: 1em;
  width: 100%;
}
.offers-page .content #offers .inline-picture {
  padding: 0;
  display: none !important;
}
.offers-page .content #offers .inline-picture > img {
  border-color: #f5f5f5;
  width: 100%;
}
.offers-page .content #offers .inline-picture > div {
  background: #3b4501;
  height: 250px;
  margin-top: 2em;
  margin-bottom: 2em;
}
.offers-page .content #offers #offer-2 {
  padding: 0px;
}

@media screen and (min-width: 481px) {
  .offers-page .content {
    background-image: url("../images/logo-background.svg");
    background-size: auto 400vw;
    background-position: -230vw 0;
    background-repeat: no-repeat;
  }
  .offers-page .content .circle-container {
    order: -1;
  }
  .offers-page .content .circle-container .circle, .offers-page .content .circle-container body .big-circle, body .offers-page .content .circle-container .big-circle {
    width: 10em;
    height: 10em;
    background: #c4b292;
    display: flex;
    align-items: center;
    z-index: 15;
    margin-bottom: 1em;
    margin-top: 1em;
    margin-left: calc(50% - 5em);
  }
  .offers-page .content .circle-container .circle > .border, .offers-page .content .circle-container body .big-circle > .border, body .offers-page .content .circle-container .big-circle > .border {
    display: table;
    border: 2px dashed white;
    border-radius: 50%;
    height: 9em;
    width: 9em;
    margin-left: 0.5em;
  }
  .offers-page .content .circle-container .circle > .border > p, .offers-page .content .circle-container body .big-circle > .border > p, body .offers-page .content .circle-container .big-circle > .border > p {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    color: white;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    line-height: 1.5em;
    font-weight: bold;
    text-shadow: 1px 1px #949494;
  }
  .offers-page .content #offers {
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0;
    padding-right: 0;
  }
  .offers-page .content #offers .white-offer > .container {
    padding: 1em;
  }
  .offers-page .content #offers > .container #offer-1, .offers-page .content #offers #offer-2, .offers-page .content #offers > .container #offer-3 {
    margin-top: 0;
    margin-bottom: 3em;
    padding: 1em;
  }
  .offers-page .content #offers .offer > .offer-header {
    cursor: initial;
    background-color: transparent;
    border-bottom: none;
    padding: 0;
  }
  .offers-page .content #offers .offer > .offer-header > h2 {
    width: 100%;
    color: #3b4501;
    padding-right: 0;
    margin-bottom: 1em;
    text-align: center;
    font-size: 1.5em;
  }
  .offers-page .content #offers .offer > .offer-header > span {
    display: none;
  }
  .offers-page .content #offers .offer > p {
    display: block !important;
    /*For resizing width */
    padding-left: 0px;
    padding-right: 0px;
    background: none;
  }
  .offers-page .content #offers .white-offer {
    background: white;
    -webkit-box-shadow: 0px 7px 47px -2px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 0px 7px 47px -2px rgba(0, 0, 0, 0.05);
    box-shadow: 0px 7px 47px -2px rgba(0, 0, 0, 0.05);
  }
  .offers-page .content #offers .white-offer > .container {
    margin: 0 auto;
    padding: 1em;
  }
  .offers-page .content #bg-image {
    height: 300px;
    background-attachment: fixed;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("../images/stage/storch_bg.jpg");
    width: 100%;
  }
  .offers-page .content #bg-image-cover {
    background: white;
    margin-top: -300px;
    opacity: 0.2;
    height: 300px;
    width: 100%;
  }
}
@media screen and (min-width: 700px) {
  .offers-page .content {
    background-size: auto 400vw;
    background-position: -230vw 0;
  }
}
@media screen and (min-width: 961px) {
  .offers-page #svgContainer-1, .offers-page #svgContainer-2 {
    display: block;
    position: absolute;
    z-index: 10;
    content: "";
  }
  .offers-page #svgContainer-1 path, .offers-page #svgContainer-2 path {
    stroke: #c4b292;
    stroke-width: 4px;
  }
  .offers-page .content {
    background-size: auto 200vw;
    background-position: -120vw 0;
  }
  .offers-page .content #offers > .container #offer-1, .offers-page .content #offers #offer-2, .offers-page .content #offers > .container #offer-3 {
    margin-top: 5em;
    margin-bottom: 5em;
  }
  .offers-page .content #offers .offer > .offer-header > h2 {
    text-align: left;
  }
  .offers-page .content #offers .inline-picture {
    display: flex !important;
  }
  .offers-page .content .circle-container {
    order: inherit;
  }
  .offers-page .content .circle-container .circle, .offers-page .content .circle-container body .big-circle, body .offers-page .content .circle-container .big-circle {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: calc((100% - 10em) / 2);
    margin-left: 0;
  }
}
@media screen and (min-width: 1280px) {
  .offers-page .content {
    background-size: auto 150vw;
    background-position: -80vw 0;
  }
  .offers-page .content #offers .white-offer div:nth-child(-n+3) {
    order: 2;
  }
  .offers-page .content #offers .white-offer .inline-picture {
    order: 3;
  }
}
/* About */
.about-page .stage {
  background-image: url("../images/stage/storch_small.jpg");
  background-size: cover;
  background-position: 20% center;
}
.about-page .content #table-impressum {
  width: 100%;
  margin-top: 2em;
  margin-bottom: 2em;
}
.about-page .content #table-impressum tr {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  padding-bottom: 1.5em;
}
.about-page .content #table-impressum td {
  width: 100%;
}
.about-page .content #table-impressum td > p {
  line-height: 1.5;
}
.about-page .content #table-impressum td:nth-child(1) {
  width: 100%;
}
.about-page .content #table-impressum td:nth-child(1) > p {
  font-weight: bold;
}
.about-page .content #table-impressum td:nth-child(2) {
  width: 100%;
  padding-left: 3em;
}
.about-page .content .imp-label {
  font-weight: bold;
  line-height: 2em;
}
.about-page .content .imp-text {
  padding-left: 3em;
  line-height: 2em;
}

@media screen and (min-width: 481px) {
  .about-page .stage {
    background-position: 30% center;
  }
}
@media screen and (min-width: 550px) {
  .about-page .content #table-impressum td:nth-child(2) {
    width: 70%;
    /* padding-left: 0; */
  }
  .about-page .content #table-impressum td:nth-child(1) {
    width: 30%;
    min-width: 8em;
  }
}
@media screen and (min-width: 640px) {
  .about-page .stage {
    background-image: url("../images/stage/storch.jpg");
  }
}
/* 404 Error */
.error-page {
  height: 100vh;
  top: 0px;
  background-image: url("../images/error.jpg");
  background-size: cover;
  background-position: center 5em;
}
.error-page header .logo-row #site-logo {
  float: none;
}
.error-page .content {
  background-image: none;
}
.error-page .content > .row {
  height: 100%;
  display: flex;
  align-items: center;
}
.error-page .content > .row #error-text {
  position: absolute;
  top: 10vh;
}
.error-page .content > .row #error-text > div {
  background: rgba(255, 255, 255, 0.4);
  padding: 3em;
  width: min-content;
  max-width: 400px;
  padding: 3em;
}
.error-page .content > .row #error-text h1 {
  margin-bottom: 1em;
  font-weight: bold;
  color: #6c290e;
}
.error-page .content > .row #error-text p {
  margin-bottom: 1.5em;
}
.error-page .content > .row #error-text a {
  text-decoration: none;
  white-space: nowrap;
}

@media screen and (min-width: 500px) {
  .error-page {
    background-position: center 0px;
  }
  .error-page .content > .row #error-text {
    width: 50%;
    margin-left: 10vw;
  }
}
@media screen and (min-width: 1280px) {
  .error-page .content > .row #error-text > div {
    width: fit-content;
  }
  .error-page .content > .row #error-text > div p {
    margin-bottom: 3em;
  }
}

/*# sourceMappingURL=main.css.map */