@font-face {
    font-family: 'OpenSans';
    src: url('OpenSans-Regular-webfont.eot');
    src: url('OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('OpenSans-Regular-webfont.woff') format('woff'),
         url('OpenSans-Regular-webfont.ttf') format('truetype'),
         url('OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'OpenSans';
    src: url('OpenSans-Italic-webfont.eot');
    src: url('OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('OpenSans-Italic-webfont.woff') format('woff'),
         url('OpenSans-Italic-webfont.ttf') format('truetype'),
         url('OpenSans-Italic-webfont.svg#OpenSansItalic') format('svg');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'OpenSans';
    src: url('OpenSans-Bold-webfont.eot');
    src: url('OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('OpenSans-Bold-webfont.woff') format('woff'),
         url('OpenSans-Bold-webfont.ttf') format('truetype'),
         url('OpenSans-Bold-webfont.svg#OpenSansBold') format('svg');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'OpenSans';
    src: url('OpenSans-BoldItalic-webfont.eot');
    src: url('OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('OpenSans-BoldItalic-webfont.woff') format('woff'),
         url('OpenSans-BoldItalic-webfont.ttf') format('truetype'),
         url('OpenSans-BoldItalic-webfont.svg#OpenSansBoldItalic') format('svg');
    font-weight: bold;
    font-style: italic;
}

/* Setup --------------------------------------------- */
a { color: #262626; text-decoration: underline;}
a:visited { color: #262626; text-decoration: underline;}
a:hover { color: #FFB100; text-decoration: none;}
a:focus { outline: thin dotted; }
html,body {background-color: #faeed5; font-family: "OpenSans", arial, helvetica, sans-serif; font-size: 93%; line-height: 160%; height: 100%;}
body{background-image: url("../images/background.png"); background-position: right top; background-repeat: no-repeat;}
h1 {font-weight:bold;margin-bottom:1em;margin-top:0.5em;font-size:1.8em; line-height: 140%;}
h2 {font-weight:bold;margin-bottom:.5em;margin-top:.5em;font-size:1.6em; color: #FFB100; line-height: 140%;}
h3 {font-weight:bold;margin-bottom:.5em;margin-top:.5em;font-size:1.4em; line-height: 140%;}
h4 {color:#363;text-transform:none;text-decoration:none;font-weight:bold;margin-bottom:.25em;font-size:1.2em; line-height: 140%;}
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{margin-bottom: 1em;}
strong{ font-weight: bold; }
hr{background-color: #FFB100; height: 2px; width: 100%; border: 0px solid; }

/* Struktur ------------------------------------------ */
#container_wrapper{background-color: transparent; max-width: 1140px; position: relative; margin-left: auto; margin-right: auto;}
#container{ margin-left: 1em; margin-right: 1em;}
#content{font-size:1em; line-height: 160%; background-color: white; border-radius: 10px; box-shadow: 0px 0px 4px rgba(0,0,0,0.35); z-index: 2; position: relative; margin-bottom: 2em; padding-top: 1px; padding-bottom: 1px; }
#menu-trigger{display: none}
#content_header{max-height: 200px; overflow: hidden; border-radius: 10px; width: 100%; background-color: silver; margin-bottom: 1.5em;}
#content_header img{width: 100%;}
#content_inner{background-color: white; margin: 1.5em; }
#header{position: relative; height: 150px; z-index: 1; transition:all 1.0s ease-in-out;}
#logo{margin-top: 10px; margin-left: 10px; height: 130px; width: 407px;}
#header_inner{ display:none; position: absolute; min-height: 45px; bottom: 0; right: 10px; width: 400px; background-color: #e4ded5; border-top-right-radius: 10px; border-top-left-radius: 3em; box-shadow: 0px 0px 4px rgba(0,0,0,0.35)}
html.js #header img{margin-bottom: 4em}
html.js #header_inner{display: block;}
#breadcrumb{position: absolute; top: 2em; right: 1em; font-size: 0.8em; color: #666;  transition:all 1.0s ease-in-out;}
#breadcrumb a{color: #333; text-decoration: underline;}
#spalte_l{float: left; width: 25%; transition: width 1s}
#navi{}
#navi li a{display: block; padding: 0.2em 0.5em; background-color: #e4ded5; color: black; text-decoration: none; border-radius: 5px; font-size: 1.2em;margin-bottom: 0.4em; -moz-transition: background-color 0.4s ease; -webkit-transition: background-color 0.4s ease; -ms-transition: background-color 0.4s ease; -o-transition: background-color 0.4s ease; transition: background-color 0.4s ease;}
#navi ul {margin-bottom: 1em;}
html.no-js #navi li a:hover, html.js.csstransitions #navi li a:hover{background-color: #FFB100;}
#navi li li a{background-color: white; text-indent: 1em; font-size: 1.1em; padding: 0.2em; margin-bottom: 0.2em;}
#navi li li li a{background-color: white; text-indent: 2em; font-size: 1em; padding: 0.2em; margin-bottom: 0.2em;}
#navi li a.now{background-image: url(../images/pfeile.png); background-repeat: no-repeat; background-position: right top; font-weight: bold;}
#navi li a.now:hover{ background-position: right bottom;}
#inhalt{width: 70%; float: right;margin-bottom: 2em;}
#footer{}
#footer_inner{background-color: red;}
#mobilemenu{display: none;}
#back-to-top { position:fixed; bottom:0px; right:50px;	cursor:pointer;	padding:10px; background:#FFB100; border-top-left-radius:5px; border-top-right-radius:5px; color:white;	z-index: 99; opacity: 0.3 ; display: none;}
#back-to-top:hover{opacity: 1;}
#search_results_fix{margin-bottom: 2em; display: none;}
#suche{float: right; margin-right: 1em;}
#suchschlitz_fix, #suche_fix{display: none;}
#suchschlitz_fix{width: 9.5em; margin-top: 0.5em; border: 1px silver solid; background-color: white; padding: 0.25em; color: #949494; line-height: 1.5em; font-size: 1em; font-style: italic;}
#suchschlitz_fix:focus{background-color: white; color: black; font-style: normal; }
#suche_fix{ margin-top: 0.5em; border: 1px silver solid; margin-left: 0.3em; padding: 0.2em 0.5em;line-height: 1.5em;}

#mobilemenu_select{display: none;}
#mobile_one{display: none;}


/* Elemente ------------------------------------------ */
.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:1em; }
.abstand_u { margin-bottom:1em; }
.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: 23.875%; }
.trennlinie{ padding-bottom: 0.5em; padding-top: 0.5em; }
.unsichtbar {  position:absolute;  left:-10000px; top:auto; width:1px; height:1px; overflow:hidden;}
.softbox{width: 48%; border: 1px solid #e4ded5; margin-bottom: 1em; float: left; border-radius: 5px; }
.softbox h1{font-size: 1.5em;}
.softbox_inner{margin: 0.5em;}
.softbox:nth-child(2n+2){float: right; }
.softbox:nth-child(2n+3){clear: both;}
.softbox .kat{display: block; padding: 0.2em 0.5em; background-color: #e4ded5; color: black; text-decoration: none; border-radius: 5px; font-size: 1.2em;margin-bottom: 0.4em;}
.softbox .storyAuthor{ color: #6f6f6f; font-size: 0.8em; width: 60%; float: left;}
.softbox .storyLink{ color: black; font-size: 1em; text-align: right;}
.softbox:hover{background-color: #FAEED5; transition: all 1.0s ease-in-out;}
.softbox img {width: 100%; margin:0px 0px 1em 0px; float: none;}
.termine .termin_datum{width: auto; font-weight: bold;  display: block;  padding-top: 0.2em;  padding-right: 0.5em;  padding-bottom: 0.2em;  padding-left: 0.5em;  background-color: #e4ded5;  color: black;  border-top-left-radius: 5px;  border-top-right-radius: 5px;  border-bottom-right-radius: 5px;  border-bottom-left-radius: 5px;  font-size: 1.2em;  margin-bottom: 0.4em;}
.termine .termin_zeit{font-weight: normal; width: 25%; float: left;}
.termine .termin_text{width: 75%; float: right; padding-top: 1px; margin-bottom: 1em; font-size: 1em;}
.termine p{font-size: 1em;}
.termine h3{margin-top: 0; font-size: 1.3em;}
.termine hr{height: 0px; background-color: #e4ded5;}
.termine .more{text-align: left; font-size: 1em;}

#inhalt ul {margin-bottom: 1em;}
#inhalt ul li{margin-left: 2em; list-style: disc; list-style-position: outside;}
#inhalt ol {margin-bottom: 1em;}
#inhalt ol li{margin-left: 2em; list-style: decimal; list-style-position: outside;}


#spalte_l .termine a{text-decoration: none; display: block;}
#spalte_l .termine {border: 1px solid #FFB100; padding: 0.5em; margin-bottom: 0.25em;}
#spalte_l .termine .termin_datum{width: auto; border-radius: 0px; background-color: white; color: #FFB100; padding: 0; font-size: 1em; font-weight: normal; margin: 0;}
#spalte_l .termine .termin_zeit, #spalte_l .termine .termin_text p{display: none;}
#spalte_l .termine .termin_text{width: auto; float: none; padding-top: 1px; margin-bottom: 0em;}
#spalte_l .termine h3{margin-top: 0; font-size: 1.1em; font-weight: bold; margin: 0px;}
#spalte_l .termine hr{height: 0px; background-color: #FFB100; margin: 0;}

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

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


/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 960px) {}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 768px) {
	#spalte_l{width: 35%;}
	#inhalt{width: 60%; margin-right: 2%;}
	#header{height: 180px;}
	#breadcrumb{position: absolute; top: 1em;}
	.softbox{width: auto; border: 1px solid #e4ded5; margin-bottom: 1em; float: none; border-radius: 5px; }
	.softbox_inner{margin: 0.5em;}
	.softbox:nth-child(2n+2){float: none; }
}

@media only screen and (max-width: 630px) {
	#navi {font-size: 0.9em;}
}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 480px) {
  body{font-size: 90%;}
  #container{ margin-left: 0.5em; margin-right: 0.5em;}
  #content_inner{background-color: white; margin: 0.5em;}
  #spalte_l, #inhalt{float: none; width: 100%; clear: both;}
  #inhalt{margin-bottom: 0;}
  #navi, #fontsize, #tools{display: none; }
  #header{height: auto;}
  #logo{width: 90%; height: auto;}
  #header_inner{width: 90%;}
  #breadcrumb{display: none;}
  .hideme{display: none;}
  #lines { border-bottom: 12px double black; border-top: 4px solid black; height: 4px; width:25px; float: left; margin-right: 1em;}
  html.jPanelMenu #mobile_one{display: block;}
  /*#mobile_one{display: block;}*/
  #menu-trigger{ width: 100%; display: block; background-color: #FFB100; padding: 0.5em; font-size: 1.5em; font-weight: bold; text-decoration: none; color: black; border-bottom: 1px solid silver;
	background: -moz-linear-gradient(top,  #ffb100 0%, #ffbf3f 50%, #ffb100 51%, #ffb100 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffb100), color-stop(50%,#ffbf3f), color-stop(51%,#ffb100), color-stop(100%,#ffb100));
	background: -webkit-linear-gradient(top,  #ffb100 0%,#ffbf3f 50%,#ffb100 51%,#ffb100 100%);
	background: -o-linear-gradient(top,  #ffb100 0%,#ffbf3f 50%,#ffb100 51%,#ffb100 100%);
	background: -ms-linear-gradient(top,  #ffb100 0%,#ffbf3f 50%,#ffb100 51%,#ffb100 100%);
	background: linear-gradient(to bottom,  #ffb100 0%,#ffbf3f 50%,#ffb100 51%,#ffb100 100%);}
	  
	#mobilemenu_select{ width: 100%; display: block; background-color: #FFB100; text-decoration: none; color: black; border-bottom: 1px solid silver;
	background: -moz-linear-gradient(top,  #ffb100 0%, #ffbf3f 50%, #ffb100 51%, #ffb100 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffb100), color-stop(50%,#ffbf3f), color-stop(51%,#ffb100), color-stop(100%,#ffb100));
	background: -webkit-linear-gradient(top,  #ffb100 0%,#ffbf3f 50%,#ffb100 51%,#ffb100 100%);
	background: -o-linear-gradient(top,  #ffb100 0%,#ffbf3f 50%,#ffb100 51%,#ffb100 100%);
	background: -ms-linear-gradient(top,  #ffb100 0%,#ffbf3f 50%,#ffb100 51%,#ffb100 100%);
	background: linear-gradient(to bottom,  #ffb100 0%,#ffbf3f 50%,#ffb100 51%,#ffb100 100%);}
    #mobilemenu_select select{width: 90%; margin: 1em 5%; font-size: 1.0em; font-weight: normal; border: 1px solid gray;}
    html.jPanelMenu #mobilemenu_select{display: none;}
    #suchschlitz_fix{width: 160px;}
    #jPanelMenu-menu{background-color: #faeed5; border-right: 1px solid white; }
	#jPanelMenu-menu ul{width: 100%;}
	#jPanelMenu-menu ul li{width: 100%;}
	#jPanelMenu-menu ul li a{display: block; padding: 0.6em 0.4em; background-color: #FFB100; color: black; text-decoration: none;font-weight: bold;border-bottom: 1px solid white; font-size: 1.2em;}
	#jPanelMenu-menu ul li a:hover{background-color: white;}
	#jPanelMenu-menu ul li li a{font-weight: normal; padding-left: 1em; background-color: #E4DED5;}
	#jPanelMenu-menu ul li li a:hover{font-weight: normal; padding-left: 1em; background-color: white;}
	#jPanelMenu-menu ul li li li a{font-weight: normal; padding-left: 1.5em; background-color: #f3efe8;}
	#jPanelMenu-menu li a.now{background-image: url(../images/pfeile.png); background-repeat: no-repeat; background-position: right -68px;}
	#jPanelMenu-menu li li a.now, #jPanelMenu-menu li li a.now:hover, #jPanelMenu-menu li a.now:hover{background-image: url(../images/pfeile.png); background-repeat: no-repeat; background-position: right 5px;}
	#jPanelMenu-menu .closer, #jPanelMenu-menu .closer:hover{background-color: #FFB100; padding: 0.5em; font-size: 1.5em; font-weight: bold; text-decoration: none; color: black; border-bottom: 1px solid silver;
	background: -moz-linear-gradient(top,  #ffb100 0%, #ffbf3f 50%, #ffb100 51%, #ffb100 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffb100), color-stop(50%,#ffbf3f), color-stop(51%,#ffb100), color-stop(100%,#ffb100));
	background: -webkit-linear-gradient(top,  #ffb100 0%,#ffbf3f 50%,#ffb100 51%,#ffb100 100%);
	background: -o-linear-gradient(top,  #ffb100 0%,#ffbf3f 50%,#ffb100 51%,#ffb100 100%);
	background: -ms-linear-gradient(top,  #ffb100 0%,#ffbf3f 50%,#ffb100 51%,#ffb100 100%);
	background: linear-gradient(to bottom,  #ffb100 0%,#ffbf3f 50%,#ffb100 51%,#ffb100 100%);
	width: 100%; display: block; text-align: center; font-weight: bold; text-decoration: none; color: black; font-size: 1.5em; border-bottom: 1px solid white;}

}