/* ==================================================================
Allgemeines Stylesheet fuer den Siteaufbau
Datei: layout.css
Media: all

Datum: 02.10.2009
Autor:	Agentur Grintsch
Internet: www.grintsch.com

Inhalt:
CSS-Anweisungen f�r 

Aufbau:
1. Allgemeine Selektoren
	1.1 Inline-Elemente
	1.2 Block-Elemente
	1.3 Klassen

2. Site-Wrapper

3. Logo

4. Contentbereich
	4.1 TextContent
		4.1.1 box_text
		4.1.2 box_header + spezielle boxen
			4.1.2.1 wContentStage box_header
		4.1.3 text_full
		4.1.4 text_half
			4.1.4.1 Special for Contacts
		4.1.5 text_one_third
		4.1.6 img_half
			4.1.6.1 img_half (speziell f�r blue_gradient)
		4.1.7 contentText f�r Startseite
		4.1.8 contentText f�r Filialen
	4.2 ContentStage
		4.2.1 ContentStage f�r Filialen
		4.2.2 Tabnavigation Image or GoogleMaps
	4.3 InfoContent
		4.3.1 InfoContent f�r Startseite
	4.4 Stage
	4.5 Print/Recommend

5. Header
	5.1 Subnavigation
	5.2 download-area
	5.3 Suche
	5.4 customer login
	5.5 Breadcrumb

6. Menu Main
	6.1 Navigation

7. Footer
==================================================================== */
/* ======================================================

	=2. Site-Wrapper

========================================================= */
#wPage.page_filialen { 
	background: #3B73C6 url(img/bg/full_filialen.jpg) no-repeat;
}

/* ======================================================

	=3. Logo

========================================================= */
#wPage.page_filialen #wLogo { background: #2967c0 url(img/bg/wLogo_blue_gradient.gif) no-repeat; }

/* ======================================================

	=4. Contentbereich

========================================================= */
#wPage.page_filialen #wContent { background: none; }

#wPage.page_filialen #wContent #content { background: none; }

	#wPage.page_filialen #wContentBg { 
		padding-bottom:0;
		/*background: url(img/bg/wContentBg_startseite.gif) no-repeat bottom left; */
	}

/* ======================================================

	=4.1 TextContent

========================================================= */
#wPage.page_filialen #wContentText {
	float: left;
	
	width: 975px;
	xxxmin-height: 450px;
	xxxheight: 450px;
	min-height: 480px;
	height: 480px;
	xxxbackground: url(img/bg/full_filialen.jpg) no-repeat;
}

	#wPage.page_filialen #wContentText div.headline {
		position: absolute;		
	}

		#wPage.page_filialen #wContentText h1 { color: #fff; }
		#wPage.page_filialen #wContentText h2,
		#wPage.page_filialen #wContentText h3 { padding: 0; }
		
	/*#wPage.page_filialen #wContentText div.filialen {*/
	#wPage.page_filialen #wContentText div.box_text {
		position: absolute;
		top: 180px;
		right: 15px;
		
		width: 470px;
		background: #fff url(img/bg/content_startseite.gif) no-repeat;
	}

	#wPage.page_filialen #wContentText div.box_text h2 {
		padding: 0;
		margin-bottom: 5px;
	}
	#wPage.page_filialen #wContentText div.box_text h3 { 
		color: #72737a; 
		padding: 0;
		margin-bottom: 10px;
	}

	#wPage.page_filialen #wContentText div.box_text a {
		padding-left: 10px;
		background: url(img/reste/arrow_e2001a_8x12.gif) no-repeat 0 2px;
	}

		#wPage.page_filialen #wContentText div.box_text a:hover,
		#wPage.page_filialen #wContentText div.box_text a:active,
		#wPage.page_filialen #wContentText div.box_text a:focus { text-decoration: underline; }

	#wPage.page_filialen #wContentText div.box_text div.text_half {
		width: 450px;
		padding: 10px 10px 25px;
		background: url(img/bg/wContentText_filialen_shadow.gif) no-repeat bottom left;
	}

	/* ======================================================
		=4.2.1 wContentText box_header 
	========================================================= */
	#wContentText div.box_header h1 {
		top: 150px;
		padding: 0;
	}
	
	#wContentText div.box_header h2 {
		top: 125px;
	}

		#wContentText div.box_header div.text_full h1 {
			left: 16px;
			top: 365px;
			width: auto;
			padding: 5px 50px 5px 10px;
			background-color: #fff;
		}
	
		#wContentText div.box_header div.text_full p.abstract {
			position: absolute;
			color: #fff;
			left: 16px;
			top: 401px;
			padding: 5px 50px 5px 10px;
			background-color: #004EBD;
		}

		#wContentText div.box_header div.box_thumbnails { padding: 350px 12px 0 0; }

		#wContentText div.box_header div.box_thumbnails a { 
			float: right;
			margin-right: 5px;
		}

	/* ======================================================
		=4.2.2 Tabnavigation Image or GoogleMaps
	========================================================= */
	#wPage.page_filialen #wContentText div.box_text table {	width: 450px; }
	
	#wPage.page_filialen #wContentText div.box_text div.box_tab { border-left: 1px solid #72737a; }
	
	#wPage.page_filialen #wContentText div.box_text div.box_tab ul { 
		list-style-type: none;
		margin-bottom: 0;
	}

	#wPage.page_filialen #wContentText div.box_text div.box_tab ul li {
		float: left;
		text-align: center;
		
		width: 60px;
		padding: 3px;
		border-width: 0 1px 0 0;
		border-style: solid;
		border-color: #72737a;
		background: none;
	}

		#wPage.page_filialen #wContentText div.box_text div.box_tab ul li.active { 
			border-width: 1px 1px 0 0;
			background: url(img/bg/content.gif) no-repeat; 
		}
		
	#wPage.page_filialen #wContentText div.box_text div.box_tab ul li a {
		display: block;
		width: 60px;
		height: 20px;
		color: #72737a;
		font-weight: bold;
		padding: 0;
		background: none;
	}

	#wPage.page_filialen #wContentText div.shop_pointer_1 {
		position: absolute;
		top: 230px;
		left: 256px;
		
		width: 247px;
		height: 100px;
		border: 2px solid #fff;
		border-bottom: none;
		border-right: none;
	}

	/* ======================================================
		=4.2.3 ImageMap 
	========================================================= */
	#wPage.page_filialen dl#standorte_map {
		position: absolute;
		display: block;
		top: 203px;
		left: 0px;
		height: 397px;
		width: 541px;
		
		background-position: top left;
		background-repeat: no-repeat;
	}
	
	#wPage.page_filialen dl#standorte_map.herzogenrath { background-image: url(img/imagemap/background_map_herzogenrath.jpg); }
	#wPage.page_filialen dl#standorte_map.aachen { background-image: url(img/imagemap/background_map_aachen.jpg); }
	#wPage.page_filialen dl#standorte_map.huerth { background-image: url(img/imagemap/background_map_huerth.jpg); }
	#wPage.page_filialen dl#standorte_map.suelz { background-image: url(img/imagemap/background_map_suelz.jpg); }
	#wPage.page_filialen dl#standorte_map.suelz_2 { background-image: url(img/imagemap/background_map_suelz_2.jpg); }
	#wPage.page_filialen dl#standorte_map.nippes { background-image: url(img/imagemap/background_map_nippes.jpg); }
	#wPage.page_filialen dl#standorte_map.zollstock { background-image: url(img/imagemap/background_map_zollstock.jpg); }
	#wPage.page_filialen dl#standorte_map.chlodwigplatz { background-image: url(img/imagemap/background_map_chlodwigplatz.jpg); }
	#wPage.page_filialen dl#standorte_map.deutz { background-image: url(img/imagemap/background_map_deutz_fh.jpg); }
	#wPage.page_filialen dl#standorte_map.brakel { background-image: url(img/imagemap/background_map_brakel.jpg); }
	#wPage.page_filialen dl#standorte_map.bonn { background-image: url(img/imagemap/background_map_bonn.jpg); }
	#wPage.page_filialen dl#standorte_map.rath { background-image: url(img/imagemap/background_map_rath.jpg); }
	#wPage.page_filialen dl#standorte_map.holzminden { background-image: url(img/imagemap/background_map_holzminden.jpg); }

		#wPage.page_filialen dl#standorte_map #map_herzogenrath {
			position: absolute;
			left: 26px;
			top: 228px;
			width: 39px;
			z-index: 10;
		}

		#wPage.page_filialen dl#standorte_map #map_aachen {
			position: absolute;
			left: 111px;
			top: 270px;
			width: 36px;
			z-index: 15;
		}

		#wPage.page_filialen dl#standorte_map #map_huerth {
			position: absolute;
			left: 153px;
			top: 197px;
			width: 38px;
			z-index: 20;
		}

		#wPage.page_filialen dl#standorte_map #map_suelz {
			position: absolute;
			left: 184px;
			top: 151px;
			width: 37px;
			z-index: 25;
		}

		#wPage.page_filialen dl#standorte_map #map_suelz_2 {
			position: absolute;
			left: 164px;
			top: 145px;
			width: 37px;
			z-index: 20;
		}

		#wPage.page_filialen dl#standorte_map #map_nippes {
			position: absolute;
			left: 227px;
			top: 100px;
			width: 38px;
			z-index: 30;
		}
		
		#wPage.page_filialen dl#standorte_map #map_zollstock {
			position: absolute;
			left: 239px;
			top: 186px;
			width: 33px;
			z-index: 20;
		}

		#wPage.page_filialen dl#standorte_map #map_chlodwigplatz {
			position: absolute;
			left: 265px;
			top: 163px;
			width: 33px;
			z-index: 25;
		}

		#wPage.page_filialen dl#standorte_map #map_deutz {
			position: absolute;
			left: 309px;
			top: 141px;
			width: 37px;
			z-index: 30;
		}

		#wPage.page_filialen dl#standorte_map #map_brakel {
			position: absolute;
			left: 374px;
			top: 35px;
			width: 37px;
			z-index: 35;
		}

		#wPage.page_filialen dl#standorte_map #map_bonn {
			position: absolute;
			left: 400px;
			top: 311px;
			width: 39px;
			z-index: 40;
		}

		#wPage.page_filialen dl#standorte_map #map_rath {
			position: absolute;
			left: 418px;
			top: 163px;
			width: 37px;
			z-index: 45;
		}

		#wPage.page_filialen dl#standorte_map #map_holzminden {
			position: absolute;
			left: 445px;
			top: 20px;
			width: 37px;
			z-index: 50;
		}


			#wPage.page_filialen dl#standorte_map #map_herzogenrath a,
			#wPage.page_filialen dl#standorte_map #map_aachen a,
			#wPage.page_filialen dl#standorte_map #map_huerth a,
			#wPage.page_filialen dl#standorte_map #map_suelz a,
			#wPage.page_filialen dl#standorte_map #map_suelz_2 a,
			#wPage.page_filialen dl#standorte_map #map_nippes a,
			#wPage.page_filialen dl#standorte_map #map_zollstock a,
			#wPage.page_filialen dl#standorte_map #map_chlodwigplatz a,
			#wPage.page_filialen dl#standorte_map #map_deutz a,
			#wPage.page_filialen dl#standorte_map #map_brakel a,
			#wPage.page_filialen dl#standorte_map #map_bonn a,
			#wPage.page_filialen dl#standorte_map #map_rath a,
			#wPage.page_filialen dl#standorte_map #map_holzminden a {
				display: block;
				text-decoration: none;
				height: 60px;
				width: 35px;
				background-image: url(img/imagemap/hover/handy_hover.png);				
				background-position: 0 -100px;
				background-repeat: no-repeat;
				
				z-index: 20;
			}

			#wPage.page_filialen dl#standorte_map #map_brakel a,
			#wPage.page_filialen dl#standorte_map #map_holzminden a { background-image: url(img/imagemap/hover/handy_hover_s.png); }

			#wPage.page_filialen dl#standorte_map #map_herzogenrath a:hover,
			#wPage.page_filialen dl#standorte_map #map_aachen a:hover,
			#wPage.page_filialen dl#standorte_map #map_huerth a:hover,
			#wPage.page_filialen dl#standorte_map #map_suelz a:hover,
			#wPage.page_filialen dl#standorte_map #map_suelz_2 a:hover,
			#wPage.page_filialen dl#standorte_map #map_nippes a:hover,
			#wPage.page_filialen dl#standorte_map #map_zollstock a:hover,
			#wPage.page_filialen dl#standorte_map #map_chlodwigplatz a:hover,
			#wPage.page_filialen dl#standorte_map #map_deutz a:hover,
			#wPage.page_filialen dl#standorte_map #map_brakel a:hover,
			#wPage.page_filialen dl#standorte_map #map_bonn a:hover,
			#wPage.page_filialen dl#standorte_map #map_rath a:hover,
			#wPage.page_filialen dl#standorte_map #map_holzminden a:hover { background-position: 0 0; }

			#wPage.page_filialen dl#standorte_map a span, #wPage.page_filialen dl#standorte_map a:visited span { display: none; }

/* ======================================================

	=4.3 InfoContent

========================================================= */
#wPage.page_filialen #wContentInfo {
	float: left;
	
	width: 975px;
}

	#wPage.page_filialen #wContentInfo div.text_one_third,
	#wPage.page_filialen #wContentInfo div.text_half,
	#wPage.page_filialen #wContentInfo div.text_full {
		float: left;
		
		width: 940px;		
		height: 18px;
		padding: 6px 10px;
		margin: 0;
		
		border-bottom: 0 none;
		background: #fff url(img/bg/content_startseite.gif) no-repeat;
	}

	#wPage.page_filialen #wContentInfo h3 {
		float: left;
		font-size: 14px;
		padding: 2px 10px 0 0;
		border-right: 1px solid #72737a;
	}
	
	#wPage.page_filialen #wContentInfo p {
		float: left;
		padding: 0 10px 0 10px;
	}

	#wPage.page_filialen #wContentInfo a {
		float: right;
		padding: 0 0 0 10px;
		background: url(img/sonstiges/arrow_e2001a_8x12.gif) no-repeat 0 3px;
	}

		#wPage.page_filialen #wContentInfo a:hover,
		#wPage.page_filialen #wContentInfo a:active,
		#wPage.page_filialen #wContentInfo a:focus { text-decoration: underline; }
