@charset 'utf-8';
@import url(reset.css);

/* Colors
orange layout: #fecf42;
orange font: #e4a400;
dark grey: #626262;
fonts dark grey: #efefef;
*/


/* ----------------------------------------------------- All browsers */
body{
color: #000;
font-family: verdana, arial, sans-serif;
background: #626262 url(images/back_body.jpg) top left repeat-x;
}

/* Layout settings */

#wrapper {
width: 979px;
margin: 0px auto 0px auto;
border-left: 1px solid #fecf42;
position: relative;
padding-top: 111px;
background: transparent url(images/back_content_all.gif) top left repeat-y;
}

#main {
background: #FFF;
width: 687px;
float: left;
margin-left: 289px;
display: inline;
color: #353535;
font-size: 0.8em;
font-family: verdana, arial, sans-serif;
line-height: 1.5;
min-height:  600px;
}

#left {
float: left;
margin-left: -979px;
width: 270px;
display: inline;
}

/* Header */
#header{
	position: absolute;
	top: 0px;
	left: 0px;
	background: black url(images/back_body.jpg) top left repeat-x;
	height: 111px;
	width: 979px;
	z-index: 10;
	overflow: hidden;
}

#header a.logo {
	position: absolute;
	top: 0px;
	left: -2px;
	display: block;
	width: 391px;
	height: 80px;
	background: url(images/logo.jpg) -7px 0px no-repeat;
}

strong {
	font-weight: bold;
}

#header a.logo span{
	position: absolute;
	left: -2323px;
	top: -2323px;
	}

/* Menu links */

#left ul#mainmenu {
	margin-left: 10px;
	margin-top: 25px;
}

.js #left ul#mainmenu {
	opacity: 0;
	visibility: hidden;
	}

#left ul li {
	padding: 0px 10px 0px 0px;
	background: url(images/menu_trenner.jpg) bottom left repeat-x;
	display: inline-block;
	width: 245px;
}


#left ul li a{
	font-family: Arial, Helvetica, sans-serif;;
	font-size: 0.9em;
	color: #3f3f3f;
	text-decoration: none;
	display: block;
	margin-top: 18px;
	}

#left ul li a:hover{
	color: #fff;
	}

#left ul ul{
	margin: 0px 0px 5px 0px;
	padding: 0px 0px 0px 0px;
	display: block;
	overflow: hidden;
	}

#left ul ul ul{
	display: none;
	}

#left ul li.active ul ul{
	display: none;
	}
	
#left ul li.active ul li.active ul{
	display: block;
	}

#left ul ul li{
	display: inline;
	float: left;
	background: transparent;
	padding: 0px 0px 0px 0px;
	margin: 1px 5px 5px 0px;
	border: none;
	line-height: 0.7em;
	font-size: 0.7em;
	border-right: 1px solid #3f3f3f;
	width: auto;
	}

#left ul ul li a{
	line-height: 0.7em;
	padding-right: 5px;
	font-size: 1em;
	display: inline;
	float: left;
	margin: 0px;
	}
	
#left ul ul li.last{
	border: none;
	}
	

#left li.active a{
	font-weight: bold;
	color: #FFF;
	}

#left li.active ul ul{
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	display: block;
	overflow: hidden;
	}

#left ul li.active ul li{
	display: inline;
	background: transparent;
	padding: 0px 0px 0px 0px;
	margin: 1px 2px 2px 0px;
	border: none;
	line-height: 0.8em;
	font-size: 0.8em;
	border-right: none;
	text-indent: 0px;
	}

#left ul li.active ul li a{
	line-height: 1em;
	padding: 2px 10px 2px 15px;
	font-size: 1em;
	display: block;
	float: none;
	margin: 0px;
	font-weight: normal;
	width: 200px;
	color: #3f3f3f;
	background: url(images/menu_pfeil.gif) 2px 4px no-repeat;
	}

#left ul li.active ul li a:hover{
	background-position: 2px -50px;
	color: #FFF;
	}
	
#left ul li.active ul li.first {
	margin-top: 5px;
}

#left ul li.active ul li.active a{
	background-position: 2px -50px;
	color: #FFF;
	font-weight: bold;
	}
	
	
#left ul li.active ul li.active li{
	line-height: 1em;
	font-size: 1em;
	}
	
#left ul li.active ul li.active li a{
	line-height: 1em;
	font-size: 1em;
	font-weight: normal;
	color: #3f3f3f;
	padding: 2px 10px 2px 27px;
	background: url(images/menu_pfeil.gif) 17px 3px no-repeat;
	}

#left ul li.active ul li.active li a:hover, #left ul li.active ul li.active li.active a{
	background-position: 17px -51px;
	color: #FFF;
	font-weight: bold;
	}

#left ul li.active ul li.active li a:hover {
	font-weight: normal;
}

/* Metamenu */
#metamenu {
	position: absolute;
	top: 92px;
	left: 3px;
}

#metamenu li{ 
display: inline;
float: left;
padding-right: 5px;
font-size: 0.7em;
line-height: 1.1em;
overflow: visible;
background: url(images/strich_weiss.gif) right 3px no-repeat;
}

#metamenu li.last{
	background: none;
	} 

#metamenu li a{ 
font-size: 1em;
color: #FFF;
text-decoration: none;
padding-left: 5px;
}


	
/* Tabmenu */

#tabmenu {
	position: absolute;
	top: 80px;
	right: -4px;
}

#tabmenu li{
	margin-right: 3px;
	float: left;
	display: inline;
	}

#tabmenu a{
	background: url(images/tab_right.jpg) right top no-repeat;
	color: #FFF;
	font-size: 11px;
	padding: 0px 10px 0px 0px;
	height: 26px;
	line-height: 26px;
	text-decoration: none;
	display: block;
	width: auto! important;
	width: 10px;
	margin-top: 5px;
}

#tabmenu a span{
	background: url(images/tab_left.jpg) left top no-repeat;
	padding: 0px 0px 0px 10px;
	height: 26px;
	line-height: 26px;
	display: block;
}

#tabmenu a:hover{
	background-position: right -59px;
	}
	
#tabmenu a:hover span, #tabmenu li.active a span{
	background-position: left -59px;
	}
	
#tabmenu li.active a{
	height: 31px;
	color: #3f3f3f;
	margin-top: 0px;
	line-height: 40px;
	background-position: right -59px;
}


/* Content */
#content {
	margin: 0px 10px 0px 0px;
}

#main h1, #main h2.blog{
	padding-left: 35px;
	background: url(images/haken_gelb.gif) top left no-repeat;
	font-size: 2.3em;
	color: #e4a400;
	line-height: 1.7em;
	font-family: 'Trebuchet MS',verdana,arial,sans-serif;
	margin-top: 20px;
	letter-spacing: -1px;
	margin-bottom: 10px;
}

#main h2.blog{
	margin-top: 60px;
	}

#main h2{
	font-size: 1.4em;
	font-weight: normal;
	font-family: 'Trebuchet MS',verdana,arial,sans-serif;
	color: #626262;
	}

#main h3{
	font-weight: bold;
	margin-bottom: 5px;
	}
	
#main p{
	color: #353535;
	margin-bottom: 20px;
	}
	
#main a{
	color: #e4a400;
	text-decoration: none;
	font-weight: bold;
}
	

#main a.link1{
	color: #e4a400;
	font-weight: bold;
	}

#content ul{
	margin: 0px 10px 20px 10px;
}

#content ul li{
	line-height: 1.25;
	margin-bottom: 10px;
	padding-left: 20px;
	background: url(images/listenpfeil.gif) 0px 2px no-repeat;
}

/* Teaser */
.news {
	position: relative;	
	margin: 10px 25px 15px 0px;
	padding-bottom: 10px;
	padding-top: 12px;
	border-top: 1px solid #CCC;
	height: auto! important;
	height: 135px;
	min-height: 135px;
}

.eintrag {

}

.newsbild {
	height: 125px;
	width: 125px;
	border: 1px solid #CCC;
	text-align: center;
	position: absolute;
	top: 22px;
	left: 9px;
}

.newsbild img{

	}
.news h2, .news .newsinfo, .news .eintrag{
	margin-left: 150px;
	}


.news .newsinfo {
	font-size: 0.85em;
	margin: 0px 0px 5px 150px;
	font-style: italic;
}
	
.ohne h2, .ohne .newsinfo, .ohne .eintrag {
	margin-left: 50px;
}


.ohne {
	padding-top: 0px;
}

#main .news h2 a{
	color: #626262;
	text-decoration: none;
	margin-top: 12px;
	margin-bottom: 0px;
	font-weight: normal;
}

.date{
	width: 32px;
	height: 30px;
	position: absolute;
	left: 0;
	top: 11px;
	font-size: 14px;
	font-weight: bold;
	color: #FFF !important;
	text-align: center;
	padding-top: 15px;
}

.date span{
	position: absolute;
	top: -1px;
	left: 2px;
	color: #FFF;
	font-size: 10px;
	font-family: arial, sans-serif;
	padding: 0px;
	white-space: nowrap;
	letter-spacing: -1px;
	}


.weiterlesen {
	font-size: 1em;
	display: block;
	margin: 20px 20px 0px 0px;
}

.month{
	background: url(images/kalenderblatt.gif) top left no-repeat;
	color: #FFF;
}

.paging{
	margin-top: 20px;
}

.paging a, .paging span {
padding: 3px;
width: 15px;
display: block;
float: left;
margin-right: 5px;
text-align: center;
}

.paging a{
background: #FEBE1A;
color: #FFF !important;
}

.paging span {
border: 1px solid #CCC;
padding: 2px;
width: 15px;
}

.paging a:hover{
background: #666;
}	

#ditto_pages {
margin: 10px 0px 30px 0px;
}

/* Footer */

#footer{
	position: relative;
	background: #626262 url(images/back_footer.jpg) top left repeat-x;
	height: 161px;
	width: 100%;
	border-top: 1px solid #fecf42;
}

#footer .footerlinks{
	width: 979px;
	height: 161px;
	margin: 0px auto 0px auto;
	border-right: 1px solid #fecf42;
	position: relative;
}

div.unten {
width: 250px;
float: left;
font-family: verdana, sans-serif;
margin-top: 30px;
margin-bottom: 10px;
}

div.unten ul li a, a.nachoben{
color: #FFF;
text-decoration: none;
display: block;
font-size: 0.7em;
font-family: verdana, sans-serif;
}

div.unten ul li a:hover{
	color: #CCC;
}

a.nachoben{
position: absolute;
top: 19px;
right: 25px;
font-weight: bold;
padding-left: 12px;
background: transparent url(images/nachoben.gif) left 3px no-repeat;

}

a.nachobenschwarz {
font-weight: bold;
padding-left: 12px;
background: transparent url(images/nachobenschwarz.gif) 388px 7px no-repeat;
float: right;
margin: 10px 0px 10px 0px;
text-decoration: none;
display: block;
width: 100%;
text-align: right;
}

a.nachobenschwarz:hover {
background: #333 url(images/nachoben.gif) 388px 7px no-repeat;
color: #FFF;
}


div.unten ul, div.unten h3 {
margin-left: 0px;
}

div.unten h3 a{
color: #FFF;
text-decoration: none;
font-size: 0.7em;
}

div.unten ul li{
display: inline;
}

.closed {
	height: 20px;
	overflow: hidden;
	opacity: 0;
}

.offen {
	height: 130px;
	opacity: 1;
}

#toggler {
	position: absolute;
	top: 20px;
	left: 0px;
	font-size: 0.7em;
	font-weight: bold;
	color: #FFF;
	cursor: pointer;
	padding-right: 10px;
	background: url(images/nachunten.gif) right 4px no-repeat;
}

#footer p{
	font-size: 11px;
	color: #FFF;
	margin-top: 15px;
}

#footer p a{
	color: #FFF;
	text-decoration: none;
	font-weight: bold;
	}

/* Sitemap */

#sitemap a {
	text-decoration: none;
}

/* Formulare */

/*kontakt*/
div.kontakt label {
width: 160px;
float: left;
}

div.kontakt input, div.kontakt select, div.kontakt textarea, div.kontakt option {
border: 1px solid #CCC;
width: 250px;
margin-top: 5px;
background: url(images/kachel.jpg);
color: #626262;
}

div.kontakt textarea {
height: 250px;
font-size: 12px;
}

div.kontakt input.submit {
width: 148px;
color: #626262;
margin-left: 0px;
margin-top: 25px;
}

div.kontakt input.code {
width: 148px;
}

#main div.kontakt input.required, textarea.required {
	border: 2px solid #fecf42;
}

div.kontakt option {
background: #666;
color: #626262;
}

div.kontakt img {
margin-left: 160px;
margin-top: 10px;
}

div.kontakt p {
margin-bottom: 0;
}

/* Tabbox */

#tabbox_outer {
	position: relative;
	background: transparent url(images/tabbox_back_oben.gif) left 19px no-repeat;
	width: 661px;
	padding-top: 27px;
	padding-bottom: 20px;
}

#main #tabbox_menu {
	position: absolute;
	top: 0px;
	left: 0px;
	margin: 0px;
	padding: 0px;
}

#main #tabbox_menu li{
	display: inline;
	float: left;
	padding: 0px;
	margin: 0px;
	background: url(images/contenttab_rechts.gif) right top no-repeat;
	height: 20px;
	font-size: 0.85em;
	margin-right: 3px;
	line-height: 20px;
	cursor: pointer;
	white-space: nowrap;
	}
#tabbox_menu li span{
	background: url(images/contenttab_links.gif) left top no-repeat;
	height: 20px;
	display: block;
	width: auto! important;
	width: 10px;
	padding: 0px 10px 0px 10px;
	}
	
#main #tabbox_menu li.active{
	background: url(images/contenttab_rechts.gif) right -48px no-repeat;
	}

#tabbox_menu li.active span{
	background: url(images/contenttab_links.gif) left -48px no-repeat;
	}
	
#tabbox_bottom {
	background: url(images/tabbox_back_unten.gif) left bottom no-repeat;
	padding-bottom: 13px;
	}
	
#tabbox_mitte {
	background: url(images/tabbox_back_mitte.gif) 0px 0px repeat-y;
	width: 661px;
}
	
#tabbox_content{
overflow: hidden !important;	/*you need that!!! */
width: 661px;
padding-bottom: 10px;
}

.pane{
float: left;		/* you need that!!! */
display: none;		/* you need that - if you remove this, at load the page will have height of the heighest pane, see more instructions in html-file */
width:641px;		/* set the width of your content here, it's not necessary if you dont wanna have fixed with */
padding:10px;		/* unimportant */	
}

#start.pane {
	display: block;
}



#paneContainer{
float:left;			/*you need that!!! */
background: transparent;
}

#main #tabbox_content .news{
	border: 0px;
	padding-bottom: 0px;
	margin-bottom: 0px;
	margin-top: 0px;
	width: 600px;
	position: static;
}

#main #tabbox_content .newsbild {
 position: static;
 float: left;
 width: 125px;
 height: 125px;
}

.newsbild img{

	}
#main #tabbox_content .news h2, #main #tabbox_content .news .eintrag{
	width: 420px;
	float: left;
	position: static;
	margin-left: 20px;
	display: inline;
	}
	
	/* galerie */


#galerie {
	width: 657px;
}

.bild {
	background: transparent;
	width: 200px;
	height: 150px;
	float: left;
	margin-right: 18px;
	overflow: hidden;
	margin-bottom: 18px;
}

#galerie_eintrag .bild{
	width: 400px;
	height: 300px;
	float: left;
	position: relative;
	display: inline;
}



.info{
	position: absolute;
	left: 0px;
	bottom: -1800px;
	width: 430px;
	height: 80px;
	background: url(images/75prozentblack.png);
	z-index: 100;
	display: block;
	font-size: 10px;
	color: #FFF;
	}

#galerie_eintrag .info{
	top: 260px;
	height: 40px;
	width: 400px;
	}

a.details{
	position: absolute;
	top: 0;
	left: 0;
	width: 420px;
	height: 320px;
	display: block;
	background: url(images/trans.gif);
	text-indent: 500px;
}
	
/* Galeriemenü */
div.galeriemenu {
	margin-bottom: 30px;
	margin-top: 25px;
	position: relative;
}

#main a.uebersicht {
	position:absolute;
	top: 58px;
	left: 0px;
	font-size: 11px;
}

#main div.galeriemenu h2{
	font-size: 12px;
	font-weight: bold;
	border-bottom: 1px solid #CCC;
	margin-bottom: 5px;
	padding-bottom: 2px;
	}

div.layouts{
	width: 140px;
	float: left;
	margin-right: 25px;
	display: inline;
}

div.farben{
	width: 110px;
	float: left;
	margin-right: 25px;
	display: inline;
}

div.kategorien{
	width: 347px;
	float: left;
	display: inline;
}

#main div.kategorien ul{
	margin: 0px;
} 

#main div.kategorien ul li{
	display: inline;
	float: left;
	padding: 0px 5px 0px 0px;
	margin-right: 5px;
	background: transparent;
	}
	
#main div.kategorien ul li a{
	font-size: 12px;
	font-weight: normal;
	font-family: 'Trebuchet MS', verdana, sans-serif;
	background: transparent;
	}



#main div.layouts ul, #main div.farben ul{
	margin: 0px;
	}

#main div.layouts ul li, #main div.farben ul li{
	padding: 0px;
	width: 19px;
	height: 19px;	
	display: block;
	float: left;
	overflow: hidden;
	background: transparent;
	margin-right: 2px;
	margin-left: 0px;
}

#main div.layouts ul li a, #main div.farben ul li a{
	width: 19px;
	height: 19px;	
	display: block;
	text-indent: 20px;
	background-position: 2px 2px;
	}
	
li#layout143 a{
	background: url(images/galerie_menu_25.gif) top left no-repeat;
}

li#layout144 a{
	background: url(images/galerie_menu_27.gif) top left no-repeat;
}

li#layout145 a{
	background: url(images/galerie_menu_29.gif) top left no-repeat;
}

li#layout146 a{
	background: url(images/galerie_menu_31.gif) top left no-repeat;
}

li#layout147 a{
	background: url(images/galerie_menu_33.gif) top left no-repeat;
}

li#farbe134 a{
	background: url(images/galerie_menu_49.gif) top left no-repeat;
}

li#farbe135 a{
	background: url(images/galerie_menu_18.gif) top left no-repeat;
}

li#farbe136 a{
	background: url(images/galerie_menu_22.gif) top left no-repeat;
}

li#farbe137 a{
	background: url(images/galerie_menu_48.gif) top left no-repeat;
}

li#farbe138 a{
	background: url(images/galerie_menu_20.gif) top left no-repeat;
}

li#farbe139 a{
	background: url(images/galerie_menu_14.gif) top left no-repeat;
}

li#farbe140 a{
	background: url(images/galerie_menu_16.gif) top left no-repeat;
}

li#farbe141 a{
	background: url(images/galerie_menu_45.gif) top left no-repeat;
}

li#farbe142 a{
	background: url(images/galerie_menu_46.gif) top left no-repeat;
}

li#farbe149 a{
	background: url(images/galerie_menu_47.gif) top left no-repeat;
}

#main div.galeriemenu ul li.active a, #main div.galeriemenu ul li a:hover {
	background-color: #fecf42;
}

#main div.kategorien ul li.active a, #main div.kategorien ul li a:hover {
	background-color: transparent;
	color: #626262;
}

/* Galerie Startseite */
.galerieeintrag {
	width: 150px;
	float: left;
	margin-right: 15px;
	display: inline;
}

#galeriestart{
	margin-bottom: 20px;
	padding-bottom: 20px;

}

/* Galerie Eintrag */

.daten {
	float: left;
	width: 240px;
	padding-left: 10px;
	padding-right: 10px;
	position: relative;
}

#galerie_eintrag h2 a{
	font-size: 14px;
	color: #e4a400;
	font-weight: bold;
	background: url(images/link_extern.gif) 100% 1px no-repeat;
	padding-right: 20px;
}

#galerie_eintrag h2{
	border-bottom: 1px solid #989898;
	margin-bottom: 5px;
}

#galerie_eintrag h3 {
	font-size: 11px;
	color: #FFF;
	margin-top: 0px;
	margin-bottom: 0px;
}

#galerie_eintrag p{
	font-size: 11px;
	color: #FFF;
	margin-bottom: 10px;
}

#galerie_eintrag {
	background: url(images/eintrag_back_all.gif) repeat-y;
}

.innergalerie{
	background: url(images/eintrag_oben.gif) top left no-repeat;
	padding-top: 15px;
}

.abstimmen {
	position: absolute;
	top: 260px;
	width: 260px;
	height: 40px;
	left: 0px;
	background: #272727 url(images/pfeil_klein.gif) 180px 14px no-repeat;
}
#main #galerie_eintrag .abstimmen p{
color: #e4a400;
font-weight: bold;
padding-left: 50px;
background: url(images/pfeil_gross.gif) 0px 5px no-repeat;
line-height: 40px;
font-size: 12px;
}

.back{
float: right;
margin: -20px 25px 0px 0px;
}

/* Kommentare */
#kommentare{
	padding-bottom: 0px;
	margin-top: 20px;
	background: url(images/comments_top.gif) left -4px no-repeat; 
}



.eintrag_footer{
	background: url(images/eintrag_unten.gif) bottom left no-repeat;
	padding-bottom: 49px;
}

.innerkommentare{
	background: url(images/back_comments_all.gif) 260px repeat-y;
	padding-top: 24px;
}

.comment-row{
	background: #8c8b8b url(images/strich_gelb.gif) left bottom repeat-x;
	margin: 0px 31px 0px 8px;
	position: relative;
}

.innerrow{
	padding-top: 5px;
	padding-bottom: 10px;
	background: url(images/back_comments_all.gif) 252px repeat-y;
}

.author{
	position: relative;
	width: 230px;
	float: left;
}

.authorimage{
	position: absolute;
	left: 4px;
	top: 4px;
	border: 1px solid #CCC;
}

.author p, .author a, .author span{
	margin-left: 80px;
	line-height: 1.5;
	margin-top: 0px;
	}

.author a, .author span{
	font-weight: bold;
	color: #FEBE1A;
	font-size: 11px;
	}
.comment-number {
	position: absolute;
	right: 5px;
	top: -5px;
	font-size: 50px;
	color: #696969;
	font-family: "Impact", arial, sans-serif;
	z-index: 1;
}

.jot-row-alt .comment-number{
	color: #8C8B8B;
}

.comment-eintrag{
	width: 369px;
	float: right;
	margin-right: 5px;
	margin-top: 3px;
	display: inline;
	padding-left: 20px;
	z-index: 100;
	position: relative;
	background: url(images/pfeil_sehr_klein.gif) left 4px no-repeat;
}

/* Kommentarform */

#kommentare label{
width: 240px;
float: left;
color: #FFF;
text-align: right;
font-size: 11px;
padding-right: 20px;
font-weight: bold;
background: url(images/pfeil_sehr_klein.gif) right 50% no-repeat;
}

#kommentare label span{
	font-size: 10px;
	font-weight: normal;
	}

#kommentare input, #kommentare textarea{
	background: #FFF;
	border: 0px;
	width: 320px;
	margin-left: 14px;
	}

#kommentare textarea{
	overflow: auto;
	}

#kommentare .form-row{
	clear: both;
	margin-bottom: 10px;
}

#kommentare input.submit {
	margin-left: 275px;
	width: 100px;
}

#kommentare h2{
	color: #FFF;
	border: 0px;
	margin-left: 275px;
}

#rss{
	width:282px;
	height: 120px;
	background: url(images/rss_back.gif) top left no-repeat;
	position: absolute;
	top: -80px;
	right: -10px;
	cursor: pointer;
}

#rss div{
	margin: 30px 20px 40px 20px;
	}

#rss div a{
	color: #3b3b3b;
	font-size: 11px;
	text-decoration: none;
	}

#rss div a:hover{
	color: #FFF;
	}

#tagchunk {
	margin-top: 25px;
}

/* ----------------------------------------------------- JS enabled browsers */

.js div { }

/* ----------------------------------------------------- IE7 and below */

.ie7 div { }

/* ----------------------------------------------------- IE6 and below */

.ie6 div { }