/*Projekt: www.autosattlerei.tv
  Datum: Februar 2010
  Autor: Thomas Schneider*/

/*======================
  Allgemeine Einstellung
  ======================*/
  
*{ margin: 0; padding: 0; }
* html {	height:101% }

body {
	background-image:url(../layout-elemente/hg-body.png);
	background-repeat:repeat-x;	
	margin:0px;
	padding:0px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#333333;
	}
h2 {
	color:#333333;
	font-size:14px;
	font-weight:bold;
	line-height: 20px;
	letter-spacing: 0px;
	word-spacing: -2px;
	margin-top:1em;
	margin-bottom:1em;
	}

p {
	letter-spacing: 0px;
	word-spacing: -2px;
	line-height: 19px;
	text-align:justify;
	margin-bottom:1em;
	}
a { text-decoration:none;
	border-bottom: 1px dotted #ee6408 }
a:hover, a:focus {
	border-bottom: 1px solid red
	}

#first {/*dient für SEO*/
	width: 950px;
	margin-right: auto;
	margin-left: auto;
	margin-top:5px;
	color:#808080;
	text-align:center;
	font-size:10px;
	}
#first h1 {
	color:#808080;
	font-size:10px;
	text-align:center;
	}
	
#wrapper {
	background-color:transparent;
	width:970px;
	margin-right:auto;
	margin-left:auto;
	margin-top:5px;
	border-left-color:#CCCCCC;
	border-right-color:#CCCCCC;
	border-left-width:1px;
	border-right-width:1px;
	border-left-style:outset;
	border-right-style:inset;
	overflow:hidden; /*sorgt dafür, das 3-spalten-Layout nicht bis 2.5000px nach unten läuft, wenn kein Inhalt                       vorhanden ist*/
	}
/*=========================================================
 #header-Bereich  Positionierung von Bild und Textformation
 ==========================================================*/
	
#header {
	margin-left:auto;
	margin-right:auto;
	width:970px;
	height:95px;
	background-image:url(../layout-elemente/hg-header.jpg);
	background-repeat:repeat-x;
	}
span.headerbild {
	float:right;
	margin-top:15px;
	margin-right:10px;
	}

/*===========
 ENDE #header
 ============*/

#naht {
	margin-left:auto;
	margin-right:auto;
	margin-top:0px;
	height:58px;
	width:970px;
	background-image:url(../layout-elemente/autosattlerei-polsterei.jpg);
	background-repeat:no-repeat;
	
	}
/*=======================
   Horizontale Navigation
  =======================*/
#navileiste { 
	margin-left:auto;
	margin-right:auto;
	margin-top:-5px;
	padding-top:8px;
	height:38px;
	width:970px;
	background-image:url(../layout-elemente/hg-navileiste.jpg);
	background-repeat:repeat-x;
	}
#navileiste ul {
	list-style-type:none;	
	margin-left:20px;
	}
#navileiste li {
	
	display:inline;
	color:#ee6408;
	font-size:14px;
	font-weight:bold;
	}
#navileiste a {
	
	color:#ee6408;
	padding-right:50px;	
	padding-left:13px;
	border-bottom:0px; /*damit keine Linie unter den Hyperlinks sind */
	}
#navileiste a:hover {
	
	color:#ea763b;
	padding-right:50px;
	background-image:url(../layout-elemente/dreieck-g.gif);
	background-repeat:no-repeat;
	background-position:center left;
	padding-left:13px;
	border-bottom:0px; /*damit keine Linie unter den Hyperlinks sind */
	}
#startseite #navi101 a,
#leistungen #navi102 a,
#referenzen #navi103 a,
#unternehmen #navi104 a,
#kontakt #navi105 a {
	color:#ea763b;
	padding-right:50px;
	background-image:url(../layout-elemente/dreieck-g.gif);
	background-repeat:no-repeat;
	background-position:center left;
	padding-left:13px;
	border-bottom:0px; /*damit keine Linie unter den Hyperlinks sind */
	}
	
/*===================================
  Navigationsbereich in LINKER Spalte
  ===================================*/
#navispalte_links {
	float:left;
	width:225px;
	margin-top:15px; /*gleiche Abstandsgröße wie bei #textbereich nehmen*/
	padding-bottom : 25000px;
	margin-bottom : -25000px;
	}
	/*Korrektur für IE 6 und kleiner*/
	* html #navispalte_links { width:244px; }
	

#navigation ul {	
	margin-left:0px;
	list-style-type:none;
	width:219px;
	margin-bottom:50px;	
	}
	/*Korrektur für IE 6 und kleiner*/
	* html #navigation ul { width:214px; }
	
#navigation li {	
	display:block;
	width:219px;
	font-family : Verdana, Arial, Helvetica, sans-serif;
	font-size : 14px;
	font-weight : bold;
	}
	/*Korrektur für IE 6 und kleiner*/
	* html #navigation ul li { width:213px; }
	
#navigation a {	
	display:block;	
	width:219px;
	height:39px;	/*mit padding-top verbunden zwecks Höhe 37+17=54pxGesamthöhe*/
	text-decoration : none; /*damit LINKS nicht unterstrichen werden*/
	list-style-type:none;
	color:#ff6600;	/*orange Schrift*/
	background-image:url(../layout-elemente/hg-navi.png);
	background-repeat:repeat-x;
	padding-top:15px; /*mit height verbunden zwecks Höhe 37+17=54pxGesamthöhe*/
	padding-left:5px;
	border-bottom:1px;
	border-bottom-color:#ff6600;
	border-bottom-style:dotted;	
	}
	
#navigation a:hover {	
	color:#444444;
	font-size:16px;
	background-image:url(../layout-elemente/hg-navi-over.png);
	background-repeat:repeat-x;	
	border-bottom:0;
	}
#navigation span {
	font-size:10px;
	font-weight:normal;
	color:#444444;
	}
	
#cabrio #navi00 a,
#planen #navi01 a,
#innenausstattung #navi02 a,
#polsterarbeiten #navi03 a,
#restauration #navi04 a,
#sitzheizung #navi05 a,
#motorrad_sitzheizung #navi06 a {
	color:#FFFFFF;
	background-image:url(../layout-elemente/hg-navi-over.png);
	background-repeat:repeat-x;	
	}
	
	
#seo_navi {
	width:170px;
	}

#seo_navi ul {
	margin-left:0px;
	list-style-type:none;
	width:170px;
	margin-bottom:100px;
	}
#seo_navi li {
	display:block;
	width:170px;
	font-family : Verdana, Arial, Helvetica, sans-serif;
	font-size : 10px;
	font-weight : bold;
	}
	/*Korrektur für IE 6 und kleiner*/
#seo_navi a {
	color:#ff6600;
	font-size:10px;
	height:14px;
	text-decoration:none;
	border-bottom:0;
	}
#seo_navi a:hover {
	color:#444444;
	font-size:12px;
	}
/*=============================================
  E N D E   Navigationsbereich in LINKER Spalte
  =============================================*/
  
/*=======================================
 Textbereich in MITTLERER & RECHTER Spalte
 =========================================*/
#textbereich { /*hier liegen die mittlere Spalte mit text01 und die rechte Spalte mit text02 drin*/
	float:right;
	width:726px;	
	margin-top:15px; /*gleiche Abstandsgröße wie bei #navigation nehmen*/
	padding-bottom : 25000px;
    margin-bottom : -25000px;
		}  
	
	
#text01 { /*ist die MITTLERE Spalte*/
	float:left;
	width:521px;
	padding-bottom : 25000px;
	margin-bottom : -25000px;
		}
	/*Korrektur für IE 6 und kleiner*/
	* html #text01 { width:521px; } /*von 494px auf 521px geändert, mal sehen, obs funzelt*/
	
#text01 h1 {
	font-size:16px;
	font-weight:bold;
	line-height: 20px;
	letter-spacing: 0px;
	word-spacing: -2px;
	margin-top:1em;
	margin-bottom:1em;
	}

#text01 ul li {
	padding-bottom:5px;
	list-style-type:none;
	width:auto;
	}
#text01 ul {
	
	}
	
#text01 p {
	margin-top:10px;
	}
#text01 h2 {
	margin-top:10px;
	margin-bottom:10px;
	}
	
	
	
#text02 { /*ist die RECHTE Spalte*/
	float:right;
	width:185px;
	padding-bottom : 25000px;
	margin-bottom : -25000px;
	border-left: 1px dotted gray;
	
	
	}
#ahs {
	margin-right:auto;
	margin-left:auto;
	width:175px;
	padding-left:10px;
	}
#ahs img {
	width:140px;
	
	}
#ahs p {
	font-weight:bold;
	margin-top:5px;
	margin-left:2px;
	}
#ahs a {
	text-decoration:none;
	color:#333333;
	}
#ahs a:hover, a:focus {
	border-bottom: 1px solid red
	}
	
	
/*===================================================
  E N D E   Textbereich in MITTLERER & RECHTER Spalte
  ===================================================*/
#hauptfenster {
	min-height:400px;
	
	}
	
#footer {
	clear:both;
	background-image:url(../layout-elemente/auto-sattlerei-hg.jpg);
	background-repeat:repeat-x;
	height:41px;
	width:972px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:10px;
	padding-top:10px;
	color:#ee6408;
	text-align:center;
	z-index:1;
	}
#footer p {
	text-align:center;
		}
#footer a, a:hover {
	color:#ee6408;
	text-decoration:none;
	}
#last  { /*dient für SEO*/
	width: 950px;
	margin-right: auto;
	margin-left: auto;
	margin-top:5px;
	color:#808080;
	text-align:center;
	font-size:10px;
	}
#last h1 { /*dient für SEO*/
	color:#808080;
	text-align:center;
	font-size:10px;
	}
#last a {
	text-decoration:none;
	color:#808080;
	}

/*=======================================================
  Bilder im Textfluß positionieren, mit Bildbeschriftung
  =======================================================*/
  
span.bildrechts  {  /*Positionierung des Bildes im Textfluß rechts Bsp.Historie*/
	float:right;
	text-align:center;
	padding:3px;
	border:2px solid #ccc;
	
	margin-left:10px;
	margin-right:1px;
	}
img.bildmitte  {  /*Positionierung des Bildes im Textfluß mittig*/
	
	padding:3px;
	border:2px solid #ccc;
	}
	
.bildtext {
	display:block;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
	margin-top:4px;
	border:0;
	text-align:center;
	}
/*ENDE Bild-rechts*/

/*=========================== 
  Hervorgehobene Textpassagen
  =========================== */
  
.hervorgehoben {
	float:inherit;
	display:block;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:110%;
	margin-top:0px;
	margin-bottom:15px;
	padding: 5px 20px 5px 20px;
	border-top:3px solid #E9591D;
	border-bottom:3px solid #E9591D;	
	}
#text01 ul.hervorgehoben li { /*damit kästchen-punkte zu sehen sind*/
	list-style-type:square;
	}
/* HTML entweder mit class="hervorgehoben" oder mit blockquote.
   Quelle: LittleBox 3.1.3  Hinweisboxen hervorheben */
   
/*================================== 
  B i l d e r - G a l e r i e - BOX
  ================================== */
 
ul.bilder_galerie_boxen {
	list-style-type:none;
	margin:0;
	padding:0;
	overflow:hidden;
	width:102%;
	 }
	 	 
ul.bilder_galerie_boxen  li.bilder_box {
	background-image:url(../layout-elemente/hg-body.png);
	float:left;
	list-style-type:none;
	text-align:center;
	margin: 3px 5px 0 0;
	padding:2px;
	width:157px;
	height:180px;
	}
ul.bilder_galerie_boxen .bilder_box_titel {
	
	height:33px;
	margin:0px;
	margin-bottom:10px;
	padding-top:4px;
	}	
	

ul.bilder_galerie_boxen .img{ /*?? Wenn statt .bilder_box_image nur img steht, dann erscheinen Bilder 		                                             mit Rahmen*/
	text-align:center;
	margin-top:0px;
	margin-right:auto;
	margin-bottom:10px;
	margin-left:auto;
	padding:3px;
	width:141px;
	height:141px;
	}
ul.bilder_galerie_boxen h3 {
	color:#E9591D;
	font-size:13px;
		}
ul.bilder_galerie_boxen p {
	margin-left:5px;
	margin-top:5px;	
	line-height: 13px;
	text-align:center;
	font-size:11px;
	}
ul.bilder_galerie_boxen img {
	width:150px;
	margin-left:5px;
	margin-right:5px;
	}
ul.bilder_galerie_boxen a {
	text-decoration:none;
	border-bottom:0px;
	}
	
	
/*=================================
  E N D E   Bildergalerie in Boxen
  =================================*/
  
  /*================================== 
  B i l d e r - Hinweis - in BOXEN // Bsp bei Leistungen-Sattlerei
  ================================== */
 
ul.bilder_hinweis_boxen {
	list-style-type:none;
	margin:0;
	padding:0;
	overflow:hidden;
	width:102%;
	 }
	 	 
ul.bilder_hinweis_boxen  li.bilder_box {
	background-image:url(../layout-elemente/hg-body.png);
	float:left;
	list-style-type:none;
	
	width:230px;
	text-align:center;
	margin: 20px 20px 10px 0;
	padding:2px;
		}
ul.bilder_hinweis_boxen .bilder_box_titel {
	
	height:33px;
	width:230px;
	margin-bottom:10px;
	padding-top:10px;	
	}	
	
ul.bilder_hinweis_boxen h3 {
	color:#EE6408;
	font-size:16px;
	font-weight:bold;
		}
ul.bilder_hinweis_boxen p {
	margin-left:5px;
	margin-top:5px;	
	line-height: 13px;
	text-align:center;
	font-size:11px;
	}
ul.bilder_hinweis_boxen img {
	height:100px;
	margin-left:20px;
	margin-right:20px;
	border:0px;
	}
ul.bilder_hinweis_boxen a {
	text-decoration:none;
	border-bottom:0px;
	}	
	
/*=================================
  E N D E   Bilderhinweis in Boxen
  =================================*/
  
/*=================================================================
  Galerie Bild links - Text rechts // Bsp. bei Referenzen Sattlerei
  =================================================================*/
 ul.galerie_bild_text {
 	list-style-type:none;
	padding:0;
	margin:0;
	}
 ul.galerie_bild_text li {
 	position:relative;
	min-height:130px;
	padding:0;
	margin:0;
	}
* html  ul.galerie_bild_text li { height:130px; } /*Patch für IE < 7IE, da er min-height:130px nicht kennt */

 ul.galerie_bild_text li h3 {
 	line-height:1;
	margin-top:0;
	font-size:14px;
	}
 ul.galerie_bild_text li h3,
 ul.galerie_bild_text li p {
 	padding-left:130px;
	}
 ul.galerie_bild_text li img {
 	position:absolute;
	top:0px;
	left:0px;
	width:115px;
	padding:3px;
	border:2px solid #ccc;
	}
	

/*=================================
  E N D E   Galerie Bild links - Text rechts
  =================================*/