@charset "utf-8";
/* CSS Document */

/*==================================*/
/* Website ostseegerüstbau.de		*/
/* Datum: Mai 2009					*/
/* Autor: graugans-design			*/
/*==================================*/

/*==============================*/
/* Inhalt:						*/
/* I.	allgemeine Format.		*/
/* II.	wrapper					*/
/* III.	header					*/
/* IV. 	navi					*/
/* V.	content					*/
/* Va. 	spalte_links			*/
/* Vb. 	spalte_rechts			*/
/* VI.	footer					*/
/* VII.	kontakt					*/
/* VIII.formular landeseite_2	*/
/*==============================*/

/*==============================*/
/* Farben:						*/
/* hg 				#fff		*/
/* hg content		#e9bb6e		*/
/* text				#684615		*/
/* hg navi			#684615		*/
/*==============================*/

/*==============================*/
/* Teil I. 						*/
/* allg. Format.				*/
/*==============================*/

/* reset */
* {
	margin:0;
	padding:0;
}

html {
	height:101%;
}

body {
	font-family:Verdana, Geneva, sans-serif;
	font-size:small;
	color:#353536;
	line-height:1.4em;
}

h3 {
	color:#6f6f70;
	margin-bottom:20px;
	line-height:1.4em;
	font-size: 16px;
}

h4 {
	color:#646464;
	margin-bottom:0.5em;
	font-size: 13px;
}

a {
	color:#353536;
}

.fett {
	font-weight:bold;
	color:#646464;
}

.klein {
	font-size:80%;
}

.gruen {
	color: #0fa41d !important;	
}

.kursiv {
	font-style: italic;	
}

.trenner {
	border-top: 1px solid #CCC;	
	margin: 20px 0;
}

/* kein Rahmen um Bildlinks */
a img {
	border:none;
}

/*==============================*/
/* Teil II. 					*/
/* wrapper						*/
/*==============================*/

/* hat den linken schatten als hg */
#wrapper {
	width:970px;
	margin:10px auto;
	padding-left:20px; /* platz für schatten */
	background-image:url(_img/schatten_links.gif);
	background-position:top left;
	background-repeat:no-repeat;
}

/* nur für den rechten schatten */
#wrapper_innen {
	padding-right:20px;
	background-image:url(_img/schatten_rechts.gif);
	background-position:top right;
	background-repeat:no-repeat;
	position: relative;
}

/*==============================*/
/* Teil III. 					*/
/* header						*/
/*==============================*/

#header {
	height:211px;
	background-image:url(_img/header_foto.jpg);
	background-repeat:no-repeat;
	background-position:bottom;
	background-color:white;
	position:relative;
}

#header h1 {
	text-indent:-10000px;
	height:99px;
	background-image:url(_img/header_oben_neu.gif);
	background-repeat:no-repeat;
	background-position:top;

}

/* Wechselgalerie */
#slideshow {
	position: absolute;
	width: 950px;
	height: 112px;	
}

/*IE6 Hack*/
* html #slideshow {
	top: 0px; 
}

/*IE7 Hack*/
*+ html #slideshow {
	top: -3px; 
}

/* Falls Javascript deaktiviert ist */
#slideshow {
	position: relative;
}

/* Falls Javascript deaktiviert ist */
#slideshow img {
	position: absolute;
	top: 0;	
}


/* Sprachauswahl */
#sprachwahl {
	position:absolute;
	top:20px;
	right:30px;
	z-index:200;
	height:20px;
}

/* Text ausblenden */
#sprachwahl span {
	display:none;
}

/* Sprachwahl Liste */
#sprachwahl li {
	display:inline;
	list-style:none;
}

/* kein Rahmen */
#sprachwahl img {
	border:0;
}

/* Flagge als HG */
li.deutsch img {
	background-image:url(_img/flagge_de.gif);
	background-repeat:no-repeat;
	background-position:bottom;
}

/* Hover */
li.deutsch a:hover img {
	background-image:url(_img/flagge_de.gif);
	background-repeat:no-repeat;
	background-position:top;
}

/* Flagge als HG */
li.englisch img {
	background-image:url(_img/flagge_en.gif);
	background-repeat:no-repeat;
	background-position:bottom;
}

/* Hover */
li.englisch a:hover img {
	background-image:url(_img/flagge_en.gif);
	background-repeat:no-repeat;
	background-position:top;
}

/* Sprachwahl aktiv */
.deutsch li.deutsch img {
	background-image:url(_img/flagge_de.gif);
	background-repeat:no-repeat;
	background-position:top;
}

/* Sprachwahl aktiv */
.englisch li.englisch img {
	background-image:url(_img/flagge_en.gif);
	background-repeat:no-repeat;
	background-position:top;
}

/*==============================*/
/* Teil IV. 					*/
/* navi							*/
/*==============================*/

#navi, #navi_en {
	background-color:#88898a;
	height:2em;
	border-top:1px solid white;
}	

#navi ul, #navi_en ul {
	list-style-type:none;
}

#navi li, #navi_en li {
	float:left;
}

#navi a, #navi_en a {
	display:block;
	text-decoration:none;
	color:white;
	line-height:2em;
	padding-left:1.5em;
	padding-right:1.5em;
	border-right:1px solid white;
}

/* englische Version, Navilinks schmaler */
#navi_en a {
	padding-left:10px;
	padding-right:10px;
}

#navi a:hover, #navi_en a:hover {
	background-color:#a1a1a1;
}

/* aktive seite bleibt gehovert */
#index .start,
#interimshallen .interimshallen, 
#zeltbau .zeltbau,
#geruestbau .geruestbau,
#schrumpffolie .schrumpffolie,
#intercept_technology .intercept_technology {
	background-color:#6d6d6d;
	/*background-color:#7b90b3;*/
}

/*==============================*/
/* Aktuelle Projekte-Button		*/
/*==============================*/

#aktuelle_projekte_button {
	position: absolute;
	height: 189px;
	width: 42px;
	left: -42px;
	top: 234px;
}

#aktuelle_projekte_button a {
	display: block;
	background: url(_img/aktuelle-projekte.gif) no-repeat;	
}

#aktuelle_projekte_button a:hover,
#aktuelle_projekte_button a:focus {
	background: url(_img/aktuelle-projekte-hover.gif) no-repeat;	
}

#aktuelle_projekte_button span {
	display: none;	
}

/* IE6 Hack */
* html #aktuelle_projekte_button {
	top: 235px;
}

/* IE6 Hack */
* html #aktuelle_projekte #einspaltig {
	height: 100%;
	position: relative;
	left: -130px;
}

/*==============================*/
/* Teil V. 						*/
/* content						*/
/*==============================*/

#content {
	width:888px;
	float:left;
	clear:left;
	border-left:1px solid #88898a;
	border-right:1px solid #88898a;
	padding:30px 30px 30px 30px;
}

/* verd... ie6 */
*html #interimshallen #content,
*html #zeltbau #content {
	overflow:hidden;
}

#content li {
	margin-left:20px;
}

/*==============================*/
/* Teil Va. 					*/
/* spalte links					*/
/*==============================*/

#spalte_links {
	float:left;
	width:316px;
	padding-right:15px;
	border-right:1px solid #88898a;
}


/* damit trenner bis unten geht */
/* auf fahrgerüste seite */
#fahrgerueste #spalte_links {
	height:400px;
}

/*==============================*/
/* Teil Vb. 					*/
/* spalte rechts				*/
/*==============================*/

#spalte_rechts {
	margin-left:355px;
}

/* Bild des Infopakets Tucken nach rechts */
#infopaket_bestellen #spalte_rechts img {
	margin-left:100px;
	margin-bottom:20px;
}

/* bilder anordnen */
.float_schmal {
	float:left;
	width:157px;
	margin-right:19px;
	margin-bottom:20px;
}

.float_breit {
	float:left;
	width:247px;
	margin-right:19px;
	margin-bottom:20px;
}

.float_breit_rechts {
	float:right;
	/*width:247px;*/
	margin-left:19px;
	margin-bottom:20px;
}

.float_breit_klein {
	float:left;
	width:172px;
	margin-left:10px;
	margin-bottom:20px;
}

.no_margin_left {
	margin-left: 0;	
}

.float_breit_klein_keinrand {
	float:left;
	width:172px;
	margin-left: 0;
}

/* bilder formatieren */
.portrait img {
	border:1px solid #88898a;
	/*height:165px;*/
}

.portrait_klein img {
	border:1px solid #88898a;
}

*html .portrait {
	padding:3px 3px 0 3px;
}

.bildunterschrift {
	font-size:70%;
	margin-top:3px;
	line-height:1.3em;
}

/* iFrame auf Kontakt Seite */
#kontakt iframe {
	border:1px solid #88898a;
}

/* grauer Kasten auf der Grüsteseite */
#grauer_kasten {
	border:1px solid #88898a;	
	background: #f1f1f1;
	padding: 10px;
	margin-bottom: 20px;
	font-size: 80%;
}

/* Schrift im grauen Kasten kleiner */
#grauer_kasten p,
#grauer_kasten li {
	line-height: 130%;
}

/* Abstand der Bilder */
#grauer_kasten img {
	margin: 10px 5px 10px 0;	
}

/*==============================*/
/* Teil IV. 					*/
/* footer  						*/
/*==============================*/

#footer {
	height:40px;
	background-image:url(_img/footer_neu.gif);
	background-repeat:no-repeat;
	clear:left;
	color:white;
	position:relative;
}

#footer p {
	display:inline;
	line-height:39px;
	margin-left:20px;
}

#footer ul {
	text-align:right;
	position:relative;
	bottom:28px;
	margin-right:20px;
}

#footer li {
	list-style-type:none;
	margin-bottom:10px;
	display:inline;
}

#footer a {
	text-decoration:none;
	color:white;
}

#footer a:hover,
#footer a:active,
#footer a:focus {
	outline:none;
	color:#e0e0e0;
}

/*==============================*/
/* Teil VIIa. 					*/
/* kontakt						*/
/*==============================*/



/* eingabefeld unter beschriftung */
.block {
	display:block;
}

/* kein rahmen ums formular */
fieldset {
	border:none;
}

textarea {
	width:250px;
	display:block;
	margin-bottom:20px;
}

/* graugans-logo tiefer */
#graugans {
	
	margin-bottom:-3px;
}

/*==============================*/
/* Teil VIIb. 					*/
/* Infopaket-Formular			*/
/*==============================*/



/* Felder von Hausnr und PLZ schmaler */
#hausnummer, #plz {
	width:57px;
}

/* kein Umbruch */
#bitte_anruf {
	display:inline;
	width:1em;
}

.kurzes_textfeld {
	width:190px;
}


/*==============================*/
/* Teil VIII. 					*/
/* landeseiten					*/
/*==============================*/

/* landeseiten werden anders formatiert */
#landeseite_1 #spalte_links {
	float:left;
	width:491px;
	padding-right:20px;
	border-right:1px solid #88898a;
}

#notdach #spalte_links {
	width:481px;
}

#notdach #spalte_rechts {
	margin-left:530px;
}

/* landeseiten werden anders formatiert */
#landeseite_1 #spalte_rechts {
	margin-left:540px;
}

/* iFrame darf keinen Rand haben */
#landeseite_1 #spalte_rechts iframe {
	border:none;
}
	

/* listenpunkte ersetzen auf landeseite */
#landeseite_1 #spalte_links li,
.gruenes_haekchen {
	list-style-image:url(_img/_landeseite/checked.gif);
	padding-bottom:3px;
	margin-bottom:5px;
}
	

/* bilder anordnen landeseiten */
.float_schmal_landeseite {
	float:left;
	width:97px;
	margin-right:19px;
	margin-bottom:20px;
}

.float_breit_landeseite {
	float:left;
	width:152px;
	margin-right:19px;
	margin-bottom:20px;
}

/* info-paket-button */
#landeseite_infobutton {
	width:17em;
	border:1px solid #88898a;
	line-height:30px;
	text-align:center;
	position:relative;
	left:50%;
	margin:2em auto 2em -110px;
}

/* hyperlink info-paket-button */
#landeseite_infobutton a {
	display:block;
	background-color:#0fa41d;
	color:#fff;
	padding:.2em .7em .3em .7em;
}

/* hover */
#landeseite_infobutton a:hover {
	background-color:#048811;
}
	

/* bilder formatieren landeseiten */
.portrait_landeseite {
	border:1px solid #88898a;
	height:100px;
}

/* kleingedrucktem */
.kleingedrucktes {
	font-size:80%;
	line-height:1.2em;
}
	
/* normale Liste (ohne grüne Häkchen */
.aufzaehlungspunkte li {
	list-style-image: none !important;
	list-style: disc !important;	
}
	
/*==============================*/
/* Teil VIII. 					*/
/* formular landeseite_2		*/
/*==============================*/

#landeseite_2 #formular,
#infopaket_bestellen #formular,
#kontakt #formular {
	border: 1px solid #CCC;
	background: #F2F2F2;
	padding:20px;
}

#notdach #formular {
	border: 1px solid #0fa41d;
	background: #e7f5e8;
	padding:20px;
}

/* listenpunkte ersetzen auf landeseite */
#landeseite_2 #spalte_links li,
#notdach #spalte_links li,
.gruenes_haekchen {
	list-style-image:url(_img/_landeseite/checked.gif);
	padding-bottom:3px;
	margin-bottom:5px;
}

#landeseite_2 #spalte_links {
	float:left;
	width:580px;
	padding-right:30px;
	border-right:1px solid #88898a;
}

#landeseite_2 #spalte_rechts {
	margin-left:640px;
}

/* Formular stylen */
input, textarea {
	width: 260px;
	margin-bottom:15px;
	border: 1px solid #CCC;
	padding: 3px;
}

/* Formular Notdach stylen */
#notdach input {
	border: 1px solid #0fa41d;
	padding: 3px;
}

input {
	height: 1.1em;	
}

/* Absendeknopf */
#senden {
	height: 30px;
	width: 180px;
	color: white;
	background: #aaa;
	border-top: 1px solid #fff;
	border-left: 1px solid #fff;
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
}

#notdach #senden {
	background: #28ae34;
	border-right: 1px solid #10831b;
	border-bottom: 1px solid #10831b;	
}

#senden:hover, #senden:focus {
	background: #999;
	border-right: 1px solid #666;
	border-bottom: 1px solid #666;
}

#notdach #senden:focus,
#notdach #senden:hover {
	background: #0fa41d;	
}

#senden:active {
	border-top: 1px solid #666;
	border-left: 1px solid #666;
	border-right: 1px solid #eee;
	border-bottom: 1px solid #eee;
}

/*==============================*/
/* Teil IX. 					*/
/* Aktuelle Projekte Fotos		*/
/*==============================*/

/* Damit zwei kleine Fotos übereinander stehen 
   werden sie v. Container umhüllt, Breite des
   Containers entspricht Breite der Bilder. 
   Container floatet leinks */
.container_fotos_klein {
	width: 170px;
	float: left;	
	margin-right: 12px;
	margin-left: -10px;
}