/* ###################################################################
   # Styledefinitionen für die Darstellung am Bildschirm
   #
   # Diese Datei definiert die Stile die in den Templates verwendet
   # werden..
   #
   ################################################################### */


/* ###################################################################

   Verwendete Farben

   HEX      RGB DEC      FARBE        VERWENDUNG
	
   #CC0000  255,000,000  Dunkelrot    Text
                                      HG Tabellenüberschriften
                                      Warenkorbkopf
                                      Rahmen Formularfelder
                                      HG Hover Hauptmenè

   #E36633  227,102,051  Fuchsbraun   Hauptrahmen

   #804000  128,064,000  Dunkelbraun  HG mittlere Warenkorbzeile
                                      Links
                                      Text in Formularfeldern

   #F4A460  244,164,096  Helbraun     HG Formularfelder

   #FEF2C5  254,242,197  Blassgelb    HG
                                      Texte in Balken

   ################################################################### */


/* ###################################################################
   # Template Design
   #
   # Dieser Block definiert die Stile die in den Templates verwendet
   # werden. Da das Template-Design individuell ist, dürfen in diesem
   # Bereich beliebige Änderungen vorgenommen werden.
   #
   ################################################################### */

.image {
	border: 1px solid #aaaaaa;
	padding: 4px;
	background: #eeeeee;
}
table.image {
	border: none;
	background: transparent;
}

/* ###################################################################
   # HTML Elemente
   #
   # Hier werden die Stile für ganze HTML-Elemente festgelegt.
   # Änderungen in diesem Block sind erlaubt, haben aber grosse
   # Auswirkungen auf das Erscheinungsbild des Shops.
   #
   ################################################################### */

hr {
	color: #004080;
}

/* ###################################################################
   # SYSTEMBEREICH
   #
   # Elemente in diesem Bereich werden vom Shopsystem verwendet.
   # Diese Elemente dürfen angepasst, aber nicht entfernt werden.
   # Das ändern oder entfernen kann drastische auswirkungen auf
   # das Erscheinungsbild des Shops haben!
   #
   ################################################################### */

/* *******************************************************************
   * Shopformulare
   ******************************************************************* */

.shopform { text-align: left; }
table.shopform { border: 1px solid #004080;  padding: 0px 0px 0px 0px; background-color: #CCCCFF; width: 600px;    }
td.shopformblock { color: #EEEEEE;  text-align: left;  font-weight: bold;  background-color: #004080; padding: 3px 3px 3px 3px; margin: 0px 0px 0px 0px;     }
th.shopform { color: #000000;  text-align: left;  font-weight: bold;  background-color: #9999FF; padding: 3px 3px 3px 3px; margin: 0px 0px 0px 0px;  width: 150px;  background-image: none;    }
td.shopform { color: #000000; background-color: #CCCCFF; padding: 3px 3px 3px 3px;  margin: 0px 0px 0px 0px;  }
td.shopformerror { color: Red; background-color: #CCCCFF; padding: 3px 3px 3px 3px;  margin: 0px 0px 0px 0px;  font-weight: bold;  font-size: 11px;       }
hr.shopform { border: 1px solid #004080;}
td.shopformbutton { color: #000000; background-color: #FFFFFF; padding: 6px 3px 6px 3px;  margin: 0px 0px 0px 0px;  text-align: center;   }

/* Text "erforderlich" in Formularfeldern */
.smalltext { font-size: 9px;  font-weight: normal;  }

/* Kleine Links in Formularen (z.B. "Passwort vergessen?") */
a.formlinksmall:link    {text-decoration: none; color: #004080; font-size: 9px; }
a.formlinksmall:visited {text-decoration: none; color: #004080; font-size: 9px; }
a.formlinksmall:hover   {text-decoration: none; color: #FF0000; font-size: 9px; }
a.formlinksmall:active  {text-decoration: none; color: #000000; font-size: 9px; }
a.formlinksmall:focus   {text-decoration: none; color: #FF0000; font-size: 9px; }

/* *******************************************************************
   * Warenkorb
   ******************************************************************* */

td.basket {
	background-color : #CCCCFF;
	background-image : none;
	FONT-SIZE: 8pt; 
	padding-left: 3px;
	color: #000000;
	line-height: normal;
}
td.basketright {
	background-color : #CCCCFF;
	background-image : none;
	FONT-SIZE: 8pt; 
	padding-left: 3px;
	color: #000000;
	text-align: right;
	white-space: nowrap;
	line-height: normal;
}
td.baskettop {
	background-color: #9999FF;
	FONT-SIZE: 8pt; 
	color: #000000;
	padding-left: 3px;
	vertical-align: middle;
	line-height: normal;
}
td.baskettext {
	FONT-SIZE: 8pt; 
	color: Black;
	background-color: #DDDDDD;
	padding-left: 3px;
	line-height: normal;
}
td.baskettextright {
	FONT-SIZE: 8pt; 
	color: Black;
	background-color: #DDDDDD;
	padding-left: 3px;
	text-align: right;
	line-height: normal;
}
td.baskettitle {
	FONT-WEIGHT: bold; 
	FONT-SIZE: 12pt; 
	TEXT-ALIGN: left;
	color: #000000;
	line-height: normal;
}
table.basket {
	FONT-SIZE: 8pt; 
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	color: #000000;
	line-height: normal;
}
td.baskethead {
	FONT-WEIGHT: bold; 
	FONT-SIZE: 8pt; 
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 
	background-color: #004080;
	color : #EEEEEE;
	text-align: left;
	line-height: normal;
}
td.basketheadright {
	FONT-WEIGHT: bold; 
	FONT-SIZE: 8pt; 
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	BACKGROUND-COLOR: #004080;
	COLOR : #EEEEEE;
	text-align: right;
	line-height: normal;
}
hr.basket {
	color: #004080;
	height: 1px;
}
a.basket         {BACKGROUND-COLOR: transparent; color: #fef2c5; text-decoration: none;}
a.basket:link    {BACKGROUND-COLOR: transparent; color: #fef2c5; text-decoration: none;}
a.basket:visited {BACKGROUND-COLOR: transparent; color: #fef2c5; text-decoration: none;}
a.basket:hover   {BACKGROUND-COLOR: transparent; color: #fef2c5; text-decoration: underline overline;}
a.basket:active  {BACKGROUND-COLOR: transparent; color: #fef2c5; text-decoration: underline overline; color: Red; }
a.basket:focus   {BACKGROUND-COLOR: transparent; color: #fef2c5; text-decoration: underline overline;}

/* *******************************************************************
   * Startartikel
   ******************************************************************* */
table.startarticle { border-top: 1px solid #004080; border-left: 1px solid #004080; }
tr.startarticle { }
th.startarticle {  border-right: 1px solid #004080;  color: #000000;  border-left: none !important;  background-color: #CCCCCC;   }
td.startarticle {  border-right: 1px solid #004080; border-bottom: 1px solid #004080;  vertical-align: top;   }
	
/* *******************************************************************
   * Verschiedenes
   ******************************************************************* */

/* Rechtsausrichtung für Preise */
.price { text-align: right;}

/* Schattierung für Artikelübersicht */
.shadow { background-color: #EEEEEE;  }
.noshadow { background-color: transparent; }

/* Textlinks für Links die an Stelle von Buttons verwendet werden */
.shopmenu          {color: #CC0000;}
a.shopmenu         {text-decoration: none;}
a.shopmenu:link    {text-decoration: none;}
a.shopmenu:visited {text-decoration: none;}
a.shopmenu:hover   {text-decoration: underline overline;}
a.shopmenu:active  {text-decoration: underline overline; color: Red; }
a.shopmenu:focus   {text-decoration: underline overline;}

/* Buttons im Seitenmenü und Bildbuttons in Formularen */
.imagebutton {
	COLOR: #000000; 
	FONT-FAMILY: Tahoma, Arial, sans-serif;
	border: none !important;
	background-color: transparent;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
}
a.imagebutton {
	COLOR: #000000; 
	FONT-FAMILY: Tahoma, Arial, sans-serif;
	border: none;
	background-color: transparent;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
}
img.imagebutton {
	COLOR: #000000; 
	FONT-FAMILY: Tahoma, Arial, sans-serif;
	border: none;
	background-color: transparent;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
}
/* *******************************************************************
   * Kategoriemenu
   ******************************************************************* */
	
/* Kategoriemenu Ebene 1 */
.catmenu1 { font-size: 8pt; font-style: normal; font-weight: bold; background-color: transparent;  }
a.catmenu1:link    {text-decoration: none; color: #FFFF00; background-color: transparent;  display: block; padding: 1px 3px 1px 10px; width: 153px;}
a.catmenu1:visited {text-decoration: none; color: #FFFF00; background-color: transparent;  display: block; padding: 1px 3px 1px 10px; width: 153px;}
a.catmenu1:hover   {text-decoration: none; color: #FF0000; background-color: #CCCCFF;  display: block; padding: 1px 3px 1px 10px; width: 153px;}
a.catmenu1:active  {text-decoration: none; color: #000000; background-color: #CCCCFF;  display: block; padding: 1px 3px 1px 10px; width: 153px;}
a.catmenu1:focus   {text-decoration: none; color: #FF0000; background-color: #CCCCFF;  display: block; padding: 1px 3px 1px 10px; width: 153px;}

.catmenu1active { font-size: 8pt; font-style: normal; font-weight: bold; color: #E36633; background-color: #CCCCFF;  }
a.catmenu1active:link    {text-decoration: none; color: #000000; background-color: #CCCCFF;  display: block; padding: 1px 3px 1px 10px; width: 153px;}
a.catmenu1active:visited {text-decoration: none; color: #000000; background-color: #CCCCFF;  display: block; padding: 1px 3px 1px 10px; width: 153px;}
a.catmenu1active:hover   {text-decoration: none; color: #FF0000; background-color: #CCCCFF;  display: block; padding: 1px 3px 1px 10px; width: 153px;}
a.catmenu1active:active  {text-decoration: none; color: #000000; background-color: #CCCCFF;  display: block; padding: 1px 3px 1px 10px; width: 153px;}
a.catmenu1active:focus   {text-decoration: none; color: #FF0000; background-color: #CCCCFF;  display: block; padding: 1px 3px 1px 10px; width: 153px;}

/* Kategoriemenu Ebene 2 */
.catmenu2 { font-size: 8pt; font-style: normal; font-weight: bold; color: #E36633; background-color: transparent;  }
a.catmenu2:link    {text-decoration: none; color: #FFFF00; background-color: transparent;  display: block; padding: 1px 3px 1px 25px; width: 138px;}
a.catmenu2:visited {text-decoration: none; color: #FFFF00; background-color: transparent;  display: block; padding: 1px 3px 1px 25px; width: 138px;}
a.catmenu2:hover   {text-decoration: none; color: #FF0000; background-color: #CCCCFF;  display: block; padding: 1px 3px 1px 25px; width: 138px;}
a.catmenu2:active  {text-decoration: none; color: #000000; background-color: #CCCCFF;  display: block; padding: 1px 3px 1px 25px; width: 138px;}
a.catmenu2:focus   {text-decoration: none; color: #FF0000; background-color: #CCCCFF;  display: block; padding: 1px 3px 1px 25px; width: 138px;}

.catmenu2active { font-size: 8pt; font-style: normal; font-weight: bold; color: #E36633; background-color: #CCCCFF;     }
a.catmenu2active:link    {text-decoration: none; color: #000000; background-color: #CCCCFF;  display: block; padding: 1px 3px 1px 25px; width: 138px;}
a.catmenu2active:visited {text-decoration: none; color: #000000; background-color: #CCCCFF;  display: block; padding: 1px 3px 1px 25px; width: 138px;}
a.catmenu2active:hover   {text-decoration: none; color: #FF0000; background-color: #CCCCFF;  display: block; padding: 1px 3px 1px 25px; width: 138px;}
a.catmenu2active:active  {text-decoration: none; color: #000000; background-color: #CCCCFF;  display: block; padding: 1px 3px 1px 25px; width: 138px;}
a.catmenu2active:focus   {text-decoration: none; color: #FF0000; background-color: #CCCCFF;  display: block; padding: 1px 3px 1px 25px; width: 138px;}

/* Kategoriemenu Ebene 3 */
.catmenu3 { font-size: 8pt; font-style: normal; font-weight: bold; color: #E36633; background-color: transparent;      }
a.catmenu3:link    {text-decoration: none; color: #FFFF00; background-color: transparent; display: block; padding: 1px 3px 1px 40px; width: 123px;}
a.catmenu3:visited {text-decoration: none; color: #FFFF00; background-color: transparent; display: block; padding: 1px 3px 1px 40px; width: 123px;}
a.catmenu3:hover   {text-decoration: none; color: #FF0000; background-color: #CCCCFF; display: block; padding: 1px 3px 1px 40px; width: 123px;}
a.catmenu3:active  {text-decoration: none; color: #000000; background-color: #CCCCFF; display: block; padding: 1px 3px 1px 40px; width: 123px;}
a.catmenu3:focus   {text-decoration: none; color: #FF0000; background-color: #CCCCFF; display: block; padding: 1px 3px 1px 40px; width: 123px;}

.catmenu3active { font-size: 8pt; font-style: normal; font-weight: bold; color: #E36633; background-color: #CCCCFF;       }
a.catmenu3active:link    {text-decoration: none; color: #000000; background-color: #CCCCFF; display: block; padding: 1px 3px 1px 40px; width: 123px;}
a.catmenu3active:visited {text-decoration: none; color: #000000; background-color: #CCCCFF; display: block; padding: 1px 3px 1px 40px; width: 123px;}
a.catmenu3active:hover   {text-decoration: none; color: #FF0000; background-color: #CCCCFF; display: block; padding: 1px 3px 1px 40px; width: 123px;}
a.catmenu3active:active  {text-decoration: none; color: #000000; background-color: #CCCCFF; display: block; padding: 1px 3px 1px 40px; width: 123px;}
a.catmenu3active:focus   {text-decoration: none; color: #FF0000; background-color: #CCCCFF; display: block; padding: 1px 3px 1px 40px; width: 123px;}

.xmenuback {
	background-color: #fef2c5;
	width: 100%;
}

/* Links in der Kategorieübersicht wenn keine Artikel gefunden wurden */
.pagemenu {
	vertical-align: bottom;
	color: #808080;
	font-size: 11px;
}
ul.pagemenu{
	list-style : disc outside url(../files/punkt1.gif);
}
li.pagemenu {
	margin-bottom: 5px;
}

/* Seitennavigation */
.pagenav { padding: 2px 4px 2px 4px; background: #CCCCFF; border: 1px solid #FFFFFF;  color: #000000;  }
a.pagenav:link    {text-decoration: none; color: #EEEEEE; background: #004080; border: 1px solid #FFFFFF;}
a.pagenav:visited {text-decoration: none; color: #EEEEEE; background: #004080; border: 1px solid #FFFFFF;}
a.pagenav:hover   {text-decoration: none; color: #FF0000; background: #CCCCFF; border: 1px solid #FFFFFF;}
a.pagenav:active  {text-decoration: none; color: #000000; background: #CCCCFF; border: 1px solid #FFFFFF;}
a.pagenav:focus   {text-decoration: none; color: #FF0000; background: #CCCCFF; border: 1px solid #FFFFFF;}

/* Artikelliste */
.artlist { border: none; width: 100%;}

/* Artikelsuche */
select.search {font-size: 9px;}
input.search {font-size: 9px;}
table.search {margin: auto;}
tr.search {}
td.search {padding: 0px 2px 0px 2px;  vertical-align: middle; }

/* ###################################################################
   # Ende SYSTEMBEREICH
   ################################################################### */