/*hellbraun*/
@import "fonts.css";
* {
  padding: 0;
  margin: 0;
}
html {
  overflow-x: hidden;
  overflow-y: auto;
}
img {
  border: none;
}
body {
  font-family: 'Segoe UI Regular', sans-serif;
  font-weight: 200;
  color: #7E807F;
  font-size: 17px;
  background-color: #FFF;
}
body#textseite {
  padding: 10px;
}
p {
  line-height: 1.2em;
}
#container {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
}
#head_bild {
  position: relative;
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  /*max-height:80vh;*/
  max-height: calc(80vh - 120px);
  overflow: hidden;
  align-items: flex-end;
  display: flex;
  /*overlay*/
}
#head_bild img {
  width: 100%;
  max-width: 100%;
  height: auto;
  display: block;
  position: relative;
}
#head_bild #head_overlay {
  z-index: 1;
  position: absolute;
  left: 3%;
  /*
		right:20%;
		top:60px;
		*/
  bottom: 60px;
  color: white;
  width: 550px;
  max-width: 100%;
  display: flex;
  align-items: flex-start;
}
#head_bild #head_overlay .icon {
  width: 100px;
}
#head_bild #head_overlay .text {
  margin-left: 20px;
  width: 500px;
  max-width: 100%;
}
#head_bild #head_overlay .text .head {
  background-color: #ec7418;
  border: 2px solid white;
  padding: 5px 22px;
  margin-bottom: 10px;
  display: inline-block;
  border-radius: 20px;
  font-weight: bold;
}
#head_bild #head_overlay .text .head:empty {
  display: none;
}
#head_bild #head_overlay .text .tx1:empty {
  display: none;
}
#head_bild #head_overlay .text .tx2 {
  text-indent: -9px;
  background: #5c7fac;
  background: rgba(92, 127, 172, 0.8);
  font-size: 0.7em;
  padding: 10px 15px;
  margin-top: 10px;
  border-radius: 20px;
}
#head_bild #head_overlay .text .tx2:empty {
  display: none;
}
#head_bild .arr {
  position: absolute;
  bottom: 20px;
  z-index: 2;
  left: 50%;
  transform: translateX(-25%);
}
#head_bild .arr img {
  width: 60%;
  height: auto;
}
/*head bild*/
#head_overlay_mobil {
  display: none;
  background-color: #5c7fac;
  color: white;
  width: 100%;
  box-sizing: border-box;
  border: 2px #ca7e0e;
  padding: 20px 22px;
  justify-content: space-between;
  margin: 0;
  font-size: 14px;
}
#head_overlay_mobil .head {
  background-color: #ec7418;
  border: 2px solid white;
  padding: 5px 22px;
  margin-bottom: 10px;
  display: inline-block;
  border-radius: 20px;
  font-weight: bold;
}
#head_overlay_mobil .head:empty {
  display: none;
}
#head_overlay_mobil .li {
  width: 37%;
  position: relative;
  margin-top: 40px;
}
#head_overlay_mobil .icon {
  width: 65px;
}
#head_overlay_mobil .icon img {
  width: 100%;
  height: auto;
}
#head_overlay_mobil .re {
  width: 46%;
}
#head_overlay_mobil .text .head {
  font-weight: bold;
}
section {
  width: 100%;
  line-height: 1.5em;
}
article {
  padding: 10px;
}
h1 {
  font-size: 16px;
  color: #ca7e0e;
}
h2 {
  font-size: 23px;
  color: #CA7E0E;
}
h3 {
  font-size: 17px;
  margin-bottom: 1.8em;
}
#textseite h1 {
  font-size: 20px;
  margin-bottom: 1.5em;
}
#textseite h2 {
  font-size: 17px;
  margin-bottom: 1.5em;
}
#textseite h3 {
  font-size: 15px;
  margin-bottom: 1.5em;
  color: #ca7e0e;
}
#textseite h4 {
  font-size: 17px;
  margin-bottom: 1.2em;
}
#textseite p {
  margin-bottom: 20px;
}
#textseite table {
  overflow-y: scroll;
  border-collapse: collapse;
  width: 80%;
  max-width: 100%;
  font-size: 0.9em;
}
#textseite table th {
  text-align: left;
}
#textseite table td {
  border: 1px solid grey;
  padding: 5px;
  vertical-align: top;
}
#textseite ul {
  margin-left: 40px;
}
a {
  text-decoration: none;
  color: #7E807F;
  color: #ca7e0e;
}
.boxcontainer {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: flex-start;
}
.box {
  background-color: cornflowerblue;
  align-self: stretch;
  justify-content: center;
  align-items: center;
  -webkit-flex: 0 0 20%;
  flex: 0 1 20%;
  flex-basis: 20%;
  padding: 20px;
  margin-bottom: 20px;
  display: flex;
  text-align: center;
}
.clear {
  clear: both;
}
.clear:after {
  content: "";
  display: block;
  visibility: hidden;
  clear: both;
}
.schmuckfarbe {
  color: #ca7e0e;
}
header #header_top {
  width: 1350px;
  max-width: 95%;
  margin: 0 auto;
  background-color: white;
  height: 170px;
  top: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
}
header #header_top .logo {
  text-align: center;
  width: 150px;
  max-width: 80%;
}
header #header_top .logo img {
  max-width: 80%;
  height: auto;
}
header #header_top #suche {
  width: 250px;
}
header #header_top #suche button {
  background: none;
  color: grey;
  border: none;
  padding: 1px 0 0 2px;
  font-size: 21px;
  position: relative;
  top: 1px;
  height: 45px;
}
header #burgerbutton {
  position: absolute;
  z-index: 2;
  right: 15px;
  top: 29px;
  display: none;
  width: 40px;
  height: calc($breite/2);
  border-top: 2px solid #ca7e0e;
  border-bottom: 2px solid #ca7e0e;
}
header #burgerbutton:after {
  content: '';
  position: absolute;
  width: 40px;
  border-top: 2px solid #ca7e0e;
  left: 0;
  top: 9px;
}
.zeiten, .dokumente, .asp, .ueber {
  width: 1350px;
  max-width: 95%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.zeiten .zeiten_h2, .dokumente .zeiten_h2, .asp .zeiten_h2, .ueber .zeiten_h2 {
  height: 40px;
}
.zeiten .zeiten_h2 a, .dokumente .zeiten_h2 a, .asp .zeiten_h2 a, .ueber .zeiten_h2 a {
  text-decoration: underline;
}
.zeiten .zeiten_head, .dokumente .zeiten_head, .asp .zeiten_head, .ueber .zeiten_head {
  margin-bottom: 10px;
}
.zeiten .zeiten_zeit, .dokumente .zeiten_zeit, .asp .zeiten_zeit, .ueber .zeiten_zeit {
  color: #CA7E0E;
}
.zeiten .zeiten_inner a, .dokumente .zeiten_inner a, .asp .zeiten_inner a, .ueber .zeiten_inner a {
  text-decoration: underline;
}
.zeiten .zeiten_inner .doc_img, .dokumente .zeiten_inner .doc_img, .asp .zeiten_inner .doc_img, .ueber .zeiten_inner .doc_img {
  width: 60px;
  height: auto;
}
.dokumente > div:first-of-type, .asp > div:first-of-type, .ueber > div:first-of-type {
  width: 25%;
  min-width: 340px;
}
.dokumente > div:first-of-type .item, .asp > div:first-of-type .item, .ueber > div:first-of-type .item {
  float: left;
  text-align: center;
  margin-top: 50px;
}
.dokumente > div:nth-of-type(2), .asp > div:nth-of-type(2), .ueber > div:nth-of-type(2) {
  width: 500px;
  margin-top: 30px;
}
.dokumente > div:nth-of-type(2) .item.doc, .asp > div:nth-of-type(2) .item.doc, .ueber > div:nth-of-type(2) .item.doc {
  display: none;
  text-align: center;
  margin-bottom: 30px;
}
.dokumente > div:last-of-type, .asp > div:last-of-type, .ueber > div:last-of-type {
  width: 500px;
  text-align: center;
}
.dokumente > div:last-of-type .item, .asp > div:last-of-type .item, .ueber > div:last-of-type .item {
  margin-top: 50px;
}
.asp {
  justify-content: flex-start;
}
.asp > div:nth-of-type(2) {
  width: 350px;
}
.asp > div:nth-of-type(2) a {
  color: inherit;
}
.asp > div:nth-of-type(3) {
  width: 370px;
  text-align: left;
  margin-top: 30px;
}
.asp > div:nth-of-type(3) a {
  color: inherit;
}
.ueber {
  justify-content: flex-start;
}
.ueber > div:nth-of-type(2) {
  width: 60%;
  text-align: left;
}
.ueber > div:nth-of-type(2) .ueber_galerie {
  margin-top: 30px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.ueber > div:nth-of-type(2) .ueber_galerie h2 {
  flex-basis: 100%;
  margin: 20px 0;
}
.ueber > div:nth-of-type(2) .ueber_galerie img {
  border-radius: 5%;
  margin-bottom: 10px;
}
.break {
  width: 1350px;
  max-width: 95%;
  margin: 0 auto;
  margin-top: 40px;
  margin-bottom: 20px;
  height: 2px;
  background: #ddd;
}
section {
  background-color: #FFF;
}
footer {
  margin-top: 20px;
  padding-bottom: 30px;
}
footer #footernavi {
  display: flex;
  float: right;
  margin-bottom: 30px;
}
footer #footernavi li {
  list-style-type: none;
  margin-right: 30px;
}
footer #footernavi li a {
  color: #7E807F;
}
footer .ankerscroll img {
  width: 25px;
  height: auto;
}
.anfahrt {
  width: 1350px;
  max-width: 95%;
  margin: 0 auto;
  min-height: 500px;
  background-repeat: no-repeat;
  background-position: right 20px;
  background-size: 42% auto;
}
.anfahrt .text {
  margin-top: 50px;
  width: 50%;
}
.anfahrt #osmap {
  margin-top: 40px;
  width: 400px;
  max-width: 100%;
  height: 400px;
  display: inline-block;
  float: left;
}
.anfahrt .map_aside {
  color: #ca7e0e;
  float: left;
  margin-top: 40px;
  margin-left: 20px;
}
.anfahrt_karte {
  margin-top: 50px;
  display: none;
  text-align: center;
}
.anfahrt_karte img {
  max-width: 80%;
  height: auto;
}
.highlight {
  background-color: #fcefdb;
}
#osmap, #karte {
  height: 400px;
  width: 100%;
}
/* -------------------
NAVIGATION
----------------------*/
#mainnavi {
  font-family: 'Segoe UI Regular', sans-serif;
  font-weight: bold;
  margin: 72px 0 0 0;
  padding: 0;
  list-style-type: none;
  list-style-position: outside;
  position: relative;
  line-height: 25px;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  /*/ul*/
}
#mainnavi li {
  position: relative;
  color: #7E807F;
}
#mainnavi a {
  display: block;
  padding: 3px 20px;
  text-decoration: none;
  color: #7E807F;
  font-size: 18px;
}
#mainnavi a.aktiv, #mainnavi a:hover {
  color: #464646;
  /*z.B: .transition(all, 2s, linear, 0s);*/
  -webkit-transition: color linear 0.5s 0s;
  -moz-transition: color linear 0.5s 0s;
  -ms-transition: color linear 0.5s 0s;
  -o-transition: color linear 0.5s 0s;
}
#mainnavi ul {
  background-color: White;
  margin: 0;
  padding: 0;
  list-style-type: none;
  list-style-position: outside;
  position: relative;
  line-height: 20px;
  position: absolute;
  display: none;
  top: 28px;
  z-index: 1001;
  padding-top: 10px;
}
#mainnavi ul a {
  float: left;
  font-size: 15px;
  width: 150px;
}
#mainnavi ul li ul {
  top: auto;
}
#mainnavi ul ul {
  left: 12em;
  margin: 0px 0 0 10px;
}
#mainnavi li:hover ul ul, #mainnavi li:hover ul ul ul, #mainnavi li:hover ul ul ul ul {
  display: none;
}
#mainnavi li:hover ul, #mainnavi li li:hover ul, #mainnavi li li li:hover ul, #mainnavi li li li li:hover ul {
  display: block;
}
/* -------------------
NAVIGATION ENDE
----------------------*/
/*-------------------------
Mobile Navigation
--------------------------*/
/*fastschwarz*/
#mobilenavi li.head {
  cursor: pointer;
}
#mobilenavi li.head .home {
  padding-top: 5px;
  height: 31px;
}
#mobile_menuicon {
  position: absolute;
  left: 15px;
  top: 15px;
  z-index: 3;
}
#mobilemenu {
  display: none;
  position: absolute;
  top: -1000px;
  z-index: 5;
  left: 0;
  width: 100%;
  border-top: 1px solid #dcdbdb;
}
/*-------------------------
Ende mobile Navigation
---------------------------*/
.suchergebnis {
  margin-bottom: 15px;
}
#formular .req {
  color: red;
}
#formular .row {
  margin: 15px 0px;
}
#formular .row:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
#formular .row .value {
  position: relative;
  display: inline-block;
  float: left;
}
#formular .row .value.binweg {
  display: none;
}
#formular .row .desc {
  float: left;
  width: 130px;
}
#formular input[type="text"], #formular input[type="url"], #formular input[type="email"], #formular input[type="password"], #formular input[type="phone"], #formular textarea, #formular select.webselect {
  background-color: #ffffff;
  border: 1px solid #999;
  width: 300px;
  padding: 5px 5px;
}
#formular input[type="checkbox"], #formular input[type="radio"] {
  margin-right: 3px;
}
#formular select.webselect {
  width: calc($width+11px);
}
#formular textarea {
  width: 200px;
  height: 150px;
}
#formular input[type="submit"] {
  background-color: #ffffff;
  border: 1px solid #999;
  width: 300px;
  padding: 5px 5px;
}
#formular .hidden {
  display: none;
}
#formular .abhaengig {
  display: none;
}
#formular .radio_ul, #formular .checkbox_ul {
  list-style-type: none;
  list-style-position: outside;
}
/*/formular*/
.form_edit_container {
  background-color: white;
  border: 1px solid #3B3B3B;
  padding-bottom: 20px;
}
.form_controller {
  background-color: #EF8C11;
  margin-top: 5px;
  margin-bottom: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 5px;
}
#sitemap {
  padding-left: 15px;
}
#sitemap ul {
  padding-left: 15px;
}
/* -------------------
FORM VALIDATOR START
----------------------*/
#formular input.error, #formular textarea.error, #formular select.error {
  border: 1px solid #bf2424e6;
}
#formular input.valid, #formular textarea.valid, #formular select.valid {
  /* border: 1px solid green; */
}
#formular label.error {
  width: 240px;
  position: absolute;
  right: -280px;
  top: -8px;
  padding: 8px;
  border: 1px solid #696969;
  background-color: #bf2424e6;
  color: #e2e0e0;
  /*z.B.   .schatten(5px, 5px, 6px, 0.3);*/
  -webkit-box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.5);
  box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.5);
}
/* -------------------
FORM VALIDATOR ENDE
----------------------*/