/* -------------------------------------------------------------- START CONTAINER -------------------------------------------------------------- */
* {
	margin: 0;
	padding: 0;
}

html, body {
	height: 100%; /* Heel belangrijk voor je meebewegende footer */
	font-family:Arial, Helvetica, sans-serif;
	font-size: 13px;
	line-height:16px;
	color: #666;
}


div#flashcontent {
	width:2440px;
	height:1810px;
	text-align:left;
	margin:0px auto;
	position:absolute;
	top:-430px;
	left:-35%;
	margin-left:0px;
	z-index:0;
} 


a.bekijk
{
	font-size:	11px;
	padding: 3px 6px;
	background:url(../images/menu.jpg);
	color: #fff;
	text-decoration: none;
}
a.bekijk:hover
{
	text-decoration: underline;
	font-color:#00;

}

a.bekijk:visited
{
	text-decoration: underline;
	font-color:#fff;

}


div#container {
	position: relative; /* De container positioneer je relative omdat je de footer absoluut aan de container positioneert */
	margin: 0px auto; /* deze div centreren */
	top:10px;
	width: 870px;
	background-color: #fff;
	padding-bottom: 160px;
}

.clear {
	clear: both;
}
/* -------------------------------------------------------------- END CONTAINER -------------------------------------------------------------- */



/* -------------------------------------------------------------- START HEADER -------------------------------------------------------------- */

div#header_tekst {
	padding: 3px;
	background-color: #ebebeb;
	border: 3px solid white;
}

div#header_tekst p {
	text-align: center;
}

div#header_tekst h1 {
	font-size: 22px;
	text-align: center;
	padding: 50px 30px 0px 0px;
}

div#header.menu1 a {
	background-image: url('../../template/images/menu_kp.png');
}

div#header.menu1 a:hover {
	background-image: url('../../template/images/menu_kp_shadow.png');
}

div#header {
	height: 94px;
	padding-left: 45px;
}

div.fadehover {
	float: left;
	height: 94px;
	width: 250px;
	margin-right: 20px;
}
 
img.a {
	display:	block;
	float:		left;
	z-index: 	10;
}
 
img.b {
	float: left;
	margin-top: -94px;
}


/* -------------------- START TOP MENU -------------------- */
div#menu {
	width: 870px;
	height: 275px;
	background-image: url('../images/header.png');
	background-repeat: no-repeat;
	background-position: 0px 30px;
}

div#menu.relatiegeschenk {
	background-image: url('../images/header1.png');
}

	div#top_menu ul {
		list-style: none;
		margin: 0px;
	}
	
	div#top_menu li {
		float: right;
		text-align: center;
		list-style: none;
	}
	
	div#top_menu li a {
		display: block;
		text-decoration: none;
		font-weight: bold;
		height: 20px;
		line-height: 20px;
		padding:0px 10px 0px 10px;
	}
	
	div#top_menu li a:hover {
		color: red;
	}
		
	div#top_menu li.current a {
		color: #686868;
	}
	
	div#top_menu li.current a:hover {
		color: #686868;
	}
/* -------------------- END TOP MENU -------------------- */
/* -------------------- START MENU LEFT -------------------- */
	div#left_menu{
		width: 185px;
		clear: both;
	}

	div#left_menu ul {
		list-style: none;
	}
	
	div#left_menu li {
		list-style: none;
		width:  285px;
		color: #FFFFFF;
		text-decoration: none;
		font-weight: bold;
		padding: 30px 0 0 10px;
	}
	
	div#left_menu li a {
		display: block;
		/*color: #1c1914; /* donkerbruin van menu achtergrond */
		line-height: 67px;
		text-align: left;
		padding-left: 5px;
	}
	
	div#left_menu li a:hover {
		color: #FFFFFF;
	}
	
	div#left_menu li.current a {
		color: #FFFFFF;
	}
	
	div#sharebutton {
		padding: 30px 0 0 15px;
	}	
/* -------------------- END MENU LEFT -------------------- */
/* -------------------------------------------------------------- END HEADER -------------------------------------------------------------- */



/* -------------------------------------------------------------- START CONTENT -------------------------------------------------------------- */
div#content {
	color: black;
	min-height: 200px;
	position: relative;
	z-index: 2;
	top: 160px;
}
	
	h1 {
		color: #424242;
		font-size: 20px;
		text-align: left;
		padding-bottom: 25px;
	}

	h2 {
		font-size: 17px;
		color: black;
		text-align: center;
		padding-bottom: 12px;
	}
	
	p {
		padding-bottom: 10px;
	}
	
	blockquote {
		padding: 0 0 0 55px;
	}

	a {
		color: #065A8B;
		text-decoration: none;
	}
	
	a:hover {
		color: #18ACFF;
	}
	
	#content ul {
		list-style:  circle;
	}
	
	#content li {
		list-style: circle;
		width:  500px;
		text-decoration: none;
		padding: 10px 0 0 10px;
	}
	
	#content li a {
		display: block;
		line-height: 67px;
		text-align: left;
		padding-left: 5px;
	}
	
	#content li a:hover {
		color: #18ACFF;
	}
	
	#content li.current a {
		color: #424242;
	}
	
/* -------------------- START CONTENT LEFT -------------------- */
#content div.left_content {
	float: left;
	padding: 10px;
	width: 850px;
}
#content div.left_content ul.gebruiker_menu {
	background-color: #064998;
	list-style-type: none;
	height: 30px;
	margin-bottom: 10px;
}
#content div.left_content ul.gebruiker_menu li {
	float: left;
	color: #fff;
	width: auto;
	padding: 0px;
	list-style: none;
}
#content div.left_content ul.gebruiker_menu li a {
	display: visible;
	line-height: 30px;
	padding: 0px 15px;
	color: #fff;
}
div.left_content_middle {
	padding: 15px;
}

/* De negatieve margins zijn om de witte randen om het plaatje heen weg te werken.*/
div.catalogus img.catalogus{
	margin: -5px 0px -8px 5px;
} 
div.catalogus {
	padding: 0px;
	margin: 0px;
}

/* De negatieve margins zijn om de witte randen om de plaatjes van de partners weg te werken.*/
div#content img.partners{
	float: left;
	margin: 0px 10px;
}
div#content div.partners {
	padding: 0px 10px 0px 0px;
	margin: 0px;
}
div#content div.partners p {
	height: 60px;
	line-height: 13px;
	color: #797979;
	padding-bottom: 5px;
}

div#content div.left_content form p {
	padding-bottom: 2px;
}

div#content div.left_content form input {
	margin-bottom: 10px;
}
/* -------------------- END CONTENT LEFT -------------------- */
/* -------------------- START CONTENT RIGHT -------------------- */
div.right_content {
	float: left;
	padding: 0px 14px 20px 14px;
	width: 842px;
	background-color: #fff;
}
div.right_content_middle {
	padding: 0px 14px;
}

div.right_content ol {
	margin-left: 15px;
	margin-bottom: 15px;
}

div.right_content ol li {
	margin-left: 10px;
	padding: 0px;
}

div.right_content div.product {
  	border: 1px solid #CCCCCC;
    float: left;
    padding: 9px;
    margin: 5px 10px;
    width: 163px;
	background-color:#FFF;
}

div.right_content div.product:hover {
	border: 1px solid #333;
}

div#content div.product h2 {
	font-size:	12px;
	height:		20px;
}

div#content div.product h1 {
	text-align: center;
}

div.right_content div.product div.image {
	height:		150px;
	overflow:	hidden;
}

div.right_content p.bladeren {
	text-align: center;
	padding-top: 3px;
}
/* -------------------- END CONTENT RIGHT -------------------- */
/* -------------------------------------------------------------- END CONTENT -------------------------------------------------------------- */

form input[type="submit"] {
	margin-top: -10px;
	display: block;
	margin-left: 0px;
	padding: 5px;
	width: 198px;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 13px;
}

div.secundair, a.secundair, input.secundair {
	background-color: #064998;
        color:#fff;
}


/* -------------------------------------------------------------- START FOOTER -------------------------------------------------------------- */
div#clear {
	clear: both;
	height: 35px;
	width: 700px;
}

div#footer {
	clear: both;
	width: 700px;
}

div#footer p {
	color: #797979;
	font-size: 10px;
	padding: 0px 20px 5px 20px;
}
/* -------------------------------------------------------------- END FOOTER -------------------------------------------------------------- */



/*
 * Tabel
 */

.tabel {
	border-spacing:1px;
	background-color:#E7E7E7;
	width: auto;
}

.tabel_login {
	border-spacing:0px;
	width: auto;
}

.tabel_login th {
	padding-top: 8px;
}


.tabel th {
	padding: 8px;
 	font-weight: bold;
	text-align: right;
	background: #F5F5F5;
	border: 1px solid #FFF;
}

.tabel .left {
	text-align: left;
}

.tabel .center {
	text-align: center;
}

.tabel .right {
	text-align: right;
}

.tabel .aantal {
	text-align: center;
}

.tabel .aantal form {
	padding: 0 5px; 
	margin: 0; 
	float:left;
}

.tabel .aantal input[type=image] {
	vertical-align: top;
}

.tabel tr	{
	background-color:#FFF; 
	text-align: center;
	
}
.tabel tr.odd 	{
	padding: 6px;
	background: #f9f9f9;
	border-top:1px solid #FFF;
}
.tabel td {
	padding: 6px;
}

.submit_ja {
    margin:0 7px 0 0;
    background-color:#f5f5f5;
    border:1px solid #dedede;
    border-top:1px solid #eee;
    border-left:1px solid #eee;
    font-size:10px;
    line-height:130%;
    text-decoration:none;
    cursor:pointer;
    padding:5px 10px 6px 7px; /* Links */
}

.submit_ja:hover {
    background-color:#E6EFC2;
    border:1px solid #C6D880;
    color:#529214;
}

.submit_nee {
    margin:0 7px 0 0;
    background-color:#f5f5f5;
    border:1px solid #dedede;
    border-top:1px solid #eee;
    border-left:1px solid #eee;
    font-size:10px;
    line-height:130%;
    text-decoration:none;
    font-weight:bold;
    color:#969696;
    cursor:pointer;
    padding:5px 10px 6px 7px; /* Links */
}

.submit_nee:hover {
    background-color:#fbe3e4;
    border:1px solid #fbc2c4;
    color:#d12f19;
}

/*
 * Titel balk voor bv winkelwagen
 */

div.titel {
	width: 545px;
	background-image: url('../images/titel_achtergrond.jpg');
	background-repeat: no-repeat;	
	color: #fff;
	font-size: 12px;
	padding: 7px 10px;
	margin: 10px 0;
}

/*
 * Style the message boxes
 */

.messagebox {
	border: 1px solid;
	margin: 10px 0px;
	padding:15px 10px 15px 50px;
	background-repeat: no-repeat;
	background-position: 10px center;
}
.info {
	color: #00529B;
	background-color: #BDE5F8;
	background-image: url('../images/icons/info_medium.png');
}
.success {
	color: #4F8A10;
	background-color: #DFF2BF;
	background-image:url('../images/icons/success_medium.png');
}
.warning {
	color: #9F6000;
	background-color: #FEEFB3;
	background-image: url('../images/icons/warning_medium.png');
}
.error {
	color: #D8000C;
	background-color: #FFBABA;
	background-image: url('../images/icons/error_medium.png');
}


/*
 * CSS voor gebruiker site
 */


div#header_gebruiker {
	width: 868px;
	margin: 0px 1px;
	height: 160px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	position: absolute;
	z-index: 1;
}


/* De cloudtag staat in een aparte div. Deze komt helemaal onderaan de website, onder het laatste subitem bij de content */
div#footer div#cloud {
	clear: both;
	margin: 13px;
	border-top: 1px solid #999;
}

/* Deze HR zorgt ervoor dat de cloud woorden (die gefloat worden), netjes onder elkaar en naast elkaar blijven staan. */
div#footer div#cloud hr.spacer {
	height: 1px;
	clear: both;
	visibility: hidden;
}

/* Ik gebruik nu 3 verschillende grooten, h1, h2 en h3. Dit kun je nog veranderen door bijv. procenten. Daar moet je zelf even naar kijken, ik weet niet hoe je die cloud tag ga implementeren */
div#cloud h1 a{
	float: left;
	color: #065A8B;
	font-size: 15px;
	padding: 0px 10px;
	text-decoration: none;
	line-height: 15px;
}


div#cloud h1 a:hover {
	color: #003885;
}

div#cloud h2 a{
	float: left;
	color: #065A8B;
	font-size: 13px;
	padding: 0px 10px;
	text-decoration: none;
	line-height: 15px;
}
div#cloud h2 a:hover {
	color: #065A8B;
}

div#cloud h3 a{
	float: left;
	color: #065A8B;
	font-size: 11px;
	padding: 0px 10px;
	text-decoration: none;
	line-height: 15px;
}

div#cloud h3 a:hover {
	color: #003885B;
}

#login{
	margin: -100px;
	width: 500px;
	height: 200px;
	padding: 25px;
	padding-top: 100px;
	top: 50%;
	left: 50%;
	margin-left: -280px;
	margin-top: -250px;
	background-image: url("../images/login_back.png");
	position:absolute;
}

input {
	border:			1px solid #A5A6A6;
	font-size:		18px;
	color: 			#666;
	padding:		1px 3px;
	margin-bottom: 5px;
}

input[type="radio"], input[type="checkbox"] {
	border:			medium none;
}

inputarea {
	border:			1px solid #000000;
	padding:		1px 3px;