@charset "UTF-8";
/* CSS Document */
/* ################ Einbindung Google Webfonts ################### */
/* poppins-300 - latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  src: url("../fonts/poppins-v6-latin-300.eot");
  /* IE9 Compat Modes */
  src: local("Poppins Light"), local("Poppins-Light"), url("../fonts/poppins-v6-latin-300.eot?#iefix") format("embedded-opentype"), url("../fonts/poppins-v6-latin-300.woff2") format("woff2"), url("../fonts/poppins-v6-latin-300.woff") format("woff"), url("../fonts/poppins-v6-latin-300.ttf") format("truetype"), url("../fonts/poppins-v6-latin-300.svg#Poppins") format("svg");
  /* Legacy iOS */
}

/* poppins-regular - latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/poppins-v6-latin-regular.eot");
  /* IE9 Compat Modes */
  src: local("Poppins Regular"), local("Poppins-Regular"), url("../fonts/poppins-v6-latin-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/poppins-v6-latin-regular.woff2") format("woff2"), url("../fonts/poppins-v6-latin-regular.woff") format("woff"), url("../fonts/poppins-v6-latin-regular.ttf") format("truetype"), url("../fonts/poppins-v6-latin-regular.svg#Poppins") format("svg");
  /* Legacy iOS */
}

/* poppins-500 - latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  src: url("../fonts/poppins-v6-latin-500.eot");
  /* IE9 Compat Modes */
  src: local("Poppins Medium"), local("Poppins-Medium"), url("../fonts/poppins-v6-latin-500.eot?#iefix") format("embedded-opentype"), url("../fonts/poppins-v6-latin-500.woff2") format("woff2"), url("../fonts/poppins-v6-latin-500.woff") format("woff"), url("../fonts/poppins-v6-latin-500.ttf") format("truetype"), url("../fonts/poppins-v6-latin-500.svg#Poppins") format("svg");
  /* Legacy iOS */
}

/* poppins-600 - latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  src: url("../fonts/poppins-v6-latin-600.eot");
  /* IE9 Compat Modes */
  src: local("Poppins SemiBold"), local("Poppins-SemiBold"), url("../fonts/poppins-v6-latin-600.eot?#iefix") format("embedded-opentype"), url("../fonts/poppins-v6-latin-600.woff2") format("woff2"), url("../fonts/poppins-v6-latin-600.woff") format("woff"), url("../fonts/poppins-v6-latin-600.ttf") format("truetype"), url("../fonts/poppins-v6-latin-600.svg#Poppins") format("svg");
  /* Legacy iOS */
}

/* poppins-700 - latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/poppins-v6-latin-700.eot");
  /* IE9 Compat Modes */
  src: local("Poppins Bold"), local("Poppins-Bold"), url("../fonts/poppins-v6-latin-700.eot?#iefix") format("embedded-opentype"), url("../fonts/poppins-v6-latin-700.woff2") format("woff2"), url("../fonts/poppins-v6-latin-700.woff") format("woff"), url("../fonts/poppins-v6-latin-700.ttf") format("truetype"), url("../fonts/poppins-v6-latin-700.svg#Poppins") format("svg");
  /* Legacy iOS */
}

/* ################ Farben ################### */
/*
	bordeaux: #590042 rgb 89,0,66
	beige: #ffedbb rgb 255,237,189
	dgrau: #5d6054 rgb 93,96,84
	grün: #88af33 rgb 136,175,51
*/
/* ################ andere variablen / mixins ################### */
/* benutzen dann wie folgt: @include border-radius($radius50); */
/* ################ Media Queries ################### */
/*456px*/
/*564px*/
/*760px*/
/*1016px*/
/*1272px*/
/*1432px*/
/* ################ Allgemeines ################### */
html, body {
  width: 100%;
  height: 100%;
  overflow-x: no-display;
  /* bei hidden liegt die Scrollleiste obendrüber*/
  /*position: fixed; /*Wegen mobil Safari iOS 7,8 usw. */
  font-size: 16px;
}

@media screen and (min-width: 35.25em) {
  html, body {
    font-size: 17px;
  }
}

@media screen and (min-width: 47.5em) {
  html, body {
    font-size: 18px;
  }
}

@media screen and (min-width: 63.5em) {
  html, body {
    font-size: 20px;
  }
}

@media screen and (min-width: 79.5em) {
  html, body {
    font-size: 23px;
  }
}

*, *:before, *:after {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

/*Schriften, Schriftgröße, Abstände */
body {
  font-family: "Poppins", Helvetica, Arial,sans-serif;
  font-style: normal;
  font-weight: 300;
  color: #5d6054;
  text-align: center;
  /*zentriert den wrap außen, wird vererbt! ggf. mit text-align: left zurücksetzen!*/
  margin-right: auto;
  /*für Zentrierung */
  margin-left: auto;
  position: relative;
  background-color: #ffffff;
  overflow-x: hidden;
  /* bei hidden liegt die Scrollleiste obendrüber*/
}

.pure-g {
  font-family: "Poppins",Helvetica,Arial,sans-serif;
  letter-spacing: normal;
}

h1, h2, h3, h4, h5 {
  font-family: "Poppins",Helvetica,Arial,sans-serif;
  color: #88af33;
  text-align: left;
  font-weight: 500;
}

h1, h2 {
  margin-top: 1rem;
  padding-bottom: 0.6rem;
  font-size: 1.5rem;
  line-height: 1.8rem;
}

/* Klasse für Schriftfarbe bordeaux */
.col_bor, .col_bor a {
  color: #590042;
}

/* Klasse für font-weight semi-bold */
.s-bold {
  font-weight: 600;
}

h3 {
  margin-top: 0.7rem;
  padding-bottom: 0.5rem;
  font-size: 1.3rem;
  line-height: 1.6rem;
}

h4 {
  margin-top: 0.7rem;
  padding-bottom: 0.5rem;
  font-size: 1.1rem;
  line-height: 1.4rem;
}

h6 {
  font-weight: 500;
}

p, h5, h6 {
  text-align: left;
  padding-bottom: 0.4rem;
  font-size: 0.9rem;
  line-height: 1.25rem;
}

p.p-first {
  margin-top: 0.4rem;
}

b {
  font-weight: 500;
}

a {
  font-size: 0.9rem;
  line-height: 1.25rem;
  text-decoration: none;
  color: #5d6054;
}

/*.pure-menu-link{
	padding-right: 1rem;
}*/
a:focus,
a:hover,
a:active {
  font-weight: 500;
  text-decoration: none;
  -webkit-user-select: none;
  /* damit IPad u. IPhone hover können*/
  -webkit-touch-callout: none;
  /* damit IPad u. IPhone hover können*/
}

li {
  list-style: none;
}

figure {
  margin: 0;
}

/* ################ Abstände Seitenränder ################### */
main article > div, main article section, main aside.spalte-links, main aside.spalte-rechts, main .bildergalerie, main aside.planung, footer .wrap-footer, footer .copyright {
  padding-right: 0.5rem;
  padding-left: 0.5rem;
}

.nav-top {
  padding-right: 0.5rem;
}

header .logo {
  padding-left: 0.5rem;
}

@media screen and (min-width: 35.25em) {
  main article > div, main article section, main aside.spalte-links, main aside.spalte-rechts, main .bildergalerie, main aside.planung, footer .wrap-footer, footer .copyright {
    padding-right: 1rem;
    padding-left: 1rem;
  }
  .nav-top {
    padding-right: 1rem;
  }
  header .logo {
    padding-left: 1rem;
  }
}

@media screen and (min-width: 47.5em) {
  main article > div, main article section, main aside.spalte-links, main aside.spalte-rechts, main .bildergalerie, main aside.planung, footer .wrap-footer, footer .copyright {
    padding-right: 2rem;
    padding-left: 2rem;
  }
  header .logo {
    padding-left: 2rem;
  }
}

@media screen and (min-width: 50em) {
  .nav-top {
    padding-right: 2rem;
  }
}

@media screen and (min-width: 79.5em) {
  main article > div, main article section, main aside.spalte-links, main aside.spalte-rechts, main .bildergalerie, main aside.planung, footer .wrap-footer, footer .copyright {
    padding-right: 5%;
    padding-left: 5%;
  }
  .nav-top {
    padding-right: 5%;
  }
  header .logo {
    padding-left: 5%;
  }
}

@media screen and (min-width: 89.5em) {
  main article > div, main article section, main .bildergalerie, main aside.planung, footer .wrap-footer, footer .copyright {
    padding-right: 10%;
    padding-left: 10%;
  }
  main aside.spalte-rechts, .nav-top {
    padding-right: 10%;
  }
  header .logo, main aside.spalte-links {
    padding-left: 10%;
  }
}

@media screen and (min-width: 1900px) {
  main article > div, main article section, main .bildergalerie, main aside.planung, footer .wrap-footer, footer .copyright {
    padding-right: 15%;
    padding-left: 15%;
  }
  main aside.spalte-rechts, .nav-top {
    padding-right: 15%;
  }
  header .logo, main aside.spalte-links {
    padding-left: 15%;
  }
}

/* ################ header ################### */
header {
  position: relative;
  height: auto;
  min-height: 8rem;
  z-index: 300;
  left: 0;
  top: 0;
  /*overflow-y: hidden;*/
  /*overflow-x: hidden;*/
  /* headbilder*/
  /* transparenter Balken am unterem Header-Rand*/
  /* Phone & E-Mail Icons */
  /* deko - Info-box */
}

header figure img {
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
}

header .slider .rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
}

header .slider .rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
}

header .slider .rslides li:first-child {
  position: relative;
  display: block;
  float: left;
}

header .slider .rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
}

header .h-balken {
  background-color: rgba(255, 255, 255, 0.7);
  height: 0.5rem;
  position: absolute;
  bottom: 0rem;
}

header .top-wrap {
  position: fixed;
  top: 14vw;
  /* Positionierung noch optimieren - oder alle Headbilder müssen gleich hoch sein */
  left: 0;
  height: auto;
  z-index: 400;
  /* Balken mit Verlauf*/
  /* navi-balken */
  /* mobil-navigation */
}

header .top-wrap .balken {
  background-color: #590042;
  /* es geht auch rgba($col_bordeaux, 0.5) */
  /* FF3.6-15 */
  /* Chrome10-25,Safari5.1-6 */
  background: -webkit-gradient(linear, left top, right top, from(#590042), to(rgba(89, 0, 66, 0.5)));
  background: linear-gradient(to right, #590042 0%, rgba(89, 0, 66, 0.5) 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#590042', endColorstr='#80590042',GradientType=1 );
  /* IE6-9 */
  height: 1.75rem;
}

header .top-wrap .logo {
  text-align: left;
  position: absolute;
  bottom: 0.1rem;
  left: 0;
  height: auto;
}

header .top-wrap .logo img {
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
}

header .top-wrap .nav-top .menu-top .pure-menu-item {
  text-align: left;
}

header .top-wrap .nav-top .menu-top .pure-menu-item a {
  color: #ffedbb;
  padding: 0.8rem 0.2rem 0rem 0.2rem;
  font-size: 0.8rem;
}

header .top-wrap .nav-top .menu-top .pure-menu-item .pure-menu-children {
  background-color: rgba(89, 0, 66, 0.7);
  padding-top: 0.5rem;
}

header .top-wrap .nav-top .menu-top .pure-menu-item .pure-menu-children .pure-menu-item a {
  padding: 0.5rem 1rem;
}

header .top-wrap .nav-top .menu-top li.active > a.pure-menu-link, header .top-wrap .nav-top .menu-top .pure-menu-link:focus, header .top-wrap .nav-top .menu-top .pure-menu-active:hover, header .top-wrap .nav-top .menu-top .pure-menu-active:active, header .top-wrap .nav-top .menu-top .pure-menu-link:active {
  color: #88af33;
  background-color: transparent;
  font-weight: 700;
  -webkit-user-select: none;
  /* damit IPad u. IPhone hover können*/
  -webkit-touch-callout: none;
  /* damit IPad u. IPhone hover können*/
}

header .top-wrap .nav-top .menu-top .pure-menu-active > .pure-menu-link, header .top-wrap .nav-top .menu-top .pure-menu-active:focus, header .top-wrap .nav-top .menu-top .pure-menu-link:hover {
  color: #88af33;
  background-color: transparent;
  font-weight: 700;
  -webkit-user-select: none;
  /* damit IPad u. IPhone hover können*/
  -webkit-touch-callout: none;
  /* damit IPad u. IPhone hover können*/
}

header .top-wrap .custom-wrapper {
  /* = nav-top */
  position: absolute;
  right: 0rem;
  top: -0.1rem;
  height: 2rem;
  -webkit-transition: height 0.5s;
  transition: height 0.5s;
}

header .top-wrap .custom-wrapper .custom-toggle {
  /* Menü-Hamburger */
  background-color: #ffedbb;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  position: absolute;
  top: -0.4rem;
  right: 0.5rem;
  z-index: 500;
  display: none;
  /* voreingestellt ist, das diese box unsichtbar ist*/
}

header .top-wrap .custom-wrapper .custom-toggle .bar {
  background-color: #590042;
  display: block;
  width: 30px;
  height: 3px;
  border-radius: 100px;
  position: absolute;
  top: 22px;
  right: 7px;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

header .top-wrap .custom-wrapper .custom-toggle .bar:first-child {
  -webkit-transform: translateY(-7px);
  transform: translateY(-7px);
}

header .top-wrap .custom-wrapper .custom-toggle .bar:last-child {
  -webkit-transform: translateY(7px);
  transform: translateY(7px);
}

header .top-wrap .custom-wrapper .custom-toggle.x .bar {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

header .top-wrap .custom-wrapper .custom-toggle.x .bar:first-child {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

header .top-wrap .custom-wrapper.open {
  height: 14.3rem;
  /*Höhe Menü, wenn offen*/
}

header .top-wrap .custom-wrapper.open .menu-top {
  display: inline-block;
  position: relative;
  top: 1.8rem;
  right: 10rem;
  background-color: rgba(89, 0, 66, 0.7);
  z-index: 1000;
  padding: 0rem 0rem 0.5rem 0.5rem;
}

@media screen and (min-width: 28.5em) {
  header .top-wrap .balken {
    height: 2rem;
  }
}

@media screen and (min-width: 35.25em) {
  header .top-wrap {
    top: 11.5vw;
  }
  header .top-wrap .logo {
    bottom: 0.2rem;
  }
}

@media screen and (max-width: 47.5em) {
  header .top-wrap .custom-wrapper {
    /* bei einer Breite von ab SM (768px) wird die toogle box (Hamburger) unsichtbar */
  }
  header .top-wrap .custom-wrapper .custom-toggle {
    display: block;
  }
  header .top-wrap .custom-wrapper .menu-top {
    /* menü ist unsichtbar */
    display: none;
  }
}

@media screen and (min-width: 47.5em) {
  header .top-wrap {
    top: 10vw;
  }
  header .top-wrap .logo {
    bottom: 0.3rem;
  }
}

@media screen and (min-width: 63.5em) {
  header .top-wrap {
    top: 9vw;
  }
  header .top-wrap .logo div {
    width: 300px;
  }
}

@media screen and (min-width: 79.5em) {
  header .top-wrap {
    top: 5.5rem;
  }
}

header .kontakt-icons {
  width: 45px;
  height: auto;
  position: fixed;
  right: 0.5rem;
  top: 14vw;
  margin-top: 2.2rem;
}

header .kontakt-icons div.tel, header .kontakt-icons div.email {
  position: relative;
  z-index: 300;
  background-color: #ffedbb;
  width: 45px;
  height: 45px;
  margin-top: 0.5rem;
  border-radius: 22px;
  right: 0;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
  -webkit-transition-duration: 0.5s;
          transition-duration: 0.5s;
  transition-delay: 0s;
  -webkit-transition-delay: 2s;
  transition-delay: 2s;
  -webkit-animation: showup 4s ease;
  animation: showup 4s ease;
  overflow: hidden;
}

header .kontakt-icons div.tel p, header .kontakt-icons div.email p {
  color: #590042;
  position: relative;
  left: 50px;
  top: -32px;
}

header .kontakt-icons div.tel p a, header .kontakt-icons div.email p a {
  font-weight: 500;
  color: #590042;
  font-size: 1rem;
}

header .kontakt-icons div.tel:hover, header .kontakt-icons div.email:hover, header .kontakt-icons div.tel:active, header .kontakt-icons div.email:active {
  width: 16rem;
  border-radius: 22px;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
  -webkit-transition-duration: .5s;
  transition-duration: .5s;
  right: 13.5rem;
  -webkit-user-select: none;
  /* damit IPad u. IPhone hover können*/
  -webkit-touch-callout: none;
  /* damit IPad u. IPhone hover können*/
}

header .kontakt-icons .tel div, header .kontakt-icons .email div {
  position: relative;
  z-index: 400;
  width: 45px;
  height: 45px;
}

header .kontakt-icons .tel div {
  background: url(../img/icons/icon_anrufen.svg) no-repeat center;
  background-size: 100% auto;
}

header .kontakt-icons .email div {
  background: url(../img/icons/icon_email.svg) no-repeat center;
  background-size: 100% auto;
}

@media screen and (min-width: 35.25em) {
  header .kontakt-icons {
    top: 14vw;
  }
}

@media screen and (min-width: 47.5em) {
  header .kontakt-icons {
    top: 10vw;
  }
}

@media screen and (min-width: 63.5em) {
  header .kontakt-icons {
    top: 9vw;
  }
}

@media screen and (min-width: 79.5em) {
  header .kontakt-icons {
    top: 5.5rem;
  }
}

header aside {
  position: absolute;
  z-index: 100;
  bottom: -18%;
  right: 17vw;
  /*5vw */
  height: 40vw;
  width: 40vw;
}

header aside .kreis-w {
  position: absolute;
  top: 0rem;
  background-color: rgba(255, 255, 255, 0.4);
  height: 100%;
  width: 100%;
  /*border-radius: 50%;*/
  border-radius: 50%;
}

header aside .kreis-g {
  position: absolute;
  top: 15%;
  right: -3vw;
  height: 80%;
  width: 80%;
  background-color: rgba(136, 175, 51, 0.3);
  border-radius: 50%;
}

header aside .kreis-g img {
  position: absolute;
}

header aside h2 {
  text-align: center;
  position: relative;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.1rem;
  top: 4%;
  z-index: 200;
}

@media screen and (min-width: 28.5em) {
  header aside {
    bottom: -20%;
    height: 37vw;
    width: 37vw;
    right: 10vw;
  }
  header aside h2 {
    font-size: 1.15rem;
    line-height: 1.3rem;
  }
}

@media screen and (min-width: 35.25em) {
  header aside {
    right: 5vw;
  }
  header aside h2 {
    top: 7%;
    font-size: 1.3rem;
    line-height: 1.5rem;
  }
}

@media screen and (min-width: 47.5em) {
  header aside {
    height: 34vw;
    width: 34vw;
  }
  header aside h2 {
    top: 8%;
    font-size: 1.4rem;
    line-height: 1.7rem;
  }
}

@media screen and (min-width: 63.5em) {
  header aside {
    bottom: -15%;
    right: 8vw;
    height: 30vw;
    width: 30vw;
  }
  header aside h2 {
    top: 10%;
    font-size: 1.5rem;
    line-height: 1.9rem;
  }
}

@media screen and (min-width: 89.5em) {
  header aside {
    max-height: 650px;
    max-width: 650px;
  }
  header aside h2 {
    top: 14%;
    font-size: 1.8rem;
    line-height: 2.2rem;
  }
}

/* ################ main (startseite + grundsätzliches) ################### */
main {
  /* oberer Text */
  padding-top: 2rem;
  position: relative;
  width: 100%;
  height: auto;
  /* Projekt / Aktuelles */
  /* weiter / weiterlesen allgemein */
}

main .kreis-b1 {
  width: 30vw;
  min-width: 200px;
  max-width: 340px;
  height: 30vw;
  min-height: 200px;
  max-height: 340px;
  background-color: rgba(255, 237, 189, 0.4);
  border-radius: 50%;
  position: absolute;
  top: 1rem;
  left: -4.5rem;
  z-index: 10;
}

main article {
  position: relative;
  z-index: 100;
  /* Starttext */
  /* Das bieten wir Ihnen */
}

main article div.start-text {
  padding-bottom: 2rem;
}

main article section.vorschau-leistungen {
  background-color: rgba(136, 175, 51, 0.4);
  padding-top: 1rem;
}

main article section.vorschau-leistungen h2 {
  padding-bottom: 3rem;
}

main article section.vorschau-leistungen .spalten3-li .img-box, main article section.vorschau-leistungen .spalten3-mi .img-box, main article section.vorschau-leistungen .spalten3-re .img-box {
  position: relative;
  height: auto;
  padding-bottom: 3rem;
}

main article section.vorschau-leistungen .spalten3-li .img-box img.icon, main article section.vorschau-leistungen .spalten3-mi .img-box img.icon, main article section.vorschau-leistungen .spalten3-re .img-box img.icon {
  background-color: rgba(255, 255, 255, 0.7);
  border-radius: 50%;
  padding: 0.2rem;
  position: absolute;
  top: -2.5rem;
  right: 33.33%;
}

@media screen and (min-width: 47.5em) {
  main article section.vorschau-leistungen .spalten3-li .img-box img.icon, main article section.vorschau-leistungen .spalten3-mi .img-box img.icon, main article section.vorschau-leistungen .spalten3-re .img-box img.icon {
    top: -2rem;
  }
}

main article section.vorschau-leistungen .spalten3-li figcaption, main article section.vorschau-leistungen .spalten3-mi figcaption, main article section.vorschau-leistungen .spalten3-re figcaption {
  background-color: rgba(255, 255, 255, 0.7);
  position: absolute;
  bottom: 2.95rem;
  /*3.34vw*/
  left: 0;
}

main article section.vorschau-leistungen .spalten3-li figcaption h3, main article section.vorschau-leistungen .spalten3-mi figcaption h3, main article section.vorschau-leistungen .spalten3-re figcaption h3 {
  text-align: center;
}

main article section.vorschau-leistungen .spalten3-li figcaption h3 a, main article section.vorschau-leistungen .spalten3-mi figcaption h3 a, main article section.vorschau-leistungen .spalten3-re figcaption h3 a {
  font-size: 1.3rem;
  color: #590042;
}

@media screen and (min-width: 47.5em) {
  main article section.vorschau-leistungen {
    /* Abstand zwischen den boxen */
  }
  main article section.vorschau-leistungen .spalten3-li {
    padding-right: 0.4rem;
  }
  main article section.vorschau-leistungen .spalten3-mi {
    padding-right: 0.2rem;
    padding-left: 0.2rem;
  }
  main article section.vorschau-leistungen .spalten3-re {
    padding-left: 0.4rem;
  }
}

main .info-unten {
  position: relative;
}

main .info-unten .kreis-b1 {
  top: -3rem;
  left: -7rem;
}

main .info-unten aside h2 {
  padding-bottom: 1.5rem;
}

main .info-unten .spalte-links {
  padding-top: 1rem;
  padding-bottom: 2rem;
  z-index: 100;
}

main .info-unten .spalte-links .img-box {
  position: relative;
}

main .info-unten .spalte-links .img-box figcaption {
  background-color: rgba(255, 255, 255, 0.7);
  position: absolute;
  bottom: 0;
  left: 0;
}

main .info-unten .spalte-links .img-box figcaption h3 {
  text-align: center;
}

main .info-unten .spalte-links .img-box figcaption h3 a {
  font-size: 1.3rem;
  color: #88af33;
}

main .info-unten .spalte-rechts {
  background-color: rgba(255, 237, 189, 0.4);
  padding-top: 1rem;
  padding-bottom: 1rem;
}

main .info-unten .spalte-rechts .text-box h5 {
  color: #5d6054;
}

main .info-unten .spalte-rechts .text-box p.a-weiter {
  text-align: right;
}

main .info-unten .spalte-rechts .text-box p.a-weiter a {
  font-weight: 500;
  color: #88af33;
}

@media screen and (min-width: 47.5em) {
  main .info-unten .spalte-rechts h3.mehr-abstand {
    margin-top: 5rem;
  }
}

main .weiter a {
  cursor: pointer;
}

main .weiterlesen {
  display: none;
}

/* ################ main (Unterseiten) ################### */
/*main ueber uns*/
main.ueber-uns .start-text ul {
  padding-left: 0.8rem;
}

main.ueber-uns .start-text ul li {
  list-style-type: disc;
  margin-left: 0.5rem;
  color: #88af33;
}

main.ueber-uns .start-text ul li p {
  color: #5d6054;
}

@media screen and (min-width: 35.25em) {
  main.ueber-uns .start-text div ul:first-of-type {
    padding-right: 0.5rem;
  }
  main.ueber-uns .start-text div ul:last-of-type {
    padding-left: 1.3rem;
    /* 0.8rem von oben + 0.5rem*/
  }
}

main.ueber-uns .historie {
  background-color: rgba(136, 175, 51, 0.4);
  padding-top: 1rem;
  margin-top: 0;
  padding-bottom: 1rem;
}

main.ueber-uns .historie ul {
  margin-top: 1rem;
  margin-left: 1.2rem;
  padding-left: 0.7rem;
  padding-bottom: 1rem;
  z-index: 100;
  border-left: 2px solid #88af33;
}

main.ueber-uns .historie ul li {
  list-style-type: disc;
  list-style-position: outside;
  color: #590042;
  margin-top: 0.1rem;
  padding-bottom: 0.3rem;
  font-size: 0.9rem;
  line-height: 1.25rem;
  font-weight: 500;
  text-align: left;
}

main.ueber-uns .spalten2-bild {
  position: relative;
  padding-bottom: 2rem;
}

main.ueber-uns .spalten2-bild .kreis-b1 {
  top: -4rem;
  left: 80vw;
}

main.ueber-uns .spalten2-bild div.img-box {
  position: relative;
  z-index: 100;
}

main.ueber-uns .vorschau-leistungen h2 {
  padding-bottom: 0.5rem;
}

main.ueber-uns .vorschau-leistungen p:last-of-type {
  padding-bottom: 3rem;
}

/*main aktuelles*/
main.aktuelles .vorschau-leistungen h2 {
  padding-bottom: 0.5rem;
}

main.aktuelles .vorschau-leistungen p:last-of-type {
  padding-bottom: 3rem;
}

main.aktuelles .nachricht {
  padding-bottom: 3rem;
}

main.aktuelles .nachricht h5 {
  color: #5d6054;
  padding-bottom: 0;
}

main.aktuelles .nachricht p.m-a {
  padding-bottom: 1rem;
  text-align: right;
}

main.aktuelles .nachricht p.m-a a {
  color: #88af33;
  font-weight: 500;
  font-size: 1rem;
}

main.aktuelles .nachricht .bild3-li, main.aktuelles .nachricht .bild3-mi, main.aktuelles .nachricht .bild3-re {
  padding: 1rem 0rem 0rem 0rem;
}

@media screen and (min-width: 47.5em) {
  main.aktuelles .nachricht .text-li-mit-bild {
    padding-right: 1rem;
  }
  main.aktuelles .nachricht .bild3-li {
    padding-right: 0.4rem;
  }
  main.aktuelles .nachricht .bild3-mi {
    padding-right: 0.2rem;
    padding-left: 0.2rem;
  }
  main.aktuelles .nachricht .bild3-re {
    padding-left: 0.4rem;
  }
}

@media screen and (min-width: 63.5em) {
  main.aktuelles .nachricht .text-li-mit-bild {
    padding-right: 2rem;
  }
}

/*main Leistungen und projekte (bildergalerie)*/
main.leistungen, main.projekte {
  /*allgemeines für leistungen*/
  /*Pflege und Service*/
  /*Planung*/
}

main.leistungen section, main.projekte section {
  margin-top: 1rem;
  padding-bottom: 1rem;
}

main.leistungen section .le-bild, main.projekte section .le-bild {
  padding-top: 0.8rem;
}

@media screen and (min-width: 47.5em) {
  main.leistungen section.leistung-bild-re .le-text, main.projekte section.leistung-bild-re .le-text {
    padding-right: 1rem;
  }
}

@media screen and (min-width: 63.5em) {
  main.leistungen section.leistung-bild-re .le-text, main.projekte section.leistung-bild-re .le-text {
    padding-right: 1.5rem;
  }
}

@media screen and (min-width: 79.5em) {
  main.leistungen section.leistung-bild-re .le-text, main.projekte section.leistung-bild-re .le-text {
    padding-right: 2.5rem;
  }
}

main.leistungen section.leistung-bild-li, main.projekte section.leistung-bild-li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  /* Angabe damit innenliegende (div-boxen) in der Reihenfolge getauscht werden können*/
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  /* Angabe damit innenliegende (div-boxen) in der Reihenfolge getauscht werden können*/
}

main.leistungen section.leistung-bild-li .le-bild, main.projekte section.leistung-bild-li .le-bild {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
  /* Box soll auf Position 2 sein statt wie in html auf Pos. 1*/
}

main.leistungen section.leistung-bild-li .le-text, main.projekte section.leistung-bild-li .le-text {
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
  /* Box soll auf Position 1 sein statt wie in html auf Pos. 2*/
}

@media screen and (min-width: 47.5em) {
  main.leistungen section.leistung-bild-li .le-bild, main.projekte section.leistung-bild-li .le-bild {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
  main.leistungen section.leistung-bild-li .le-text, main.projekte section.leistung-bild-li .le-text {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    padding-left: 1rem;
  }
}

@media screen and (min-width: 63.5em) {
  main.leistungen section.leistung-bild-li .le-text, main.projekte section.leistung-bild-li .le-text {
    padding-left: 1.5rem;
  }
}

@media screen and (min-width: 79.5em) {
  main.leistungen section.leistung-bild-li .le-text, main.projekte section.leistung-bild-li .le-text {
    padding-left: 2.5rem;
  }
}

main.leistungen section.leistung-bild-re, main.projekte section.leistung-bild-re {
  position: relative;
  /*unterer Kreis*/
}

main.leistungen section.leistung-bild-re .kreis-b1, main.projekte section.leistung-bild-re .kreis-b1 {
  top: -5rem;
  left: 80vw;
  z-index: 1;
}

main.leistungen section.leistung-bild-re .le-bild .img-box, main.projekte section.leistung-bild-re .le-bild .img-box {
  position: relative;
  z-index: 50;
}

main.leistungen .bildergalerie, main.projekte .bildergalerie {
  background-color: rgba(136, 175, 51, 0.4);
  padding-top: 1rem;
  padding-bottom: 1rem;
  margin-top: 1rem;
}

main.leistungen .bildergalerie p, main.projekte .bildergalerie p {
  text-align: right;
}

main.leistungen .bildergalerie .galerie-box, main.projekte .bildergalerie .galerie-box {
  margin-top: 1rem;
}

main.leistungen .bildergalerie .galerie-box .my-gallery figure:nth-of-type(odd), main.projekte .bildergalerie .galerie-box .my-gallery figure:nth-of-type(odd) {
  padding-right: 0.5rem;
}

main.leistungen .bildergalerie .galerie-box .my-gallery figure:nth-of-type(even), main.projekte .bildergalerie .galerie-box .my-gallery figure:nth-of-type(even) {
  padding-left: 0.5rem;
}

main.leistungen .bildergalerie .galerie-box .my-gallery figure, main.projekte .bildergalerie .galerie-box .my-gallery figure {
  padding-bottom: 1rem;
}

@media screen and (min-width: 35.25em) {
  main.leistungen .bildergalerie .galerie-box .my-gallery figure:nth-of-type(odd), main.projekte .bildergalerie .galerie-box .my-gallery figure:nth-of-type(odd) {
    padding-right: 0.7rem;
  }
  main.leistungen .bildergalerie .galerie-box .my-gallery figure:nth-of-type(even), main.projekte .bildergalerie .galerie-box .my-gallery figure:nth-of-type(even) {
    padding-left: 0.7rem;
  }
  main.leistungen .bildergalerie .galerie-box .my-gallery figure, main.projekte .bildergalerie .galerie-box .my-gallery figure {
    padding-bottom: 1.4rem;
  }
}

@media screen and (min-width: 47.5em) {
  main.leistungen .bildergalerie .galerie-box .my-gallery, main.projekte .bildergalerie .galerie-box .my-gallery {
    /* für gleichmäßigen Abstand und gleiche Größe der Bildboxen: */
    /* jedes 4. angefangen beim 1. */
    /* jedes 4. angefangen beim 2. */
    /* jedes 4. angefangen beim 3. */
    /* jedes 4. angefangen beim 4. */
  }
  main.leistungen .bildergalerie .galerie-box .my-gallery figure:nth-of-type(odd), main.projekte .bildergalerie .galerie-box .my-gallery figure:nth-of-type(odd) {
    padding-right: 0rem;
  }
  main.leistungen .bildergalerie .galerie-box .my-gallery figure:nth-of-type(even), main.projekte .bildergalerie .galerie-box .my-gallery figure:nth-of-type(even) {
    padding-left: 0rem;
  }
  main.leistungen .bildergalerie .galerie-box .my-gallery figure:nth-of-type(4n-3), main.projekte .bildergalerie .galerie-box .my-gallery figure:nth-of-type(4n-3) {
    padding-right: 1.5rem;
  }
  main.leistungen .bildergalerie .galerie-box .my-gallery figure:nth-of-type(4n-2), main.projekte .bildergalerie .galerie-box .my-gallery figure:nth-of-type(4n-2) {
    padding-right: 1rem;
    padding-left: 0.5rem;
  }
  main.leistungen .bildergalerie .galerie-box .my-gallery figure:nth-of-type(4n-1), main.projekte .bildergalerie .galerie-box .my-gallery figure:nth-of-type(4n-1) {
    padding-right: 0.5rem;
    padding-left: 1rem;
  }
  main.leistungen .bildergalerie .galerie-box .my-gallery figure:nth-of-type(4n), main.projekte .bildergalerie .galerie-box .my-gallery figure:nth-of-type(4n) {
    padding-left: 1.5rem;
  }
  main.leistungen .bildergalerie .galerie-box .my-gallery figure, main.projekte .bildergalerie .galerie-box .my-gallery figure {
    padding-bottom: 2rem;
  }
}

main.leistungen section.pflegeleistung, main.projekte section.pflegeleistung {
  background-color: rgba(136, 175, 51, 0.4);
  padding-top: 1rem;
  margin-top: 0;
}

main.leistungen section.pflegeleistung ul, main.projekte section.pflegeleistung ul {
  padding-left: 2rem;
  padding-bottom: 1rem;
}

main.leistungen section.pflegeleistung ul li, main.projekte section.pflegeleistung ul li {
  list-style-type: disc;
  list-style-position: outside;
  color: #590042;
}

main.leistungen section.pflegeleistung h3, main.leistungen section.pflegeleistung h3 a, main.projekte section.pflegeleistung h3, main.projekte section.pflegeleistung h3 a {
  color: #590042;
  margin-top: 0.1rem;
  padding-bottom: 0.3rem;
}

main.leistungen section.pflegeleistung h3 a:hover, main.leistungen section.pflegeleistung h3 a:focus, main.leistungen section.pflegeleistung h3 a:active, main.projekte section.pflegeleistung h3 a:hover, main.projekte section.pflegeleistung h3 a:focus, main.projekte section.pflegeleistung h3 a:active {
  font-weight: 600;
}

main.leistungen section.pflegeleistung p, main.projekte section.pflegeleistung p {
  color: #5d6054;
}

main.leistungen .planung, main.projekte .planung {
  background-color: rgba(136, 175, 51, 0.3);
  margin-top: 1rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

main.leistungen .planung section, main.projekte .planung section {
  margin-top: 2rem;
}

main.leistungen .planung section .box-li, main.leistungen .planung section .box-mi, main.leistungen .planung section .box-re, main.projekte .planung section .box-li, main.projekte .planung section .box-mi, main.projekte .planung section .box-re {
  padding-bottom: 1rem;
}

@media screen and (min-width: 47.5em) {
  main.leistungen .planung section .box-li, main.projekte .planung section .box-li {
    padding-right: 0.5rem;
  }
  main.leistungen .planung section .box-re, main.projekte .planung section .box-re {
    padding-left: 0.5rem;
  }
  main.leistungen .planung section h3, main.projekte .planung section h3 {
    margin-top: 0rem;
  }
}

/* Datenschutz*/
.impr-datens main article .start-text p strong {
  font-weight: 500;
}

.impr-datens main article .start-text ul {
  padding-left: 2rem;
  padding-bottom: 1rem;
}

.impr-datens main article .start-text ul li {
  list-style-type: disc;
  list-style-position: outside;
  text-align: left;
  padding-bottom: 0.4rem;
  font-size: 0.9rem;
  line-height: 1.25rem;
}

/* nur für Projekte */
main.projekte article section div:first-of-type {
  margin-top: 0.5rem;
}

main.projekte article section div.le-text h4 a {
  color: #88af33;
}

main.projekte article section div.le-text h4 a.closed span.aus, main.projekte article section div.le-text h4 a.open span.an {
  display: none;
}

main.projekte article section.leistung-bild-li div.le-bild, main.projekte article section.leistung-bild-re div.le-bild {
  padding-top: 0.2rem;
}

main.projekte article section.leistung-bild-re {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  /* Angabe damit innenliegende (div-boxen) in der Reihenfolge getauscht werden können*/
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  /* Angabe damit innenliegende (div-boxen) in der Reihenfolge getauscht werden können*/
}

main.projekte article section.leistung-bild-re .le-bild {
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
}

main.projekte article section.leistung-bild-re .le-text {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}

@media screen and (min-width: 47.5em) {
  main.projekte article section.leistung-bild-re .le-bild {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
  main.projekte article section.leistung-bild-re .le-text {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
}

main.projekte article section.leistung-bild-li .le-bild {
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
}

main.projekte article section.leistung-bild-li .le-text {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}

@media screen and (min-width: 47.5em) {
  main.projekte article section.leistung-bild-li .le-bild {
    -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
            order: 1;
  }
  main.projekte article section.leistung-bild-li .le-text {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}

@media screen and (min-width: 47.5em) {
  main.projekte article section.leistung-bild-li div.le-bild, main.projekte article section.leistung-bild-re div.le-text {
    padding-right: 1rem;
  }
  main.projekte article section.leistung-bild-li div.le-text, main.projekte article section.leistung-bild-re div.le-bild {
    padding-left: 1rem;
  }
}

main.projekte article aside.bildergalerie {
  margin-top: 0rem;
}

@media screen and (min-width: 47.5em) {
  main.projekte article aside.bildergalerie {
    padding-bottom: 0rem;
  }
}

/* bildergalerien - große Ansicht */
.pswp .pswp__bg {
  background: rgba(0, 0, 0, 0.8);
}

/* main kontakt */
main.kontakt {
  /*spalte links*/
  /*spalte rechts*/
}

main.kontakt .spa-links {
  padding-bottom: 1.5rem;
}

main.kontakt .spa-links h4 {
  margin-top: 1.5rem;
}

main.kontakt .spa-links table {
  margin-top: 1.5rem;
  padding-bottom: 1.5rem;
  border-collapse: initial;
}

main.kontakt .spa-links table td:first-child {
  padding-right: 1rem;
}

main.kontakt .spa-links table td:first-child b {
  color: #88af33;
}

main.kontakt .spa-links div {
  margin-top: 0.5rem;
  padding-bottom: 0.5rem;
}

main.kontakt .spa-rechts {
  padding-right: 0rem;
  padding-left: 0rem;
}

main.kontakt .spa-rechts h3 {
  margin-top: 0rem;
}

main.kontakt .spa-rechts .form {
  /* browser einstellungen zurücksetzen bzw. unsichtbar machen (Checkbox)*/
  /* alle browser einstellungen zurücksetzen bzw. unsichtbar machen*/
}

main.kontakt .spa-rechts .form fieldset {
  margin-top: 0.3rem;
  padding-bottom: 0.1rem;
}

main.kontakt .spa-rechts .form fieldset .t-re {
  text-align: right;
}

main.kontakt .spa-rechts .form fieldset:last-of-type {
  position: relative;
  top: -1rem;
  margin-top: 0rem;
  padding-top: 0;
}

main.kontakt .spa-rechts .form fieldset:last-of-type p.small, main.kontakt .spa-rechts .form fieldset:last-of-type p.small a {
  font-size: 0.7rem;
  line-height: 1.1rem;
}

main.kontakt .spa-rechts .form .feld {
  position: relative;
  background-color: rgba(255, 237, 189, 0.4);
  margin-top: 0.5rem;
}

main.kontakt .spa-rechts .form .feld input {
  width: 100%;
  border: none;
  -webkit-box-shadow: none;
          box-shadow: none;
  border-radius: 0;
  background-color: transparent;
  padding: 0.2rem;
  padding-left: 5rem;
  font-size: 0.9rem;
}

main.kontakt .spa-rechts .form .feld textarea {
  border: none;
  -webkit-box-shadow: none;
          box-shadow: none;
  border-radius: 0;
  background-color: transparent;
  padding-top: 2rem;
}

main.kontakt .spa-rechts .form .feld > label {
  position: absolute;
  top: 0rem;
  left: 0.5rem;
  font-size: 0.8rem;
}

main.kontakt .spa-rechts .form .feld > input:focus + label {
  font-size: 0.6rem;
}

main.kontakt .spa-rechts .form p {
  margin-top: 0.5rem;
}

main.kontakt .spa-rechts .form input[type="checkbox"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: auto;
  float: left;
  margin-right: .75em;
  border: none;
  background: transparent;
}

main.kontakt .spa-rechts .form input[type='checkbox']:checked,
main.kontakt .spa-rechts .form input[type='checkbox']:not(:checked) {
  background: transparent;
  position: relative;
  visibility: hidden;
  margin: 0;
  padding: 0;
}

main.kontakt .spa-rechts .form input[type='checkbox'] + label {
  cursor: pointer;
  text-align: left;
}

main.kontakt .spa-rechts .form input[type='checkbox']:checked + label::before,
main.kontakt .spa-rechts .form input[type='checkbox']:not(:checked) + label::before {
  content: ' ';
  display: inline-block;
  width: 25px;
  height: 25px;
  position: relative;
  border: 1px solid #ffedbb;
  background: rgba(255, 237, 189, 0.4);
  -webkit-box-shadow: inset 0 1px 1px 0 rgba(0, 0, 0, 0.1);
          box-shadow: inset 0 1px 1px 0 rgba(0, 0, 0, 0.1);
}

main.kontakt .spa-rechts .form input[type='checkbox']:hover + label::before {
  background: rgba(136, 175, 51, 0.3);
  border: 1px solid rgba(136, 175, 51, 0.4);
  -webkit-box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.4);
          box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.4);
}

main.kontakt .spa-rechts .form input[type='checkbox']:checked + label::before {
  background: url(../img/icons/icon_harken.svg) no-repeat center;
  background-size: 90% auto;
  background-color: rgba(136, 175, 51, 0.3);
  border: 1px solid rgba(136, 175, 51, 0.4);
  -webkit-box-shadow: inset 0 0 0 2px white;
          box-shadow: inset 0 0 0 2px white;
}

main.kontakt .spa-rechts .form #submitbtn {
  padding: 0.1rem 1rem;
  margin-top: 1rem;
  background-color: rgba(136, 175, 51, 0.4);
  color: #590042;
  font-weight: 600;
  font-size: 1.1rem;
  text-align: right;
}

@media screen and (min-width: 47.5em) {
  main.kontakt .spa-links {
    padding-right: 1rem;
  }
  main.kontakt .spa-rechts {
    padding-left: 1rem;
  }
}

@media screen and (min-width: 79.5em) {
  main.kontakt .spa-links {
    padding-right: 2rem;
  }
  main.kontakt .spa-rechts {
    padding-left: 2rem;
  }
}

/*OpenStreet-maps */
header figure.karte {
  height: 57vw;
}

@media screen and (max-width: 47.5em) {
  header figure.karte {
    height: 65vw;
  }
}

header figure.karte #map1 {
  position: relative;
  z-index: 0;
  width: 100%;
  height: 100%;
  font-size: 0.8rem;
}

header figure.karte #map1 .leaflet-control-container .leaflet-top {
  position: absolute;
  bottom: 1rem;
  top: auto;
}

header figure.karte #map1 .leaflet-control-container .leaflet-bottom.leaflet-right {
  position: absolute;
  /*left: 0;
                right: auto;*/
  /*-ms-transform: rotate(270deg); /* IE 9 */
  /*-ms-transform-origin: 0% 0%; /* IE 9 */
  /*-webkit-transform: rotate(270deg); /* Safari 3-8 */
  /*-webkit-transform-origin: 0% 0%; /* Safari 3-8 */
  -webkit-transform-origin: top right;
          transform-origin: top right;
  -webkit-transform: rotate(270deg);
          transform: rotate(270deg);
  right: 16px;
  bottom: 181px;
}

header figure.karte #map1 .leaflet-control-container .leaflet-bottom.leaflet-right .leaflet-control-attribution {
  padding-left: 0.2rem;
}

header figure.karte #map1 .leaflet-control-container .leaflet-bottom.leaflet-right .leaflet-control-attribution a {
  font-size: 10px;
  line-height: 10px;
}

@media screen and (max-width: 47.5em) {
  header figure.karte #map1 .leaflet-popup {
    display: none;
  }
}

/* ################ footer ################### */
footer {
  text-align: left;
}

footer .wrap-footer {
  padding-top: 1rem;
  padding-bottom: 1rem;
  background-color: #88af33;
}

footer .wrap-footer h3 {
  font-size: 1rem;
  padding-bottom: 0.2rem;
  color: #ffffff;
}

footer .wrap-footer p {
  font-size: 0.8rem;
  color: #ffffff;
}

footer .wrap-footer a {
  font-size: 0.8rem;
  color: #ffffff;
}

footer .wrap-footer section {
  padding-bottom: 1rem;
}

footer .wrap-footer .footer-underline {
  background-color: #ffffff;
  height: 1px;
  width: 6rem;
  margin-bottom: 1rem;
}

footer .wrap-footer .f-liste p {
  padding-bottom: 0;
}

footer .wrap-footer .f-liste ul li ul {
  padding-left: 0.5rem;
}

@media screen and (min-width: 35.25em) {
  footer .wrap-footer .f-liste {
    padding-left: 0.5rem;
  }
}

footer .wrap-footer .f-liste li.active > p > a {
  font-weight: 500;
  color: #ffedbb;
}

footer .wrap-footer .f-adresse p:last-of-type {
  padding-bottom: 1.5rem;
}

footer .wrap-footer .f-adresse figure div.img-box {
  padding: 0.7rem;
  background-color: #ffffff;
}

footer div.balken-green {
  background-color: rgba(136, 175, 51, 0.5);
  height: 0.5rem;
}

footer .copyright p, footer .copyright a {
  color: #88af33;
  font-size: 0.7rem;
}

@media screen and (min-width: 47.5em) {
  footer .copyright p:last-of-type {
    text-align: right;
  }
}

/* ################## cookie message #####################*/
#cookie-message {
  position: fixed;
  bottom: 0px;
  z-index: 2000;
  text-align: center;
  width: 100%;
  -webkit-transition: .3s ease-out;
  transition: .3s ease-out;
  background: #590042;
  background: rgba(89, 0, 66, 0.9);
  margin: 0;
  padding: .7rem 0;
}

#cookie-message .cookie-content {
  width: 60%;
  margin: 0 auto;
  position: relative;
}

#cookie-message p {
  margin: 0;
  color: #ffffff;
  padding: 0rem 0.5rem 0.5rem 0.5rem;
}

#cookie-message p a {
  color: #ffffff;
  text-decoration: none;
}

#cookie-message.close {
  display: none !important;
}

#cookie-message .cookie-close {
  position: absolute;
  top: 0;
  right: 0;
  color: #ffffff;
}

#cookie-close:hover, #cookie-close:focus, #cookie-close:active {
  color: #ffffff;
}

/* ################## alter Browser message #####################*/
#outdated {
  height: 250px;
}

#outdated p {
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  text-transform: none;
  font-size: 14px;
  line-height: 18px;
}

#outdated #btnUpdateBrowser {
  background-color: #a6040f;
}

#outdated #btnCloseUpdateBrowser {
  background-color: #a6040f;
  border: none;
  font-size: 45px;
}

/* https://animejs.com/; 
https://www.minimamente.com/project/magic// http://jsfiddle.net/ARTsinn/65QsU/; 
https://blog.kulturbanause.de/2015/10/css-keyframe-animationen/
https://developer.mozilla.org/de/docs/Web/CSS/CSS_Animations/CSS_Animationen_nutzen
https://wiki.selfhtml.org/wiki/CSS/Eigenschaften/Animation/animation
http://gudh.github.io/ihover/dist/index.html
*/
/* https://goentgen.de/  */
/*# sourceMappingURL=style.css.map */