/*  ====================================================
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: 1em;
	} 

/* 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: disc;
	}

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, Raster 
   ============================================== */

body {
	background-color: #7ac7cb;
	font-family: Georgia, Times;
	font-size: medium;
	}

#headder {
	position:relative;
	overflow: hidden;
	background-color: #bce1e1;
	padding: 0;
	border: 0;
	margin: 0;
	}

#wrapper_headder {
	position:relative;
	overflow: hidden;
	background-color: #bce1e1;
	width: 800px;
	padding: 0;
	border: 0;
	margin: 0 auto;
	}

#content {
	position:relative;
	overflow: hidden;
	background-color: #bce1e1;
	padding: 0;
	border: 0;
	margin: 0;
	}
	
#wrapper_content {
	position:relative;
	overflow: hidden;
	background-color: #bce1e1;
	width: 620px;
	padding: 0 90px;
	border: 0;
	margin: 0 auto;
	}

#grafik {
	position:relative;
	overflow: hidden;
	background-image: url(grafik/verlauf.gif);
	background-repeat: repeat-x;
	background-color: #bce1e1; 		
	width: 100%;
	padding: 0;
	border: 0;
	margin: 0;
	}

#wrapper_grafik {
	position:relative;
	overflow: hidden;		
	background-color: #eee;
	width: 800px;
	padding: 0;
	border: 0;
	margin: 0 auto;
	}

#footer {
	position:relative;
	overflow: hidden;
	background-color: #7ac7cb; 		
	width: 100%;
	padding: 0;
	border: 0;
	margin: 0;
	}

#wrapper_footer {
	position:relative;
	overflow: hidden;		
	background-color: #7ac7cb;
	width: 560px;
	text-align: center;
	padding: 50px 120px 50px 120px;
	border: 0;
	margin: 0 auto;
	}

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

#logo {
	margin: 40px 0 30px 80px;	
	}

#uboot {
	position: absolute;
	top: 0;
	right: 70px;
	}

#blase5 {
	position: absolute;
	background-image: url(grafik/blase5.png);
	background-repeat: no-repeat;
	width: 219px;
	height: 218px;
	top: -30px;
	left: 5%;
	z-index: 10;
	}

#blase41 {
	position: absolute;
	background-image: url(grafik/blase4.png);
	background-repeat: no-repeat;
	width: 110px;
	height: 110px;
	top: 30px;
	right: 20%;
	z-index: 15;
	}

#blase42 {
	position: absolute;
	background-image: url(grafik/blase4.png);
	background-repeat: no-repeat;
	width: 110px;
	height: 110px;
	top: 50%;
	left: 20%;
	z-index: 20;
	}

#blase31 {
	position: absolute;
	background-image: url(grafik/blase3.png);
	background-repeat: no-repeat;
	width: 68px;
	height: 68px;
	top: 75%;
	left: 25%;
	z-index: 25;
	}

#blase32 {
	position: absolute;
	background-image: url(grafik/blase3.png);
	background-repeat: no-repeat;
	width: 68px;
	height: 68px;
	top: 65%;
	right: 15%;
	z-index: 30;
	}

/* Internet Explorer bis V6 OHNE transparente Blasen */
* html #blase5, 
* html #blase41, 
* html #blase42, 
* html #blase31, 
* html #blase32 {
	background: transparent;   
	}		

/* ==============================================
   3 - Content, Spalten etc.
   ============================================== */

.col600-bh { /* box 600 breit hellblau */
	float: left;
	overflow: hidden;
	background-color: #cee9e8;
	width: 600px;
	padding: 0;
	margin: 10px;
	}

		.col600-bh-kopf {
			background-image: url(grafik/re-bh-600-top.gif);
			background-position: left top;
			background-repeat: no-repeat;
			padding: 20px 20px 0 20px;
			}

		#content .col600-bh-fuss {
			background-image: url(grafik/re-bh-600-bot.gif);
			background-position: left bottom;
			background-repeat: no-repeat;
			padding: 0 20px 25px 20px;
			margin: 0;
			}

.col290-sd { /* box 290 breit sd sand-dunkel */
	float: left;
	overflow: hidden;
	background-color: #f1e49f;
	width: 290px;
	padding: 0;
	margin: 10px;
	}

		.col290-sd-kopf {
			background-image: url(grafik/re-sd-290-top.gif);
			background-position: left top;
			background-repeat: no-repeat;
			padding: 20px 20px 0 20px;
			}

		.col290-sd-fuss {
			background-image: url(grafik/re-sd-290-bot.gif);
			background-position: left bottom;
			background-repeat: no-repeat;
			padding: 0 20px 25px 20px;
			margin: 0;
			}

.col290-sh { /* box 290 breit sh sand-hell */
	float: left;
	overflow: hidden;
	background-color: #f7f2d2;
	width: 290px;
	padding: 0;
	margin: 10px;
	}

		.col290-sh-kopf {
			background-image: url(grafik/re-sh-290-top.gif);
			background-position: left top;
			background-repeat: no-repeat;
			padding: 20px 20px 0 20px;
			}

		.col290-sh-fuss {
			background-image: url(grafik/re-sh-290-bot.gif);
			background-position: left bottom;
			background-repeat: no-repeat;
			padding: 0 20px 25px 20px;
			margin: 0;
			}

.col290-mitte {
	padding: 0 20px 0 20px;
	}

/* ==============================================
   3 - Type
   ============================================== */
  
#content h1 {
	font-size: 135%;
	font-style: normal;
	font-weight: normal;
	line-height: 1.5;
	letter-spacing: 0.02em;
	color: #164a98;
	margin-bottom: 0.5em;
	}

#content h2 {
	font-size: 115%;
	font-style: normal;
	font-weight: normal;
	line-height: 1.5;
	letter-spacing: 0.02em;
	color: #164a98;
	margin-bottom: 0.5em;
	}

#content p, li {
	font-size: 100%;
	color: #164a98;
	line-height: 1.5;
	letter-spacing: 0.02em;
	}
#impressum #content #impressum1 li,
#content #kontakt li {
	list-style-type: none;
	margin-left: 0;
	} 


#content a {
	font-size: 100%;
	color: #209cd3;
	line-height: 1.5;
	letter-spacing: 0.02em;
	text-decoration: none;
	outline: none;
	}

#content a:hover {
	color: #f57500;
	}

address {
	font-size: 80%;
	line-height: 1.5;
	letter-spacing: 0.02em;
	color: #164a98;
	}

#footer a {
	color: #164a98;
	text-decoration: none;
	outline: none;
	}

#footer a:hover {
	color: #f57500;
	}

} /* Ende @media screen */

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