@charset "iso-8859-1";
/* CSS Document */

/*==================================*/
/* Website ratio-clean.de			*/
/* Datum: Januar 2010				*/
/* Autor: graugans-design			*/
/*==================================*/

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

/*==============================*/
/* Farben:						*/
/*==============================*/

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

/* Reset */
* {
	padding:0;
	margin:0;
	outline:none;
}

/* hüpf! */
html {
	height:101%;
}

body {
	background-image:url(../_img/hg_verlauf.gif);
	background-repeat:repeat-x;
	color:#16394a;
}

/* Listen */
li {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:1em;
	line-height:1.6em;
	margin-left:20px;
}

p {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:1em;
	line-height:1.6em;
	margin-bottom:1.6em;
}

hr {
	clear:both;
	height: .1px;
	border: none;
	visibility:hidden;
	margin: 0;
	padding: 0;
}

a {
	color:#16394a;
	/*text-decoration:none;*/
}

a:hover, a:focus {
	text-decoration:underline;
	color:#006497;
}

a img {
	border:none;
}

/*==============================*/
/* Klassen						*/
/*==============================*/

/* Trennlinie mit Punkten */
.doppelte_punktlinie {
	border-top:dotted 1px black;
	border-bottom:dotted 1px black;
	height:5px;
	background-color:#c0e8fa;
}

.doppelte_punktlinie_hell {
	border-top:dotted 1px black;
	border-bottom:dotted 1px black;
	height:5px;
	background-color:#e2f1f8;
}

.no_uppercase {
	text-transform:none;
}

.fett {
	font-weight:bold;
}

.schatten {
	text-shadow:#FFF 0 1px 1px;
}

.abgesetzt {
	line-height:2em;
}

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

/* wrapper_aussen */
#wrapper_aussen {
	background-image:url(../_img/hg_wrapper.jpg);
	background-repeat:no-repeat;
	background-position:top center;
}

/* wrapper zentrieren, fixe Breite */
#wrapper {
	width:950px;
	margin:0 auto;
	padding-top:115px;
}

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

/* Überschrift verschwinden lassen */
h1 {
	display:none;
}

h3 {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:2em;
	font-weight:normal;
	line-height:1.3em;
	text-shadow:#FFF 0 1px 1px;
}

#produkte h3 {
	margin-bottom:20px;
}

h4 {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:1.4em;
	font-weight:normal;
	margin-bottom:20px;
	line-height:1.3em;
	text-shadow:#FFF 0 1px 1px;
}

/* zur Pos. der Sprchawahl */
#header {
	position:relative;
}

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

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

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

/* 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;
}
/* Flagge als HG */
li.espagnol img {
	background-image:url(../_img/flagge_es.gif);
	background-repeat:no-repeat;
	background-position:bottom;
}

/* Hover */
li.espagnol a:hover img {
	background-image:url(../_img/flagge_es.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;
}

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

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

/* Navigation nach rechts */
#navi ul {
	margin-left:577px;
	position:relative;
	top:-2px;
}
.espagnol #navi ul {
  margin-left: 550px;
}
/* Navigation in Reihe */
#navi li {
	display:inline;
	list-style:none;
	margin-left:15px;
	text-transform:uppercase;
	font-family:Verdana, Geneva, sans-serif;
	font-size:10px;
	letter-spacing:2px;
	padding:0 1px 5px 1px;
}

/* Navigation auf den englischen Seiten */
.englisch #navi ul {
	margin-left:510px;	
}

/* keine Unterstreiczhung */
#navi a {
	text-decoration:none;
	color:#16394a;
}

/* hover */
#navi a:hover,
#navi a:focus {
	border-bottom:5px solid #3fa1d3;
	padding-bottom:5px;
}

/* aktiver link */
#index .start,
#produkte .produkte,
#kontakt .kontakt, 
#impressum .impressum {
	border-bottom:5px solid #16394a;
	padding-bottom:5px;
}


/*==============================*/
/* Teil Va. 						*/
/* content						*/
/*==============================*/

#seitentitel {
	padding:20px 30px;
}

/* Inhaltsbereich unter der Überschrift polstern */
#content_main {
	padding:30px;
}

/* auf Produkteseite kein innerer Abstand */
#produkte #content_main {
	padding:30px 0;
}

/* Spalten anordnen */
.spalte_links {
	float:left;
	width:430px;
	position:relative; /* um Elemente darin auszurichten */
}

/* Kontaktseite Spalte links schmaler */
#kontakt .spalte_links {
	width:310px;
}

.spalte_rechts {
	margin-left:460px;
}

/* Kontaktseite Spalte rechts näher dran */
#kontakt .spalte_rechts {
	margin-left:360px;
}

/* Kontaktseite 2. Adresse nach rechts */
#nach_links { /* beinhaltet die Kaakser Adresse */
	width:290px;
	float:left;
}

/* Produktbilder über Tab anordnen */
#produktbilder {
	padding:20px 0px 20px 40px;
}

/* Absstand der Bilder zueinander */
.abstand_produktbild {
	margin-right:45px;
}

/*==============================*/
/* Teil Vb. 					*/
/* produkte						*/
/*==============================*/

/* die den Produkttext umgebende Box */
.produkte_textbox {
	margin-right:306px;
}

/* das die Produktfotos umgebende DIV */
.detailfotos_produkte {
	width:276px;
	float:right;
	margin-left:30px;
}

/* Fotos im DIV */
/* Breite: 268px + 2x padding (3px) und border (1px) */
/* = 276px */
.detailfotos_produkte img {
	padding:3px;
	background-color:#FFF; /* mit padding breiter weisser Rahmen */
	border:1px dotted #0086ca;
}

/* Unterschrift Produktfotos */
.detailfotos_produkte p {
	font-size:.7em;
	font-style:italic;
}

/* Spalten mit technischen Daten */
.spalte_links_produkte {
	width:276px;
	float:left;
	margin-right:30px;
	border-top:1px dotted #000;
	/*border-bottom:1px dotted #000; aktivieren, wenn Referenzen da */
	padding-top:15px;
	padding-bottom:15px;
}

* html .spalte_links_produkte {
	width:270px;
}

* html .spalte_rechts_produkte {
	width:270px;
}

.spalte_rechts_produkte {
	margin-left:306px;
	width:276px;
	border-top:1px dotted #000;
	/*border-bottom:1px dotted #000; aktivieren, wenn Referenzen da */
	padding-top:15px;
	padding-bottom:15px;
}

#referenzen {
	margin-top:20px;
}

/* Box mit Zulieferer Logos */
#zulieferer {
	padding:20px 30px 0 30px;	
}

/* Zulieferer-Logos Abstand */
#zulieferer img {
	margin-right:30px;
}

.spalte_links_produkte h5,
.spalte_rechts_produkte h5,
#referenzen h5 {
	text-transform:uppercase;
	font-family:Verdana, Geneva, sans-serif;
	font-size:.7em;
	margin-bottom:15px;
}

.spalte_links_produkte p,
.spalte_rechts_produkte p,
.spalte_links_produkte li,
.spalte_rechts_produkte li {
	font-family:Verdana, Geneva, sans-serif;
	font-size:.7em;
}

/*==============================*/
/* Teil VI. 					*/
/* footer						*/
/*==============================*/

/* Adresse mittig */
.adresse {
	float:left;
	width:430px;
	margin:10px 0 10px 30px;
	font-family:Verdana, Geneva, sans-serif;
	font-size:9px;
	letter-spacing:2px;
	font-style:normal;
	text-transform:uppercase;
	line-height:1.6em;
}

.rechtsbuendig {
	text-align:right;
}

/* Überschrift des Adressblocks etwas abgesetzt */
.abgesetzt {
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:10px;
}