@font-face {
    font-family: 'OpenSans-Regular';
        src: url('design/fonts/OpenSans-Regular.ttf');
        src: url('design/fonts/OpenSans-Regular.ttf') format ('truetype')
        font-weight: normal;
    	font-style: normal;
}


@font-face {
    font-family: 'OpenSans-Bold';
        src: url('design/fonts/OpenSans-Bold.ttf');
        src: url('design/fonts/OpenSans-Bold.ttf') format ('truetype')
        font-weight: normal;
    	font-style: normal;
}

@font-face {
    font-family: 'Righteous-Regular';
        src: url('design/fonts/BigShouldersDisplay-Black.ttf');
        src: url('design/fonts/BigShouldersDisplay-Black.ttf') format ('truetype')
        font-weight: normal;
    	  font-style: normal;
}


/* Setup --------------------------------------------- */
:root{
  --main-color: #9DC41C;
  --main-color-trans: rgba(168, 28, 70, 0.8);
  --sec-color: black;
  --sec-color-trans: rgba(0, 0, 0, 0.8);
}

a { color: #00e; }
a:visited { color: var(--main-color); }
a:hover { color: var(--main-color); }
a:focus { outline: thin dotted; }
a:link{color: var(--main-color); text-decoration: none;}
body {background-color: silver; font-family: 'OpenSans-Regular', Futura, Trebuchet MS, Arial, sans-serif; font-style: normal; }
h1 {margin-bottom:0.5em;font-size:3em; color:var(--main-color);line-height: 1.25em; font-family:'Righteous-Regular';}
h2, h2 span {font-weight:lighter;margin-bottom:0.5em;margin-top:0;font-size:2em; line-height: 1.25em; color: var(--sec-color); font-family:'Righteous-Regular';}
h3 {font-weight:lighter;margin-bottom:0.5em;margin-top:0;font-size:1.15em;line-height: 1.25em; color:var(--sec-color); font-family:'OpenSans-Bold'}
h4 {font-weight:normal;margin-bottom:.25em;margin-top:0;font-size:1em;line-height: 1.25em; color:black;}
#content_right h1 {margin-bottom:0;}
pre {font-family:monospace,serif;font-size:1em;white-space:pre;white-space:pre-wrap;word-wrap:break-word;margin:0;padding:0}
code {font:inherit;font-family:monospace,serif;font-size:1em;margin:0;padding:0}
p{ font-family:'OpenSans-Regular'; margin-bottom: 1em; margin-top: 0.25em; color:var(--sec-color); font-size: 0.95em; line-height: 1.7em;}
em{font-style: italic;}
strong{ font-family:'OpenSans-Bold'; }
video{width: 100%;}
body{max-width:100%; overflow-x:hidden; background-color: white; background-attachment:fixed; background-size: cover;}

/* Struktur ------------------------------------------ */


#container_wrapper{width: 100%; position: relative;}
#navi_wrapper{max-width: 900px; background-color: white; position: relative; margin-left: auto; margin-right: auto;}
#shopLink_wrapper{position: relative; float: left; width: 350px; height: 40px; margin: 5% 0 0 5%;}
#shopLink_wrapper a {display: block;height: 40px; cursor: pointer;}
#shopLink_wrapper a:hover #shopLinkImage{background-image: url("design/images/linkArrow_hover.svg");}
#shopLinkImage{width: 40px; height: 40px; background-image: url("design/images/linkArrow.svg"); position: absolute;}
#shopLinkText{color: var(--main-color); position: absolute; top:50%; transform: translateY(-50%); left: 60px; font-size: 1.5em;}

#navi a { color: white; }
#navi a:visited { color: white; }
#navi a:hover { color: white; }
#navi a:focus { outline: none; }

.termin_datum {background-color: rgba(0,0,0,0.6); color:white; border-radius:2px; position:relative; left: -5px; display:inline-block;}
.termin_text h3 {margin:5px 0;}
.termin_datum h3 {margin:5px;}
.termin_text {font-size:90%;}

.termine_kurz {font-size: 120%; line-height:120%;}
.termine_kurz span {font-weight:bold;}
.termine_kurz a {display:block;}
.termine_kurz li {margin-bottom: 0.5em;}


.storyAuthor, .storyLink {font-size: 75%;}
.kat {font-size: 75%; float:right; background-color: rgba(0,0,0,0.6); color:white; border-radius:2px; padding:5px; line-height:1em;}

/*Einspaltiges Template*/

#content_single_column {width:100%; padding-right:1%;}

/**/
#navi_inner ul {text-align:right;}

#navi_inner li {
    -webkit-user-select: none !important;
    -webkit-touch-callout: none !important;
    list-style: none inside !important; position:relative;}
#navi_inner ul ul {display:none; position: absolute; background-color:transparent; left:0; margin-left:0; z-index:2; width:200px; margin-top:21%; text-align:left;}

#navi_inner ul li:hover > ul {display:block;}
#navi_inner ul li ul li {padding-left: 0.3em; padding-right: 0.3em; padding-top:0; padding-bottom:0; top:5px; position:relative; display:block; background-color:#7c8284;
    }

#navi_inner ul li.current ul li > a{white-space: nowrap; padding: 0.1em 0; display:inline-block; border-top: 1px solid #0a89c5 !important; border-bottom: none; width:100%; color:white; font-size:100%;}


#navi_inner ul li ul li ul { position:absolute; top:0; left: 100%;}
#navi_inner ul li ul li ul li{ top:0 }


#navi_inner ul li ul li a { white-space: nowrap; padding: 0.1em 0; display:inline-block; border-top: 1px solid #0a89c5; width:100%; color:white; font-size:100%;}
#navi_inner ul li ul li:first-child > a {border-top: 2px solid transparent;}


#navi_inner ul li ul li:hover {}

#navi_inner ul > li:hover > a{color:white;}
#navi_inner ul li ul li:hover a{color: white !important;}

#navi_inner a,#navi_inner a:hover,#navi_inner a:focus{color:white; text-decoration:none;}
#navi_inner ul li a:visited:hover{color: white;}
#navi_inner ul li ul li a:visited{color: white;}
#navi_inner ul li.current > a{color: white !important; border-bottom: 8px solid #0a89c5; padding-bottom: 1.2em;}


/**/

#navi li {display:inline-block; padding:5px 1.5%; padding-bottom: 4.5%;}
#navi_wrapper_wrapper{width:100%;}

#footer_navi {float:right; font-size:120%;}
#footer_navi li {display:inline; padding-right:0.5em;}
#footer_navi li a {text-decoration:none;}

/* Mobile Menu ####################################################################################*/

#mobile_wrapper{display: inline; text-align:center; overflow:hidden; float: right; margin-right: 2em;}
#mobile_schriftzug_wrapper{display:inline-block; width:78%;}
.mobile_icon{width:55px; height:70px; display:inline-block; float:left;}
#mobile_navi_inner{display:none; text-align: left; overflow: hidden; position: absolute; width: 30%; background-color: var(--sec-color-trans); z-index: 3; font-size: 1.5em; right:0; top:152.5px; border-bottom: 3px solid var(--main-color);}
#hamburger_line_wrapper{ width:100%; height:100%; padding-top:3px;}
.hamburger_line{position:relative;height:5px;	top:10px; margin-bottom:8px; width: 55px; background-color: var(--main-color); display:block;}
.hamburger_text{font-size: 1.4em; width: 55px; display: block; margin-top: 0.5em; font-family: 'Righteous-Regular'; color: var(--main-color);}
#mobile_logo img, #mobile_logo{max-width:40px; max-height: 40px;}
#mobile_logo{display:inline-block; float:right; margin-right: 1em;}
#mobile_navi_inner ul {display: block; overflow: hidden;}

#mobile_navi_inner ul li { border: none; width: 90%; padding: 0.5em 0 0.5em 10%;}
#mobile_navi_inner ul li:last-child{border-bottom: none;}
#mobile_navi_inner ul li:first-child{border-top: none;}
#mobile_navi_inner ul li.current a{ font-family: 'OpenSans-Bold'; color: var(--main-color);}
#mobile_navi_inner ul li ul li.current a{ font-family: 'OpenSans-Bold' !important;}
#mobile_navi_inner ul li ul{display: block;}
#mobile_navi_inner ul li ul li{width: 100%; border: none; padding-top: 0; padding-bottom: 0;}
#mobile_navi_inner ul li a{font-family: 'OpenSans-Regular';}
#mobile_navi_inner ul li ul li a{font-family: 'OpenSans-Regular' !important; font-size: 0.8em;}
#mobile_navi_inner ul li.current ul li a{color: white;}


.mobileTargerRot{transform: rotate(90deg);}
#mobile_navi_inner ul li ul{display: none;}
#mobile_navi_inner ul > li a.mobileTarget{float:right; width:20px; height: 20px; text-align: center; cursor:pointer; padding: 0 100px 0 0;}


/* Mobile Menu END ################################################################################*/

#container,#navi_container{margin-left: auto; margin-right: auto; width: 100%;  background-color: white;}
#content_inner_wrapper { width:100%; min-height:400px;}

#content_left {width:100%; padding-right:1%;}

#header_wrapper{width:100%; background-color:var(--sec-color); height: 150px; border-bottom: 3px solid var(--main-color);}
#header_inner{width:100%; max-width: 1200px; margin-left:auto; margin-right:auto; overflow: hidden;}
#logo{width:150px; padding: 40px 0 15px 0; float:left;}
#logo img{width:100%;}
#foot_mobil{width:150px; margin: 0 auto;}
#foot_mobil img{width:100%;}
#navi{float:right; width:50%; padding-top: 5%;}
#content_wrapper{width:100%; display:inline-block;}



#content_wrapper {background-color:white;}
#navi_inner{font-size:1.2em; font-family:'OpenSans-Bold';}
#navi_inner a{text-decoration:none !important;}
#content{white-space:nowrap;}
.content_inner{background-color: white; min-height: 200px; position:relative; display:inline-block; vertical-align:top; white-space:normal; line-break: strict; padding-top:1em;}
#breadcrumb{  color:white; float:left; font-size:90%; padding-top:1em; }
#breadcrumb a{text-decoration:none;}
#breadcrumb span a{color: white;}





#footer_inner{background-color: white;}
#mobilemenu{display: none;}
#back-to-top { position:fixed; bottom:0px; right:50px;	cursor:pointer;	padding:10px; background:var(--main-color); border-top-left-radius:5px; border-top-right-radius:5px; color:white;	z-index: 99; opacity: 0.3 }
#back-to-top:hover{opacity: 1;}



/* Elemente ------------------------------------------ */

.TiB_wrapper{position: relative;}
.TiB_text{position: absolute; background-color: var(--main-color-trans); top: 50%; transform: translateY(-50%); padding: 4em 4em 4em 17em;}
.TiB_text h2, .TiB_text p{color:white; font-size: 120%;}



.clear { clear:both; float:none; }
.umflossen_r { float:right; }
.umflossen_l { float:left; }
.abstand_r { margin-right: 3%; }
.abstand_l { margin-left: 3%; }
.abstand_o { margin-top:5em; }
.abstand_u { margin-bottom:5em; }
.table{display: table;}
.table_cell{display: table-cell; vertical-align: middle;}
.table_cell_margin{padding-left: 6%;}
.table_cell_halb{width: 45.5%;}
.table_cell_halb h2{margin-bottom: 0;}

.sysWrapper{min-height:5px;}
.sysWrapper:hover{border: 1px solid red; background-color:#ffe7e7; height: 5em;}


.ele_noAnim_wrapper{display: block; margin-left: auto; margin-right: auto; width: 100%; max-width: 1200px;}

.ganz {width: 100%;}
.halb { padding:0; width: 48.5%;}
.zweidrittel { padding:0; width: 62.66%; }
.drittel { padding:0; width: 31.33%; }
.viertel { padding:0; width: 22.75%; }
.trennlinie{width: 100%; height: 2px; background-color: var(--main-color);}
.imageWrapper{width: 100%; max-width: 900px; margin: 0 auto 0 auto;}

.content_inner ul {margin-left: 1em; margin-bottom: 1em;}
.content_inner ol {padding-left:0em; margin-left:1em; margin-bottom: 1em;}
.content_inner ul li{ list-style: disc outside !important; color: var(--sec-color); font-family:'OpenSans-Regular'; font-size: 0.95em;}
.content_inner ol li{ list-style: decimal outside !important; color: var(--sec-color); font-family:'OpenSans-Regular'; font-size: 0.95em;}

.element_text{max-width:900px; margin: 0 auto 0 auto; margin-bottom: 2em;}


#content_left .systemColumn {font-size: 130%; line-height:130%;}
.systemColumn{margin-top: -0.8em;}

/* helper -------------------------------------------- */

.hidden { display: none !important; visibility: hidden; }
.clear {float: none; clear: both;}


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

@media only screen and (max-width: 1200px) {
  .TiB_text{position:relative; top:0; transform: none !important; background-color: var(--main-color); padding: 4em;}
  .ele_wrapper, .ele_wrapper_visible{width:92% !important; padding-left: 4%; padding-right: 4%;}
  #navi{width: 40% !important;}
  #logo{margin-left: 4%;}

}
@media only screen and (max-width: 810px) {
  body{font-size: 80%;}
  #logo{width: 150px;}
  #mobile_navi_inner{width: 50%;}
  .avf_text{display: none;}
  .ele_3ih_imageContainer{ display: block !important; width: 100% !important;}
  .ele_3ih_abstand_l{margin-left: 0 !important; margin-top: 1em;}
  .table_cell{display: block !important;}
  .table_cell p{margin-bottom: 0; margin-top: 0; padding-top: 1em; padding-bottom: 1em;}
  .anim_tb_image{width:100% !important; order: 1 !important;}
  .textImageWrapper{margin-bottom: 2em}
}

@media only screen and (max-width: 550px) {
  body{font-size: 80%;}
  h1{font-size: 1.8em;}
  h2{font-size: 1.5em;}
  #mobile_navi_inner{width: 100%;}
  #navi{padding-top: 15%; }
  .table_cell{display: block;}
  .table_cell_halb {width: 96%;}
  .halb{width:100%;}
  .abstand_l{margin-left: 0;}
  .table_cell_margin{padding-left:0; margin-top: 0.25em;}
  .kt_wrapper_half{width: 100% !important; display: block;}
  .kt_wrapper .kt_wrapper_half:first-child{margin-bottom:1em;}

  .abstand_u{margin-bottom: 2em;}
  .ele_3ih_headTextContainer h2{font-size: 1em !important;}
  .ele_3ih_headTextContainer{top: 25px !important;}
  .ele_3ih_TextContainer{top: 75px !important;}
  .anim_tb_text{width: 100% !important; display: block;}
  .anim_tb_image{width: 100% !important; display: block;}
  .image_wrapper_3_margin{margin-left: 3.6% !important; }
  .image_wrapper_3{font-size: 60%;}

}





/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {



}