/* global margin reset */
* {
	margin: 0;
	padding: 0;
}

/* general html element rules */
html{
	height: 100%;
	background-color: #fff;
	background: url(../img/bg_main.jpg) top left repeat-x #fed404;
}

body{
	font: 0.625em Tahoma, Helvetica, sans-serif;
	text-align: center;	
	color: #333;
	background: url(../img/bg_main_bottom.jpg) bottom right repeat-x transparent;
	min-height: 100%;
}

img, fieldset, td, th, tr{
	border: none;
}

ul li{
	list-style-type: none;
}


ol li{
	margin: 0 0 2em 2.7em;
	font-size: 1em;
}

ol li li{
	font-size: 1em;
}


table{
	clear: both;
}
/* link trigger for pseudo classes */
a:link,
a:visited,
a:hover,
a:focus,
a:active{
	display: run-in;
	color: #000;
	text-decoration: none;
}

a:hover,
a:focus,
a:active{
	text-decoration: underline;
}

/* aural class, used only for the screen readers and bots */
body .aural{
	display: block;
	position:absolute;
	left: -5000px;
	width: 990px;
	overflow: hidden;
}

/* structural layout elements */

#logo{
	position:absolute;
	width: 60px;
	left: 15px;
	top: 24px;
	z-index: 20;
}



.wrapper {
	width: 100%;
	max-width: 1004px;
	text-align: left;	
	background: url(../img/bg_black_stripe.gif) top left repeat-y #fff;
	position: relative;
	margin: auto;
}

strong{
	font-weight: bold;
}




/* homepage - high resoltution */

#home{
	overflow: hidden;
}

#home body{
	height: 100%;	
	background-image: none;
}

#home body .wrapper{
	position:absolute;
	left: -5000px;
	width: 990px;
	overflow: hidden;
}


/* Footer Styles */

.footer, .push {
	height: 125px; /* .push must be the same height as .footer */
	clear: both;
}

.footer{
	position: absolute;
	bottom: 0px;
	width: 100%;
	height: 361px;	
	background: url(../img/bg_footer_left.jpg) bottom left no-repeat #fff;
}

.footerRight {
	position: absolute;
	bottom: 0px;
	right: 0;
	width: 251px;
	height: 312px;	
	background: url(../img/bg_footer_right.jpg) bottom left no-repeat transparent;
}

.wrapper #copyright{
	position: fixed;
	top: 151px;
	right: 0px;
	width: 100%;
	color: #afafaf;
}


/* because of firefox position fixed bug with flash */
#products .wrapper #copyright{
	position: absolute;
}
/* because of firefox position fixed bug with flash */
#tv_spot .wrapper #copyright{
	position: absolute;
}
/* because of firefox position fixed bug with flash */
#registration .wrapper #copyright{
	position: absolute;
}

.wrapper #copyright p{
	width: 100%;
	max-width: 1004px;
	height: 426px;
	background: url(../img/legal_line.gif) top right no-repeat transparent;
	margin: 0 auto;
}

/* GUI elements */

#metanavigation{
	list-style-type: none;
	position: absolute;
	right: 0;
	top: 8px;
	z-index: 105;
	visibility:hidden;
}

#metanavigation li{
	display: inline;
}

#metanavigation li a{
	display: block;
	float: left;
	padding: 0 5px;
	background: url(../img/bg_meta_navigation.gif) center right no-repeat transparent;
	color: #333;
}

#metanavigation li.last a{
	background-image: none;
}

#metanavigation li a:hover{
	text-decoration: underline;
}

/* Navigation */
#flashNavigationTarget{
	
}

#navigation{
	background: url(../img/bg_navigation.gif) top right no-repeat transparent;
	position: absolute;
	top: 0px;
	height: 120px;
	width: 850px;
	right: 0;
	z-index: 100;
}

#navigation ul{
	display:block;
	position: absolute;
	left: -5000px;
}

/* Flash content element styles */

#flashRegistrationContent{
	padding-top: 70px;
	margin-left: 210px;
	width: 730px;
	height: 850px;
	position: relative;
	z-index: 99;
}

/* Content element styles */

#content{
	padding-top: 70px;
	margin-left: 210px;
	width: 490px;
	float: left;
	position: relative;
	z-index: 10;
	line-height: 1.4em;
}

#content_win{
	padding-top: 70px;
	margin-left: 205px;
	width: 485px;
	float: left;
	position: relative;
	z-index: 10;
	line-height: 1.4em;
}

#content h1{
	color: #fcc602;
	font-weight: normal;
	font-size: 3em;
	margin-bottom: 20px;
	height: 40px;
}

h2, img.h2{
	font-size: 1.8em;
	color: #f4a000;
	margin: 0 !important;
}

h2{
	height: 21px;
}

h3{
	font-size: 1.2em;
	margin-bottom: 0.3em;
	color: #f4a000;
}

h4{
	font-size: 1em;
}

#content h4{
	margin-bottom: 1em;
}

#content p,
#content ul,
#content caption{
	font-size: 1.1em;
}

#content ul ul{
	font-size: 1em;
}


#content p,
#content img{
	margin-bottom: 1.2em;
}

.wrapper p{
	width: 440px;
}

#content img.visual{
	margin-left: -5px;
}



/* Products page */

.productList{
	margin: 12px 0;
}

.productList .item{
	margin-bottom: 20px;
	background:  url(../img/bg_underline.gif) bottom left no-repeat transparent;
}

.productList .last{
	background-image: none;
}


.productList img{
	visibility: hidden;
}

.productList img,
.productList .animation{
	float: left;
	margin-right: 10px;
	margin-top: -10px;
}


#content .productList h2,
#content .productList p,
#content .productList ul{
	margin-left: 152px !important;
}

#content .productList h2{
	height: 26px;
}
#content .productList p{
	width: 250px;
}

.productList ul{
	clear: right;
	height: 65px;
}

.productList ul li{
	display: inline;
}

.productList ul li a{
	display: block;
	float: left;
	width: 87px;
	height: 50px;
	background: url(../img/content/btn_products_spr.jpg) top left no-repeat transparent;
	
}


.productList .flashInside img{
	display: none;
}

.productList ul #productOrange a{
	background-position: 0 0;
}

.productList ul #productOrange a:hover,
.productList ul #productOrange a:focus{
	background-position: 0 -50px;
}

.productList ul #productApple a{
	background-position: -87px 0;
}

.productList ul #productApple a:hover,
.productList ul #productApple a:focus{
	background-position: -87px -50px;
}

.productList ul #productMulti a{
	background-position: -174px 0;
}

.productList ul #productMulti a:hover,
.productList ul #productMulti a:focus{
	background-position: -174px -50px;
}

.productList ul #productYellow a{
	width: 97px;
	background-position: -261px 0px;
}

.productList ul #productYellow a:hover,
.productList ul #productYellow a:focus{
	background-position: -261px -50px;
}

.productList ul #productRed a{
	width: 97px;
	background-position: -358px 0px;
}

.productList ul #productRed a:hover,
.productList ul #productRed a:focus{
	background-position: -358px -50px;
}


.productList ul #productAntioxidant a{
	width: 107px;
	background-position: -455px 0px;
}

.productList ul #productAntioxidant a:hover,
.productList ul #productAntioxidant a:focus{
	background-position: -455px -50px;
}

.productList ul #productPrebiotic a{
	width: 107px;
	background-position: -562px 0px;
}

.productList ul #productPrebiotic a:hover,
.productList ul #productPrebiotic a:focus{
	background-position: -562px -50px;
}


/* Single Product pages */

.productContainer {
	width: 496px;
	padding-top: 260px;
	padding-left: 5px;
	margin-left: -5px;
	position: relative;
	background-color: transparent;
	background-position: top left;
	background-repeat: no-repeat;
}

#content .productContainer p.copy{
	position: absolute;
	top: 175px;
	left: 15px;
	width: 260px;
	color: #fff;
}

#content .productContainer p.copy a{
	text-decoration: underline;
	color: #fff;
}

#content .productContainer p.notice{
	position: relative;
	top: -40px;
	margin-bottom: -20px;
	left: 225px;
	font-size: 1em;
}

.productContainer a.recommended{
	display: block;
	position: absolute;
	top: 285px;
	left: 175px;
	padding-left: 20px;
	width: 85px;
	line-height: 1.2em;
	background-color: transparent;
	background-position: 0 1px;
	background-repeat: no-repeat;
}

.productContainer a.recommended:hover,
.productContainer a.recommended:focus{
	background-position: 0 -59px;
}


.productContainer h3,
.productContainer ul{
	width: 150px;
}


.productContainer ul{
	margin-bottom: 30px;
}

.productContainer li{
	background-color: transparent;
	background-position: top left;
	background-repeat: no-repeat;
	padding-left: 12px;
}

#content .productContainer li a{
	text-decoration: underline;
}

/* Nutrition tables */

.nutrition {
	border-collapse: collapse;
	margin: 0px 0 20px;
}

.nutrition caption{
	text-align: left;
	margin-bottom: 10px;
}


.nutrition th,
.nutrition td{
	width: 55px;
	text-align: center;
	line-height: 1em;
}



.nutrition th{
	background:  url(../img/content/bg_nutrition_orange.gif) top left no-repeat #fff;
	padding: 10px 0;
	margin-bottom: 7px;
	font-weight: normal;
	color: #999;
}

.nutrition td{
	background:  url(../img/content/bg_nutrition_orange.gif) bottom left no-repeat #fbbc17;
	padding: 5px 0;
	color: #fff;
}



/* color variations for the single products */

/* 100% Orange */
.productOrange .productContainer{
	background-image: url(../img/content/headerbild_orange.jpg);
}

.productOrange .productContainer  a.recommended{
	color: #a7b522;
}
.productOrange .productContainer  h3{
	color: #fbbc17;
}

.productOrange .productContainer  li{
	background-image: url(../img/content/bg_list_orange.gif);
}

.productOrange .productContainer  a.recommended{
	background-image: url(../img/content/arrow_apfel.gif);
}


.productOrange .nutrition th,
.productOrange .nutrition td{
	background-image:  url(../img/content/bg_nutrition_orange.gif);
}

/* 100% Apple */
.productApple .productContainer{
	background-image: url(../img/content/headerbild_apfel.jpg);
}
.productApple .productContainer  a.recommended{
	color: #ff7602;
}
.productApple .productContainer  h3{
	color: #a7b522;
}

.productApple .productContainer  li{
	background-image: url(../img/content/bg_list_apfel.gif);
}

.productApple .productContainer  a.recommended{
	background-image: url(../img/content/arrow_multifrucht.gif);
}

.productApple .nutrition th,
.productApple .nutrition td{
	background-image:  url(../img/content/bg_nutrition_apfel.gif);
}

/* 100% Multi */
.productMulti .productContainer{
	background-image: url(../img/content/headerbild_multifrucht.jpg);
}
.productMulti .productContainer  a.recommended{
	color: #fbbc17;
}
.productMulti .productContainer  h3{
	color: #ff7602;
}

.productMulti .productContainer  li{
	background-image: url(../img/content/bg_list_multifrucht.gif);
}

.productMulti .productContainer  a.recommended{
	background-image: url(../img/content/arrow_orange.gif);
	top: 273px;
	left: 170px;
}

.productMulti .nutrition th,
.productMulti .nutrition td{
	background-image:  url(../img/content/bg_nutrition_multifrucht.gif);
}

/* FTG Yellow */
.productYellow .productContainer{
	background-image: url(../img/content/headerbild_ftg_gelb.jpg);
	padding-top: 290px;
}
.productYellow .productContainer  a.recommended,
.productYellow .productContainer  h3{
	color: #f0cb00;
}

.productYellow .productContainer  li{
	background-image: url(../img/content/bg_list_ftg_gelb.gif);
}

.productYellow .productContainer  a.recommended{
	background-image: url(../img/content/arrow_ftg_gelb.gif);
	top: 262px;
	left: 155px;
}

.productYellow .productContainer  p.copy{
	width: 250px !important;
}

.productYellow .productContainer ul{
	width: 160px !important;
}

.productYellow .nutrition th,
.productYellow .nutrition td{
	background-image:  url(../img/content/bg_nutrition_ftg_gelb.gif);
}

/* FTG Red */
.productRed .productContainer{
	background-image: url(../img/content/headerbild_ftg_rot.jpg);
	padding-top: 305px;
}
.productRed .productContainer  a.recommended,
.productRed .productContainer  h3{
	color: #c31644;
}

.productRed .productContainer  li{
	background-image: url(../img/content/bg_list_ftg_rot.gif);
}

.productRed .productContainer  a.recommended{
	background-image: url(../img/content/arrow_ftg_rot.gif);
	top: 279px;
	left: 163px;
}

.productRed .productContainer  p.copy{
	top: 180px !important;
	width: 230px !important;
}

.productRed .productContainer ul{
	width: 160px !important;
}

.productRed .nutrition th,
.productRed .nutrition td{
	background-image:  url(../img/content/bg_nutrition_ftg_rot.gif);
}

/* Antioxidant */
.productAntioxidant .productContainer{
	background-image: url(../img/content/headerbild_antiox.jpg);
	padding-top: 285px;
}
.productAntioxidant .productContainer  a.recommended,
.productAntioxidant .productContainer  h3{
	color: #c31644;
}

.productAntioxidant .productContainer  li{
	background-image: url(../img/content/bg_list_antiox.gif);
}

.productAntioxidant .productContainer  a.recommended{
	background-image: url(../img/content/arrow_antiox.gif);
	top: 308px;
}

.productAntioxidant .productContainer  p.copy{
	width: 255px !important;
}

.productAntioxidant .nutrition th,
.productAntioxidant .nutrition td{
	background-image:  url(../img/content/bg_nutrition_antiox.gif);
}

/* Prebiotic */
.productPrebiotic .productContainer{
	background-image: url(../img/content/headerbild_prebiotic.jpg);
	padding-top: 300px;
}
.productPrebiotic .productContainer  a.recommended,
.productPrebiotic .productContainer  h3{
	color: #ff9414;
}

.productPrebiotic .productContainer  li{
	background-image: url(../img/content/bg_list_prebiotic.gif);
}

.productPrebiotic .productContainer  a.recommended{
	background-image: url(../img/content/arrow_prebiotic.gif);
	top: 305px;
	left: 150px;
}

.productPrebiotic .productContainer  p.copy{
	width: 240px !important;
}

.productPrebiotic .nutrition th,
.productPrebiotic .nutrition td{
	background-image:  url(../img/content/bg_nutrition_prebiotic.gif);
}


/* A-Z Page */

.glossar .index{
	background: url(../img/box_orange.jpg) bottom left no-repeat transparent;
	padding-bottom: 8px;
	margin-bottom: 20px;
}

.glossar .index ul{
	background: url(../img/box_orange.jpg) top left no-repeat transparent;
	padding: 10px 15px 0 15px;
}


.glossar .index ul li{
	display: inline;
}


.glossar .index ul ul{
	background: none;
	padding: 0;
	float: left;
}

.glossar .index ul ul li{
	display: list-item;
}

.glossar .index a{
	color: #fff;
	font-weight: bold;
	background: url(../img/link_arrow_01.jpg) 0 5px no-repeat transparent;
	display: block;
	padding-left: 10px;
	padding-bottom: 5px;
	width: 120px;
}

p.topLink {
	text-align: right;
	background: url(../img/bg_underline.gif) 0 7px repeat-x transparent;
}

p.topLink a {
	background: url(../img/top_arrow.jpg) 7px 7px no-repeat #fff;
	display: block;
	float: right;
	margin-right: 10px;
	padding: 0px 3px 0 17px;
	color: #999;
	font-size: 0.9em;
}

p.topLink a:hover,
p.topLink a:focus{
	background-image: url(../img/top_arrow_over.jpg);
	color: #666;
}



/* sidebar elements */

#sidebar{
	width: 270px;
	margin: 150px 0 200px 0;
	padding-top: 5px;
	padding-right: 30px;
	float: right;
	background: url(../img/bg_sidebar.gif) top left no-repeat transparent;
	position: relative;
	z-index: 5;
}

#sidebar .bottomEnd{
	height: 20px;
	background: url(../img/bg_sidebar.gif) bottom left no-repeat transparent;
	clear: both;
}

#sidebar .teaser{
	background: url(../img/content/teaser_model1.jpg) top left no-repeat transparent;
	height: 160px;
	width: 260px;
	margin-bottom: 5px;
	float: left;	
	clear: both;
	position: relative;
}


#sidebar .teaser h2,
#sidebar .teaser p,
#sidebar .teaser a{
	margin-left: 28px;
}

#sidebar .teaser h2{
	color: #fff;
	margin-top: 22px;
	font-size: 18px;
}

#sidebar .teaser p{
	position: absolute;
	top: 60px;
	width: 115px;
}

#sidebar .teaser a{
	display: block;
	position: absolute;
	z-index: 180;
	width: 180px;
	height: 30px;
	bottom: 20px;
	background: url(../img/content/teaser_ftg_gelb_link.gif) top left no-repeat transparent;
}


#sidebar .teaser p a{
	margin: auto;
}

#sidebar .teaser a span{
	position: absolute;
	left: -5000px;
	width: 0;
	overflow: hidden;
}

/* teaser variations - diferrent bg images, heights */
#sidebar .kaufen{
	background-image: url(../img/content/teaser_kaufen.jpg);
}

#sidebar .kaufen p{
	width: 130px;
}

#sidebar .produkte{
	background-image: url(../img/content/teaser_produkte.jpg);
}

#sidebar .produkte p{
	width: 135px;
}

#sidebar .produkte a{
	background-image: url(../img/content/teaser_produkte_link.gif);
}

#sidebar .produkte a:hover,
#sidebar .produkte a:focus{
	background-position: 0 -35px;
}

#sidebar .tvspot{
	background-image: url(../img/content/teaser_tvspot.jpg);
}

#sidebar .tvspot a{
	background-image: url(../img/content/teaser_tvspot_link.gif);
	background-position: 0 10px;
}
#sidebar .tvspot p{
	width: 110px;
}
#sidebar .tvspot a:hover,
#sidebar .tvspot a:focus{
	background-position: 0 -40px;
}



#sidebar .gewinn{
	background-image: url(../img/content/teaser_gewinn.jpg);
}

#sidebar .gewinn a{
	background-image: url(../img/content/teaser_gewinn_link.gif);
	background-position: 0 10px;
}
#sidebar .gewinn p{
	width: 110px;
}
#sidebar .gewinn a:hover,
#sidebar .gewinn a:focus{
	background-position: 0 -40px;
}


#sidebar .abisz{
	background-image: url(../img/content/teaser_nat_gesund.jpg);
}

#sidebar .abisz a{
	background-image: url(../img/content/teaser_nat_gesund_link.gif);
	background-position: 0 10px;
}

#sidebar .abisz a:hover,
#sidebar .abisz a:focus{
	background-position: 0 -40px;
}

#sidebar .abisz p{
	width: 105px;
}

#sidebar .marke{
	background-image: url(../img/content/teaser_marke.jpg);
}
#sidebar .marke p{
	width: 155px;
}

#sidebar .marke a{
	background-image: url(../img/content/teaser_marke_link.gif);
	background-position: 0 10px;
}


#sidebar .marke a:hover,
#sidebar .marke a:focus{
	background-position: 0 -40px;
}

#sidebar .fruehstueck{
	background-image: url(../img/content/teaser_ftg_gelb.jpg);
}
#sidebar .fruehstueck p{
	width: 135px;
}

#sidebar .fruehstueck a{
	background-image: url(../img/content/teaser_ftg_gelb_link.gif);
	background-position: 0 10px;
}

#sidebar .fruehstueck a:hover,
#sidebar .fruehstueck a:focus{
	background-position: 0 -40px;
}

/* Clearing Floats */
#header:after,
#metanavigation:after,
#navigation:after,
#sidebar:after,
.productList .item:after,
.glossar .index:after,
p.topLink:after{
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}



/* legal page styles */

#legal{
	background: url(../img/bg_meta_sidebar.gif) top left repeat-y #fff;
	overflow-y: scroll;
	
}

#legal body{
	background:none;
}

#legal .wrapper{
	background: url(../img/legal_header.jpg) -20px 0 no-repeat #fff;
	width: auto;
	margin-left: 67px;
	padding: 180px 30px 80px 30px;
}

#legal #content{
	width: auto;
	width: 400px !important;
	margin: auto;
}



#legal #content p{
	width: auto;
}

#legal #logo{
	left: 0px;
	top: 0px;
	width: auto;
}


#legal ol{
	font-size: 1.1em;
}



/* Table of Content navigation */
#legal ul{
	font-size: 1em;
}

#legal .toc{
	margin: 2em 0;
	font-size: 1.1em;
}

#legal .toc li{
	margin: 0;
}



/* noflash page styles */
#noflash #content {
	margin: 60px 0 0 110px;
	background: url(../img/bg_noflash.jpg) top left no-repeat #ffffff;
	width: 635px;
	height: 556px;
	position: relative;
}

#noflash #content h1{
	margin-left: 254px;
}

#noflash #content p{
	margin-left: 256px;
	margin-bottom: 8px;
	width: 290px;
}


#noflash #content #legalLine {
	position: absolute;
	bottom: 0px;
	margin-left: 0px;
	width: auto;
	color: #afafaf;
	font-size: 1em;
}

#noflash #content a{
	display: block;
	background: url(../img/bg_noflash_link_01.gif) center left no-repeat #ffffff;
	padding: 10px 35px;

}

#noflash #content a.orange{
	background-image: url(../img/bg_noflash_link_02.gif);
	color: #f88e00;
}

#noflash #copyright{
	top: 90px;
}


#banner_track {
	position:absolute;
	left:-2000px;
}

/* ----------- layout.js Styles ------------*/

table.button {
	border:0px;
	cursor:pointer;
	margin:0px;
	padding:0px;
	border-spacing:0px;
	border-collapse:collapse;
}
tr.button {
	border:0px;
	margin:0px;
	padding:0px;
	border-spacing:0px;
	border-collapse:collapse;
}
td.button {
	border:0px;
	margin:0px;
	padding:0px;
	border-spacing:0px;
	font: 1.1em Tahoma, Helvetica, sans-serif;
	font-weight: normal;
	color:#333333;
	text-align: center;	
	vertical-align:middle;	
	border-collapse:collapse;
}
td.button_over {
	border:0px;
	margin:0px;
	padding:0px;
	border-spacing:0px;
	font: 1.1em Tahoma, Helvetica, sans-serif;
	font-weight: normal;
	color:#F88C00;
	text-align: center;	
	vertical-align:middle;
}
img.line {
	border:0px;
	margin:0px !important;
	padding:0px;
	border-spacing:0px;
	line-height:0px;
	}
div.line {
	border:0px;
	margin:0px !important;
	padding:0px;
	border-spacing:0px;
	line-height:0px;
	}


/* ------------ Print Styles -------------*/
@media print{
	
	/* reveal html navigation */
	#navigation ul{
		position: static;
	}
	/* hide flash navigation */
	#navigation #flashNavigationTarget{
		display: none;
	}
	
	

	

}