/*  ====================================================
Stylesheet: allinone
Datei:  style.css
Datum:  2009-05-28 
Autor:  Christian Tacke, Dortmund Beach Design 
========================================================== */

/* ==============================================
   @media all
   ============================================== */

@media all { 

/* ==============================================
   1 - Reset
   ============================================== */

* {
	padding: 0;
	margin: 0;
	}

/* ==============================================
   2 - Restaurierung 
   ============================================== */

/* margin-bottom für Überschriften, Absätze, Listen etc. */
h1, h2, h3, h4, h5, h6, 
p, blockquote, address, pre, 
ul, ol, dl, table {
	margin-bottom: 1em;
	}

/* Zitate einrücken */ 
blockquote { 
	margin: 1em 2em;
	} 

/* Für alle Listen: nicht einrücken */
ul, ol, dl { 
	margin-left: 0;
	}

/* Für alle Listenelemente: nicht einrücken */
li { 
	margin-left: 0;
	} 

/* Definitionen in Definitionslisten noch mehr einrücken */
dd { 
	margin-left: 2em;
	}

/* Verschachtelte Listen ohne Außenabstand oben/unten */
ul ul, ul ol, ul dl,
ol ul, ol ol, ol dl,
dl ul, dl ol, dl dl {
	margin-top: 0;
	margin-bottom: 0;
	}

/* Aufzählungszeichen für Listenkisten */

/* Ebene 1 - ul: square (ausgefülltes Rechteck); ol: Dezimalzahlen  */
ul {
	list-style-type: none;
	}

/*ol { 
	list-style-type: none;
	}*/

/* Ebene 2 - ul: disc (ausgefüllter Kreis); ol: kleine Buchstaben */
ul ul { 
	list-style-type: disc;
	}

ol ol { 
	list-style-type: lower-alpha;
	}

ul ol { 
	list-style-type: decimal;
	}
ol ul {
	list-style-type: square;
	}

/* Auswahl in Auswahllisten (select) durch padding: 0 schlecht lesbar */
option { 
	padding-left: 0.2em; 
	padding-right: 0.3em; 
	}

/* Rahmen um fieldset und verlinkte Bilder entfernen */
fieldset, a img { 
	border: none; 
	}

} /* Ende @media all */

/* ==============================================
   @media screen
   ============================================== */

@media screen { 

/* ==============================================
   1 - Body, Wrapper 
   ============================================== */

html { height: 101%; }    

body {
	background-color: #a9b5bd;
	background-image: url(grafik/layout/tl-back.gif);
	background-position: center top;
	background-repeat: repeat;
	font-family: Helvetica, Arial, sans-serif;
	font-size: small;
	padding-top: 30px;
	padding-bottom: 40px;
	}

#language {
	position: absolute;
	top: 110px;
	right: 35px;
	}

p#language {
	font-size: 11px;
	color: #ccb100;
	}

#language a {
	color: #117ACB;
	text-decoration: none;
	}

#wrapper {
	position: relative;
	overflow: hidden;
	background-color: #fff;
	width: 900px;
	padding: 10px;
	border: 0;
	margin: 0 auto;
	}

* html #wrapper { height: 1%; }


/* ==============================================
   2 - Headder 
   ============================================== */

#headder {
	background-color: #ffdb00;
	}

#logo {
	margin:0 0 25px 0;
	}
	
/* ==============================================
   3 - Menu 
   ============================================== */

#menu {
	background-color: #ffdb00;
	}

.menu {
	border: none;
	border: 0px;
	margin: 0px;
	padding: 0px;
	font-size: 12px;
	font-weight: bold;
	}
	
.menu ul {
	background: #ffdb00;
	height: 30px;
	list-style: none;
	margin: 0;
	padding: 0;
	}
	
	.menu li {
		float: right;
		padding: 0px;
		}
		
	.menu li a {
		background-color: #ffdb00;
		color: #333;
		display: block;
		font-weight: normal;
		line-height: 30px;
		margin: 0px;
		padding: 0px 20px;
		text-align: center;
		text-decoration: none;
		outline: none;
		}
		
		.menu li a:hover, .menu ul li:hover a {
			background-color: #fff;
			color: #333;
			text-decoration: none;
			outline: none;
			}
			
	.menu li ul {
		background: #ffed80 url("grafik/layout/tl-back-dropdown.gif") center center repeat;
		display: none;
		height: auto;
		padding: 0px;
		margin: 0px;
		border: 0px;
		position: absolute;
		width: 190px;
		border-bottom: 10px solid #fff;
		z-index: 200;
		/*top:1em;
		/*left:0;*/
		}
		
	.menu li:hover ul {
		display: block;
		}
		
	.menu li li {
		display: block;
		float: none;
		margin: 0px;
		padding: 0px;
		width: 190px;
		}
	.menu li:hover li a {
		background: none;
		}
		
	.menu li ul a {
		display: block;
		height: 30px;
		font-size: 12px;
		font-style: normal;
		margin: 0px;
		padding: 0px 10px 0px 15px;
		text-align: left;
		}
		
		.menu li ul a:hover, .menu li ul li:hover a {
			background: #117acb url("grafik/layout/tl-back-dropdown-hover.gif") center center repeat;
			border: 0px;
			color: #fff;
			text-decoration: none;
			outline: none;
			}
			
	.menu p {
		clear:left;
		}
	
	.menu span {
		color: #fff;
		}
	
	.menu b {
		color: #117acb;
		display: block;
		line-height: 30px;
		margin: 0px;
		padding: 0px 20px;
		text-align: center;
		}

/* ==============================================
   4 - Content 
   ============================================== */

#content {
	position: relative;
	overflow: hidden;
	background-color: #b9c4cc;
	background-image: url(grafik/layout/2col.gif);
	background-position: center top;
	background-repeat: repeat-y;
	padding: 0;
	border: 0;
	border-top: 15px solid #b9c4cc;
	border-bottom: 25px solid #b9c4cc;
	margin: 0;
	margin-top: 8px;
	}

* html #content { height: 1%; }

#content_standorte {
	position: relative;
	overflow: hidden;
	background-color: #ffdb00;
	background-position: center top;
	background-repeat: repeat-y;
	padding: 0;
	border: 0;
	border-top: 15px solid #ffdb00;
	border-bottom: 25px solid #ffdb00;
	margin: 0;
	margin-top: 8px;
	}

* html #content_standorte { height: 1%; }

#content_home {
	position: relative;
	overflow: hidden;
	background-color: #b9c4cc;
	padding: 0;
	border: 0;
	margin: 0;
	margin-top: 8px;
	}

* html #content_home { height: 1%; }

			#col1 {
				position: relative;
				overflow: hidden;
				float: left;
				width: 185px;
				background-color: transparent;
				padding: 15px 20px 20px 20px;
				border: 0;
				margin: 0;
				}
			
			* html #content_home #col1 { height: 1%; }
			
			#col24 {
				position: relative;
				overflow: hidden;
				float: left;
				width: 675px;
				background-color: #fff;
				padding: 0;
				border: 0;
				margin: 0;
				}
			
			* html #content_home #col24 { height: 1%; }
			
			.bg {
				position: relative;
				overflow: hidden;
				float: left;
				width: 220px;
				height: 220px;
				background-color: #0CF;
				padding: 0;
				border-left: 5px solid #fff;
				margin: 0;
				}
			
			.down {
				border-top: 5px solid #fff;
				}
			
			
	
	#col12 {
		float: left;
		position: relative;
		overflow: hidden;
		width: 420px;
		background-color: transparent;
		padding: 0px 15px 15px 15px;
		border: 0;
		margin: 0;
		}
	
	* html #col12 { height: 1%; }
				
	#col2 {
		float: left;
		position: relative;
		overflow: hidden;
		width: 200px;
		background-color: transparent;
		padding: 5px 20px 20px 20px;
		border: 0;
		margin: 0;
		margin-left: 210px;
		}
	
	* html #col2 { height: 1%; }
	
	#col12_text {
		float: left;
		position: relative;
		overflow: hidden;
		width: 410px;
		background-color: transparent;
		padding: 5px 20px 20px 20px;
		border: 0;
		margin: 0;
		}
	
	* html #col12_text { height: 1%; }
	
	#col34 {
		float: right;
		position: relative;
		overflow: hidden;
		width: 410px;
		background-color: transparent;
		padding: 5px 20px 20px 20px;
		border: 0;
		margin: 0;
		}
	
	* html #col34 { height: 1%; }
	
		
		.pic_float {
			margin: 4px;
			}
		
		#content_home h1,
		#content h1 {
			font-size: 13px;
			font-weight: bold;
			line-height: 1.5em;
			letter-spacing: 0.01em;
			color: #333;
			padding: 0;
			border: 0;
			margin: 0;
			margin-bottom: 0.75em;
			}
		
		#content_home h2,
		#content h2 {
			font-size: 11px;
			font-weight: bold;
			line-height: 1.5em;
			letter-spacing: 0.01em;
			color: #333;
			padding: 0;
			border: 0;
			margin: 0;
			margin-bottom: 0;
			}
		
		#content_home p,
		#content p,
		#content li,
		#content form {
			font-size: 11px;
			font-weight: normal;
			line-height: 1.5em;
			letter-spacing: 0.01em;
			color: #333;
			}
		
		#agb #content li {
			list-style-position: inside;
			}
		
		.p_last {
			margin-bottom: 2em;
			}
		
		#content a {
			text-decoration: none;
			outline: none;
			font-size: 11px;
			font-weight: normal;
			line-height: 1.75em;
			letter-spacing: 0.01em;
			color: #117acb;
			}
		
		#content a:hover {
			color: #fff;
			}
		
		#content ul span {
			color: #fff;
			}
		
		#content .diagramm_01,
		#content .diagramm_02,
		#content .diagramm_03,
		#content .diagramm_04 {
			background-color: #edf0f2;
			background-image: url(grafik/layout/nr-01.gif);
			background-position: left top;
			background-repeat: no-repeat;
			color: #117acb;
			padding: 6px 10px 10px 45px;
			margin-bottom: 0;
			}
		
		#content .diagramm_02 {
			background-image: url(grafik/layout/nr-02.gif);
			}
			
		#content .diagramm_03 {
			background-image: url(grafik/layout/nr-03.gif);
			}
		
		#content .diagramm_04 {
			background-image: url(grafik/layout/nr-04.gif);
			}
		
		.diagramm_back {
			background-color: #edf0f2;
			background-image: url(grafik/layout/diagramm-back.gif);
			background-position: center bottom;
			background-repeat: no-repeat;
			padding: 5px 10px 25px 10px;
			}
			
		#content .diagramm_top {
			margin-top: 40px;
			margin-bottom: 20px;
			}	
			
		#content .center {
			text-align: center;
			margin-top: 20px;
			}
		
			
		
		/* ==============================================
   4 - Inhalt / Kontaktformular
   ============================================== */
   
#content form#kontakt {
  width: 410px; 
  color: #444; 
  line-height: 2.5;
  padding: 0px; 
  margin: 0; 
}

#content fieldset {
  padding: 10px; 
  margin: 10px; 
}

#content label {
  position: relative; 
  bottom: 2px; 
  cursor: pointer; 
}

#content .eingabe {
	margin-bottom: 12px;
	}

#content label.davor {
  float: left; 
  clear: left; 
  width: 120px; 
  text-align: left; 
  margin-right: 10px; 
}

#content input#anrede_herr {
  padding-left: 0; 
  margin-left: 130px; 
}

#content input#abschicken {
  cursor:pointer; 
  padding: 5px; 
  margin-left: 130px;
}

#content form p {
  margin: 0; 
  margin-left: 130px;
  font-size: smaller;
  line-height: 1.5;
}

#content form span {
	color: #117acb;
	}

#content .tlsc {
	margin-bottom: 12px; 
	margin-left: 132px;
}

/* ==============================================
   1 - Deutschland
   ============================================== */

#standorte #content_standorte a {
	color: #117acb;
	text-decoration: none;
	outline: none;
	font-size: 100%;
	line-height: 1.6;
	letter-spacing: 0.01em;
	margin-bottom: 0.5em;
	}

#deutschland {
	margin: 0 0 0 260px;
	}

#hamburg {
	position: absolute;
	top: 80px;
	left: 380px;
	z-index: 50;
	}

#dortmund {
	position: absolute;
	top: 200px;
	left: 320px;
	z-index: 50;
	}

#leipzig {
	position: absolute;
	top: 210px;
	left: 470px;
	z-index: 50;
	}

#ludwigshafen {
	position: absolute;
	top: 300px;
	left: 350px;
	z-index: 50;
	}


		
/* ==============================================
   5 - Footer 
   ============================================== */

#footer {
	position: relative;
	overflow: hidden;
	background-color: #a9b5bd;
	color: #333;
	font-size: 10px;
	line-height: 2em;
	letter-spacing: 0.025em;
	padding: 0;
	border: 0;
	margin: 0;
	margin-top: 8px;
	}

* html #footer { height: 1%; }

	#footer menu {
		width: 195px;
		background-color: transparent;
		padding: 20px 10px 25px 20px;
		border: 0;
		margin: 0;
		}
	
	#footer menu li {
		background-color: transparent;
		list-style-type: none;
		}
		
	#menu01,
	#menu02,
	#menu03 {
		float: left;
		}
	
	#menu04 {
		float: right;
		}
	
	#footer menu h1 {
		font-size: 100%;
		font-weight: bold;
		padding-left: 8px;
		margin-bottom: 0;
		}
	
	#footer span {
		color: #fff;
		}
	
	#footer a {
		display: block;
		color: #333;
		text-decoration: none;
		outline: none;
		padding-left: 5px;
		}
	
	#footer a:hover {
		background-color: #b6c0c7;
		}
	
	#footer #menu04 a {
		display: inline;
		color: #333;
		text-decoration: none;
		outline: none;
		padding-left: 5px;
		}
	
	#footer #menu04 a:hover {
		background-color: transparent;
		}
	
	
	
	#metallhandel #menu_metallhandel span,
	#isoliererbedarf #menu_isoliererbedarf span,
	#baubeschlaege #menu_baubeschlaege span,
	#sicherheitstechnik #menu_sicherheitstechnik span,
	#bauelemente #menu_bauelemente span,
	#werkzeugemaschinen #menu_werkzeugemaschinen span,
	#befestigungstechnik #menu_befestigungstechnik span,
	#industriebedarf #menu_industriebedarf span,
	
	#holzverarbeiter #menu_holzverarbeiter span,
	#metallverarbeiter #menu_metallverarbeiter span,
	#architektenbauherren #menu_architektenbauherren span,
	#handwerkindustrie #menu_handwerkindustrie span,
	#isolierertrockenbauer #menu_isolierertrockenbauer span,
	
	#home #menu_home span,
	#unternehmen #menu_unternehmen span,
	#standorte #menu_standorte span,
	#kontakt #menu_kontakt span,
	#agb #menu_agb span,
	#impressum #menu_impressum span {
		color: #117acb;
		}
	
/* ==============================================
   6 - Copy 
   ============================================== */

#copy {
	position: relative;
	overflow: hidden;
	background-color: #a9b5bd;
	text-align: center;
	color: #333;
	font-size: 9px;
	line-height: 1.25em;
	letter-spacing: 0.01em;
	padding: 20px 10px 25px 10px;
	border: 0;
	margin: 0;
	}

* html #copy { height: 1%; }

	#copy p {
		margin-bottom: 0;
		}

#copy a {
	text-decoration: none;
	outline: none;
	color: #333;
	}

#copy a:hover {
	color: #fff;
	}

/* ==============================================
   the last - BUG HACKS
   ============================================== */
   
* html li  { height: 1%; }  /* zusaetzlicher Leerraum in Listenlinks-Bug */

/* * html  { word-wrap: break-word; }  /* Problem der sich erweiternden Box */

/* * html #kopfschrifth1  { height: 1%; } /* 3-Pixel Bug */



} /* Ende @media screen */

/* ======================================
   E N D E style.css
   ====================================== */