/* css-Vorlagen 
Thomas Seilnacht 
www.seilnacht.ch Shop*/


/* Format Body*/
body {
  background-color: #F1F1F1; 
  color: black;
  font-family: Arial, Helvetica; 
}

 html  {
  -webkit-text-size-adjust: none;
}

/* Format Container */
div#wrapper {
  background-color: #F1F1F1;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

/* Format Kopfbereich */
div#kopf {
  background-color: #666;
  background-image: url('hinter.jpg');

  color: #FFFFFF;
  font-size: large;
  text-align: left;
  padding-top: 0px;
  padding-right: 0px;
  padding-left: 0px;
  padding-bottom: 0px;
}

div#kopf img {    display: block;
}

/* Format Navibereich Kopf quer*/
div#navi { 
  background-color: #CCC; 
  font-weight: bold;
  font-size: large;
  word-spacing: 12px;
  color: #666666; 
  margin-left: 0px;
  text-align: left;
  padding-top: 12px;
  padding-right: 7px;
  padding-left: 20px;
  padding-bottom: 12px;
}

/* Format Navibereich Kopf quer*/
div#navi2 { 
  background-color: #CCC; 
  font-weight: bold;
  font-size: large;
  color: #111111; 
  margin-left: 0px;
  margin-top: 4px;
  text-align: left;
  padding-top: 12px;
  padding-right: 7px;
  padding-left: 12px;
  padding-bottom: 12px;
}

/* Format Navigationsbereich links*/
div#links {
  background-color: #CCC;
  width: 180px;
  position: absolute;
  font-size: large;
  left: 0px;
  font-weight: bold;
  color: #000000; 
  padding-top: 10px;
  padding-right: 5px;
  padding-left: 5px;
  padding-bottom: 3px;
  line-height: 2.0;
}
 
/* Format Textbereich */
div#text {
  background-color: white; 
  color: black; 
  font-size: medium;
  margin-left: 0px;
  margin-right: 0px;
  padding-top: 25px;
  padding-bottom: 10px;
  padding-right: 20px;
  padding-left: 20px;
}

div#textklein {
  background-color: white; 
  color: black; 
  font-size: small;
  margin-left: 0px;
  margin-right: 0px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 20px;
  padding-left: 20px;
}

div.mtext {
  background-color: white; 
  color: black; 
  font-size: small;
  margin-left: 0px;
  margin-right: 0px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 20px;
  padding-left: 20px;
}

/* Format Produktebereich */
div.produkte {
  background-color: white; 
  color: black; 
  border: 0px solid #666666;
  font-size: medium;
  margin-left: 0px;
  margin-right: 0px;
  padding-top: 15px;
  padding-bottom: 0px;
  padding-right: 15px;
  padding-left: 0px;
  float: left;
}

/* Format Warenkorbereich */
div#wkorb {
  background-color: #EEEEEE; 
  color: black; 
  font-size: medium;
  margin-left: 0px;
  margin-right: 0px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 20px;
  padding-left: 20px;
}


/* Format Fussbereich */
div#fuss {
  background-color: #369;
  color: black; 
  font-size: x-small;
  text-align: center;
  padding-right: 10px;
  padding-left: 10px;
}

/* Schriftgroessen Ueberschriften */
h1 {font-size: xx-large; display: inline;}
h2 {font-size: x-large; display: inline;}
h3 {font-size: large; display: inline;}
h4 {font-size: medium; font-weight: normal; display: inline;}
s1 {font-size: small; font-weight: normal; display: inline;}
s2 {font-size: small; display: inline;}
s3 {font-size: x-small; display: inline;}

/* Linkfarben */
a:active {color: #F30; }
a:link {color: #004080; } 
a:visited {color: #004080; } 
a:hover {color: #F30 ;}
a img:hover {box-shadow: 0 0 10px rgba(255,102,0,1)}

 
/* Tabellenzellen formatieren */
td  {
	border: 0px solid gray;
	font-size: medium;
	color: black;
}

/* Linien formatieren */
hr  {
	width: 100%;
	border-top: 1px solid gray;
	border-bottom: 1px solid gray;
	background-color: gray;
	height: 0px;
}

/* Aufzaehlungen formatieren */
li  {
	margin-left: 0px;
}


/* Form-Aktion-Button gestalten */
input  {
	font-family: Arial; 
	font-size: large; 
	font-weight: bold; 
	color: #C30; 
	padding-top: 8px; 
	padding-bottom: 8px;

	}

TEXTAREA  {
    font-family: arial; 
	font-size: medium; 
	font-weight: bold; 
	color: #C30; 
	padding-top: 1px; 
	padding-bottom: 1px;
}

/* Link-Button gestalten */
div.menu {
	float: left;
	background-color: gray;
	color: black;
	font: Arial,Helvetica;
	padding-top: 5px;
	padding-left: 8px;
	padding-right:8px;
	padding-bottom: 5px;
	margin-right: 8px;
	text-align: center;
	}

/* Mehrere Bilder nebeneinander mit Text zentrieren*/
div.bilder {
  text-align: center;
  float: left;
  padding: 15px;
  font-size: small;
  font-weight: bold;
}

/* Bilderreihen nebeneinander mit Text zentrieren*/
div.bilder2 {
  text-align: center;
  float: left;
  overflow: hidden;
  padding: 4px;
  font-size: small;
  font-weight: bold;
}
 
/* Bild links neben Kolonne einfuegen */
div.contbild {
	float: left;
	color: black;
	font: arial;
	padding-top: 5px;
	padding-left: 8px;
	padding-right:8px;
	padding-bottom: 5px;
	margin-right: 25px; 
	}	
	
/* Bilder formatieren */
img {
    border: 0px;
	color: #333;
}
 
/* Block zentrieren */
div.block {
  text-align: center;
  font-size: small;
  font-weight: bold;
} 
	 



/* Kolonne untereinander */
div.kolonneunter {
	margin-top: 0px;
	margin-left: 10px;
	padding-top: 6px;
	padding-left: 10px;
	padding-right: 0px;
	padding-bottom: 6px;
    color: black;
	font: Arial;
    text-align: left;
	}


/* Schrift dunkelrot */
div.drot {
	color: #CC0000;
}

/* Schrift orange */
div.orange {
	color: #F30;
}

/* Schrift dunkelgruen */
div.dgruen {
	color: #006600;
}

/* Schrift anthrazitblau */
div.ablau {
	color: #004080;
}