/************************************************
 *
 * Compucorner v3 Stylesheet
 *
 * Author: J. van Egmond
 * Date: 12/07/2008
 *
 ***********************************************/
 
 
/************************************************ 
*	GLOBAL
************************************************/
* {
	padding				: 0;
	margin				: 0;
}


/************************************************ 
*	GENERAL
************************************************/
body {
	background			: #FFF url(../img/bg.png) repeat-x scroll top;
	padding-top			: 22px;
}

a {
	color				: #F8A407;
	text-decoration		: none;
}

a:hover {
	text-decoration		: underline;
}

/************************************************ 
*	TEMPLATE
************************************************/
#wrap {
	position			: relative;
	
	width				: 1018px;
	height				: 825px;
	
	margin				: 0 auto;
}

#wrap div {
	position			: relative;
}

#header {
	width				: 1018px;
	height				: 179px;
	
	background			: transparent url(../img/header.png);
	
	clear				: both;
}

#body {
	float				: left;
	
	width				: 568px;
}

#sidebar {
	float				: left;
	
	width				: 164px;
	height				: 635px; /* TEMP */
	left				: 4px;
}

#producten {
	float				: left;
	
	width				: 264px;
	height				: 635px;
	left				: 15px;
}

#footer {
	font-family			: Verdana;
	font-size			: 11px;
	font-style			: italic;
	color				: #999;
	text-align			: center;
}


/************************************************ 
*	HEADER / TABS
************************************************/
#tabs {
	position			: relative;
	
	width				: 215px;
	height				: 28px;
	left				: 747px;
}

#tabs ul {
	list-style			: none;
}

#tabs ul li.seperator {
	width				: 3px;
}

#tabs ul li,
#tabs ul li a {
	display				: block;
	
	width				: 106px;
	height				: 28px;
	
	line-height			: 28px;
	
	text-decoration		: none;
	
	float				: left;
}

#tab_home 		{ background: transparent url(../img/tab_home.png) repeat scroll top; }
#tab_contact	{ background: transparent url(../img/tab_contact.png) repeat scroll top; }

#tabs ul li a:hover,
#tabs ul li a.selected {
	background-position	: 0 -28px;
}


/************************************************ 
*	HEADER / LOGIN
************************************************/
#login {
	position			: relative;
	
	width				: 210px;
	height				: 100px;
	top					: 11px;
	left				: 748px;
}

#login_header {
	position			: relative;
	
	width				: 206px;
	height				: 24px;
	top					: 3px;
	left				: 3px;
	
	background			: transparent url(../img/login_header.png);
}

#loggedin_header {
	
}

.login_textfield {
	position			: relative;
	float				: left;
	
	width				: 125px;
	height				: 16px;
	top					: 11px;
	left				: 10px;
	
	margin				: 5px 0 0 0;
	padding				: 4px 3px 0 3px;
	
	border				: none;
	background			: transparent url(../img/tf_field.png) no-repeat;
	
	font-family			: "Trebuchet MS";
	font-size			: 11px;
	font-style			: italic;
	color				: #999;
}

.login_info {
	display				: block;
	position			: relative;
	float				: left;
	
	width				: 19px;
	height				: 20px;
	top					: 11px;
	left				: 10px;
	
	margin				: 5px 0 0 0;
	
	background			: transparent url(../img/tf_button.png) no-repeat;	
}

#login_submit {
	display				: block;
	position			: relative;
	float				: left;
	
	width				: 35px;
	height				: 29px;
	left				: 17px;
	
	text-decoration		: none;
	background			: transparent url(../img/button_accept.png) no-repeat;
}

#logged_in {
	width				: 196px;
	height				: 85px;
	padding				: 5px 7px;
}

#logged_in h1 {
	font-family			: Georgia;
	font-size			: 16px;
	font-style			: italic;
	font-weight			: normal;
	color				: #333;
	margin-bottom		: 7px;
}

#logged_in h1 img {
	vertical-align		: top;
	*vertical-align		: middle;
}

#logged_in ul {
	list-style			: none;
	font-family			: "Trebuchet MS";
	font-size			: 14px;
}

#logged_in ul img {
	vertical-align		: middle;
}

/************************************************ 
*	HEADER / NAVIGATION
************************************************/
#navigation {
	position			: relative;
	
	width				: 627px;
	height				: 50px;
	top					: 1px;
	left				: 119px;
}

#navigation ul {
	list-style			: none;
}

#navigation ul li,
#navigation ul li a {
	display				: block;
	
	height				: 50px;
	
	line-height			: 50px;
	
	text-decoration		: none;
	
	float				: left;
}

#nav_nieuws {
	width				: 102px;
	background			: transparent url(../img/nav_nieuws.png) repeat scroll top;
}

#nav_overons {
	width				: 113px;
	background			: transparent url(../img/nav_overons.png) repeat scroll top;
}

#nav_producten {
	width				: 123px;
	background			: transparent url(../img/nav_producten.png) repeat scroll top;
}

#nav_diensten {
	width				: 110px;
	background			: transparent url(../img/nav_diensten.png) repeat scroll top;
}

#navigation ul li a:hover,
#navigation ul li a.selected {
	background-position	: 0 -50px;
}


/************************************************ 
*	HEADER / NAVIGATION / GOOGLE
************************************************/
#google {
	width				: 179px;
	height				: 50px;
	
	background			: transparent url(../img/nav_eind.png) no-repeat;
}

.googlefield {
	display				: block;
	position			: relative;
	
	width				: 141px;
	height				: 19px;
	top					: 14px;
	left				: 14px;
	
	border				: none;
	background			: transparent url(../img/google_field.png) repeat scroll top;
	
	padding				: 3px 3px 0 3px;
	
	font-family			: "Trebuchet MS";
	font-style			: italic;
	color				: #555;
}

#google form input.focus {
	background-position	: 0 -22px;
}


/************************************************ 
*	BODY
************************************************/
#body_firstwrap {
	position			: relative;
	
	width				: 568px;
	
	background			: transparent url(../img/body_top.png) no-repeat scroll top;
}

#body_secondwrap {
	position			: relative;
	
	width				: 518px;
	height				: 585px; /* TEMP */
	
	padding				: 25px 25px 30px 25px;
	
	background			: transparent url(../img/body_bottom.png) no-repeat scroll bottom;
	
	font-family			: "Trebuchet MS";
	font-size			: 14px;
}

#body_content {
	width				: 518px;
	height				: 585px;
	
	overflow			: auto;
}

#body_secondwrap p {
	margin-top			: 1em;	
}

#body_secondwrap h1 {
	font-family			: "Georgia";
	font-size			: 24px;
	font-style			: italic;
	font-weight			: normal;
	color				: #F8A407;
}

#body_secondwrap h3 {
	font-size			: 14px;
	font-weight			: bold; 
}

#body_secondwrap ul {
	margin				: 1em 1em;
}

#body_secondwrap ul li img {
	vertical-align		: bottom;
}


/************************************************ 
*	SIDEBAR
************************************************/
#sidebar_content,
#sidebar_footer {
	position			: relative;
}

#sidebar_content {
	width				: 164px;
	height				: 605px; /* TEMP */
	
	background			: transparent url(../img/sidebar_light.png) repeat-y;
	
	padding-top			: 10px;
}

#sidebar_content div * {
	font-family			: "Trebuchet MS";
	font-size			: 14px;
}

#sidebar_content div span {
	width				: 142px;
	display				: block;
	
	background			: #c8e5ff url(../img/icons/bullet_orange.png) no-repeat 0 3px;
	margin-left			: 2px;
	padding				: 2px 2px 2px 15px;
	
	font-style			: italic;
	font-weight			: bold;
	font-size			: 14px;
	color				: #444;
	
	cursor				: pointer;
	cursor				: hand;
}

#sidebar_content div span img {
	vertical-align		: bottom;
	*vertical-align		: middle;
}

#sidebar_content div p {
	padding				: 3px 10px;
	font-size			: 12px;
	display				: none;
}

#sidebar_content div p a {
	font-size			: 12px;
}

#sidebar_footer {
	width				: 164px;
	height				: 20px;
	background			: transparent url(../img/sidebar_bottom.png) repeat-y;
}


/************************************************ 
*	PRODUCTEN
************************************************/
#producten .prod_top,
#producten .prod_middle,
#producten .prod_bottom {
	position			: relative;
	
	width				: 244px;
	height				: 135px;
	
	padding				: 10px;
}

#producten div div {
	float				: left;
}

.prod_top {
	background			: transparent url(../img/prod_top.png) no-repeat;
}

.prod_middle {
	margin				: 5px 0 0 0;
	background			: transparent url(../img/prod_middle.png) no-repeat;
}

.prod_bottom {
	margin				: 5px 0 0 0;
	background			: transparent url(../img/prod_bottom.png) no-repeat;
}

.prod_img {
	width				: 100px;
	height				: 135px;
}

.prod_text {
	width				: 139px;
	height				: 135px;
	padding-left		: 5px
}

.prod_text h1 {
	font-family			: "Georgia";
	font-size			: 20px;
	font-style			: italic;
	font-weight			: normal;
	color				: #F8A407;
}

.prod_text p {
	font-family			: "Trebuchet MS";
	font-size			: 14px;
	margin-top			: 1em;
}

.prod_text img {
	vertical-align		: bottom;
}

.prod_text a {
	font-family			: "Trebuchet MS";
	font-size			: 14px;
}

.product_image {
	width					: 100px;
	height					: 135px;
	padding					: 5px;
	border					: 1px solid #bbb;
	-moz-border-radius		: 6px;
	-khtml-border-radius	: 6px;
	-webkit-border-radius	: 6px;
	border-radius			: 6px;
	float					: right;
}

/************************************************ 
*	FOOTER
************************************************/
#footer span,
#footer span a {
	color				: #999;
	text-decoration		: none;
}

#footer span a:hover {
	color				: #333;
	text-decoration		: underline;
}