/* CSS Document */

/* Farbset
Die Grundfarbe (Lindengrün) ist #A8D420
Variante heller: #E9FFAA
Variante greller: #D3FF6C*/

/*Basics*/
body{
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
  margin: 0px;
  padding: 0px;
  text-align: center;
  color: #000;
  background: #fff;
  font: normal normal 14px Arial, Helvetica, sans-serif;
  }
h1 {
  font: bold 15px Arial, Helvetica, sans-serif;
	width: 430px;
	border-bottom: 3px #A8D420 solid;
}
h2 {
  font: bold 13px Arial, Helvetica, sans-serif;
  border-bottom-color:#A8D420;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  width:430px;
}
.smallfont {
  font: normal normal 12px Arial, Helvetica, sans-serif;
}

p {
margin: 0px;
padding: 0px;
width: 430px;
  font: normal normal 13px Arial, Helvetica, sans-serif;
 padding-bottom: 15px;
}
td {
  font: normal normal 13px Arial, Helvetica, sans-serif;
}
/*Listen im contentbereich*/
#content ul{
list-style: none;
margin: 0;
padding: 0;
}
#content ul li{
width:420px;
margin-bottom: 10px;
font-size:12px;
padding: 5px;
border: 1px solid;
border-color:#ccc;
/*will man, dass sich die links über die ganze box erstrecken, die oberen vier zeilen in den folgenden passus verschieben, und ev.den folgenden hovereffekt  in ul li a:hover umbenennen*/
}
#content ul li a{
color:#000;
}
#content ul li:hover{
border-color:#A8D420;
background-color:#E9FFAA;
}

/*links im contentbereich*/
#content a {
color: #000;
font-style:normal;
text-decoration:none;
border-bottom: 1px solid #A8D420;
}

#content a.foto
{
border: none;
}
#content img.foto
{
border: none;
margin: 0;
padding: 0;
}

/*infobox im contentbereich*/
#content ol{
list-style: none;
margin: 0;
padding: 0;
}
#content ol li{
width:405px;
line-height: 15px;
padding: 10px;
border: 1px solid;
border-color:#A8D420;
background-color:#E9FFAA;
  font: normal normal 12px Arial, Helvetica, sans-serif;
}

/*Bild im Contentbereich*/
#content a img
{
border: 1px solid;
border-color:#A8D420;
background-color:#fff;
padding: 5px;
margin-right:10px;
width:190px;
height:140px;
}
#content img:hover {
background-color:#E9FFAA;
}


/* Die grossen Layoutblöcke*/

/*Der um alles drumrum*/
#wrapper { 
  position: relative;
  width: 950px;
  height: 1500px;
  margin: 0px auto 0;
  z-index:1;
  text-align: left;
  background: #fff;
  }

/*Spalten*/
#left-column{ 
  position:absolute;
  top: 0px;
  left: 0px;
  width: 250px;
  height: 1500px;
  z-index:3;
  text-align: left;
  background: #fff;
  }
#center-column{
  position:absolute;
  top: 0px;
  left: 250px;
  width: 450px;
  height: 1500px;
  z-index:40;
  text-align: left;
  background: #fff;
/*  border-left:#eee 1px solid; /*war #000 1px*/
/*  border-right:#000 1px solid; */
  }
#right-column{
	position:absolute;
	top: 0px;
	left: 700px;
	width: 250px;
	height: 1500px;
	z-index:5;
	text-align: left;
	background: #fff;
	background-image: url(../img/material/balken/balken_rechts_bg.jpg);
	background-repeat: repeat-y;
  }

/*hier noch die Schatten für die Center-Column*/
#centercolumnschatten2 {
/*left: 0px;
width: 451px;
height:1500px;
border-right: #ccc 1px solid;
visibility:none;
z-index:1;*/
}
#centercolumnschatten1 {
/*left: 0px;
width: 452px;
height:1500px;
border-right: #eee 1px solid;
visibility:none;
z-index:1;*/
}

/*Die Spalten für die Stücküberblicke*/
#img-left-column{
	position:absolute;
	top: 250px;
	left: -131px;
	width: 350px;
	height: 900px;
	z-index:7;
	text-align: left;
    }
 #img-right-column{
	position:absolute;
	top: 300px;
	left: 230px;
	width: 340px;
	height: 900px;
	z-index:6;
	text-align: left;
  }

/*Bild oben*/
 #img-top{
  position:absolute;
  left: 5px;
  top: 5px;
  width: 430px;
  height: 100px;
  z-index:3;
  }  
 #img-top img{
 width: 440px;
 height: 100px;
 }

/*Content */
 #content{
  position:absolute;
  left: 10px;
  top: 210px;
  width: 440px;
  height: 800px;
  z-index:1;
  }  


/*DAS MENU*/
/*Menuboxen*/
#menu{  
  position:absolute;
  top: 111px;
  left: 5px;
  width: 440px;
  height: 25px;
  background-color:#fff;
  border-top: 3px #A8D420 solid;
  border-bottom: 3px #A8D420 solid;
  z-index:8;
  }
/*Menuelemente*/
#produktionen {
	position:absolute;
	left:0px;
	top:0px;
	width:98px;
	height:30px;
	background-image:url(../img/material/menu/produktionen.gif);
	background-repeat:no-repeat;
	z-index: 1;
}
#produktionen:hover {
	background-image:url(../img/material/menu/produktionen-over.gif);
}
#aktuell {
	width:62px;
	height:22px;
	background-image:url(../img/material/menu/aktuell.gif);
	background-repeat:no-repeat;
}
#aktuell:hover {
	background-image:url(../img/material/menu/aktuell-over.gif);
}

#archiv{
	width:62px;
	height:22px;
	background-image:url(../img/material/menu/archiv.gif);
	background-repeat:no-repeat;
}
#archiv:hover {
	background-image:url(../img/material/menu/archiv-over.gif);
}

#externe {
	position:absolute;
	left:104px;
	top:0px;
	width:119px;
	height:30px;
	background-image:url(../img/material/menu/externe.gif);
	background-repeat:no-repeat;
	z-index: 1;
}
#externe:hover {
	background-image:url(../img/material/menu/externe-over.gif);
}
#taki {
	width:165px;
	height:22px;
	background-image:url(../img/material/menu/taki.gif);
	background-repeat:no-repeat;
}
#taki:hover {
	background-image:url(../img/material/menu/taki-over.gif);
}
#graham {
	width:165px;
	height:22px;
	background-image:url(../img/material/menu/graham.gif);
	background-repeat:no-repeat;
}
#graham:hover {
	background-image:url(../img/material/menu/graham-over.gif);
}

#ueber {
	position:absolute;
	left:230px;
	top:0px;
	width:66px;
	height:30px;
	background-image:url(../img/material/menu/ueber.gif);
	background-repeat:no-repeat;
	z-index: 1;
}
#ueber:hover {
	background-image:url(../img/material/menu/ueber-over.gif);
}
#katerbra {
	width:174px;
	height:22px;
	background-image:url(../img/material/menu/katerbra.gif);
	background-repeat:no-repeat;
}
#katerbra:hover {
	background-image:url(../img/material/menu/katerbra-over.gif);
}
#festivals {
	width:174px;
	height:22px;
	background-image:url(../img/material/menu/festivals.gif);
	background-repeat:no-repeat;
}
#festivals:hover {
	background-image:url(../img/material/menu/festivals-over.gif);
}
#stats {
	width:174px;
	height:22px;
	background-image:url(../img/material/menu/stats.gif);
	background-repeat:no-repeat;
}
#stats:hover {
	background-image:url(../img/material/menu/stats-over.gif);
}

#spielplan {
	position:absolute;
	left:303px;
	top:0px;
	width:69px;
	height:30px;
	background-image:url(../img/material/menu/spielplan.gif);
	background-repeat:no-repeat;
	z-index: 1;
}
#spielplan:hover {
	background-image:url(../img/material/menu/spielplan-over.gif);
}

#kontakt {
	position:absolute;
	left:379px;
	top:0px;
	width:57px;
	height:25px;
	background-image:url(../img/material/menu/kontakt.gif);
	background-repeat:no-repeat;
	z-index: 1;
}
#kontakt:hover {
	background-image:url(../img/material/menu/kontakt-over.gif);
}


/*submenuelemente*/
#sub_prod{
	position:absolute;
	padding-top:7px;
	top: 24px;
	left: 0px;
	width: 67px;
	height: 60px;
	visibility: hidden;
	z-index: 1;

} 
#produktionen:hover #sub_prod, #sub_prod:hover{
	visibility: visible;
} 
#sub_ext{
	position:absolute;
	padding-top:7px;
	top: 24px;
	left: 0px;
	width: 140px;
	height: 60px;
	visibility: hidden;
	z-index: 1;
} 
#externe:hover #sub_ext, #sub_ext:hover{
	visibility: visible;
} 
#sub_ueber{
	position:absolute;
	padding-top:7px;
	top: 24px;
	left: 0px;
	width: 140px;
	height: 81px;
	visibility: hidden;
	z-index: 1;
} 
#ueber:hover #sub_ueber, #sub_ueber:hover{
	visibility: visible;
} 
/*alle over-bilder zum preloaden und das zeug für die druckversion*/
#preloadimages, #printlogo, #footer{
	position: absolute;
	top: -300px;
	left: -300px;
	width: 200px;
	height: 229px;
	z-index: 0;
	visibility:hidden;
}


/*DIE SEITLICHEN SUBMENUS UND BILDERKÄSTEN*/

/*submenu für die produktionen*/
#produktions-menu-links{
position: absolute;
left: 99px;
top:233px;
width:170px;
height: 200px;
}
#produktions-menu-rechts{
position: absolute;
left: 0px;
top:233px;
width:170px;
height: 200px;
}
.produktions-menu ul {
list-style: none;
margin: 0;
padding: 0;
}
.produktions-menu ul li{
background-color:#ffffff;
font: normal normal 12px Arial, Helvetica, sans-serif;
margin-bottom: 4px;
margin-left: 4px;
padding: 5px;

}
.produktions-menu ul li a {
display:block;
color:#000000;
border-bottom: none;
text-decoration:none;
font: normal normal 12px Arial, Helvetica, sans-serif;
}

.produktions-menu ul li:hover{
background-color:#E9FFAA;
}
#produktions-menu-links .produktions-menu ul li{
border-style: solid;
border-color:#A8D420;
border-width: 1px 0px 1px 1px;
/*bisherige variante im schattenstil
border-style: solid;
border-top-color:#ccc;
border-bottom-color:#000;
border-left-color:#000000;
border-width: 1px 0px 1px 1px;
*/

}
#produktions-menu-rechts .produktions-menu ul li{
border-style: solid;
border-top-color:#A8D420;
border-bottom-color:#A8D420;
border-right-color:#A8D420;
border-width: 1px 1px 1px 0px;
/*bisherige variante im schattenstil
border-style: solid;
border-top-color:#ccc;
border-bottom-color:#000;
border-right-color:#000;
border-width: 1px 1px 1px 0px;
*/
}


/*Bildkasten auf den Produktionen-Seiten*/
#bildkasten-links{
position: absolute;
left: 49px;
top:233px;
width:190px;
height: 140px;
padding: 5px;
background-color:#ffffff;
border-style: solid;
border-color:#A8D420;
border-width: 1px 0px 1px 1px;
/*bisherige variante im schattenstil
border-style: solid;
border-top-color:#ccc;
border-bottom-color:#000;
border-left-color:#000;
border-width: 1px 0px 1px 1px;
*/
}
#bildkasten-links:hover{
background-color:#E9FFAA;
}

#bildkasten-rechts{
position: absolute;
text-align:left;
left: 0px;
top:233px;
width:190px;
height: 140px;
padding: 5px 5px 5px 5px;
background-color:#ffffff;
border-style: solid;
border-color:#A8D420;
border-width: 1px 1px 1px 0px;
/*bisherige variante im schattenstil
border-style: solid;
border-top-color:#ccc;
border-bottom-color:#000;
border-right-color:#000;
border-width: 1px 1px 1px 0px;
*/
}
#bildkasten-rechts:hover{
background-color:#E9FFAA;
}


/*Die linke und rechte Linie*/
#leftline {
position: absolute;
left: 0px;
top: 152px;
height: 6px;
width:50%;
background-image:url(../img/material/balken/balken_links_linie.jpg);
background-repeat:repeat-x;
z-index: 0;
}
#rightline {
position: absolute;
right: 0px;
top: 152px;
height: 6px;
width:50%;
background-image:url(../img/material/balken/balken_rechts_linie.jpg);
background-repeat:repeat-x;
z-index: 0;
}
/*das zeug für die druckversion - verstecken*/
#printlogo {
position: absolute;
left: -500px;
top: -500px;
height: 200px;
width: 200px;
visibility:hidden;
}
#footer {
position: absolute;
left: -500px;
top: -500px;
height: 30px;
width: 450px;
visibility:hidden;
}
