/*

	CSS für GBH.Website
	
	Struktur und Layout der Seite
	
	Datum: 04/2009
	Autor: Thomas Jung ( Telefon: +49 172 3465096;
	Email: thomas@tjwd.de;
	Web: www.tjwd.de) 

*/


/* ############################ Allgemeines DesignSetup der grundsätzlichen HTML-Elemente ############################ */

* { margin:0; padding:0; }

html, body { 
	position:relative;
	width:100%;
	height: 100%;
}

body { 
	font-family: 'Lucida Grande', Verdana, Arial, Helvetica, Sans-Serif;
	background: #fff;
	text-align: center;
	font-size: 10px;
}

img { border: none; }

	

/* ############################ Erstes Design der wichtigsten Elemente für die Positionierung und Darstellung ############################ */
.hidden, #sitenav { 
	display: none;
}

#sitewrapper { 
	position: relative;
	min-height: 100.2%;
}

.centring { 
	position: relative;
	width: 90em;
	margin: 0 auto;
	text-align: left;
}

.floatclearing { 
	position: relative;
	width: 100%;
	clear: both;
}



/* ############################ Definition des Headers ############################ */
#a_top { 
	position: absolute;
	top: -4em;
	left: 0;
	width: 1px;
	height: 1px;
	display: block;
}

#header { 
	position: relative;
	background: url(../images/headergradient.gif) repeat-x 0 0;
	height: 44em;
	z-index: 4;
}

#header .centring { height: 44em; }

 
#mainelement { 
	position: absolute;
	top: 12em;
	left: 0;
	width: 90em;
	background: url(../images/mainelement_bg.png) no-repeat 0 0;
	height: 24.4em;
	z-index: 32;
}

 
h1 { 
	position: absolute;
	top: 4em;
	left: 3.6em;
	width: 24em;
	height: 6em;
	font-size: 1em;
	display: block;
}

 
#h_link { 
	position: relative;
	width: 24em;
	height: 6em;
	background: url(../images/gbh_logo.gif) no-repeat left top;
	text-indent: -900em;
	overflow: hidden;
	display: block;
}

 
#mainimg { 
	position: absolute;
	top: -1.3em;
	left: 4.5em;
	height: 30em;
	width: 57em;
	background: url(../images/mainimage_bg.png) no-repeat left top;
	z-index: 30;
}

 
#header #mainimg h2 { 

	display: none;

/*	position: absolute;
	left: 0.7em;
	bottom: 0.8em;
	font-size: 2.4em;
	font-weight: normal;
	color: #863;
	text-transform: uppercase;
	background: #fff;
	padding: 0.1em 0.4em;
*/ }

 
#mainimg div { position: absolute; top: 2.3em; left: 2.3em; display:none; }

#mainimg div#header1 { display:block; }

#mainimg a.previous,
#mainimg a.next {
	position: absolute;
	top: 0;
	width: 14em;
	height: 25em;
	cursor: pointer;
}

#mainimg a.previous { left: 0; }
#mainimg a.next { right: 0; }


#mainimg a.previous:hover { background: url(../images/mainimgnav_prev.gif) no-repeat left center; }
#mainimg a.next:hover { background: url(../images/mainimgnav_next.gif) no-repeat right center; }


/* ############################ CSS-Setup der Navigation ############################ */
#header #navigation ul.nav { 
	position: absolute;
	right: 5em;
	top: 3.5em;
	width: 22.4em;
	height: 11em;
	padding:0 0 0 1.2em;
	display: block;
	background: url(../images/navbg.png) no-repeat 0 4em;
	z-index: 31;
}

	
#header #navigation ul.nav li {  position: relative; display: block; }

#header #navigation ul.nav li.mieten a.firstlink, 
#header #navigation ul.nav li.tagen a.firstlink, 
#header #navigation ul.nav li.kultur a.firstlink  { 
	position: relative;
	width: 10.8em;
	height: 3.1em;
	background-image: url(../images/nav.png);
	background-repeat: no-repeat;
	text-indent: -900em;
	overflow: hidden;
	display: block;
}

#header #navigation ul.nav li.mieten a.firstlink { background-position: 0 0; }
#header #navigation ul.nav li.tagen a.firstlink { background-position: 0 -3.6em; }
#header #navigation ul.nav li.kultur a.firstlink {  background-position: 0 -7.2em; }

#header #navigation ul.nav li.mieten { z-index: 900; }
#header #navigation ul.nav li.tagen { z-index: 850; }
#header #navigation ul.nav li.kultur { z-index: 800; }

#header #navigation ul.nav, #header #navigation ul.nav ul  { list-style-type: none; }

 
#header #navigation ul.nav li .dropdown { 
	position: absolute;
	top: 3.5em;
	width: 18em;
	left: -90000em;
	z-index: 9000;
	background: url(../images/dropdownbg.png) no-repeat left bottom;
	padding: 0 0 2.5em 0;
}

#header #navigation ul.nav .dropdown li { 
	position: relative;
	border-bottom: 1px dotted #cb9;
	margin: 0 1.3em 0 0.8em;
	padding: 0.4em 1em;
}

#header #navigation ul.nav .dropdown li a, #footer #technav li a { 
	font-size: 1em;
	text-decoration: none;
	font-weight: bold;
	color: #963;
	border-bottom: none;
}

#header #navigation ul.nav .dropdown li:hover, #header #navigation ul.nav .dropdown li:hover a, #footer #technav li a:hover { background: #875; color: #fff; }

#header #navigation ul.nav .dropdown .dropdown_top { 
	position: absolute;
	top: -1.6em;
	left:0;
	width: 18em;
	height: 1.6em;
	background: url(../images/dropdowntop.png) no-repeat 0 0;
}

#header #navigation ul.nav li:hover .dropdown, #header #navigation ul.nav li.sfhover .dropdown { left:5em; z-index: 10000; }

 
#header #navigation ul.nav ul.nav_standort { position: relative; margin: 1.5em 0 0 0.5em; }

#header #navigation ul.nav ul.nav_standort li { 
	background: url(../images/navsep.gif) no-repeat left bottom;
	height: 1.4em;
}

#header #navigation ul.nav ul.nav_standort a { 
	font-weight: bold;
	color: #fff;
	text-decoration: none;
}

#header #navigation ul.nav ul.nav_standort a:hover { color: #863; }



/* ############################ CSS-Blocks für den Slider und die Sitemap ############################ */
#slider { 
	position: absolute;
	top: 35.9em;
	left: 4.4em;
	width: 82em;
	height: 3.5em;
	background: url(../images/slider_bg.png) no-repeat left bottom;
	z-index: 1;
}

#slider #sitemap { position: relative; height: 3.5em; }

#slider #sitemap .nav { 
	position: relative;
	margin: 5em 3em;
	height: 18em;
	list-style-type: none;
	line-height: 1.8em;
}

#slider #sitemap .nav li { 
	position: relative;
	float: left;
	width: 21%;
	border-left: 1px dotted #cba;
	margin: 0 -1px 0 0;
	height: 100%;
	padding: 0 1em;
}

#slider #sitemap .nav ul { 
	list-style-image: url(../images/sitemapbullets.gif);
	list-style-position: inside;
	margin: 1em 0;
}

#slider #sitemap .nav ul li { 
	position: relative;
	float: none;
	width: 100%;
	border-left: 0;
	height: auto;
	padding: 0;
	margin: 0;
}

#slider #sitemap .nav a.firstlink { font-size: 2em; color: #fff; text-decoration: none; }

#slider #sitemap .nav a { font-size: 1em; color: #fff; text-decoration: none; }

#slider #sitemap .nav a:hover { background: #fff; color: #875; }

#slider #sm_technav {  position: absolute; left: 3em; top: 0; }

#slider #sm_technav ul { list-style-type: none; }

#slider #sm_technav ul li { 
	position: relative;
	float: left;
	margin: 0  0 0 -1px;
	border-width: 0 1px;
	border-style: dotted;
	border-color: #cba;
	padding: 0 0.2em;
}

#slider #sm_technav ul li a { color: #fff; text-decoration: none; padding: 0.2em 0.4em; }

#slider #sm_technav ul li a:hover { 
	color: #875;
	background: #fff;
	text-decoration: none;
	padding: 0.2em 0.4em;
}

#slider #sitemapbutton { 
	position: absolute;
	top: 0.3em;
	right: 2em;
	width: 8em;
	height: 1.5em;
	border-left: 1px dotted #fff;
	background: url(../images/sitemapbtn.gif) no-repeat 5px 0;
	cursor: pointer;
}

#slider #sitemapbutton:hover { background: url(../images/sitemapbtn.gif) no-repeat 5px -15px; }

#slider #closesitemap { 
	position: absolute;
	bottom: 0.5em;
	right: 0.5em;
	width: 8em;
	height: 4em;
	background: url(../images/closesitemap.png) no-repeat 0 0;
	cursor: pointer;
}

#slider #searchform { position: absolute; top: 0.3em; left: 58.6em; }

#slider #searchform #searchword { 
	position: absolute;
	top: 0;
	left: 0;
	font-size: 10px;
	width: 10em;
	padding: 0 0.2em;
	background: #986;
	border: 1px solid #ba8;
	color: #dcb;
}

#slider #searchform #searchword:focus { background: #fff; border: 1px solid #531; color: #863; }

#slider #searchform #send { 
	position: absolute;
	left: 11em;
	top: 0.3em;
	width: 1em;
	height: 1em;
	padding: 1em 0 0 0;
	margin: 0;
	border: 0;
	overflow: hidden;
	background: transparent url(../images/submitglass.gif) no-repeat 0 0;
	display: block;
	cursor: pointer;
	font-size: 1em;
	text-indent: -9000em;
}

#slider #searchform #send:active { background: transparent url(../images/submitglass.gif) no-repeat 1px 1px; }

#slider #searchform>#send { height: 0px; }

#fullsensitive { 
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/* ############################ Design der Breadcrumb-Navigation ############################ */
#breadcrumb { 
	position: absolute;
	bottom: 0;
	left: 6em;
	width:54em;
	height: 2em;
	display: block;
	background: url(../images/hline.gif) no-repeat bottom right;
	list-style-type: none;
	padding: 0 0 0.5em 0;
}

#breadcrumb li { 
	position: relative;
	float: left;
	font-weight: bold;
	color: #863;
}

#breadcrumb a { 
	text-decoration: none;
	background: url(../images/breadsep.gif) no-repeat right center;
	padding: 0 2em 0 0;
	font-weight: normal;
	color: #863;
}

#breadcrumb a:hover { color: #531; }



/* ############################ Grundlegende Gestaltungen (Position etc.) des Contentbereichs und seiner Elemente ############################ */
#content { 
	position: relative;
	width: 54em;
	float: left;
	padding: 0 0 16em 0;
	margin: 0 0 0 6em;
	z-index: 3;
}

#content ul#contentfoot { 
	position: relative;
	margin: 4em 0;
	width: 100%;
	height: 2em;
	display: block;
	background: url(../images/hline.gif) no-repeat top right;
	list-style-type: none !important;
	list-style-image: none !important;
	padding: 1em 0 0.5em 0;
}

#content ul#contentfoot li { 
	position: absolute;
	top: 0.5em;
	font-size: 0.8333em;
	background: transparent;
	padding: 0;
	display: block;
}

#content ul#contentfoot li a { position: relative; display: block; padding: 0 0 0 1.6em;
	color: #999;
	text-decoration: none; }

#content ul#contentfoot li#to_top { left: 0 !important; }
#content ul#contentfoot li#to_top a { background: url(../images/totop.gif) no-repeat left center; border-bottom: none; }
#content ul#contentfoot li#print_site { right: 0 !important; }
#content ul#contentfoot li#print_site a {  background: url(../images/printthis.gif) no-repeat left center; border-bottom: none; }
#content ul#contentfoot a:hover { color: #666; }



/* Setup der Sidebar-Darstellung */
#sidebar { 
	position: relative;
	width: 24em;
	float: left;
	padding: 4.5em 0 16em 0;
	margin: 0 0 0 3em;
	font-size: 1em;
	line-height: 1.8em;
}



/* ############################ Gestaltung für den Fußbereich mit Funktionsnavigation ############################ */
#footer { 
	position: absolute;
	bottom: 0;
	left: 0;
	height: 12.3em;
	width: 100%;
	background: url(../images/footerbg.gif) repeat-x 0 2.2em;
	z-index: 7;

}

#footer .centring { height: 100%; background: url(../images/footermainbg.png) no-repeat 0 1em; }

#footer #technav { 
	position: absolute;
	left: 4.5em;
	top: 0;
	width: 57em;
	height: 5em;
	background: url(../images/footertechnavbg.png) no-repeat 0 0;
	list-style-type: none;
	padding: 1.6em 0 0 3em;
}

#footer #technav li { 
	position: relative;
	float: left;
	margin: 0  0 0 -1px;
	border-width: 0 1px;
	border-style: dotted;
	border-color: #999;
	padding: 0 0.2em;
}

#footer #technav li a { padding: 0.2em; border-bottom: none; }


/* ############################ EOF ############################ */