/**
 Posities: http://www.csstutorial.net/2010/04/3-column-layout/
**/
* { font-family: Arial, Helvetica, sans-serif; }

#page {
	width: 840px; 
	margin: 0 auto;
	font-size: 10pt;
}

/* Header positie */
#header {
	color: black;
}

.column1 {
	width: 260px;
	float: left;
	
	margin: 0;
}

.column2 {
	width: 210px;
	float: left;
	margin-left: 55px; 
}

.column3 {
	width: 260px;
	float: left; 
	margin-left: 55px; 
}

#footer {
	clear: both;
	margin-top: 15px;
	padding-top: 10px; 
	border-top: 1px solid #ddd;  
}

/* De verschillende lijntjes */
.column { border-top: 1px solid #ddd; padding: 5px 0 0 0; }
.clear { clear: both; }

#contact { border-top: 1px solid #ddd; }
#contact .column { border-top-width: 0; }
#contact .column2, #contact .column3 { padding-top: 20px; color: #787A7D; }
#contact a { color: #787A7D; text-decoration: none; }
#contact a:hover { text-decoration: underline; }

#onze_klanten {
	clear: both;
	margin-top: 20px;
	padding-top: 6px; 
	border-top: 1px solid #ddd;  
}

/* Menu */
#menu { margin: 0 0 10px 0; padding: 0; list-style-type: none; } 
#menu li { color: #adb1ad; display: inline; margin-right: 8px; font-size: 12pt; font-weight: normal; }
#menu a { color: #adb1ad; text-decoration: none; }
#menu a:hover { text-decoration: underline; }
#menu .active, #menu .active a { color: #787a7d; }

/* Inhoud van de content kolom */
ul#main_content { margin: 39px 0 0 0; padding: 0; list-style-type: none; }
ul#main_content li { border-bottom: 1px solid #ddd; padding: 10px 0; }
ul#main_content li:last-child { border-bottom-width: 0px; }

#contact ul { margin: 0; padding: 0; list-style-type: none; }
#contact ul li { border-width: 0px; padding: 2px 0 2px 50px; }
#contact .label { color: #787a7d; float: left; margin-left: -50px; }

#direct_mailen label { width: 150px; display: block; float: left; padding-top: 2px; }
#direct_mailen input.text { width: 150px; }
#direct_mailen textarea { width: 150px; height: 100px; }
#direct_mailen input.button { margin-left: 150px; }
#direct_mailen input.text:focus, #direct_mailen textarea:focus { background-color: #FFFD9E; }


/* Invulling verschillende stijlen op de website */
h1 { margin: 20px 0 20px 0; }
h2 { margin: 0 0 10px 0; font-size: 12pt; font-weight: normal; }
h2, h2 a { color: #787a7d; text-decoration: none; }
h2 a:hover { text-decoration: underline; }
h2 .extra { color: #adb1ad; }

h3 { font-size: 12pt; font-weight: bold; color: #272781; margin: 3px 0 0 0; }
h3 a { color: #272781; text-decoration: none; }

p { margin-top: 3px; margin-bottom: 8px; line-height: 120%; }
.tag { font-size: 9pt; color: #787A7D }

/* Portfolio */
ul.portfolio { margin: 0; padding: 0; list-style-type: none; }
ul.portfolio li { border-bottom: 1px solid #ddd; padding: 20px 0 12px 0; }
ul.portfolio li:last-child { border-bottom-width: 0px; }
ul.portfolio img { margin-bottom: 10px; border-width: 0; }

#portfolio2 ul.portfolio img { border: 1px solid #ddd; }

#referenties ul { margin: 0; padding: 0; list-style-type: none; }
#referenties ul li { float: left; display: block; width: 100px; height: 100px; margin: 4px; padding: 5px; overflow: hidden; border: 1px solid #cecece; }
#referenties ul li img { border-width: 0px; }
ul#main_content #referenties li:last-child { border-bottom-width: 1px; } 

.login label { display: inline-block; width: 110px; }

#dubbele_kolom { float: left; width: 520px; margin-left: 50px; }
#dubbele_kolom .portfolio_tekst { width: 260px; float: left; border-top: 1px solid #DDD; padding-top: 22px; }
#dubbele_kolom .portfolio_afbeelding { width: 210px; margin-left: 50px; float: left; border-top: 1px solid #DDD; padding-top: 22px; }
#dubbele_kolom .portfolio_afbeelding img { border-width: 0; }
#dubbele_kolom .portfolio_tekst h3 a { color: #272781; text-decoration: none; }
#dubbele_kolom li { border-bottom-width: 0px; padding-top: 0px; }
#dubbele_kolom li.first div { border-top-width: 0; }


#portfolio_view { margin-top: 32px; }
ul.afbeeldingen { margin: 20px 0 0 0; padding: 0; list-style-type: none; }
ul.afbeeldingen li { border-bottom:1px solid #DDDDDD; padding:12px 0 12px; }

ul.afbeeldingen li:last-child {border-bottom-width:0;}
ul.afbeeldingen li .thumb img { max-width: 260px; border: 1px solid black;}

#image_dialog label { float: left; width: 130px; }
#image_dialog div.form_elements input { width: 360px; }
#image_dialog div.form_elements textarea { width: 360px; height: 180px; }

/* Admin pagina's */
.admin { border-top: 1px solid #ddd; padding: 5px 0 0 0; }
.column_breed { width: 620px; float: left; margin: 0; }
.column_smal { width: 260px; float: left; margin-left: 50px; }

.admin .row label { width: 150px; display: inline-block; }
.admin textarea { width: 400px; }
.admin input.text { width: 400px; }

/* Admin menu */
#admin_menu { margin: 0; padding: 5px 0; list-style-type: none; border-top: 1px solid #ddd; } 
#admin_menu li { color: #adb1ad; display: inline; margin-right: 8px; font-size: 12px; font-weight: normal; }
#admin_menu a { color: #adb1ad; text-decoration: none; }
#admin_menu a:hover { text-decoration: underline; }
#admin_menu .active, #menu .active a { color: #787a7d; }