@import url(css/general-classes_tags.css);
@import url(css/boxes.css);


/* ######################################################################################################
** ### Vorbereitende Maßnahmen | Reset ##################################################################
** ######################################################################################################
*/
	/* Hiermit werden die Randabstände und border aller HTML-Elemente auf Null gesetzt. Damit wird das       
	** Aussehen der Webseite in unterschiedlichen Browsern vereinheitlicht. 
	*/
	
	* { margin:0; padding:0; font-size: 100%; } 
	
	/*
	** Die nachfolgenden Angaben entstammen dem Artikel 'Useful Code Snippets' von Mike Foskett
	** [http://www.websemantics.co.uk/tutorials/useful_css_snippets/]
	*/
	
	html { height: 100%; } 
	
	body { 
	/* Vertikalen Scrollbalken im Netscape & Firefox erzwingen. Dies verhindert, dass zentrierte Layouts 
	** um 10 Pixel springen wenn der Seiteninhalt kleiner wird als die Höhe des Browserfensters. */
		/*min-height: 101%;	*/
	/* Beseitigung des Rundungsfehlers bei Schriftgrößen im Opera sowie Standardformatierungen */
		font-size: 100.01%; 
	/* FIX: Verhindert, dass positionierte Elemente nicht verschoben werden when die Größe des Browser 
			Fensters geändert wird. */
		position: relative; 
	
	/* Vorgabe der Standardfarben und Textausrichtung*/     
		color: #000;        
		background: #fff url(img/wm24-header-bg.png) left top repeat-x; 
		text-align: left; 
		font-size: 0.8em; 
		font-family: Verdana, Arial, Helvetica, sans-serif;
	} 
	
	/* Standardrahmen zurücksetzen */
	fieldset, img { border:0; }
	
	/* Anpassung für Safari Browser. font-size:100% ist für den Safari in Formularen zu groß */ 
	select, input, textarea { font-size: 99% }


/* ############################################################
** #######   Markupfreie CSS-Floatclearing-Lösungen    ########
Bewirkt, dass ohne zusätzliche Clearing p-tags in der html Datei 
alle Spalten bis zum Ende der Seite laufen 
** ###########################################################
*/

/* Clearfix-Methode zum Clearen der Float-Umgebungen */
.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}
	
/* Diese Angabe benötigt der Safari-Browser zwingend !! */
.clearfix { display: block; } 
	
/* Overflow-Methode zum Clearen der Float-Umgebungen */
/*.floatbox { overflow:hidden; }*/
.inhalt-abschneiden { overflow:hidden; }

/* IE-Clearing: Benötigt nur der Internet Explorer und über iehacks.css zugeschaltet */
#ie_clearing { display: none } 

#stage { 
	position: relative;
	width:952px; 											/* layout width */
	margin-left: auto;										
 	margin-right: auto;
 	border-left: 1px solid #081F4B;
 	border-right: 1px solid #081F4B;
}

/*##########################################################
	all elements of the header        
###########################################################*/


#header { 
	position:relative; 
	height: 286px; 
	width: auto;
	color: #fff; 
	background: #08204C url(img/wm24-header.png) left top no-repeat; 
	z-index: 1;
}

#header-img{												/* gives more flexibility to position a header-imnage */
	width: auto;
	height: 100px;
	/*background: #08204C;*/
} 

#header-searchbox {
	position:relative; 
	width: auto;
	height: 48px;
	top: 101px;
	background: #fff url(img/wm24-searchbox.png) left top no-repeat; 
}


/*##########################################################
	all elements of the content        
###########################################################*/



#main {	            										/* wraps the 3 content columns */
	margin: 0;
	margin-top: 50px; 										/* use for distance between header and content */
	padding: 0;
	clear:both; 
	width: auto; 
	z-index: 1;
}
	
	
#breadcrumb { 
	position: absolute;
	top: 17px;
	left: 220px;
	width: 98%;
	color: #444;
	font-weight: bold;
	font-size: 0.85em;
}


#breadcrumb a {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #444;
	text-decoration: none;
}
#breadcrumb a:hover {
	color: #98002b;
}


#search {
	position: absolute;
	left:8px;
	top:12px;
	width:190px;
	height:26px;	
}	
																				
	
/*##########################################################
**######   Formatierung der drei Inhaltsspalten	  ##########
**##########################################################
*/
	
#col1 {
	float: left;
	width: 208px; /* Breite linke Spalte */
	height: 1200px;
	background: #fff url(img/wm24-box-bg-left.png) right top repeat-y; 
}
	
#col2 {
	float:right;
	width: 208px; /* Breite rechte Spalte */
	height: 1200px;
	background: #fff url(img/wm24-box-bg-right.png) left top repeat-y;
}
	
#col3 {
	width:490px; margin: 0 0 0 230px 
}

/* Backup für IE-Clearing */	
/* Der z-Index verhindert, dass im Falle des noch bestehenden IE-Bugs die Texte vor 
** dem Spaltenhintergrund erscheinen. */
#col1 {z-index: 3;}
#col2 {z-index: 5;}
#col3 {z-index: 1;}
#col1_content {z-index: 4;}
#col2_content {z-index: 6; width: 186px;float: right}
#col3_content {z-index: 2;}
	
#col1_content, #col2_content, #col3_content { 
	position:relative; 
}

#col3_innen {
	padding-top:10px;
	width:480px;	
}	





/*############################################################################################
**#############  ##########       Unterkategorie-Auflistung         ################ #########
**############################################################################################*/

#unterkategorie-bild {
	display:block;
	float:right;
	text-align: left;
}

.unterkategorie-links {
	display: none;
	/*margin-left:50%;*/
	padding-left: 10px;		
	border-left: 1px solid #999999;
}




/*############################################################################################
**#############  ##########       Produkt-Auflistung         ################ #################
**############################################################################################*/



#produkt-auflistung{
	font-size: 1.0em;
}

h1 .prod-list{
	font-size: 1.2em;
}

.prod-list-zelle {
	float: left;
	width:33%; 
	height: 280px;
	text-align: center;
	margin-bottom: 10px;
	/*background: #eeaaff;*/
}

div.bild-zentrierer {
	width:150px; 
	height:80px; 
	margin-top: 15px;
	text-align:center; 
	display:table-cell; 
	vertical-align:middle;
}
div.bild-zentrierer img {
	margin:0 auto; 
}
/* vertical align for IE */
/* befindet sich in iehacks Zeile 223*/


.prod-list-textblock {
	margin-top:7px;
}

.prod-list-name{
	font-weight: bold;
        margin-top:15px;
}
.prod-list-preis{
	font-weight: normal;
}

.prod-list-navigation{
	position: relative;
	top:-10px;
	left: 0px;
	width:100%;
	overflow: hidden;
}
#prod-list-navigation-unten{
	position:relative;
	bottom: 0px;
	left:0px;
}

.prod-list-nav-seiten{
	float: right;
}

a.prod-list-seitenzahlen {
	color:#98002b;
	text-decoration: underline;
}

a.prod-list-seitenzahlen:hover {
  color: #000;
}


/*############################################################################################
**#############  ##########       Produkt-Infoseite         ################ #################
**############################################################################################*/

#prod-info{
	margin-top:40px;
}

.prod-info-bildbereich {
	display:block;
	float:left;
	text-align: center;
	margin-left: -15px;
	width:50%;
}

.prod-info-textbereich {
	margin-left:50%;
	padding-left: 10px;		
	border-left: 1px solid #999999;
}

.prod-info-erstes-bild{
	margin-bottom: 30px;
}

.prod-info-thumbbilder{
	/*margin-left: 15px;*/
	width: 99%;
}


.prod-info-bildcontainer{
	
	/*width: 75px;*/
	/*height: 73px;*/
	margin-top: 8px;
	/*
	margin-left: 8px; */
	/*overflow: hidden;*/
	float: left;
}

.prod-info-bildcontainer img{
	/*
	margin-left: -20px;
	margin-top: -15px;
	*/
}

.prod-info-preis{
	font-size: 1.15em;
	
}
.prod-info-preis-zusatz{
	margin-bottom: 15px;
}

.prod-info-drucken{
	padding-top: 2px;
	float:right;
}

.produkt-abmessung{
	font-weight: bold;
	color:#333;
}
	
#bestell-optionen ul{
	margin:0px;
	margin-top: 0.5em;
	padding: 0px;
}
#bestell-optionen li{
	margin:0px;
	padding:0px;
	list-style:none;
}
.lagerbestand{
	padding-left: 18px;
}
.prod-info-bestellung input{
	float: left;
	margin-top: 15px;
	margin-right: 5px;
}

img{
	border: 0px;
}
/*************************************************/
/*** popup_image.php ***********************/
/*************************************************/


.popimage-bild{
	text-align: center;
	margin-top: 10px;
	font-size: 1.2em;
}

/*************************************************/
/*** show_product_thumbs.php ***********************/
/*************************************************/

.popup-image-waehlen a img{
	border: 0px;
}



/*************************************************/
/*************** Cross-Selling  ******************/
/*************************************************/


#cross-selling{
	margin-top:50px;
}

fieldset{
	border: 2px solid #DDD;
	padding: 5px;
	padding-bottom: 0px;
}

legend{
	padding: 10px;
	font-weight: bold;
	color: #333333;
}

#cross-selling .prod-list-zelle,
#cross-selling .bild-zentrierer{
	width:175px; 

}









/*############################################################################################
**#############  ##########       Inhalt-Seiten        #######################################
**############################################################################################*/

/*************************************************/
/* Startseite  ***********************************/
/*************************************************/


#flashcontent{
	margin-top:20px;
	text-align: center;
}










/*************************************************/
/* Warenkorb-Seite (Order-details) ***************/
/*************************************************/

table.warenkorb-tab {
	padding: 0px;
	margin: 0px;
	border-collapse:collapse;
}

.warenkorb-tab th{ 
	border-bottom: 2px solid #ccc;
	font-weight: bold;
	padding: 4px;
}
.warenkorb-tab th.wtk-entfernen{
	padding:0px;
}


.warenkorb-tab tr{
	vertical-align:top;	
}

.warenkorb-tab td{
	padding: 5px;
	border-bottom: 1px solid #ccc; 
}

td.wtk-bild{
}

td.wkt-anzahl {
	font-weight:bold;
	text-align:center;
}

td.wkt-artikel {
}

td.wkt-einzelpreis {
	text-align:right;
	font-size: 0.8em;
}

td.wkt-summe {
	text-align:right;
	font-size: 0.8em;
	font-weight: bold;
}

td.wkt-entfernen {
	text-align:center;
	background-color:#F1F1F1;
}

.wtk-zusammenfassung{
	margin-top: 10px;
	text-align:right;
}




/*************************************************/
/*** Login  **************************************/
/*************************************************/


#bereitskunde {
	float:right;
	width: 220px;
}

#neukunde {
	width: 240px;
	padding-right: 20px;
	border-right: 1px solid #aaa;
}


/*************************************************/
/* Mein Konto ************************************/
/*************************************************/

#mein-konto{}
#mein-konto li {
	list-style: none;
}

.artikel-container{
	float: left;
	width: 49%;
	overflow: hidden;
	text-align: center;
}

#mein-konto .artikelbild {
	height: 160px;	
}

#mein-konto .textbereich {
}

.modAccountBodyBottomCellFloat {
	float:left;
	padding-right:6px;
	vertical-align:middle;
}

div.bild-zentrierer2 {
	width:270px; 
	height:160px; 
	margin-top: 15px;
	text-align:center; 
	display:table-cell; 
	vertical-align:middle;
}
div.bild-zentrierer2 img {
	margin:0 auto; 
}


/* message box */

.messageBox { font-size: 11px; }
.messageStackError, .messageStackWarning { font-size: 11px; background-color: #ffb3b5; }
.erfolggehabt { font-size: 11px; background-color: #99ff00; }



/*************************************************/
/* account_History_Info **************************/
/*************************************************/

.accountHistoryInfoBodyAdd, .accountHistoryInfoBodyOutline , .accountHistoryInfoBodyHist {
	margin-bottom:5px;
	background: #f1f1f1;
	border-color: #cccccc;
	border-style: solid;
	border-width: 1px;
	padding:5px;
 }
 
.accountHistoryInfoBodyProd {
	margin-bottom:5px;
	background: #f1f1f1;
	border-color: #cccccc;
	border-style: solid;
	border-width: 1px;
	
}
 
.accountHistoryInfoBodyAddLeft , .accountHistoryFooterLeft {
 	float:left;
 }
 
.accountHistoryInfoBodyShipCellL {
 	float:left;
	font-weight:bold;
 }
 
.accountHistoryInfoBodyAddRight , .accountHistoryFooterRight {
 	margin-left:50%;
 }
 
.accountHistoryInfoBodyShipCellR {
 	margin-left:110px;
}

.accountHistoryInfoBodyProd {
	font-size:11px;
}

.accountHistoryInfoBodyProdTotalBody , .accountHistoryFooterRight{
	text-align:right;
}

.accountHistoryInfoBodyHistBottom {

}

TD.accountHistoryInfoBodyProdBottomH {
	background-color: #666666;
	color:#FFFFFF;
	font-weight:bold;
	font-size:10px;
	border-right: 1px solid; 
	border-bottom: 1px solid; 
	border-color: #ffffff;
	padding:2px;
}

TD.accountHistoryInfoBodyProdBottomHL {
	background-color: #666666;
	color:#FFFFFF;
	font-weight:bold;
	font-size:10px;
	border-bottom: 1px solid; 
	border-color: #ffffff;
	padding:2px;
}

TD.accountHistoryInfoBodyProdBottomB {
	border-right: 1px solid; 
	border-bottom: 1px solid; 
	border-color: #ffffff;
	padding:2px;
	background-color: #CCCCCC;
}

TD.accountHistoryInfoBodyProdBottomBL {
	border-bottom: 1px solid; 
	border-color:  #ffffff;
	text-align:right;
	padding-right:2px;
	background-color: #CCCCCC;
}

TD.accountHistoryInfoBodyProdBottomBF {
	border-bottom: 1px solid; 
	border-color:  #ffffff;
	text-align:right;
	background-color: #CCCCCC;
}

.accountHistoryInfoBodyProdTotalBodyLeft {
	float:left;
	text-align:right;
	width:80%;
}
.accountHistoryInfoBodyProdTotalBodyRight {
	padding-left:2px;
	padding-right:2px;

}

/* historyBlock-Styles sind nur aktiv wenn account_history_info.php  */
/* im root-Verzeichnis von xt:C durch beiligende Datei ersetzt wurde */

.historyBlockBody {
	border-bottom: 1px solid; 
	border-color:  #cccccc;
}

.historyBlock {
	
}

.historyBlockDate {
	float:left;
	padding:2px;
}

.historyBlockStatus {
	float:left;
	text-align:right;
	padding:2px;
	font-weight:bold;
}

.historyBlockCom {
	margin-left:50%;
	padding:2px;
	
}



/*************************************************/
/*** checkout_shipping.php ***********************/
/*************************************************/

.checkoutShipping{
}

.bestellschritte{
	width: 99.9%;
	padding-bottom: 5px;
	border-bottom: 1px solid #98002b;
	overflow: hidden;
}

.bestellschritt,
.bestellschritt-aktiv{
	margin-top: 3px;
	margin-right:10px;
	float: left;
	text-align: center;
	font-size: 0.8em;
}

.bestellschritt-aktiv{
	font-weight: bold; 
	color: #98002b;
}

.versandadr-links, .versandadr-mitte {
	float:left;
	padding-right:20px;
}
.versandadr-mitte {
	margin-right: 20px;
	padding: 10px;
	border: 1px solid #ccc;
}

.text-weiter {
	float:left;
}

.button-weiter {
	margin-left:50%;
	text-align:right;
}


/*************************************************/
/* shippingBlock (Auswahl der Versandart) ********/
/*************************************************/

.versandkostenfrei {
	height: 50px;
	margin-bottom: 5px;
	padding: 10px;
	border: 1px solid #ccc;
	background: #f6f6f6;
	overflow: hidden;
}

.versandartblock-links {
	float:left;
	padding-top:2px;
	width:4%;
}

.versandartblock-mitte {
	float:left;
	padding-left:3px;
	padding-right:3px;
	width:75%;
}

.versandartblock-rechts {
	text-align:right;
}


/*************************************************/
/* checkoutPayment *******************************/
/*************************************************/
.checkoutPayment{
	
}


.bemerkungs-form{width: 99%;}

.agb-zustimmen {
	width: 99%;
	background-color: #98002b;
	padding:5px;
	color:#FFF;
}

/****************************************************/
/* checkout_paymentBlock (Auswahl der Zahlungsweise */
/****************************************************/

.zahlungsweise {
	margin-bottom: 5px;
	padding: 10px;
	border: 1px solid #ccc;
	background: #f6f6f6;
}

.zahlungsweise-radio {
	margin-bottom:7px;
}

.zahlungsweise-links {
	float:left;
	margin-left:18px;
	width:120px;
	padding: 2px;
}

.zahlungsweise-mitte {
	float:left;
	width:350px;
	padding: 2px;
}

.zahlungsweise-rechts {
	text-align:right;
}

/*************************************************/
/* adressBookProcess *****************************/
/*************************************************/

.adressBookProcessHead , .adressBookProcessBodyT {
	font-weight:bold;
}

.adressBookProcessBodyB {
	padding-top:5px;

}

.adressBookProcessBody {
	border: 1px solid #CCCCCC;
	padding:3px;
}

.adressBookProcessBodyBLeft {
	float:left;
	font-weight:bold;
}

.adressBookProcessBodyBRight {
	margin-left:150px;
}


.adressBookProcessFooter {
	padding-top:5px;
}

.adressBookProcessFooterLeft {
	float:left;
}

.adressBookProcessFooterRight {
	margin-left:50%;
	text-align:right;
}
/*************************************************/
/* checkoutConfirmation.php **********************/
/*************************************************/
.bestellung-bestaetigen{
	width:99%;
}

.checkoutConfirmHeadTop , .checkoutConfirmIp , .checkoutConfirmBodyProdCellTotal {
	font-weight:bold;
}

.checkoutConfirmBodyAddLeft {
	float:left; background: green;
}
.checkoutConfirmBodyAddRight {
	margin-left:50%;
}

.checkoutConfirmHead , .checkoutConfirmIp , .checkoutConfirmBodyAdd , .checkoutConfirmBodyShip , .checkoutConfirmBodyPay , .checkoutConfirmBodyCom , .checkoutConfirmBodyPi , .checkoutConfirmBodyProd , .checkoutConfirmBodyRev {
	background: #f1f1f1;
	border-color: #cccccc;
	border-style: solid;
	border-width: 1px;
	padding:5px;
	margin-bottom:7px;
}

.checkoutConfirmBodyBut {
	text-align:right;
}

.bestellung-bestaetigen a{
	color: #98002b;
}
.bestellung-bestaetigen a:hover{
	color: #000;
}

.adresse-best{
	float: left; 
	width: 45%;
	margin-right: 20px;
}

.adresse-best-innen{
	border: 1px solid #ccc;
	padding: 10px;
}

/*Tabellen innerhalb der Bestellbestätigung*/


.bestell-bestae-tab{
	width: 100%;
}

.bestell-bestae-tab-art-preis{
	width: 120px;
	text-align: right;
}
/*Definiert die Farbe für den Rabatt-Preis*/
.preis-vorkasse{
	color: #009933;
}


/*************************************************/
/* createAccount(guest) **************************/
/*************************************************/

.createAccountHead ,.createAccountBodyTop {
	font-weight:bold;
	margin-bottom:5px;
}

.createAccountBodyTopTitle {
	float:left;
	font-weight:bold;
}

.createAccountBodyBottomRightL ,.createAccountBodyBottomLeft {
	float:left;
}

.createAccountBodyBottomRight {
	margin-left:120px;
}

.createAccountFooter {
	text-align:right;
}

.createAccountBodyOutline {
	margin-bottom:10px;
	background: #f1f1f1;
	border-color: #cccccc;
	border-style: solid;
	border-width: 1px;
	padding:5px;
}

.createAccountBodyTopMust {
	margin-left:50%;
	text-align:right;
	color:#ff0000;
	font-size:9px;
}

.createAccountBodyBottom {
	margin-bottom:5px;
}


/*************************************************/
/* checkoutSuccess *******************************/
/*************************************************/


.bestellung-fertig{
	width: 98%;
}





/*************************************************/
/* Rückgabe, Reklamation *************************/
/*************************************************/


#rueckgabeformular{
	text-align: center; 
	border-bottom: 1px solid #98002b; 
	margin-bottom: 15px;
	height: 30px;
}

/*##########################################################
**######        Formatierung Fussbereich         ##########
**##########################################################
*/


#footer { 
	clear:both;
	margin:0; 
	padding: 1em;
	border-color: #aaa;
	text-align:center;
	background:#163A62;
	color:#fff;
}	

.copyright {
	display:none;
	text-align:center;
	font-size:10px;
	padding-bottom:10px;
}