@charset "utf-8";
/* -------- neutralize browser styles -------- */
body, html{
	margin: 0px;
	padding: 0px;
	margin-bottom: 5px;
}
/* -------- main CONTAINER div called 'wrapper' -------- */
#wrapper {
	margin: 0px;
	padding: 0px;
	height: auto;
	width: 960px;
	margin-right: auto;
	margin-left: auto;
}

/* -------- main HEADER div called 'header' -------- */
#wrapper #header{
	padding-top: 5px;
}
#wrapper #header #header_bg{
	background-repeat: no-repeat;
	background-position: center center;
	float: left;
	height: 138px;
	width: 960px;
	margin-bottom: 5px;
}
/* -------- main TOP navigation menue -------- */

#wrapper #header #nav_bar{
	border-color:#000000;
	border-top:solid;
	border-top-width: 1px;
	border-bottom:solid;
	border-bottom-width: 1px;
	clear: both;
	/* in case we wanna put in a bg - use this below */
	/*background-image: url(../images/nav_bar.jpg);
	background-repeat: no-repeat;
	background-position: center center;*/
	height: 30px;
	width: auto;
}

#wrapper #header #nav_bar #sections ul{
	padding: 0px;
	list-style: none;
	float: left;
	margin-top: 0px;
	margin-bottom: 0px;	
	color: #eaeaea;
	margin-left: 75px;
	margin-right: 40px;
}
#wrapper #header #nav_bar #sections li{
	float: left;
	color: #eaeaea;
	padding-right: 28px;
	padding-left: 28px;
	/* here we add 17px to the top to also push down the pipe separator, in the next rule we add further padding for the text */
	padding-top: 5px;
	/* the next two style rules style the PIPES as the links get styled by the next CSS rules */
	font-size: 18px;
	font-weight: normal;
}

/* Important: */
/* u have to style the links in THIS order: link, visited, hover, active otherwise they might override each other love-hate */

#wrapper #header #nav_bar #sections li a:link, #wrapper #header #nav_bar #sections li a:visited{	
	display: block; /* this allows the entire width of the element to trigger the link, this helps out especially for IE problems */
	font-family: Verdana, Arial, Helvetica, sans-serif;	
	color: #5b5b5b;
	/* here we add another 3 px of padding for the text as we already inherited 17 px padding from the rule above  altogether now we have 20 px from top*/
	padding-top:4px;
	font-size: 11px;
	font-style: normal;
	font-weight: bold;
	text-decoration: none;
}

#wrapper #header #nav_bar #sections li a:hover, #wrapper #header #nav_bar #sections li a:active{
	color: #CC9900;
}

/* here we create a CLASS selector (.current) for the CURRENT section viewed by the user, we have to group this section together with the active & hover behavior so that the CURRENT state will not be overridden by the above rules */
#wrapper #header #nav_bar #sections li a.current, #wrapper #header #nav_bar #sections li a.current:hover, #wrapper #header #nav_bar #sections li a.current:active{
	color: #CC9900;
	/*cursor: default;*/
}

/* -------- main content -------- */

#main_content{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #000000;
	padding-left: 20px;
	padding-right: 20px;
	text-align: justify;
}

/* this rule styles the general links */
#wrapper #main #main_middle #main_content a{
	font-weight: bold;
	color: #CC9900;
	text-decoration: none;
}

#wrapper #main #main_middle #main_content h1{
	margin-top: 0px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 18px;
	font-style: normal;
	font-weight: bold;
	color: #CC6600;
}
#wrapper #main #main_middle #main_content h2{
	margin-top: 0px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 14px;
	font-style: normal;
	font-weight: bold;
	color: #7F3F00;	
}
.breadcrumb{
	font-size: 8px;
	color: #bbbbbb;
}

img{
    border: 0;
}


/* -------- footer -------- */

#wrapper #footer{
	border-color:#000000;
	border-top:solid;
	border-top-width: 1px;
	border-bottom:solid;
	border-bottom-width: 1px;
	/* the image is 57 pixels high - with the 10 pixels margin we space out more from the main div */
	margin-top: 0px;
	height: 30px;
	width: auto;
	clear: both;
    margin-bottom: 20px;

}

#wrapper #footer #footer_info ul{
	padding: 0px;
	list-style: none;
	float: left;
	margin-top: 0px;
	margin-left: 50px;
	margin-right: 50px;
	margin-bottom: 0px;	
	color: #eaeaea;
	float: left;
}
#wrapper #footer #footer_info li{
	float: left;
	color: #5b5b5b;
	/* here we add 17px to the top to also push down the pipe separator, in the next rule we add further padding for the text */
	padding-top: 9px;
	padding-left: 18px;
	padding-right: 18px;
	font-family: Verdana, Arial, Helvetica, sans-serif;	
	font-size: 11px;
	font-style: normal;
	font-weight: bold;
}
/* u have to style the links in THIS order: link, visited, hover, active otherwise they might override each other love-hate */
#wrapper #footer #footer_info li a:link, #wrapper #footer #footer_info li a:visited{	
	display: block; /* this allows the entire width of the element to trigger the link, this helps out especially for IE problems */
	text-decoration: none;
	color: #5b5b5b;
}

#wrapper #footer #footer_info li a:hover, #wrapper #footer #footer_info li a:active{
	color: #CC9900;
}

/* here we create a CLASS selector (.current) for the CURRENT section viewed by the user, we have to group this section together with the active & hover behavior so that the CURRENT state will not be overridden by the above rules */
#wrapper #footer #footer_info li a.current, #wrapper #footer #footer_info li a.current:hover, #wrapper #footer #footer_info li a.current:active{
	color: #CC9900;
	/*cursor: default;*/
}


/* -------- other styles -------- */

.error{
	font-weight: bold;
	color: #FF3300;
}
.red{
	font-weight: bold;
	color: #D40000;
}
.blue{
	font-weight: bold;
	color: #007FAA;
}
.faq{
	font-weight: bold;
	color: #CC9900;
}
/* styles the price in the item overview */
.orange_1{
	color: #e35c00;
}
/* styles the price in detailed view */
.orange_2{
	color: #e35c00;
	font-weight: bold;
}
.neutral_link{
	font-weight: normal;
	color: #000000;
	text-decoration: none;
}