@charset "UTF-8";
/* CSS Document */
* { padding: 0; margin: 0; }
html, body { height: 100%; }
body { 
	font-family:Arial, Helvetica, sans-serif;
	color: #fff; 
	background-color: #4C3F3A;
}

/* For some reason inputs don't inherit the font-family 
   provide all input fields with this class
*/
.input {
	font-family: Arial, Helvetica, sans-serif;
	font-size:12px;
}

a img { border: 0; }
.banner img { border: 0; }

.intro_tekst {
	font-size: 16px !important;
	font-weight: bold;
	color: #CCC;
}

.orange {
	color: #FC7215; 
}

.content h2 { 
	font-size: 30px; 
	color: #FC7215; 
	padding: 20px 20px 10px 20px; 
	font-weight: normal; 
}

.content p { 
	padding: 0 20px 10px 20px; 
	font-size: 15px; 
}

.clear { clear: both; }

.pageWrap {
	display: block;
	clear: both;
	float: left;
	width: 100%;
	padding: 0 0 30px;
}

.content {
	width: 920px;
	margin: 0 auto 0 auto;
}

.main {
	position: relative;	
}


.header {
	height: 400px;
	background-color: #7C1D19;
	background-image: url('../img/bg.jpg');
	background-repeat: no-repeat;
	background-position: center top;
}

.banner {
	height: 240px;	
}

.logo {
	float:left;
	height: 160px;
	width: 240px;
}

.submenu {
	background-image: url('/media/img/gradient_02.png');
	background-repeat: repeat-x;
}

.bar {
	background-image: url('/media/img/gradient.png');	
	height: 30px;
}

/* MAIN MENU NAVIGATION */
.main_menu {
	float: left;
	height: 50px;
	width: 680px;
	padding-top: 50px;
}
.main_menu ul.level-1 { list-style-type: none; }
.main_menu ul.level-1 li { float:left; }

#home a 					{ display: block; height: 50px; width:  78px; background-image: url('/media/img/navigatie/hoofdnavigatie/home.png'); }
#home a:hover 				{ background-image: url('/media/img/navigatie/hoofdnavigatie/home_f2.png'); }
#home.current a				{ background-image: url('/media/img/navigatie/hoofdnavigatie/home_f2.png'); }
#home.active a				{ background-image: url('/media/img/navigatie/hoofdnavigatie/home_f2.png'); }

#interactiondesign a 		{ display: block; height: 50px; width: 198px; background-image: url('/media/img/navigatie/hoofdnavigatie/interaction_design.png'); }
#interactiondesign a:hover 	{ background-image: url('/media/img/navigatie/hoofdnavigatie/interaction_design_f2.png'); }
#interactiondesign.current a{ background-image: url('/media/img/navigatie/hoofdnavigatie/interaction_design_f2.png'); }
#interactiondesign.active a { background-image: url('/media/img/navigatie/hoofdnavigatie/interaction_design_f2.png'); }

#graphicdesign a 			{ display: block; height: 50px; width: 162px; background-image: url('/media/img/navigatie/hoofdnavigatie/graphic_design.png'); }
#graphicdesign a:hover 		{ background-image: url('/media/img/navigatie/hoofdnavigatie/graphic_design_f2.png'); }
#graphicdesign.current a	{ background-image: url('/media/img/navigatie/hoofdnavigatie/graphic_design_f2.png'); }
#graphicdesign.active a	{ background-image: url('/media/img/navigatie/hoofdnavigatie/graphic_design_f2.png'); }


#webdesign a 				{ display: block; height: 50px; width: 134px; background-image: url('/media/img/navigatie/hoofdnavigatie/web_design.png'); }
#webdesign a:hover 			{ background-image: url('/media/img/navigatie/hoofdnavigatie/web_design_f2.png'); }
#webdesign.current a		{ background-image: url('/media/img/navigatie/hoofdnavigatie/web_design_f2.png'); }
#webdesign.active a         { background-image: url('/media/img/navigatie/hoofdnavigatie/web_design_f2.png'); }


#contact a 					{ display: block; height: 50px; width: 108px; background-image: url('/media/img/navigatie/hoofdnavigatie/contact.png'); }
#contact a:hover 			{ background-image: url('/media/img/navigatie/hoofdnavigatie/contact_f2.png'); }	
#contact.current a			{ background-image: url('/media/img/navigatie/hoofdnavigatie/contact_f2.png'); }
#contact.active a			{ background-image: url('/media/img/navigatie/hoofdnavigatie/contact_f2.png'); }	

/* SUBMENU NAVIGATION */
.submenu ul 		{  list-style-type: none; width: 100%; height: 30px; }
.submenu ul li 		{ float: left; height: 30px; }
.submenu ul li a 	{ display:block; height: 30px; }

/* INTERACTIONDESIGN */
#gebruikersbeleving a 			{ width: 162px; background-image: url('/media/img/navigatie/interactiondesign/gebruikersbeleving.png'); }
#gebruikersbeleving a:hover     { background-image: url('/media/img/navigatie/interactiondesign/gebruikersbeleving_f2.png'); }
#gebruikersbeleving.current a   { background-image: url('/media/img/navigatie/interactiondesign/gebruikersbeleving_f3.png'); }
#gebruikersbeleving.active a    { background-image: url('/media/img/navigatie/interactiondesign/gebruikersbeleving_f3.png'); }

#methodiek a 		  { width: 103px; background-image: url('/media/img/navigatie/interactiondesign/methodiek.png'); }
#methodiek a:hover    { background-image: url('/media/img/navigatie/interactiondesign/methodiek_f2.png'); }
#methodiek.current a  { background-image: url('/media/img/navigatie/interactiondesign/methodiek_f3.png'); }
#methodiek.active a   { background-image: url('/media/img/navigatie/interactiondesign/methodiek_f3.png'); }

/* GRAPHIC DESIGN */
#huisstijl a		  { width: 100px; background-image: url('/media/img/navigatie/graphicdesign/huisstijl.png'); }
#huisstijl a:hover    { background-image: url('/media/img/navigatie/graphicdesign/huisstijl_f2.png'); }
#huisstijl.current a  { background-image: url('/media/img/navigatie/graphicdesign/huisstijl_f3.png'); }
#huisstijl.active a   { background-image: url('/media/img/navigatie/graphicdesign/huisstijl_f3.png'); }

#campagne a           { width: 98px; background-image: url('/media/img/navigatie/graphicdesign/campagne.png'); }
#campagne a:hover     { background-image: url('/media/img/navigatie/graphicdesign/campagne_f2.png'); }
#campagne.current a   { background-image: url('/media/img/navigatie/graphicdesign/campagne_f3.png'); }
#campagne.active a    { background-image: url('/media/img/navigatie/graphicdesign/campagne_f3.png'); }

#pakketten a          { width: 101px; background-image: url('/media/img/navigatie/graphicdesign/pakketten.png'); }
#pakketten a:hover    { background-image: url('/media/img/navigatie/graphicdesign/pakketten_f2.png'); }
#pakketten.current a  { background-image: url('/media/img/navigatie/graphicdesign/pakketten_f3.png'); }
#pakketten.active a   { background-image: url('/media/img/navigatie/graphicdesign/pakketten_f3.png'); }

/* WEBDESIGN */
#werkwijze a		  { width: 107px; background-image: url('/media/img/navigatie/webdesign/werkwijze.png'); }
#werkwijze a:hover	  { background-image: url('/media/img/navigatie/webdesign/werkwijze_f2.png'); }
#werkwijze.current a  { background-image: url('/media/img/navigatie/webdesign/werkwijze_f3.png'); }
#werkwijze.active a	  { background-image: url('/media/img/navigatie/webdesign/werkwijze_f3.png'); }

#advies a			  { width: 80px; background-image: url('/media/img/navigatie/webdesign/advies.png'); }
#advies a:hover	      { background-image: url('/media/img/navigatie/webdesign/advies_f2.png'); }
#advies.current a     { background-image: url('/media/img/navigatie/webdesign/advies_f3.png'); }
#advies.active a	  { background-image: url('/media/img/navigatie/webdesign/advies_f3.png'); }

#ontwerp a			  { width: 93px;  background-image: url('/media/img/navigatie/webdesign/ontwerp.png'); }
#ontwerp a:hover	  { background-image: url('/media/img/navigatie/webdesign/ontwerp_f2.png'); }
#ontwerp.current a    { background-image: url('/media/img/navigatie/webdesign/ontwerp_f3.png'); }
#ontwerp.active a	  { background-image: url('/media/img/navigatie/webdesign/ontwerp_f3.png'); }

/* These go for multiple menu's */
#tarieven a 		  { width: 91px;  background-image: url('/media/img/navigatie/graphicdesign/tarieven.png'); }
#tarieven a:hover     { background-image: url('/media/img/navigatie/graphicdesign/tarieven_f2.png'); }
#tarieven.current a   { background-image: url('/media/img/navigatie/graphicdesign/tarieven_f3.png'); }
#tarieven.active a    { background-image: url('/media/img/navigatie/graphicdesign/tarieven_f3.png'); }

#portfolio a 		  { width: 100px; background-image: url('/media/img/navigatie/graphicdesign/portfolio.png'); }
#portfolio a:hover    { background-image: url('/media/img/navigatie/graphicdesign/portfolio_f2.png'); }
#portfolio.current a  { background-image: url('/media/img/navigatie/graphicdesign/portfolio_f3.png'); }
#portfolio.active a   { background-image: url('/media/img/navigatie/graphicdesign/portfolio_f3.png'); }



.content .col { float: left; width: 300px; margin-top: 10px; padding-bottom: 10px; }
.hoekje { background-image: url('/media/img/hoekje.png'); background-repeat: no-repeat; }

.content .column1 { margin-right: 10px; }
.content .column2 { margin-right: 10px; }
.content .column3 { }

.index02_column1 { float:left; height: 170px; width: 600px; }
.index02_column2 { float:left; width: 300px; position:relative; margin-right:10px; }
.index02_column3 { float:left; width: 300px; position:relative; }
.index02_column4 { float:left; width: 300px; }

.afbeelding {
	margin-top: 0;
	margin-right: 20px;
	margin-bottom: 0;
	margin-left: 20px;
	}

#footer {
	margin-top: 20px;
	background-image: url('/media/img/footer_background.png');
	background-repeat:no-repeat;
	background-position:bottom;
}

#footer .footer_col {
	float: left;
	height: 120px;
	margin-top: 20px;
}

#facets { margin-left: 20px; width: 170px; }
#contact_footer { width: 150px; }
#links { width: 210px; }
#copyright { width: 350px; }

.button_leesmeer {
	float: right;
	margin-right: 20px;
	margin-top: 10px;
}

.footer_tekst {
	font-size: 12px !important;
	color: #DDA993;
	text-decoration: none;
	line-height: 20px;
}
.footer_tekst a { color:#DDA993; text-decoration:none; }
.footer_tekst a:hover { text-decoration:underline; }

.tbl_portfolio {
	table-layout:fixed;
}

.tbl_portfolio td {
	width: 205px;
	height: 140px;
}

.tbl_portfolio a { display: block; height: 140px; width: 205px; }

div.portfolio {
	margin-top:10px;
}

.portfolio h2 {
	height: 80px;	
}

h3 {
	font-size: 36px;
	color: #DDA993;
	padding: 20px 20px 10px 20px;
	font-weight: normal;
}

h3 span {
	font-size: 24px;
	
}

h4 {
	font-size: 16px; 
	color: #FC7215; 
	font-weight: normal; 
	padding-left: 20px;
}

.two_cols_col1{
	width:610px; 
	float:left; 
	margin-right:10px;
}

#uurtarieven {
	width:920px;
	overflow:auto;
	margin-bottom: 20px;
}

#uurtarieven div {
	float:left;	
	line-height: 20px;
}

#uurtarieven .row {
	height: 20px;	
}

#uurtarieven .cell1 {
	width: 600px;
	margin-left: 20px;
}

#uurtarieven .cell2 {
	width: 160px;
}

#uurtarieven .cell3 {
	width: 140px;	
}

.bgcolor1 {
	background-color: #5E4E49;
}

.mailto {
	text-decoration: none;	
	color: white;
}

.mailto:hover {
	text-decoration: underline; 
}	

.tbl_tarieven {

}

.tbl_tarieven .tr1 {
	height: 80px;
}

.tbl_tarieven .td_empty {
	width: 10px;
	height: 25px;
}

.tbl_tarieven .bgcolor { background-color: #5E4E49; }
.tbl_tarieven td.w1 { width: 142px; }
.tbl_tarieven td.w2 { width: 494px; }
.tbl_tarieven tr.h1 { height: 50px; }

