/*
 *******************************************
 *                                         *
 * CSS FOR SPRUNK-JANSEN                   *
 * frontpage template_layput               *
 *                                         *
 * By Rasmus Frey <frey@verk.dk>           *
 *                                         *
 *******************************************
**/

#focus{
	position:relative;
	clear:both;
	width:770px;
	overflow:hidden;
	margin-bottom:25px;
}
	#leftcolumn, #centercolumn, #rightcolumn, #leftfocus, #centerfocus, #rightfocus{
		position:relative;
		float:left;
		width:240px;
		overflow:hidden;
		height:auto;
	}
	#leftcolumn, #centercolumn, #leftfocus, #centerfocus{
		position:relative;
		margin-right:25px;
	}
	
	#lefttop, #centertop, #righttop{
		position:relative;
		clear:both;
		overflow:hidden;
		height:auto;
		height:375px;
	}
	
/* Taking care of special looks */
#centertop div{
	padding:10px;
	height:330px;
	overflow:hidden;
	padding-bottom:0px;
}
#centertop div h1, #centertop div h2, #centertop div h3{
	color:#000;
}
#centertop a{
	color:#fff;
	font-weight:bold;
}
#centertop a:hover{
	color:#fff;
	background-color:#000;
}

	
/* COLORED BGs */
.redcontent{
	background:url(../graphics/bg_red.gif) no-repeat;
	color:#fff;
	width:240px;
	height:340px;
}
	.redreadmore{
		background:url(../graphics/readmore_red.gif) no-repeat;
	}
.greencontent{
	background:url(../graphics/bg_green.gif) no-repeat;
	color:#fff;
	width:240px;
	height:340px;
}
	.greenreadmore{
		background:url(../graphics/readmore_green.gif) no-repeat;
	}
.bluecontent{
	background:url(../graphics/bg_blue.gif) no-repeat;
	color:#fff;
	width:240px;
	height:340px;
}
	.bluereadmore{
		background:url(../graphics/readmore_blue.gif) no-repeat;
	}
.orangecontent{
	background:url(../graphics/bg_orange.gif) no-repeat;
	color:#fff;
	width:240px;
	height:340px;
}
	.orangereadmore{
		background:url(../graphics/readmore_orange.gif) no-repeat;
	}
.redreadmore, .greenreadmore, .bluereadmore, .orangereadmore{
	width:240px;
	height:35px;
	text-align:center;
	padding-top:15px;
	text-transform:uppercase;
}
.redreadmore a, .greenreadmore a, .bluereadmore a, .orangereadmore a{
	text-decoration:none;
	font-size:11px;
}
/* *********** */

/* HERBS */
#herbs{
	width:240px;
	height:auto;
	overflow:hidden;
}
#herbs .herblist{
	overflow:hidden;
	margin-bottom:5px;
}

#herbs h1{
	font-size:110%;
	font-weight:normal;
}

#herbs img{
	width:60px;
	height:60px;
	float:left;
}
#herbs .herblist h1{
	float:left;
	font-size:110%;
	font-weight:normal;
	color:#000;
	background-color:#f5f3f1;
	margin:0px;
	padding:10px;
	width:180px;
	height:40px;
}
#herbs .herblist h1 a{
	color:#000;
	text-decoration:none;
}
/* *********** */
	
/* shop container */

	#shopcontainer{
		clear:both !Important;
	}
		#shopcontainer #prodprice, #shopcontainer #prodadd{
			float:left;
			width:115px;
			height:64px;
		}
		#shopcontainer #prodadd{
			margin-left:10px;
			cursor:pointer;
		}
			#shopcontainer #prodadd.bluebg{
				background-image:url(../graphics/addcart_bg_blue.gif);
				background-repeat:no-repeat;
			}
			#shopcontainer #prodadd.redbg{
				background-image:url(../graphics/addcart_bg_red.gif);
				background-repeat:no-repeat;
			}
			#shopcontainer #prodadd.greenbg{
				background-image:url(../graphics/addcart_bg_green.gif);
				background-repeat:no-repeat;
			}
			#shopcontainer #prodadd.orangebg{
				background-image:url(../graphics/addcart_bg_orange.gif);
				background-repeat:no-repeat;
			}
			#shopcontainer #prodadd h3{
				margin-top:9px;
				margin-left:10px;
				font-size:130%;
			}
			#shopcontainer #prodadd h3 a{
				color:#fff;
				text-decoration:none;
			}
		#shopcontainer #prodprice{
			text-align:center;
		}
			#shopcontainer #prodprice.bluebg{
				background-image:url(../graphics/price_bg_blue.gif);
				background-repeat:no-repeat;
			}
			#shopcontainer #prodprice.redbg{
				background-image:url(../graphics/price_bg_red.gif);
				background-repeat:no-repeat;
			}
			#shopcontainer #prodprice.greenbg{
				background-image:url(../graphics/price_bg_green.gif);
				background-repeat:no-repeat;
			}
			#shopcontainer #prodprice.orangebg{
				background-image:url(../graphics/price_bg_orange.gif);
				background-repeat:no-repeat;
			}
			#shopcontainer #prodprice h3{
				margin:0px;
				padding:0px;
				margin-top:9px;
				margin-bottom:3px;
				font-size:160%;
			}
			#shopcontainer #prodprice p{
				font-size:70%;
				margin:0px;
				padding:0px;
			}
		#shopcontainer #prodinfo{
			clear:both !Important;
			padding:10px;
			padding-top:20px;
			/*width:240px;*/
		}
		#shopcontainer #prodinfo p{
			font-size:90%;
		}

/* retailer Popup */
#popitmenu{
position: absolute;
background-color: #B8AB9B;
z-index: 100;
visibility: hidden;
text-align:left;
color:#fff;
}

#popitmenu h1{
	font-size:100%;
	font-weight:bold;
	padding:3px;
	margin:0px;
}

#popitmenu p{ /*hover background color*/
	margin:0px;
	padding:3px;
}



/*
Vertical Accordions
*/
#accordion_container {
	margin: auto;
	width: auto;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	text-align:left;
}
	.accordion_toggle {
		display: block;
		width: auto;
		height:20px;
		line-height:20px;
		padding: 0px;
		padding-left:5px;
		margin: 0px;
		font-size: 13px;
		text-decoration: none;
		outline: none;
		cursor: pointer;
		text-transform:uppercase;
		background:url(../graphics/bg_accordion_heading.gif) repeat-x;
		color:#fff;
	}
	.accordion_toggle a{
		text-decoration:none;
		text-transform:uppercase;
	}
	
	.accordion_toggle span{
		background:url(../graphics/accordion_plus.gif) no-repeat;
		padding-left:20px;
	}
	
	.accordion_toggle_active {
	}
	
	.accordion_toggle_active span{
		background:url(../graphics/accordion_minus.gif) no-repeat;
		padding-left:20px;
	}
	
	.accordion_content {
		background-color: #ffffff;
		overflow: hidden;
		text-align:left;
	}
		.accordion_content .content {
			padding-top: 10px;
			padding-bottom: 10px;
		}