@import url(http://fonts.googleapis.com/css?family=Exo+2);
html {

	width: 100%;
	height: 100%;
	overflow-y: scroll;
}
body {
/*
	font-family: Palatino, Book Antiqua, Times New Roman, Times, serif; 
	font-size: 14px;
*/
	font: normal 400 18px/155% 'Exo 2', Palatino, Book Antiqua, Times New Roman, Times, serif;
	color: #fff;
	margin: 0px;
	padding: 0px;
	background-color: #000;
}
a {
	text-decoration: none;
	color: #496999;
}
a:hover {
	text-decoration: underline;
}
img {
	max-width: 100%;
	height: auto !important;
}
#main {
	padding: 0 0%;
	
}
div#kopf {
	position: relative;
	background-color: #222;
	xxxcolor: #BF7033;
	padding: 0.4% 0;
	xxxmargin-top: -10px;
}
h1 {
	font: italic 400 48px/100% 'Exo 2', Palatino, Book Antiqua, Times New Roman, Times, serif;
	margin: 16px 0px -6px 0px;
	padding: 0;
}
h2 {
	font: italic 900 24px/100% 'Exo 2', Palatino, Book Antiqua, Times New Roman, Times, serif;
	margin: 10px 4px 15px 0px;
	padding: 0;
}
h3 {
	font: italic 400 22px/100% 'Exo 2', Palatino, Book Antiqua, Times New Roman, Times, serif;
}
audio {
	width:266px;
}
#hintergrund {
	position: fixed; 
	width: 100%; 
	height: 100% !important;
}
.drittel {
	float:left;
	width: 266px;
}
.trechts {
	text-align: right;
}
.zeile {
	padding: 10px 0;
	border-bottom: #666 dashed 1px;
}
.zeile:first-of-type {
	margin-top: 10px;
}
.zeile:after {
	content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.spalte {
	float: left;
	width: 44%;
	padding: 3%;
}
.spalte_li {
	float: left;
	width: 44%;
	padding: 3% 4% 2% 3px;
	text-align: left;
}
.spalte_re {
	float: left;
	width: 44%;
	padding: 3% 2% 2% 4%;
	text-align: left;
}
.spalte_li p, .spalte_re p {
	margin: 0;
	padding: 0 0 3% 0;
}
.title-box {
    xxxcolor: #3D3A38;
    font: 300 36px/1.2em 'Exo 2', Palatino, Book Antiqua, Times New Roman, Times, serif;
    text-align: center;
	margin: 0 0 22px 0;
	max-width: 100%;
	overflow: hidden;
}
.title-box span:before {
    background: none repeat scroll 0 0 #fff;
    content: "";
    display: block;
    height: 1px;
    left: -140px;
    position: absolute;
    top: 50%;
    width: 123px;
}
.title-box span:after {
    background: none repeat scroll 0 0 #fff;
    content: "";
    display: block;
    height: 1px;
    position: absolute;
    right: -140px;
    top: 50%;
    width: 123px;
}
.title-box span {
    position: relative;
    display: inline-block;
    padding: 0 10px;
}
.behaelter {
	position: relative;
	max-width: 800px;
	margin: 0 auto;
	padding: 0 8px;
}
.behaelter:after {
	clear: both;
}
.video16to9 {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	xxxpadding-top: 25px;
	height: 0;
	max-width: 100%;
}
.video16to9 iframe, .video16to9 img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#oben {
	position: relative;
	xxxbackground-color: #bf7033;
	xxxheight: 70px;
}
#logo {
	position: absolute;
	bottom: -16px;
	left: 14px;
	z-index: 99;
}
#logo img {
	width: 280px;
}
/*
div#oben h1 {
	position: absolute;
	bottom: 0;
	right: 20px;
	color: #f4f4f4;
	font-size: 32px;
	line-height: 53px;
	height: 53px;
	margin: 0;
	padding: 0;
}
*/
div#mitte1 {
	position: relative;
	xxxbackground-color: #F2EFED;
}
div#mitte2 {
	padding: 1% 0 0 0;
	position: relative;

}
div#mitte3 {
	padding: 22px 0;
	position: relative;
	color: #fff;
	background-color: #263729;
	background-image:url(/img/fliese01.jpg);
	padding:22px;
	xxxbackground-repeat:no-repeat;
	h-align:center;

}
div#mitte3 h2 {
	color: #E7E2DB;
}
div#unten {
	position: relative;
	width: 100%;
	xxxheight: 55px;
	background-color: #222;
	xxxcolor: #FFF;
	xxxtext-align: center;
	padding: 20px 0;
}
#content {
	padding: 0 50px 20px 50px;
}
#content p {
	line-height: 130%;
}
#content h2 {
	margin: 22px 0 12px 0;
}
.links {
	position: relative;
	float: left;
	width: 518px;
	height: 100%;
}
.glink {
	margin:  0;
	display: inline-block;
	xxxwidth: 24%;
	width: 150px;
	height: 150px;
	text-align: center;


}
.glink img {
	width: 150px;
	height: 150px;
	margin: 1%;
}
.glink a {
	overflow: hidden;
	text-indent: -5000px;
	display: inline-block;
	width: 150px;
	height: 150px;
		
}
#gl-tv a, #gl-mu a, #gl-pi a, #gl-bl a { background: transparent url(/img/menue.jpg) no-repeat; }
#gl-tv a { background-position: 0px 0px; }
#gl-mu a { background-position: -150px 0px; }
#gl-pi a { background-position: -300px 0px; }
#gl-bl a { background-position: -450px 0px; }
#gl-tv a:hover { background-position: 0px -150px; }
#gl-mu a:hover { background-position: -150px -150px; }
#gl-pi a:hover { background-position: -300px -150px; }
#gl-bl a:hover { background-position: -450px -150px; }

#breadcrumbs {
	position: relative;
	float: left;
	margin: 0 0 0 20px;
}
.h {
	background-color: #fde7a8;
}
.rot {
	color: #f00;
}
.tmb {
	border: 1px solid #000;
	width: 112px;
}
.tmbf {
	width: 125px;
	//height: 110px;
	//float: left;
	font-size: 10px;
}
.beitrag {
	height: 20px;
	line-height: 20px !important;
	padding: 0;
}
.beitrag img {
	float: left;
	width: 32px;
	height: 20px;
	padding: 0;
	margin: 0 10px 0 0;
}
.cf:before, .cf:after, .row:before, .row:after {
  content: "";
  display: table;
}

.cf:after, .row:after {
  clear: both;
 }

.cf, .row {
  zoom: 1;
 }
.tmbf {
    height: 140px;
	margin-right: 5px;
    float: left;
}
.tmbi {
    height: 90px;
	width: auto;
	bottom: 0;
}
.minfo img {
    border: 1px solid #000;
}
a.minfo {
    position: relative;
	z-index: 24;
	text-decoration: none;
}
a.minfo:hover {
    z-index: 25;
    background-color: #fff;
}
a.minfo span {
    display: none;
}
a.minfo:hover span {
    display: block;
    position: absolute;
	xxxright: 50px;
	xxxtop: -70px;
	bottom: 90px;
    text-decoration: none;
	z-index: 25;
	border: 1px #888 solid;
	background-color: #fff;
	padding: 4px;
}
.clr {
	clear: both;
}
.description {
	background-color: #000 !important;
	font-size: 33px !important;
}
.leadin {
	font: italic 400 22px/110% 'Exo 2', Palatino, Book Antiqua, Times New Roman, Times, serif;
	color: #512b04;
	margin: 0;
	padding: 0 0 6% 0;
}
.tipp {
	font: italic 800 20px/130%  Palatino, Book Antiqua, Times New Roman, Times, serif;
	color: #512b04;
}
.marker {
	background-color: #ffeaaa;
}
.lauftext {
	font: normal 400 18px/130% Palatino, Book Antiqua, Times New Roman, Times, serif; 
	color: #505050;
}
.bild-links, .bild-rechts, .bild {
	font: italic 800 18px/100% Palatino, Book Antiqua, Times New Roman, Times, serif;
    fxxxont-size: 12px;
    line-height: 15px;
    xxxcolor: rgb(44,74,115);
	text-align: center;
	xxxbackground-color: #d1edf9;
	xxxborder: 1px solid #ccc;
	xxxpadding: 3px;
}
.bild-links {
    margin: 6px 12px 6px 0;
    float: left;
}
.bild-rechts {
    margin: 6px 0px 6px 12px;
    float: right;
}
.bild {
	margin: auto;
}
/* FORM */
#formular > div {
  overflow: hidden;
  padding: 1px;
  margin: 10px 0;
}
#formular > div > fieldset > div > div {
  margin: 0 0 5px 0;
}
#formular > div > label, legend {
	width: 22%;
  float: left;
  padding-right: 3%;
  text-align: right;
}
#formular > div > div,
#formular > div > fieldset > div {
  width: 75%;
  float: right;
}
input[type=text],
input[type=email],
textarea {
	width: 100%;
}
input[type=text],
input[type=email] {
  width: 50%;
}
input[type=text]:focus,
input[type=email]:focus,
textarea:focus {
  outline: 0;
  border-color: #4697e4;
}
.slogan {
	position:absolute;
	top:50px;
	font-size: 24px;
	xxxline-height:74px;
}

@media (max-width: 449px) {
			
  #formular > div {
    margin: 0 0 15px 0; 
  }
  #formular > div > label, legend {
	width: 100%;
    float: none;
    margin: 0 0 2px 0;
  }
  #formular > div > div,
  #formular > div > fieldset > div {
    width: 100%;
    float: none;
  }
  input[type=text],
  input[type=email],
  input[type=url],
  input[type=password],
  textarea,
  select {
    width: 100%;
	font-size: 16px;
  }
}
@media all and (max-width: 1000px) {
	.slogan {
	display:none;
}
}
@media all and (max-width: 798px) {

	.spalte, .spalte_li, .spalte_re {
		width: 100%;
		text-align: left;
	}
	.spalte_li { padding: 3% 0 0 0;}
	.spalte_re { padding: 0 0 3% 0;}
	.glink {
		width: 31%;
	}
	.trechts {
		text-align: left;
	}
	#logo {
		top: 5px;
		bottom: auto;
	}
}
@media all and (max-width: 600px) and (min-width: 401px) {
	h1 { font-size: 36px; }
	h2 { font-size: 22px; }
	.glink {
		width: 48%;
	}
	#logo img {
		width: 215px;
		height: auto;

	}
}
@media all and (max-width: 400px) {

	h1 { font-size: 24px; }
	h2 { font-size: 18px; }
	#logo img {
		width: 180px;
		height: auto;

	}
	.glink {
		width: 48%;
	}
	.description {
		font-size: 14px !important;
	}
}