/*

Vorläufiges Shop-Layout ...
By Gunnar Tillmann
http://www.gunnart.de

*/

/*<agl.folder "Allgemein">*/
.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}

.clearfix { display: inline-block; }

/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */

hr { display: none }
hr.Break { display: block; visibility: hidden; } 

.Break { float: none; clear: both; }
.Left { float: left }
.Right { float: Right }

body { color: #444; font-size: 12px; background-color: #fff; background-image: url("images/BG_Body.gif"); background-repeat: repeat-x; background-position: 0 0; text-align: center; margin: 0; padding: 0 }
body * { font-family: Arial, Helvetica, sans-serif }

img, a img { border: none; }
a { color: #c13; text-decoration: none }
a:hover { text-decoration: underline }
h1, h2, h3, h4, h5, h6 { }
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { }
h1 small, h2 small, h3 small, h4 small, h5 small, h6 small { }
p, h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: 0; padding-top: 0.6em; padding-bottom: 0.3em }
ul, ol { margin-top: 0; margin-bottom: 0; padding-top: 0.3em; padding-bottom: 0.3em }
li { margin-top: 0; margin-bottom: 0 }
form, input, textarea, select { font-size: 12px }
form { margin: 0; padding: 0; }
p, table, td, th, caption, li { }
p small { font-size: 10px }
h1 { color: #c13; font-size: 24px; font-weight: normal }
h2 { color: #c13; font-size: 20px; font-weight: normal }
h3 { color: #c13; font-size: 20px; font-weight: normal }
h4 { color: #c13; font-size: 16px; font-weight: normal }
h5 { color: #c13; font-size: 16px; font-weight: normal }
h6 { color: #c13; font-size: 16px; font-weight: normal }

p, ul, ol, table, form, input, textarea, select, h1, h2, h3, h4, h5, h6 { line-height: 124% }

.cAlign { text-align: center }
.rAlign { text-align: right }
.lAlign { text-align: left }

.italic { font-style: italic }
/*</agl.folder>*/



/*<agl.folder "MainCols & MainContent">*/
#MainWrap { background-color: #fff; text-align: center; margin: 30px auto 0; padding: 150px 0 10px; position: relative; z-index: 10; width: 780px; float: none; clear: both; overflow: visible }
#MainContent { text-align: left; padding: 20px 20px 50px; overflow: hidden }
#MainContent .Half { width: 360px; }

#Shadow { background-image: url("images/BG_Shadow.gif"); background-repeat: no-repeat; background-position: 50% 20px; position: absolute; top: 0; left: 0; width: 100%; height: 220px }
/*</agl.folder>*/



/*<agl.folder "Logo">*/
#Logo a, #Logo span, #Logo { display: block; position: absolute; width: 197px; height: 61px; overflow: hidden }
#Logo { color: #c13; line-height: 40px; text-align: center; text-transform: uppercase; margin: 0; padding: 0; top: 30px; left: 20px }
#Logo br { display: none }
#Logo small { color: #fff; font-size: 12px; line-height: 15px; background-color: #c13; display: block; position: absolute; bottom: 0; left: 0; width: 197px; height: 15px }
#Logo a { top: 0; left: 0 }
#Logo span { background-image: url("images/HandelsagenturHaircompanyProfessional.gif"); background-repeat: no-repeat; background-position: 0 0; cursor: pointer; top: 0; left: 0 }
/*</agl.folder>*/

/*<agl.folder "ShopFunctions (Anmelden, Ihr Konto etc.)">*/
#ShopFunctions { line-height: 30px; list-style-type: none; margin: 0; padding: 0; position: absolute; top: -30px; right: 10px; height: 30px }
#ShopFunctions li { list-style-type: none; display: inline; margin: 0; padding: 0 }
#ShopFunctions a { color: #444; font-weight: bold; /*background-color: #ddd;*/ background-repeat: no-repeat; background-position: 0 50%; margin-right: 2px; padding-right: 10px }
#ShopFunctions a:hover { color: #000 }
#ShopFunctions .Current,
#ShopFunctions .Current:hover { color: #c13 }

#ShopFunctions .LogIn a { background-image: url("images/IconLogIn_Grey.gif"); padding-left: 10px }
#ShopFunctions .LogIn a:hover { background-image: url("images/IconLogIn_Black.gif"); }
#ShopFunctions .LogIn .Current:hover,
#ShopFunctions .LogIn .Current { background-image: url("images/IconLogIn_Red.gif"); }

#ShopFunctions .LogOff a { background-image: url("images/IconLogOff_Grey.gif"); padding-left: 10px }
#ShopFunctions .LogOff a:hover { background-image: url("images/IconLogOff_Black.gif"); }
#ShopFunctions .LogOff .Current:hover,
#ShopFunctions .LogOff .Current { background-image: url("images/IconLogOff_Red.gif"); }

#ShopFunctions .Account a { background-image: url("images/IconEdit_Grey.gif"); padding-left: 13px }
#ShopFunctions .Account a:hover { background-image: url("images/IconEdit_Black.gif"); }
#ShopFunctions .Account .Current:hover,
#ShopFunctions .Account .Current { background-image: url("images/IconEdit_Red.gif"); }

#ShopFunctions .Cart a { background-image: url("images/IconCart_Grey.gif"); padding-left: 16px }
#ShopFunctions .Cart a:hover { background-image: url("images/IconCart_Black.gif"); }
#ShopFunctions .Cart .Current:hover,
#ShopFunctions .Cart .Current { background-image: url("images/IconCart_Red.gif"); }
#ShopFunctions .Cart a em { font-weight: normal; font-style: normal }

#ShopFunctions .CheckOut a { background-image: url("images/IconCheckOut_Grey.gif"); padding-left: 12px }
#ShopFunctions .CheckOut a:hover { background-image: url("images/IconCheckOut_Black.gif"); }
#ShopFunctions .CheckOut .Current:hover,
#ShopFunctions .CheckOut .Current { background-image: url("images/IconCheckOut_Red.gif"); }
/*</agl.folder>*/

/*<agl.folder "Search">*/
#Search { text-align: left; margin: 0; padding: 0; position: absolute; top: -27px; left: 10px; float: left }
#Search p { line-height: 25px; margin: 0; padding: 0; height: 25px; float: left }
#Search * { vertical-align: middle }
#Search input { line-height: normal; text-align: center }
#Search .Term { }
#Search .Go { margin-left: 5px }
/*</agl.folder>*/

/*<agl.folder "BoxCart (MouseOver Warenkorb)">*/
#BoxCart { background-color: #fff; display: none; margin: 0; padding: 0 10px; position: absolute; top: 35px; right: -5px; border: solid 3px #c13 }
#BoxCart h4 { font-size: 14px }
#ShopFunctions .Cart #BoxCart a { font-weight: normal; background-color: transparent; margin: 0; background-image: none; padding: 0 }
#BoxCart p.rAlign { border-top: 1px solid #444 }
li:hover #BoxCart { display: block }
/*</agl.folder>*/

/*<agl.folder "BoxAdmin">*/
#BoxAdmin { padding: 5px; position: absolute; top: 5px; right: 5px; border: solid 1px #c13 }
/*</agl.folder>*/



/*<agl.folder "CatNavi">*/
#CatNavi { margin: 0; padding: 0; position: absolute; top: 120px; left: 0; width: 780px; border-bottom: 3px solid #c13 }
#CatNavi li { list-style-type: none; margin: 0; padding: 0; position: relative; left: 10px; float: left }
#CatNavi a { color: #444; line-height: 25px; text-align: center; display: block; margin: 0; padding: 0 10px; height: 25px; float: left }
#CatNavi a:hover { color: #fff; background-color: #c13 }
#CatNavi .CurrentParent, 
#CatNavi .Current { color: #fff; background-color: #c13 }
#CatNavi ul { background-color: #fff; display: none; margin: 0; padding: 0; position: absolute; z-index: 1; top: 25px; left: 0; width: 150px; float: none; clear: both; border-top: 3px solid #c13 }
#CatNavi .CatLevel1:hover ul { display: block; }
#CatNavi .CatLevel1:hover ul:hover { display: block; }
#CatNavi ul li { display: inline; left: 0 }
#CatNavi ul a { line-height: normal; text-align: left; margin: 0; padding: 0 0; width: 150px; height: auto; float: none; clear: both }
#CatNavi ul span { display: block; margin: 0; padding: 3px 10px 3px 0; float: none; clear: both; border-style: none solid solid; border-width: medium 1px 1px; border-color: #c13 #c13 }
#CatNavi ul ul { position: relative; top: 0; border-style: none }
#CatNavi .CatLevel2 span { padding-left: 10px; }
#CatNavi .CatLevel3 span { padding-left: 20px; }
#CatNavi .CatLevel4 span { padding-left: 30px; }
#CatNavi .CatLevel5 span { padding-left: 40px; }
/*</agl.folder>*/

/*<agl.folder "ContentNavi (Nicht in Gebrauch)">*/
#ContentNavi { line-height: 30px; list-style-type: none; margin: 0; padding: 0; position: absolute; top: -30px; left: 10px; height: 30px }
#ContentNavi li { list-style-type: none; display: inline; margin: 0; padding: 0 }
#ContentNavi a { color: #444; padding-right: 10px; padding-left: 10px }
#ContentNavi a:hover { color: #000 }
#ContentNavi .Current a { color: #c13 }
/*</agl.folder>*/



/*<agl.folder "MainFooter">*/
#MainFooter { color: #fff; line-height: 25px; background-color: #c13; padding: 0; width: 780px; height: 25px }
/*</agl.folder>*/

/*<agl.folder "ShopInfos (Impressum, AGB etc.)">*/
#ShopInfos {}
#ShopInfos a {}
#ShopInfos .Current { color: #c13; font-weight: bold }
/*</agl.folder>*/

/*<agl.folder "FooterBoxes (Nicht in Gebrauch)">*/
#FooterBoxes { background-image: url("images/BG_FooterBoxes_cc1133.gif"); background-repeat: repeat-y; background-position: 50% 0; margin-top: 20px; width: 780px; float: none; clear: both; overflow: hidden }
#FooterBoxes .Box { text-align: left; margin-right: 20px; position: relative; left: 20px; width: 170px; float: left; overflow: hidden }
/*</agl.folder>*/



/*<agl.folder "Produkt-Listen">*/
.ProdListing1 { }
.ProdListing1 .Item {}

.ProdListing2 { }
.ProdListing2 .Item { width: 360px; float: left }
.ProdListing2 div.Col2 { float: right }
.ProdListing2 .Image { text-align: center; width: 100px; float: left }
.ProdListing2 .Image a { display: block; border: solid 1px #ddd }
.ProdListing2 .Text { width: 250px; float: right }

.ProdListing3 { }
.ProdListing3 .Item { width: 230px; float: left; margin-right: 25px; }
.ProdListing3 div.Col1 { }
.ProdListing3 div.Col2 { }
.ProdListing3 div.Col3 { margin-right: 0px; float: right }
/*</agl.folder>*/

/*<agl.folder "Navigator, ButtonSet">*/
.Navigator,
.ButtonSet { margin-top: 10px; float: none; clear: both; border-top: 1px solid #ddd }
/*</agl.folder>*/



/*<agl.folder "Kategorien-Listen">*/
.CatListing { }
.CatListing .Item { text-align: center; width: 33.3%; float: left }
/*</agl.folder>*/


/*<agl.folder "ProduktInfo - Options-Auswahl">*/
table.AttributeTable { border-collapse: collapse; border-spacing: 0; width: 100% }
table.AttributeTable td { padding-right: 5px; border-collapse: collapse; border-spacing: 0; empty-cells: show }
table.AttributeTable .Attribute {}
table.AttributeTable .Attribute td { font-weight: bold; padding-top: 10px; border-bottom: 1px solid #444 }
table.AttributeTable .Option {}
table.AttributeTable .Option td { border-bottom: 1px solid #ddd }
table.AttributeTable td.toCart input { cursor: pointer; background-color: transparent; margin: 0; padding: 0; border-style: none }
/*</agl.folder>*/

/*<agl.folder "ProduktInfo - Bild-Auswahl">*/
.ImgData { display: none }
.ImgDataActive { height: 360px; overflow: hidden; border-bottom: 1px solid #ddd }
.ImgNavi { margin-top: 10px; width: 370px; float: none; clear: both; overflow: hidden }
.ImgNavi p { margin-right: 10px; padding: 0; width: 80px; height: 80px; float: left; overflow: hidden; border: solid 1px }
.ImgNavi .Img { cursor: pointer; border-color: #ddd }
.ImgNavi .ImgActive { border-color: #c13 }
/*</agl.folder>*/



/*<agl.folder "CheckOut, Adressbuch, Formulare">*/
#ProgressBar { float: none; clear: both; }
#ProgressBar span { background-color: #ddd; float: left; text-align: center; width: 25% }
#ProgressBar span.Current { color: #c13; }

.CheckOutFunction { padding-right: 10px; border-top: 1px solid #ddd; border-right: 1px solid #ddd }
.CheckOutFunction p {}
.onepxwidth { width: 1px }

.CheckOutFunction .Third { width: 33% }
.CheckOutFunction .TwoThird { width: 66% }

table.OrderTable { width: 100% }
table.FormArea { width: 100% }
table.FormArea .Label { width: 150px }

table.CheckOutSelection { width: 100%; border-collapse: collapse; border-spacing: 0 }
table.CheckOutSelection td { border-collapse: collapse; border-spacing: 0; empty-cells: show }
table.CheckOutSelection .OverLine td, 
.OverLine { border-top: 1px solid #eee }
.UnderLine { border-bottom: 1px solid #eee }

.CheckOutFunction .main { width: 100% }
.CheckOutFunction .MainAuto .main { width: auto; }
/*</agl.folder>*/




/*<agl.folder "OrderDetails - Warenkorb">*/
table.OrderDetails { width: 100%; border-collapse: collapse; border-spacing: 0 }
table.OrderDetails th {}
table.OrderDetails td { vertical-align: top; border-top: 1px solid #ddd; border-collapse: collapse; border-spacing: 0; empty-cells: show }
table.OrderDetails .Image { text-align: center }
table.OrderDetails .Qty { text-align: center }
table.OrderDetails .Margin { position: relative; top: 4px }
table.OrderDetails .Article { text-align: left }
table.OrderDetails .SinglePrice { text-align: right }
table.OrderDetails .Price { text-align: right }
table.OrderDetails .Delete { text-align: center }
table.OrderDetails table { border-collapse: collapse; border-spacing: 0 }
table.OrderDetails table td { border-collapse: collapse; border-spacing: 0; vertical-align: middle; border-top: none }

.alter {
	display: block;
	background-image: url(img/alter.gif);
	background-repeat: no-repeat;
	width: 13px;
	height: 13px;
	border: 0px;
	font-size: 0px;
	cursor: pointer;
}
/*</agl.folder>*/

.ErrorMessage { color: #c13; background-color: #fff; padding: 5px; border: solid 2px }
.ErrorMessage a { }