/*
blauw: 	3e85c1
rood:	e30040
grijs:	58585a
roze: 	ee8ba2
*/

body, html
{
	font-family: 			Verdana;
	margin-left: 			0px;
	margin-top: 			0px;
	margin-right: 			0px;
	margin-bottom: 			0px;
	height:                 100%;
	background-image:		url(../images/background.jpg);
	background-repeat:		no-repeat;
	background-position:    center;
	background-position:    top;
    text-align:left;
}
/* fix hover on IE6 */
body { behavior:url("csshover.htc"); }

.bold
{
	font-variant: 			small-caps;
	font-size:              18px;
	font-weight: 			bold;
}	

.normal
{
	font-size:              11px;
	color:                  #FFFFFF;
	line-height: 			8px;
}

.container
{
	width:                  1000px;
	height:                 100%;
	margin-left: 			auto;
	margin-right: 			auto;
	position:               relative;
}

div#menu_map
{
	display:                block; 
	background:             url(../images/background.jpg);
	margin-left: 			0px;
	margin-top: 			0px;
	margin-right: 			0px;
	margin-bottom: 			0px;
    position:               relative;
    z-index:                1000; /* Need this for IE7 */
}

a#home
{
	position: 				absolute;
	left:					0px;
	top:					-40px;
	background:				transparent;
	width: 					250px;
	height: 				30px;
	cursor:					pointer;
}


a#websites
{
	position: 				absolute;
	left:					350px; 
	top:					-40px;
	background:				transparent;
	width: 					70px;
	height: 				25px;
	cursor:					pointer;
}

a#consultancy
{
	position: 				absolute;
	left:					430px; 
	top:					-40px;
	background:				transparent;
	width: 					90px;
	height: 				25px;
	cursor:					pointer;
}

div.graphicdesign
{
	position: 				absolute;
    left:					530px;
	top:					-40px;
	background:				transparent;
	width: 					100px;
	height: 				25px;
	cursor:					pointer;
        
}

div.graphicdesign:hover div.menu
{
	display: 				block;
    left:                   -5px;
}

div.illustration
{
	position: 				absolute;
    left:					650px;
    top:					-40px;
	background:				transparent;
	width: 					85px;
	height: 				25px;
	cursor:					pointer;
}

div.illustration:hover div.menu
{
	display: 				block;
	left:                   -10px;
}

div.photography
{
	position: 				absolute;
	left:					740px;
	top:					-40px;
	background:				transparent;
	width: 					100px;
	height: 				25px;
	cursor:					pointer;
}

div.photography:hover div.menu
{
	display: 				block;
	left:                   -0px;
}

div.aboutus
{
	position: 				absolute;
	left:					850px;
	top:					-40px;
	background:				transparent;
	width: 					60px;
	height: 				25px;
	cursor:					pointer;

}
div.aboutus:hover div.menu
{
	display:                block;
	left:                   -20px;
}

a#contact
{
	position: 				absolute;
	left:					930px; 
	top:					-40px;
	background:				transparent;
	width: 					50px;
	height: 				25px;
	cursor:					pointer;
}

.topmenu
{
	height: 				77px;
}

.logo 
{
	float: 					left;
	width:					255px;
	height:					77px;
}

.blue, .blue a
{
	color: 					#3e85c1;

}

.red, .red a
{
	color:					#e30040;
}

.grey, .grey a
{
	color:					#58585a;
}

/* Css menu */
div.menu
{
	display: 				none; 
	position: 				relative; 
	left: 					-5px; 
	top: 					0px; 
	height: 				100%; 
	margin:					0;
	padding:				0;
	padding-top:            26px;
	z-index:				100;
}

div.menu ul
{
	padding:				0;
	margin:					0;
}
		
div.menu li
{
	position: 				relative;
	float: 					left;
	list-style:             none;
	margin: 				0;
	padding:				0;
}
		
div.menu li a
{
	width:					106px;
	height: 				20px;
	display: 				block;
	text-decoration:        none;
	text-align:             center;
	line-height:            20px;
	font-weight:            bold;
	font-size: 				9px;
    font-family:            Verdana;
	white-space:            nowrap;
	background-color:       #FFFFFF;
	outline:				none;
}
		
div.menu li a:hover
{
	background-position:    bottom center;
}

div.menu ul.sub
{
	position: 				absolute;
	top: 					21px;
	width: 					106px;
	display: 				block;
	z-index:				1;
	border-bottom:          1px solid #000;

}
/* css to make sure when you hover over a main item, the sub items appear */
/* this doesnt work for IE 6. */

div.menu li:hover ul.sub
{ 
	display: 				block; 
}

/* css to make sure when you hover over a sub item, the sub-sub items appear */
div.menu ul.sub li:hover ul.subsub 
{ 
	display: 				block; 
}

div.menu ul.sub li a
{
	border-left: 			1px solid #000;
	border-right: 			1px solid #000;
	border-top: 			1px solid #000;
	border-bottom: 			none;
}

div.menu ul.sub li a:hover
{
	background-color:       #837b76;
	color:					#FFFFFF;
}

div.menu ul.subsub
{
	position: 				absolute;
	top: 					0px;
	left: 					107px;
	width: 					106px;
	display:				none;
	z-index:				1;
	border-bottom:          1px solid #000;
}


/* End CSS Drop Down Menu */

.main
{

	position: 	absolute;
	top:		80px;

}

.leftboxes
{
	margin-left:            40px;
	margin-right:           40px;
	top:					50px;
	width: 					215px;
	position:				relative;
	float:					left;
}

.leftboxes2
{
	margin-left:            40px;
	margin-right:           40px;
	top:					128px;
	width: 					215px;
	position:				relative;
	float:					left;
}

.leftboxes3
{
	margin-left:            40px;
	margin-right:           40px;
	top:					150px;
	width: 					215px;
	position:				relative;
	float:					left;
}

.leftboxes4
{
	margin-left:            40px;
	margin-right:           40px;
        top:                150px;
	width: 					215px;
	position:				relative;
	float:					left;
}

.lefttopbox
{
	margin-bottom:          25px;
	height:					179px;
}

lefttopbox2
{
	margin-bottom:          25px;
	height:					179px;
}

.leftbottombox
{
	height:					179px;
}

.leftbottombox2
{
	border-top:             #58585a solid 3px;
	border-left:			#58585a solid 3px;
	border-right:			#58585a solid 3px;
	border-bottom:			#58585a solid 3px;
	background-color:		#58585a;
	left:                   -4px;
	top:                    212px;
	position:               absolute;
	height:                 139px;
	float:                  left;
	font-size:              11px;
	color:                  #000000;
	padding-left:			3px;
	padding-right:			3px;
	padding-bottom: 		3px;
	padding-top: 			3px;
	text-align:             left;
    width:                  209px;
}

.lefttopbox .rounded
{
	background-color:		#58585a;
	height:                 36px;
	padding-left:			4px;
	padding-right:			4px;
	padding-bottom: 		2px;
	padding-top: 			2px;
	color:                  #FFFFFF;
}

.leftbottombox .rounded
{
	background-color:		#58585a;	
	height:                 36px;
	padding-left:			4px;
	padding-right:			4px;
	padding-bottom: 		2px;
	padding-top: 			2px;
	color:                  #FFFFFF;
}

.leftboxtopcontent
{
	height:                 139px;
	border-left:			#58585a solid 3px;
	border-right:			#58585a solid 3px;
	border-bottom:			#58585a solid 3px;	
}

.leftboxtopcontent2
{
	border-top:             #58585a solid 3px;
	border-left:			#58585a solid 3px;
	border-right:			#58585a solid 3px;
	border-bottom:			#58585a solid 3px;	
	background-color:		#fff;
	left:                   0px;
	top:                    0px;
	position:               absolute;
	height:                 auto;
	float:                  left;
	background-color:		#FFFFFF;
	font-size:              11px;
	color:                  #000000;
	padding-left:			10px;
	padding-right:			8px;
	padding-bottom: 		8px;
	padding-top: 			8px;
	text-align:             left;

}

.video
{
	border-top:             #58585a solid 3px;
	border-left:			#58585a solid 3px;
	border-right:			#58585a solid 3px;
	border-bottom:			#58585a solid 3px;	
	background-color:		#fff;
	left:                   0px;
	top:                    157px;
	position:               absolute;
	height:                 185px;
	float:                  left;
	background-color:		#FFFFFF;
	font-size:              11px;
	color:                  #000000;
	padding-left:			8px;
	padding-right:			8px;
	padding-bottom: 		8px;
	padding-top: 			8px;
	text-align:             left;

}

.leftboxbottomcontent
{
	height:                 139px;
	border-left:			#58585a solid 3px;
	border-right:			#58585a solid 3px;
	border-bottom:			#58585a solid 3px;		
}

.middlebox 
{
	width: 					410px;
	left:					0px;
	top:					50px;
	position:				relative;
	height: 				383px;
	float:					left;
    background-image:       url(../images/grijsvlak.png);
    background-repeat:      no-repeat;
}

.middleboxslide
{
	width: 					410px;
	left:					295px;
	top:					50px;
	position:				relative;
	height: 				423px;
	float:					left;
	background-image:       url(../images/grijsvlak.png);
	background-repeat:      no-repeat;
}


.strik
{
	position:				absolute;
	left:					-38px;
	top:					-80px;
	z-index:				100;
}


.strikblauw
{
	position:				absolute;
	left:					-110px;
	top:					-80px;
	z-index:				100;
}

.middlebox .rounded
{
	background-color:		#58585a;
	height:                 36px;
	padding-left:			4px;
	padding-right:			4px;
	padding-bottom: 		2px;
	padding-top: 			2px;
	color:                  #FFFFFF;
}

.middleboxslide .rounded
{
	height:					30px;
	padding-top:            8px;
	color:					#FFFFFF;
    background-color:       #58585a;
}


.breadcrumb
{
	width: 					410px;
	top: 					30px;
	height: 				0px;
	position: 				relative;
	left: 					290px;
	text-align:             right;
}

.breadcrumb, .breadcrumb a
{
	color: 					black;
	font-family:            Verdana, Arial, Helvetica, sans-serif;
	font-size:				10px;
	font-variant:           small-caps;
	font-weight:            bold;
	text-decoration:        none;
}



.middleboxcontent
{
	height:                 303px;
	background-color:		#58585a;
	border-left:			#58585a solid 3px;
	border-right:			#58585a solid 3px;
	border-bottom:			#58585a solid 3px;
	color:                  #FFFFFF; 
	font-size:              11px;
	list-style-type:		none;
}

.middleboxcontentslide
{
	height: 				343px;
	position: 				relative;
	/* for ff, not IE */
    left: 					3px;
	color:					#FFFFFF; 
	font-size:				11px;
    width:                  404px;
}

.middleboxcontentcycle
{
	height:                 341px;
	background-color:       #58585a;
	border-left:            #58585a solid 3px;
	border-right:           #58585a solid 3px;
	border-bottom:          #58585a solid 3px;
	color:                  #FFFFFF; 
	font-size:              11px;
	list-style-type:        none;
}


#nav div 
{
	display:				block; 
	margin:					0 5px; 
	display:				inline; 
	text-align:				center; 
	font-size:				11px; 
	font-weight:            bold;
	cursor:					pointer;
    background-color:       #58585a;
}

#middleboxcontentslide .entry 
{
	display:				none; 
	height:					343px;
}

#middleboxcontentslide .entry img
{
	vertical-align:         middle;
}		
.first, .next, .previous, .last 
{
	font-size:				11px; 
	font-weight:            bold;
}




.middleboxcontentcycle2
{
	height:                 343px;
	background-color:       gray;
	border-left:			#58585a solid 3px;
	border-right:			#58585a solid 3px;
	border-bottom:			#58585a solid 3px;
	color:                  #FFFFFF;
	font-size:              11px;
	list-style-type:		none;
}


.selectiontext 
{
	background-color:		#58585a;
	height:                 28px;
	padding-left:			0px;
	padding-right:			0px;
	padding-bottom: 		4px;
	padding-top: 			5px;
	color:                  #FFFFFF;
	font-size:              11px;
	width:                  404px;
}

.text
{
	text-align:				center;
	height:					32px;
	margin-left:            0px;
	margin-right:           0px;
	padding-bottom:         4px;
	padding-top:            4px;
	color:					#FFFFFF;
	font-size:				11px;
	position:				absolute;
	bottom:					0px;
	left: 					0px;
	width:					400px;
}

.text a
{
	text-decoration:        none;
	color:                  #d3c4b5;
	font-weight:            bold;
}

.text a:hover
{
	text-decoration:        none;
	color:                  #fff;

}

.rightbox 
{
	width: 					215px;
	left:					40px;
	top:					50px;
	position:				relative;
	height: 				383px;
	float:					left;
}

.rightbox2
{
	width: 					215px;
	left:					450px;
	top:					0px;
	position:				absolute;
	height: 				383px;
	float:					left;
}

.rightbox3
{
	width: 					215px;
	left:					450px;
	top:					0px;
	position:				absolute;
	float:					left;
}

.rightbox4
{
	width: 					215px;
	left:					40px;
	top:					50px;
	position:				relative;
	float:					left;
        
}

.rightbox5
{
	width: 					215px;
	left:					40px;
	top:					72px;
	position:				relative;
	float:					left;
}

.rightbox .rounded
{

	background-color:		#58585a;
	height:                 36px;
	padding-left:			4px;
	padding-right:			4px;
	padding-bottom: 		2px;
	padding-top: 			2px;
	color:                  #FFFFFF;
}

.rightbox2 .rounded
{
	background-color:		#58585a;
	height:                 36px;
	padding-left:			4px;
	padding-right:			4px;
	padding-bottom: 		2px;
	padding-top: 			2px;
	color:                  #FFFFFF;
}

.rightboxpicture 
{

	height:                 139px;
	border-left:			#58585a solid 3px;
	border-right:			#58585a solid 3px;
	border-bottom:			#58585a solid 3px;		
	background-color:		#ee8ba2
}

.rightboxcontent
{
	height:                 185px;	
	border-left:			#58585a solid 3px;
	border-right:			#58585a solid 3px;
	border-bottom:			#58585a solid 3px;		
	background-color:		#FFFFFF;
	font-size:              11px;
	color:                  #000000;
	padding-left:			10px;
	padding-right:			8px;
	padding-bottom: 		8px;
	padding-top: 			8px;
	text-align:             left;
}

.rightboxcontent3
{
    border-top:             #58585a solid 3px;
	border-left:			#58585a solid 3px;
	border-right:			#58585a solid 3px;
	border-bottom:			#58585a solid 3px;		
	background-color:		#FFFFFF;
	font-size:              11px;
	color:                  #000000;
	padding-left:			10px;
	padding-right:			8px;
	padding-bottom: 		8px;
	padding-top: 			8px;
	text-align:             left;
}


.rightboxcontent4
{
	height:                 160px;	
	border-top:             #58585a solid 3px;
	border-left:			#58585a solid 3px;
	border-right:			#58585a solid 3px;
	border-bottom:			#58585a solid 3px;
	background-color:		#FFFFFF;
	font-size:              11px;
	color:                  #000000;
	padding-left:			10px;
	padding-right:			8px;
	padding-bottom: 		8px;
	padding-top: 			8px;
	text-align:             left;
}

.rightboxcontent a, .rightboxcontent3 a, .rightboxcontent4 a
{
	text-decoration:        none;
	color:                  #d3c4b5;
	font-weight:            bold;
}

#video
{
	
	background:             white;
        
}

.rightboxcontent a:hover
{
	text-decoration:        none;
	color:                  #000;
	font-weight:            bold;
}

.leftboxtopcontent2 a
{

	text-decoration:        none;
	color:                  #d3c4b5;
	font-weight:            bold;
}

.leftboxtopcontent2 a:hover
{
	text-decoration:        none;
	color:                  #000;
	font-weight:            bold;
}

.rightboxcontentfull

{
	height:                 324px;	/* 204-3-8-8*/
	border-left:			#58585A solid 3px;
	border-right:			#58585A solid 3px;
	border-bottom:			#58585A solid 3px;
	background-color:		#FFFFFF;
	font-size:              11px;
	color:                  #000000;
	padding-left:			8px;
	padding-right:			8px;
	padding-bottom: 		8px;
	padding-top: 			8px;
	text-align:             left;

}