* {margin: 0; padding: 0;}
img, image {border: 0px none; padding: 0; margin: 0;}
a {color: black;}
a, a:focus, a:hover, a:active {text-decoration: none;}
body {font: 14px "Trebuchet MS", Arial, Helvetica, sans-serif; color: black;}
.clear {clear: both;}
input {font: bold 10px Verdana, Arial, Helvetica, sans-serif; color: #8C8C8C; border: none; background-color: transparent; padding-left: 4px;}

h1 {font-weight: bold; font-size: 20px; text-transform: uppercase}
h2 {font-weight: bold; font-size: 16px; text-transform: uppercase}
h2.hide_h2 {text-indent: -999em; height: 1px; font-size: 1px;} /* versteckt die H2-Überschriften */
h3 {font: bold 11px Verdana, Arial, Helvetica, sans-serif; padding-bottom: 6px;}
h4 {font-size: 12px; color: #C06; text-transform: uppercase;}
p {line-height: 1.4}


/* ****************************************************************

Farben:


******************************************************************/


#wrapper {width: 960px; margin-left: auto; margin-right: auto;}	

#header {height: 200px; background: #b3dfdd} /* Logo, Search, Login, Account, Produkt-Navi */

#logo {float: left; height: 200px; width: 200px;}
h1.logo {background: url('img/logo.gif') no-repeat;}
h1.logo a {display: block; height: 200px; width: 200px; text-indent: -999em;}

#header_right {height: 200px; width: 740px; float: right;}

#header_right_top {clear: both; height: 135px; margin-top: 10px;}
#cart {width: 140px; float: right; margin-right: 20px}
/* der text in der cart-box, datei: box_cart.html */
p.cart {font-size: 11px; color: white;}
/* versandkosten im warenkorb und bei den artikeln */
p.underlined a:hover {color: #999; text-decoration: underline;}



#login, #logout {width: 140px; margin-right: 30px; float: right;}
.loginfield {margin-top: 8px; width: 130px; background-color: #dcf9f8; padding: 5px; -moz-border-radius: 6px; -khtml-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px;}
.loginfield input[type="text"], .loginfield input[type="password"] {color: #588785}
/* in den dateien: box_login.html */
p.link a {line-height: 2; font-size: 11px; color: white; border-bottom: 1px dotted white}
p.link a:hover {color: #588785; text-decoration: none;}

#search {width: 140px; margin-right: 16px; float: right;}
#searchfield {margin-top: 8px; width: 130px; background-color: #dcf9f8; padding: 5px; -moz-border-radius: 6px; -khtml-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px;}
#searchfield input[type="text"] {color: #588785}

#header_right_bottom {clear: both; height: 40px;}
#categories {float: right; margin-right: 16px}
ul.CatNavi {display: inline; float: left; list-style: none; font-weight: bold; font-size: 22px; text-transform: uppercase; padding-left: 10px}
ul.CatNavi a {color: #588785;}
ul.CatNavi a:hover {color: white;}


#main {}


#footer {height: 50px; margin-top: 10px;}
#footer ul {display: inline; float: left; padding-left: 20px;}
#footer li {display: inline; float: left; list-style: none; padding-right: 7px;}
#footer a {color: #999; font-size: 11px;}

#copyright {color: #999; text-align: center; font-size: 10px; margin-top: 5px;}
#copyright a {color: #aaa; font-weight: bold; font-variant: small-caps;}
#copyright a:hover {color: #C06;}

#admin {margin-top: 10px;}



/********************************************************************************************************/

/****************************   ARTIKELLISTENSEITEN: product_listing.html      **************************/

/********************************************************************************************************/

.catpic {padding-bottom: 14px; padding-top: 50px;}

.productlist {}
.proddetails {height: 40px}
table.productrow {height: 260px; width: 159px; margin-bottom: 16px;}
td.infopic {margin-top: 14px;}
td.name {font-weight: bold; text-transform: uppercase;}
td.name a:hover {color: #588785;}
td.price {height: 36px;}



/********************************************************************************************************/

/***********   ARTIKELDETAILSEITEN: product_info.html, Cross Selling, Reverse Cross Selling    **********/

/********************************************************************************************************/


/* Produktnavigation */
#navigator {}
ul#productnavi {}
ul#productnavi li {display: inline; text-decoration: none;}
ul#productnavi li a {}
ul#productnavi li a:hover {}

/* hält Bilderbox und rechte Texte zusammen, sonst rutscht Text runter */
.pixanddetails {position: relative; top: 30px; left: 0; height: 520px;}

/* Bilder (ganze Box mit float left) */
.pixbox {position: relative; top: 0; left: 0; margin: 0; width: 440px; float: left;}

.mainpic img {padding: 0 0 5px 2px;}
.outeraltpix {}
.outeraltpix img {border: 1px solid #ccc;  margin: 0;}
.clickpixtext {background: #eee; padding: 2px 0 2px 0; margin-top: 5px; width: 408px; text-align: center;}

/* fasst alle Produktdetails zusammen: alles rechts vom Foto. Name, Preis, Optionen */
.proddetails {position: absolute; left: 460px; width: 480px;}
.proddescription {line-height: 1.9em; padding: 10px 0 10px 0;}

/* "alter" Preis, wird nur dann wirksam, wenn es auch einen Sonderpreis gibt*/
.productOldPrice {font-size: 14px; font-weight: bold; color: red; text-decoration: line-through;}
.prodprice {font-size: 20px; font-weight: bold; }
.prodtax {font-size: 11px; margin-top: 10px;}
.prodshippinglink {font-size: 11px;}
.prodshippinglink a {font-size: 11px; color: #666; text-decoration: underline;}
.prodshippinglink a:hover {color: #999;}
.prodshipping {font-size: 11px; margin-bottom: 6px; margin-top: 6px;}


/* Shippinglink, aus den Sprachdateien */
span.lang_links {border-bottom: 1px dotted white; color: #white;}
span.lang_links a:hover {color: #C06;}

table.prodoptions {background: #b3dfdd; padding: 10px;}
td#top {font-weight: bold; font-size: 14px;}
td#bottom {padding: 4px;}

.putincart {height: 50px; background: url('img/bag.gif') no-repeat; margin-top: 20px;}
.putincart p {display: inline;}
.putincart p.quantity {position: relative; top: 15px; left: 10px; height: 18px; padding: 1px;}
.putincart p.quantity input {color: black;}
.putincart p.cart {position: relative; top: 21px; left: 3px;}

.prodrest {margin-top: 20px; width: 960px; border-top: 1px dotted #ccc;}


.crossselling {border: 1px solid #ccc; padding: 5px;}
.crossselling h2 {font-size: 12px; padding: 10px 0 10px 2px;}
.prodreverseselling {border: 1px solid #ccc; padding: 3px;}
.prodalsopurchased {border: 1px solid #ccc; padding: 3px;}

/* error_handler: keine Suchtreffer */
#searchbox {margin: 30px auto 0 auto; width: 300px; height: 150px; border: 1px solid #ccc; }
#suchtext {display: inline; position: relative; background: white; top: -10px; left: 4px; font: bold 14px Verdana, Arial, Helvetica, sans-serif; text-transform: uppercase; padding: 10px;}
#suchsatz {position: relative; padding: 25px 0 0 34px; }


/* crossselling */
td.tinyinfopic {width: 162px; height: 120px;}
td.tinyname {}
td.tinyprice{}



/* warenkorb leer, datei: shopping_cart.html */
p.center {text-align: center;}

/* warenkorb beim auschecken, datei: shopping_cart.html*/
table.carttable {border: 1px dotted #999;}
table.carttable th {font: bold 12px Verdana, Arial, Helvetica, sans-serif; text-align: right;}
table.carttable td {border-top: 1px dotted #999; vertical-align: top; text-align: right; padding: 5px;}
table.carttable img {display: block;}
p#cartmessage {font: bold 14px/1.4 Georgia, "Times New Roman", Times, serif; padding: 10px; color: #C06;}

/* gutscheinhinweis auf warenkorbseite, datei: gift_cart.html */
#gutschein_cashen {border: 1px dotted #999; background: #F3F3F3; padding: 20px; line-height: 1.8}
p.indent {text-indent: 200px;}
p.indent200 {text-indent: 200px; margin-bottom: 4px;}
p.indent100 {text-indent: 100px; margin-bottom: 4px;}
p.floatleft {float: left;}
p.inputcode {background-color: #eee; border-bottom: 1px dotted #ccc; padding-top: 3px; width: 150px; margin-left: 200px; float: right;}
p.alignright {text-align: right;}

/* kontoverwaltung unter - MEIN KONTO und sonstige WHITEPAGES */
p.error {font: bold 14px Verdana, Arial, Helvetica, sans-serif;  padding: 10px; color: #C06;}
p.kontoverwalten {border: 1px dotted #999; padding: 5px; margin-bottom: 10px;}
p.kontoverwalten a:hover {color: #666;}
div.kontoverwalten {border: 1px dotted #999; padding: 5px; margin-bottom: 10px;}
.whitepages_left {float: left; width: 300px;}
.whitepages_right {margin-left: 330px; width: 350px;}
p.passwort {margin-left: 200px;}
p.passwort a:hover {color: #666;}
td.inputRequirement {background-color: #eee; border-bottom: 1px dotted #ccc; padding: 2px; width: 150px;}
table.formArea {border: 1px dotted #999; padding: 4px;}
td.inputleft {width: 170px; padding: 2px; border-bottom: 1px dotted #ccc;}
p.inputsec {background-color: #eee; border-bottom: 1px dotted #ccc; width: 170px; position: relative; left: 200px; margin-bottom: 4px;}
p.inputsec100 {background-color: #eee; border-bottom: 1px dotted #ccc; width: 170px; position: relative; left: 100px; margin-bottom: 4px;}
.alterpassword {border: 1px dotted #999; padding: 10px;}
.whitepages_indent200 {margin-left: 200px; margin-top: 30px;}
.whitepages_indent100 {margin-left: 100px; margin-top: 30px; width: 500px;}


span.error {font: bold 12px Verdana, Arial, Helvetica, sans-serif; color: #C06;}
td.inputcode {background-color: #eee; border-bottom: 1px dotted #ccc; padding: 2px 0 2px 0;}

#agb {font: 11px Verdana, Arial, Helvetica, sans-serif;}


/* faq */
ul.faq li {list-style: inside; line-height: 1.6;}

/* news */
ul.news {list-style: inside; line-height: 1.6;}
 








/************************************************************************************************************
*************************************************************************************************************
*************************************************************************************************************
*********************************  INFO / CONTENT / KUNDENCENTER ********************************************
*************************************************************************************************************
*************************************************************************************************************
************************************************************************************************************/

.whitepages-outer {min-height: 500px}
.whitepages-inner {margin-top: 30px}

/* Weitere Error-Meldungen unter span.error */
.errormessage {font-size: 13px; padding: 2px 6px; color: red; background: white; margin: 10px 0;}
.buttoncontinue {text-align: right; padding-right: 75px} /* Button Weiter und Zurück, nur in der content.html und bei allen media-texten */

/* Inhalt der Prozess-Seiten */
.process-content {text-align: justify; width: 600px; margin-left: 334px; min-height: 530px}
.process-content ul li {list-style: none; padding: 4px 0;}

.process-content li span.text {width: 170px; display: block; float: left;}
.process-content li span.eingabe {}
.process-content li input[type='text'], .process-content li input[type='password'] {width: 200px; border: 1px solid #dfd8ce; padding: 7px;}
.process-content li select {border: 1px solid #dfd8ce; padding: 5px; width: 216px}

/* KUNDENPROZESS-SEITEN / KONTO - account.html 
Keine Styles, nur h1, p und Buttons */

/* KUNDENPROZESS-SEITEN (KONTO) / KONTO BEARBEITEN - account_edit.html 
gehen in den allgemeinen Styles auf */
ul.accountbearbeiten {}

/* KUNDENPROZESS-SEITEN (KONTO) / PASSWORT BEARBEITEN - account_passwort.html
gehen in den allgemeinen Styles auf */
ul.editpasswort {}

/* KUNDENPROZESS-SEITEN (KONTO) / ADRESSBUCH BEARBEITEN - address_book.html */
p.borderbottom {border-bottom: 1px solid #dfd8ce; padding-bottom: 16px}

/* KUNDENPROZESS-SEITEN (KONTO) / ADRESSBUCH BEARBEITEN - address_book_details.html */
ul.editaddressbook {}
span.optional {font-style: italic; color: #999}

/* KUNDENPROZESS-SEITEN (KONTO) / ADRESSEN AUS ADRESSBUCH LÖSCHEN - address_book_process.html 
Keine Styles, nur h1, p und Buttons */

/* KUNDENPROZESS-SEITEN (KONTO) / NEUKUNDENREGISTRIERUNG / CREATE ACCOUNT - create_account.html */
/* KUNDENPROZESS-SEITEN (KONTO) / GASTANMELDUNG / CREATE GUEST ACCOUNT - create_account_guest.html */
div.createaccount {}

/* KUNDENPROZESS-SEITEN (KONTO) / LOGIN - login.html ... s. Loginfeld als Box: .loginfield wurde hier ebenfalls verwendet*/
.login_left {float: left; width: 300px; height: 300px; padding: 20px; margin-right: 40px; background-color: #b3dfdd; -moz-border-radius: 6px; -khtml-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; } /* Anmeldung */

.login_right {float: left; width: 500px} /* Weiter zur Registrierung */
#neukundenregistrierung {}
#gastregistrierung {}

/* KUNDENPROZESS-SEITEN (KONTO) / LOGOFF - logoff.html 
Keine Styles, nur h4, p und Weiter-Button */

/* KUNDENPROZESS-SEITEN (KONTO) / NEWSLETTER - newsletter.html
gehen in den allgemeinen Styles auf */
ul.newsletterverwalten {}

/* KONTO - PASSWORT VERGESSEN - passwort_double_opt_in.html*/
ul.passwortvergessen {}






