@charset "utf-8";

/*Deklaration Layout Elemente*/
.Small, .Medium, .Large { float:left; overflow:hidden; }
.Small { width:340px; }
.Medium { width:680px; }
.Large { width: 1020px; }


/*Deklaration der kleinen Boxen, die eine Spalte mit 340px abdeckne*/
.Small_Top_Border, .Small_Mid_Border, .Small_Bot_Border { width:340px; }
.Small_Top_Border { background-image:url(../Images/Layout/Box_Small_Border/Top.png); }
.Small_Mid_Border { background-image:url(../Images/Layout/Box_Small_Border/Mid.png); overflow:hidden; }
.Small_Bot_Border { background-image:url(../Images/Layout/Box_Small_Border/Bot.png); }

.Small_Top_Filled, .Small_Mid_Filled, .Small_Bot_Filled { width:340px; }
.Small_Top_Filled { background-image:url(../Images/Layout/Box_Small_Filled/Top.png); }
.Small_Mid_Filled { background-image:url(../Images/Layout/Box_Small_Filled/Mid.png); overflow:hidden; }
.Small_Bot_Filled { background-image:url(../Images/Layout/Box_Small_Filled/Bot.png); }

.Small_Form { float:left; overflow:hidden; }
.Small_Form_Top_Filled, .Small_Form_Mid_Filled, .Small_Form_Bot_Filled { width:340px; }
.Small_Form_Top_Filled { background-image:url(../Images/Layout/Formulare/Top_Form.png); }
.Small_Form_Mid_Filled { background-image:url(../Images/Layout/Formulare/Mid_Form.png); overflow:hidden; }
.Small_Form_Bot_Filled { background-image:url(../Images/Layout/Formulare/Bot_Form.png); }

.Small_Top_Border_Filled, .Small_Mid_Border_Filled, .Small_Bot_Border_Filled { width:340px; }
.Small_Top_Border_Filled { background-image:url(../Images/Layout/Box_Small_Border_Filled/Top.png); }
.Small_Mid_Border_Filled { background-image:url(../Images/Layout/Box_Small_Border_Filled/Mid.png); overflow:hidden; }
.Small_Bot_Border_Filled { background-image:url(../Images/Layout/Box_Small_Border_Filled/Bot.png); }

/*Deklaration der mittleren Boxen, die zwei Spalten zu 640px füllen*/
.Medium_Top_Border, .Medium_Mid_Border, .Medium_Bot_Border { width:680px; }
.Medium_Top_Border { background-image:url(../Images/Layout/Box_Medium_Border/Top.png); }
.Medium_Mid_Border { background-image:url(../Images/Layout/Box_Medium_Border/Mid.png); overflow:hidden; }
.Medium_Bot_Border { background-image:url(../Images/Layout/Box_Medium_Border/Bot.png); }

.Medium_Top_Filled, .Medium_Mid_Filled, .Medium_Bot_Filled { width:680px; }
.Medium_Top_Filled { background-image:url(../Images/Layout/Box_Medium_Filled/Top.png); }
.Medium_Mid_Filled { background-image:url(../Images/Layout/Box_Medium_Filled/Mid.png); overflow:hidden; }
.Medium_Bot_Filled { background-image:url(../Images/Layout/Box_Medium_Filled/Bot.png); }

.Medium_Top_Border_Filled, .Medium_Mid_Border_Filled, .Medium_Bot_Border_Filled { width:680px; }
.Medium_Top_Border_Filled { background-image:url(../Images/Layout/Box_Medium_Border_Filled/Top.png); }
.Medium_Mid_Border_Filled { background-image:url(../Images/Layout/Box_Medium_Border_Filled/Mid.png); overflow:hidden; }
.Medium_Bot_Border_Filled { background-image:url(../Images/Layout/Box_Medium_Border_Filled/Bot.png); }

/*Deklaration der großen Boxen, die drei Spalten zu 1020px füllen*/
.Large_Top_Border, .Large_Mid_Border, .Large_Bot_Border { width:1020px; }
.Large_Top_Border { background-image:url(../Images/Layout/Box_Large_Border/Top.png); }
.Large_Mid_Border { background-image:url(../Images/Layout/Box_Large_Border/Mid.png); overflow:hidden; }
.Large_Bot_Border { background-image:url(../Images/Layout/Box_Large_Border/Bot.png); }

.Large_Top_Filled, .Large_Mid_Filled, .Large_Bot_Filled { width:1020px; }
.Large_Top_Filled { background-image:url(../Images/Layout/Box_Large_Filled/Top.png); }
.Large_Mid_Filled { background-image:url(../Images/Layout/Box_Large_Filled/Mid.png); overflow:hidden; }
.Large_Bot_Filled { background-image:url(../Images/Layout/Box_Large_Filled/Bot.png); }

.Large_Top_Border_Filled, .Large_Mid_Border_Filled, .Large_Bot_Border_Filled { width:1020px; }
.Large_Top_Border_Filled { background-image:url(../Images/Layout/Box_Large_Border_Filled/Top.png); }
.Large_Mid_Border_Filled { background-image:url(../Images/Layout/Box_Large_Border_Filled/Mid.png); overflow:hidden; }
.Large_Bot_Border_Filled { background-image:url(../Images/Layout/Box_Large_Border_Filled/Bot.png); }

/*Überschriften*/
.Headline_Large_Red, .Headline_Large_Green, .Headline_Large_Blue{ width: 960px; height:30px; background-repeat:no-repeat; }
.Headline_Medium_Red, .Headline_Medium_Green, .Headline_Medium_Blue{ width: 620px; height:30px; background-repeat:no-repeat; }
.Headline_Small_Red, .Headline_Small_Green, .Headline_Small_Blue{ width:280px; height:30px; background-repeat:no-repeat; }

.Headline_Small_Red { background-image:url(../Images/Layout/Headlines/Headline_Small_red.png); }
.Headline_Small_Blue { background-image:url(../Images/Layout/Headlines/Headline_Small_blue.png); }
.Headline_Small_Green { background-image:url(../Images/Layout/Headlines/Headline_Small_green.png); }

.Headline_Medium_Red { background-image:url(../Images/Layout/Headlines/Headline_Medium_red.png); }
.Headline_Medium_Blue { background-image:url(../Images/Layout/Headlines/Headline_Medium_blue.png); }
.Headline_Medium_Green { background-image:url(../Images/Layout/Headlines/Headline_Medium_green.png); }

.Headline_Large_Red { background-image:url(../Images/Layout/Headlines/Headline_Large_red.png); }
.Headline_Large_Blue { background-image:url(../Images/Layout/Headlines/Headline_Large_blue.png); }
.Headline_Large_Green { background-image:url(../Images/Layout/Headlines/Headline_Large_green.png); }

/*
	Die folgenden Klassen sind Container Elemente. Diese werden an verschiedenen Stellen für die Tab Navigation
	verwendet. Die Container werden dort mittels MArgin durch den sichtbaren Bereich der Webseite geschoben.
*/
.Margin_Container_Category_QuickView, .Margin_Container_Category_VNav, .Margin_Container_Left_Content,
.Margin_Container_Side_Content, .Margin_Container_Bottom_Content{ float:left; }

.Margin_Container_Category_QuickView { width: 1020px; height:500px; margin: 0px 0px 0px 0px; }
.Margin_Container_Category_QuickView_Product { width: 1020px; height:500px; margin: 0px 0px 0px 0px; float: left; }

.Margin_Container_Category_VNav { height: 500px; margin: 0px 0px 0px 0px; }

.Margin_Container_Left_Content { width: 680px; height:500px; margin: 0px 0px 0px 0px; }
.Margin_Container_Side_Content { width: 340px; height:500px; margin: 0px 0px 0px 0px; }
.Margin_Container_Bottom_Content { width: 1020px; height:500px; margin: 0px 0px 0px 0px; }

/*
	Formatierung von Inhalteebenen in Zeilen und Spalten. Die genaue
	Ausrichtung der eingefügten Elemente muss über die Text Padding Klassen gesteuert
	werden.
*/ 
.Content_Row { width: auto; height: auto;  }
.Content_Col { width: 300px; height: auto; float:left; }
.Content_Info_Text { padding: 10px 50px 10px 50px; }

/*Bullets*/
.Bullet_Green { background-image:url(../Images/Layout/Bullet_Green.png); width: 20px; height: 20px; float:left; margin: -2px 5px 0px 0px; }
.Bullet_Row_Small { width: 300px; height: auto; margin: 0px 0px 10px 0px; }
.Bullet_Row_Medium { width: 600px; height: auto; margin: 0px 0px 5px 0px; }
.Bullet_Text { text-align:justify; padding: 5px 20px 5px 20px; }