
/* >>> ALLGEMEINE DEFINITIONEN <<< */

body {
font-family: 		Calibri, sans-serif, MS Sans Serif, Trebuchet MS;
line-height: 		20px;
font-size: 			14px;
letter-spacing:		-0.2px;
overflow: 			hidden;
position: 			relative;
}

html, body {
overflow-x: 		hidden;
overflow-y: 		scroll;
margin: 			0;
padding: 			0;
}

/* - Hintergrundbild - */

#bgImg { 
position:			fixed;
top: 				0;
left: 				0;
border: 			0;
z-index: 			1;
}

/* - Ausrichtung - */

.position {
width:				1300px;
margin:				auto;
position: 			relative;
z-index:			2;
}


/* >>> TEXTFORMATIERUNG <<< */

/* - Überschriften h1 bis h3 - */

h1 {
font-size: 			30px;
font-weight: 		lighter;
letter-spacing:		-0.5px;
color: 				#F79000;
text-transform: 	uppercase;  
padding-bottom: 	20px;
margin-top: 		15px;
}

h2 {
font-size: 			18px;
font-weight: 		lighter; 
letter-spacing:		-0.5px;
color: 				#F79000; 
text-transform: 	uppercase;
padding-top: 		15px; 
padding-bottom: 	5px; 
}

h3 {
font-size:			16px;
font-weight: 		lighter;
letter-spacing:		-0.5px; 
color: 				#F79000; 
text-transform:		uppercase;
}

/* - Textformatierung - */

.text {
color: 				#666666; 
line-height: 		20px; 
margin:				0; 
padding:			3px 10px;
}

/* - Textlinkfarbe beim Überfahren mit der Maus - */

a:hover {
color:				#F79000;
}

/* -  - */

.content a {
text-decoration: 	none; 
color:				#F79000; 
border-bottom:		1px dotted #F79000; 
text-transform:		uppercase;
}

/* - Aufzählungsformatierung - */

ul {
padding:			0px; 
margin-left: 		8px;
}

li { 
list-style-image:	url(/images/yellow-dot.jpg);
color: 				#6C6C6C;
margin-left:		18px;
}

li a {
text-decoration: 	none;
color: 				#6C6C6C;
border-bottom: 		1px dotted #6C6C6C;
margin:				3px 0;
display: 			inline-block;
}


/* >>> SEITENKOPF-MENÜ <<< */

#uppermenu {
position:					absolute;
left: 						0;
top: 						0px;
margin-left:				6px;
text-transform:				uppercase;
background-color: 			#000000; 
border-bottom-left-radius: 	30px;
border-bottom-right-radius: 30px;
opacity:					0.5;
filter: 					alpha(opacity=50);
-moz-opacity:				0.5;
background-repeat:			no-repeat;
height:						30px;
width:						500px;
display: 					block;
float: 						left;
line-height:				29px;
text-align:					center;
text-decoration:			none;
color:						#FFFFFF;
font-size:					11px;
letter-spacing:				0.1em;
}

/* - Formatierung des Textes - */

.uppermenu_1 {
font-size:			11px;
color:				#FFFFFF;
text-decoration:	none;
letter-spacing:		0.1em;
opacity:			1.0;
filter: 			alpha(opacity=100);
-moz-opacity:		1.0;
}


/* >>> HAUPTMENÜ <<< */

/* - Höhe, Breite und Positionierung - */

#sidebar {
position:			fixed;
z-index:			99;
top:				100px;
width:				250px;
left: 				-180px;
}

/* - Texthintergrund - */

#sidebar .text {
position:			absolute;
min-height:			160px;
height:				436px;
width:				170px;
background-color: 			#FFFFFF; 
border-top-right-radius: 	15px;
border-bottom-right-radius:	15px;
}

#sidebar .text a {
display:			block;
}

/* - Formatierung der Linien der 1. Auswahlebene - */

#sidebar .level_1 {
display: 			block;
border-top:			1px #D1D1D1 solid;
margin:				0 5px 0 5px;
text-transform: 	uppercase;
text-decoration:	none;
}

#sidebar .level_1.first {
border-top:			none;
margin-top:			25px;
text-decoration:	none;
}
/* - Formatierung des Textes der 1. Auswahlebene - */

.sidebar_1 {
color:				#6C6C6C;
font-size:			13px;
line-height:		18px;
margin: 			10px 0px 8px 0px;
font-weight: 		bold;
letter-spacing:		1px;
text-decoration:	none;
}

/* - Formatierung des Textes der 1. Auswahlebene beim Auswählen und Überfahren mit der Maus - */

.sidebar_1:hover, .sidebar_1.active  {
color:				#F79000;
letter-spacing:		1px;
}

/* - Linie vor der 2. Auswahlebene - */

#sidebar .level_2 {
display: 			block;
margin:				0 5px 0 5px;
text-decoration:	none;
}

/* - Linienfarbe der Linie vor der 2. Auswahlebene - */

#sidebar .level_2.first {
 border-top:		1px #D1D1D1 solid;
}
/* - Formatierung des Textes der 2. Auswahlebene - */

#sidebar .sidebar_2 {
color:				#6C6C6C;
font-size:			12px;
line-height:		20px;
padding: 			3px 0px 3px 0px;
letter-spacing:		0.5px;
text-decoration:	none;
}

/* - Formatierung des Textes der 2. Auswahlebene beim Überfahren mit der Maus - */

#sidebar .sidebar_2:hover {
color:				#F79000;
}

/* - 2. Auswahlebene bei Auswahl - */

.sidebar_2.active {
border:				none;
}

/* - Schalter zum Öffnen des Hauptmenüs - */

#sidebar .button {
position:			absolute;
right:				0px;
top:				200px; 
background-image:	url(/images/sidebar_button.png); 
background-repeat:	no-repeat;
height:				60px;
width:				60px;
cursor:				pointer;
}

/* - Schalter zum Schließen des Hauptmenüs - */

#sidebar .button.active {
background-image:	url(/images/sidebar_button_active.png); 
}


/* >>> ARTIKEL <<< */

/* - Abstand des Artikeltextes vom Seitenkopf - */

#content {
margin:				100px 0 0 0;
}

/* - Brotkrumennavigationsweite - */

#content .position {
width:				750px;
padding:			0 0 0 110px;
}

/* - - */

#content .content {
padding:			0 0px;
float: 				left;
width:				750px;
padding-bottom: 	20px;
background-color:	#FFFFFF;
background-position:right;
}

/* - Artikelkopf-Rahmen - */

#content .middle {
background-color: 			#FFFFFF; 
border-top-left-radius: 	30px;
border-top-right-radius: 	30px;
height:						20px;
background-position:		right;
width:						750px;
}

/* - Artikelfuß-Rahmen - */

#content .foot {
background-color: 			#FFFFFF; 
border-bottom-left-radius: 	30px;
border-bottom-right-radius: 30px;
height:						50px;
clear:						both;
background-position:		right;
}

/* - Artikeltextbreite - */

#content .content .text {
width:				480px;
float: 				left;
padding-left: 		60px;
}

/* - Artikeltextbreite Vergleiche - */
#content .content .text_vgl {
color: 				#666666; 
line-height: 		20px; 
margin:				0; 
padding:			3px 10px;
width:				680px;
float: 				left;
padding-left: 		40px;
}


/* >>> DIREKTNAVIGATION INNERHALB DES ARTIKELS <<< */

/* - Oberer Rahmen der Direktnavigation - */

#content .content .directnavi .middle {
background-color: 			#F58B00; 
border-top-left-radius: 	15px;
border-top-right-radius:	0px;
height:						15px;
background-position:		0;
width: 						180px;
}

/* - Unterer Rahmen der Direktnavigation - */

#content .content .directnavi .foot {
background-color: 			#F58B00; 
border-bottom-left-radius: 	15px;
border-bottom-right-radius: 0px;
height:						15px;
background-position:		0;
width: 						180px;
}

/* - Position des Textes - */

#content .content .right{
width: 				165px;
padding: 			0;
float: 				right;
margin-top: 		51px;
padding-right:		15px;
}

#content .content .right .text {
padding-left: 		10px;
width: 				auto;
float: 				none;
}

/* - Formatierung des Textes - */

#content .content .directnavi .sidebar_2 {
display:			block;
border-bottom:		1px #f7c57f solid;
font-size:			14px;
line-height:		19px;
letter-spacing: 	0.5px;
padding: 			6px 0;
text-decoration: 	none;
color:				#FFFFFF;
}

/* - Formatierung des Textes beim Überfahren mit der Maus - */

#content .content .directnavi .sidebar_2:hover {
color:				#f58b00;
}

/* - Hintergrundfarbe und Breite - */

.directnavi_content{
width: 				180px;
background-color: 	#f58b00;
}

/* - - */

.directnavi_1 {
display: 			block;
text-align: 		right;
padding:			0px 10px 0px 10px;
}

/* - Linienbreite - */

.directnavi .directnavi_1 a {
width: 				160px;
text-transform: 	uppercase;
}

/* - Verhalten beim Überfahren mit der Maus - */

.directnavi .directnavi_1:hover  {
background-color: 	#FFFFFF;
}

/* >>> SOCIAL PLUGINS <<< */

#content .content .right{
width: 				165px;
margin-top: 		80px;
}

/* >>> BROTKRUMENNAVIGATION <<< */

.breadcrumb{
padding:			12px 0 5px 64px;
color: 				#6C6C6C;
text-transform:		uppercase;
font-size:			11px;
letter-spacing:		1px;
background-color:	#FFFFFF; 
background-repeat:	repeat-y;
background-position:right;  
}

.breadcrumb a{
color: 				#6C6C6C;
text-decoration:	none;
line-height:		120%;
}


/* >>> NOTE-BOX <<< */

/* - Position und Ebene der Box - */

#note {
position:			fixed;
z-index:			99;
top:				300px;
right:				-235px;
width:				300px;
}

/* - Schalter zum Öffnen und Schließen der Box - */

#note .button {
position:			absolute;
left:				2px;
top:				205px;
background-image:	url(/images/note_button.png); 
background-repeat:	no-repeat;
height:				65px;
width:				65px;
cursor:				pointer;
}

/* - Schalter zum Schließen der Box - */

#note .button.active {
background-image:	url(/images/note_button_active.png); 
}

/* - Hintergrundbild und Formatierung des Textes der Box - */

#note .text {
position:					absolute;
right:						0;
width:						194px;
height:						230px;
background-color: 			#FFFFFF; 
border-top-left-radius: 	15px;
border-top-right-radius:	0px;
padding: 					20px;
color:						#666666;
}

/* - Formatierung der Überschrift in der Box - */

#note .notetext {
font-size:			22px;  
color:				#F79000;
}

/* - Formatierung des Textlink in der Box - */

#note .text a {
color:				#666666;
text-decoration:	none;
}

#note .notetextlink {
font-size:			21px;
padding-top:		30px;
}

/* - Formatierung des Textlink beim Überfahren mit der Maus - */

#note .text a:hover {
color:				#F79000;
}


/* >>> ANZEIGENFENSTER UNTEN <<< */

/* - Position - */

#info {
position:			fixed;
bottom:				40px;
width:				100%;
}

/* - Ausrichtung von links, -breite und -höhe; Hintergrund - */

#info .style {
margin:				auto; 
margin-left:		50px; 
width:				210px;
height:				210px; 
padding:			10px;
float:				left;
background-color:	#000;
opacity:			0.6;
filter: 			alpha(opacity=60);
-moz-opacity:		0.6;
position:relative; z-index:1;
}

#info .anzeige {
width:				210px;
height:				210px; 
float:				left;
left:				55px;
top:				5px;
position:			absolute; 
z-index:			2;
}

#info .style_amazon {
margin:				auto; 
margin-left:		80px; 
width:				130px;
height:				250px; 
padding:			10px;
float:				left;
background-color:	#000;
opacity:			0.6;
filter: 			alpha(opacity=60);
-moz-opacity:		0.6;
position:relative; z-index:1;
}

#info .anzeige_amazon {
width:				130px;
height:				250px; 
float:				left;
left:				85px;
top:				5px;
position:			absolute; 
z-index:			2;
}



/* >>> FUßZEILE <<< */

/* - Position, -ebene, -höhe und Hintergrund - */

#footer {
position:			fixed;
z-index: 			100;
bottom:				0;
height:				30px;
line-height:		30px;
width:				100%;
background-color:	#000000;
opacity:			0.5;
filter: 			alpha(opacity=50);
-moz-opacity:		0.5;
}

/* - Ebene und Textfarbe - */

#footer .position {
z-index:			100;
color:				#6C6C6C;
}

/* - Text - */

.footermenu {
font-size:			11px;
color:				#6C6C6C;
line-height:		90%;
text-transform: 	uppercase;
letter-spacing:		1px;
text-decoration:	none;
padding: 			0;
}

.footermenu:hover {
color:				#FFFFFF;
}
