@charset "utf-8";

/* CSS Document                                         */
/* ---------------------------------------------------- */
/* Built by fourcom gmbh, 2009. Because design matters. */
/* Further information: http://www.fourcom.ch           */
/* Site: JBDesign.ch, (C) 2009.                         */
/* CSS: Samuel Läubli                                   */
/* ---------------------------------------------------- */

/* Preliminaries */
*{
		list-style:none;
}

body{
		font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
		font-size: 11px;
		margin: 0px;
		padding: 0px;
}

/* Containers */

#HEADER{
/* edit: SL, 2010-02-08. purpose: banner «Tierschutz-Abstimmung» */
		width: 375px;
		height: 115px;
		position: relative;
		left: 50%;
		margin-left: -380px;
		margin-top: 30px;
		margin-bottom: -30px;
		padding: 4px;
		border: 1px solid #CBBB9D;
}

#OVERALL{
		width: 750px; /* resp. 760px including padding & border */
		min-height: 550px;
		position: relative;
		left: 50%;
		margin-left: -380px;
		margin-top: 60px;
		margin-bottom: 20px;
		padding: 4px;
		border: 1px solid #CBBB9D;
		overflow: visible;
}

#TOP{
		width: 750px;
		height: 91px; /* +4px margin = 95px total height of TOP including whitespace */
		position: relative;
		margin-bottom: 4px;
		background-color: #66B8DC;
}

	#Logo{
			width: 284px;
			height: 91px;
			background: url(jbdesign.gif);
			float: left;
	}
	
	#Toprest{
			height: 91px;
	}

#MENU{
	position: absolute;
	height: 83px;
	margin-left: 83px;
	padding: 4px;
	background-color: #CBBB9D;	
	z-index: 8;
}

	a.menuitem:link, a.menuitem:visited, a.menuitem:active{
		border: 1px solid #B7A07E;
		margin-left: 4px;
		height: 73px;
		width: 73px;
		padding: 4px;
		color: white;
		font-size: 16px;
		display: block;
		float: left;
		z-index: 8;
	}
	
	a.menuitem:hover{
		background-color: #D0C2A7;
	}

#MIDDLE{
		width: 750px;
		min-height: 425px;
		position: relative;
		background-color: #E5DDCE;
		overflow: auto;
}

	#Navi{
		width: 91px;
		height: 91px;
		position: absolute;
		background: url(navi-back.gif);
		z-index: 10;
	}

	#Content{
			width: 400px;
			min-height: 425px;
			position: relative;
			overflow: visible; /* overflow will increase overall-height */
			float: left;
			padding-left: 120px;
			margin-right: 30px;
			z-index: 5;
	}
		
		h1{
				margin: 0px;
				padding-top: 28px;
				font-size: 22px;
				color: #997752;
		}
		
		h2{
				margin: 0px;
				padding-top: 0px;
				padding-bottom: 12px;
				font-size: 16px;
				color: #A58867;
				font-weight: lighter;
		}
		
		#Content p{
				color: #333333;
				line-height: 1.6em;
		}
		
		a:link, a:visited, a:active{
				text-decoration: none;
				color: #006699;
		}
		
		a:hover{
				color: #CC6600;
		}
		
		img{
				border: none;
		}
	
	#Righthand{
			width: 200px;
			min-height: 425px;
			position: relative;
			overflow: hidden; /* overflow will increase overall-height */
	}
		
		#topinfo{
				width: 175px;
				height: 19px;
				margin-bottom: 4px;
				padding-left: 25px;
				padding-top: 2px;
				background: url(topinfo-back.gif);
				color: white;
		}
		
		#cartitem{
				width: 200px;
				height: 30px;
				border-bottom: 1px solid #CBBB9D;
				padding-left: 3px;
				padding-top: 2px;
				font-size: 9px;
				font-family: Verdana, Arial, Helvetica, sans-serif;
				background-color: #D8CCB6;
		}
		
		#carttotal{
				width: 200px;
				height: 26px;
				margin-top: -1px;
				padding-left: 3px;
				padding-top: 2px;
				border-top: 4px solid #E5DDCE;
				background-color: #CBBB9D;
				font-size: 9px;
				font-family: Verdana, Arial, Helvetica, sans-serif;
		}
		
		a.cart{
				width: 15px;
				height: 15px;
				margin-right: 7px;
				display: block;
				float: left;
		}
		
		a#delete{
				background: url(delete-item.gif) no-repeat 2px 2px;
		}
		
		a#gopay{
				background: url(go-pay.gif) no-repeat 3px 2px;
		}
		
		#cart{
				margin-bottom: 4px;
		}
		
		#Righthand img{
				margin-bottom: 4px;
				position: static;
		}

#BOTTOM{
		width: 750px;
		height: 26px; /* +4px margin = 30px total height of BOTTOM including whitespace */
		position: relative;
		margin-top: 4px;
		background-color: #D8CCB6;
}

		#footer2sp{
				padding-left: 3px;
				padding-right: 25px;
				font-size: 9px;
				font-family: Verdana, Arial, Helvetica, sans-serif;
				float: left;
				color: #A58867;
		}
		
		a#logolink{
				width: 100px;
				height: 26px;
				display: block;
				background: url(jb-small-half.gif);
				float: left;
				margin-right: -7px;
		}
		
		a#logolink:hover{
				background: url(jb-small.gif);
		}
		
		#fourcom{
				position:absolute;
				width: 150px;
				height: 26px;
				background: url(fourcom.gif);
				margin-left: 600px;
		}
		
		#BOTTOM a{
				color: #A58867;
				text-decoration: none;
		}
		
		#BOTTOM a:hover{
				color: #997752;
		}

/* Varia */

#tab-container-1-nav{
		padding: 0px;
		margin: 0px;
		margin-top: 4px;
}

#tab-container-1-nav li{
		display: inline;
}

a.active{
		border-bottom: 1px dotted;
}

.tab{
		margin-top: 25px;
}

/* Kontaktformular */
select{
	font-size:10px;
	width:252px;
	border:#CCCCCC 1px solid;
}

option, input{
	border:#CCCCCC 1px solid;
	height:18px;
	font-size:11px;
	font-family:"Trebuchet MS", Verdana, Arial;
	padding:0px;
	padding-left:1px;
	color:#996600;
	background:#ffffff;

}

textarea{
	border:#CCCCCC 1px solid;
	font-size:11px;
	font-family:"Trebuchet MS", Verdana, Arial;
	color:#996600;
}