/*
#####################################################################
#	Algemeen														#
#####################################################################
*/
/* Margin- en padding-reset
-------------------------------------------------------------------*/
body, html, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, form, object, input, select { margin: 0; padding: 0; }

/* Html & body
-------------------------------------------------------------------*/
html { font: 62.5%/200% Arial, Verdana, Tahoma, sans-serif; overflow-y: scroll; }
body { overflow: hidden; font-size: 1.2em; }

/* Algemene classnames
-------------------------------------------------------------------*/
.nomargin, .nom { margin: 0; }
.nopadding .nop { padding: 0; }
.nomp { margin: 0; padding: 0; }

.block { display: block; }
.inline { display: inline; }

.center { display: block; margin: auto; }

.hide, .hidden { position: absolute; left: -9999px; }

.fleft { float: left; }
.fright { float: right; }

.clear { clear: both; }
.cleft { clear: left; }
.cright { clear: right; }

.tcenter { text-align: center; }
.tleft { text-align: left; }
.tright { text-align: right; }

.vbottom { vertical-align: bottom; }
.vmiddle { vertical-align: middle; }
.vtop { vertical-align: top; }

.absolute { position: absolute; }
.relative { position: relative; }

.bold, .b, .strong { font-weight: bold; }
.em, .italic, .i { font-style: italic; }
.normal { font-weight: normal; }
.u, .underline { text-decoration: underline; }
.small { font-size: 11px; }
.lower { text-transform: lowercase; }
.upper { text-transform: uppercase; }
.capitalize { text-transform: capitalize; }

.wide { width: 100%; }

.default { cursor: default; }
.pointer { cursor: pointer; }

/* Afbeeldingen
-------------------------------------------------------------------*/
img { border: none; display: block; vertical-align: middle; }

/* Flash
-------------------------------------------------------------------*/
object { display: block; }

/* Alinea's en paragafen
-------------------------------------------------------------------*/
p, div.alinea { margin-bottom: 1.2em; }

/* Overflow en clearfix
-------------------------------------------------------------------*/
.overflow { overflow: hidden; }
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}

/* Headings
-------------------------------------------------------------------*/
h1 { 
	font-size: 1.8em;
	margin-top: 25px;
}

body#component-homepage h1 { 
	margin-top: 0;
	padding: 15px 0 0 265px;
	background: #a9da6f;
	height: 30px;
	margin-bottom: 0;
}

h2 { font-size: 1.5em; }
h3 { font-size: 1.2em; }
h4 { font-size: 1em; }

/* Hyperlinks
-------------------------------------------------------------------*/
a { color: #ff9d00; text-decoration: none; }
a:hover { text-decoration: none; color: #A9DA6F; }

a:hover, a:focus, a.none { text-decoration: none; color: #A9DA6F; }
a.none:hover, a.none:focus { text-decoration: underline; }
a span { cursor: pointer; }

a.externe-link,
a[rel*=external],
a[href^="http:"] {
	color: #ff9d00;
	text-decoration: none;
}

a.externe-link:hover,
a[rel*=external]:hover,
a[href^="http:"]:hover {
	text-decoration: none; 
	color: #A9DA6F; 
}

/* Lijsten
-------------------------------------------------------------------*/
ul, form ol { list-style: none; }

/* Formulieren
-------------------------------------------------------------------*/
label { display: block; vertical-align: middle; }
.keuze label { display: inline; }
input { vertical-align: middle; }
input.text, textarea { padding: 2px 3px; vertical-align: middle; width: 60%; }
textarea { font-size: 12px; overflow: auto; }
select { vertical-align: middle; width: 62%; }
select.auto, li.form-input-date select { width: auto; }
textarea { height: 80px; }
input, select, textarea { font-family: Arial, Verdana, Tahoma, sans-serif; }
input.radio, input.checkbox { margin: 0; margin-right: 6px; }
input.button, input.submit { cursor: pointer; overflow: visible; }

fieldset.none { border: none; margin: 0; padding: 0; }
fieldset.none legend { display: none; }
form li { padding: .2em 0; margin-bottom: 5px; }
form .keuze li { margin-bottom: 0; padding: 0; }
form em.verplicht { margin-left: 4px; }
form img.unitip { display: inline; }

li.checkbox { position: relative; }
li.checkbox input.checkbox { left: 0; position: absolute; top: 3px; }
li.checkbox label { margin-left: 20px; }

/* Tabellen
-------------------------------------------------------------------*/
th, td { padding: 3px; }
th { text-align: left; }

/* Highlighted
--------------------------------------------------------------------*/
.highlighted { background-color: #ff7200; color: #fff; }

/* Overig
-------------------------------------------------------------------*/
address { font-style: normal; }

/*
#####################################################################
#	Standaard-elementen												#
#####################################################################
*/

/* Illustraties
-------------------------------------------------------------------*/
p.illustratie img { margin: 0 auto; }
p.illustratie span {
	display: block;
	font-size: .9em;
	font-style: italic;
	text-align: center;
}
img.illustratie {
	float: right;
	margin-right: 0; margin-left: 8px;
}
img.illustratie-links {
	float: left;
	margin: .5em 8px .3em 0;
}
div.zijkolom img.illustratie {
	display: block;
	float: none;
	margin: 0 auto 2em;
}

/* Preview
-------------------------------------------------------------------*/
div.preview { margin-bottom: 2em; }
div.preview h2 { font-size: 1.3em; }
div.preview p { margin-bottom: 0; }

/* Zoekresultaten
-------------------------------------------------------------------*/
div.zoekresultaat { margin-bottom: 1.2em; }

/* Optie-menu (mail & stuur door)
-------------------------------------------------------------------*/
ul#opties { float: right; padding: 10px; }
ul#opties li { float: left; margin-left: 14px; }
ul#opties a {
	background: url(/img/opties.gif) no-repeat 0 .5em;
	color: #808080;
	display: block;
	padding-left: 18px;
}
ul#opties a.mail { background-position: -289px .4em; }

/* Error-menu
-------------------------------------------------------------------*/
ul.errors, ol.errors, li.input-error, div.form-error {
	background: #ffd6d5;
	border: 1px solid #f7403a;
	color: #f7403a;
	margin: 1em 0;
	padding: .2em 0;
}
ul.errors li, ol.errors li { 
	list-style: disc;
	margin: 0 0 0 20px;
	padding: .2em 0; 
}

li.input-error,
div.form-error { padding: 5px; }

li div.input-error,
div.form-error { font-weight: bold; }

/* FCK-editor-lijst
-------------------------------------------------------------------*/
div.alinea ul { list-style: disc; }
div.alinea ul, div.alinea ol { margin: 1em 0 1em 16px; }
div.alinea ol { margin-left: 24px; }

/* Sitemap
-------------------------------------------------------------------*/
ul.sitemap { list-style: disc; margin: 0 0 1em 24px; }

/* Webbeheer formulier
-------------------------------------------------------------------*/
div.webbeheer-formulier-thanks {
	background: none repeat scroll 0 0 #E1FFCD;
	border: 2px solid #56A721;
	line-height: 140%;
	padding: 8px;
}
div.webbeheer-formulier-thanks p { margin-bottom: 0; }

/* Zoekformulier
-------------------------------------------------------------------*/
form#zoeken, form.zoekformulier fieldset { float: right; }
form#zoeken input { float: left; }
form#zoeken input.text { margin-right: 8px; width: 160px; }

/* FCK-editor-tabel
-------------------------------------------------------------------*/
div.alinea table,
table.webapp-table {
	border: none;
	border-collapse: collapse;
	border-spacing: 0;
	color: #545454;
	width: 100%;
}

div.alinea table caption,
table.webapp-table caption {
	font-style: italic;
	margin: 1em 6px 3px;
	text-align: left;
}

div.alinea table td,
div.alinea table th,
table.webapp-table td,
table.webapp-table th {
	border: 1px solid #d8d8d8;
	padding: .2em 4px;
}

/* Container
-------------------------------------------------------------------*/
div#container-wrapper {
	width: 100%;
	position: absolute;
	z-index: 3;
	background: url(/img/background.png) repeat-y center;
}

body#component-homepage div#container-wrapper {
	 background: url(/img/backgroundhomepage.png) repeat-y center;
}

div#container {
	margin: 0 auto;
	width: 960px;
}

/* Denneappel
-------------------------------------------------------------------*/
div#denneappel	{ 
	position: absolute;
	margin: 167px 0 0 168px;
	background: url(/img/denneappel.png) no-repeat;
	min-width: 83px;
	min-height: 93px;
	z-index: 3;
}

/* Header 
-------------------------------------------------------------------*/
img#logo { float: left; }

div#header	{
	background: #FFF;	
	height: 236px;
}

div#header-fader {
	width: 762px;
	height: 232px;
	margin: 0 4px 0 194px; 
	position: relative;
	background: url(/img/backup.jpg) no-repeat;
}

div#header-fader img {
	border-bottom: 4px solid white;
}
div#header-content {
	float: right;
	position: relative;
	width: 766px;
	height: 232px;
}

div#header-content p {
	padding: 10px 40px;
}

/* Hoofdmenu
-------------------------------------------------------------------*/
ul#hoofdmenu { 
	margin: 32px 2px 20px 6px;
	padding: 8px 0 8px 0;
	background: #9acb60;
	border-radius: 4px;
	-moz-border-radius: 4px;
 }
ul#hoofdmenu li { float: left; }

ul#hoofdmenu a { 
	display: block; 
	margin: 0px 6px 0 6px;
	padding: 8px 0 8px 10px;
	width: 156px;
	font-weight: bold;
	color: #333333; 
	border-top: 1px solid #91c354;
	border-bottom: 1px solid #a4d471;
	border-radius: 4px;
	-moz-border-radius: 4px;
	text-decoration: none;
}

ul#hoofdmenu a.active,



ul#hoofdmenu a:hover { 
	background: #FFF url(/img/arrowright.png) no-repeat 150px 12px;
}

ul#hoofdmenu ul {
	clear: both;
	display: none;
	width: 200px;
}

ul#hoofdmenu li.active ul { display: block;}

ul#hoofdmenu li.subpagina a {
	display: block;
	margin-left: 10px;
	padding: 4px 4px;
	position: relative;
}

ul#hoofdmenu li.active li.subpagina a {
	background: #a9da6f;
	color: #FFF;
}

ul#hoofdmenu li li.subpagina a.active,
ul#hoofdmenu li li.subpagina a:hover {
	background: #FFF;
	color: #a9da6f;
}


/* Contactinfo
-------------------------------------------------------------------*/
dl.contact {
	display: block;
	background: #ffffff url(/img/gradientback.gif) repeat-x bottom;
	margin: 0 2px 5px 8px;
	padding: 8px 0 8px 15px;
	border-radius: 4px;
	-moz-border-radius: 4px;
}

dl.contact dt {
	color: #156b31;
	font-size: 18px;
	margin-bottom: 10px;
}

dl.contact dd {
	color: #6a6a6a;
	font-size: 14px;
}

a.mail { display: block; margin-top: 15px; padding-left: 22px; background: url(/img/mail.png) no-repeat; }
span.phone { display: block; padding-left: 22px; background: url(/img/phone.png) no-repeat; }

/* Breadcrumbs
-------------------------------------------------------------------*/
p#breadcrumbs { background: #ffffff; margin-left: 15px; font-size: 10px; }

/* Kolommen
-------------------------------------------------------------------*/
div.kolom-wrapper {
	float: left;
	width: 675px;
}
body#component-homepage div.kolom-wrapper {
	width: 770px;
}

div.kolom-wrapper-rechts { float: right; }

div.kolom-midden {
	float: right;
	padding: 10px;
	width: 430px;
}

body#component-homepage div.kolom-midden {
	padding: 0 4px 0 4px;
}

div.kolom-wrapper-rechts div.kolom-midden { float: left; }
div.kolom-wrapper-rechts div.kolom-midden-breed,
div.kolom-midden-breed { float: none; width: auto; }

div.zijkolom { min-height: 10px; overflow: hidden; }

div.kolom-links {
	float: left;
	width: 186px;
	margin: 0;
}
div.kolom-rechts {
	float: right;
	width: 230px;
	margin: 0;
	padding-top: 35px;
}

/* Inhoud kolom-midden
-------------------------------------------------------------------*/
div.kolom-midden h1 { margin-bottom: 1em; }
div.kolom-midden h2 { margin-bottom: .3em; }

/* Inhoud kolom-rechts
-------------------------------------------------------------------*/
a.knop {
	display: block;
	height: 38px;
	width: 220px;
	padding: 14px 0 0 15px;
	text-decoration: none;
	color: #000;
}

a.oranje {
	background: url(/img/highlighted.png) no-repeat;
	color: #000;
}

a.oranje:hover {
	background: url(/img/highlightedhover.png) no-repeat;
	color: #000;
}

a.home {
	float:right;
}

a.first {
	position: absolute;
	margin-top: -55px;
	z-index: 3;
}

a.blauw {
	background: url(/img/buttonblue.png) no-repeat;
	color: white;
}

a.blauw:hover {
	background: url(/img/buttonbluehover.png) no-repeat;

}

/* Fotolijstje
-------------------------------------------------------------------*/
div.fotolijstje {
	height: 356px;
}

div.fotolijstje img { 
	margin: 9px 0 0 -12px; 
	position: absolute;
	z-index: 1;
}

div.foto2,
div.foto1 {
	background: url(/img/image.png) no-repeat;
	width: 263px;
	height: 184px;
	position: absolute;
	margin-left: -23px;
	z-index: 2;
}

div.foto2 {
	background: url(/img/image2.png) no-repeat;
	margin-top: 175px;
}

div.fotolijstje img.foto2 {
	margin-top: 180px;
}

/* Social Media
-------------------------------------------------------------------*/
div.socialmedia {
	margin: 0px 5px 15px 4px;
	float: left;
}

div.socialmedia p {
	margin-bottom: 5px;
}

a.icon {
	width: 36px;
	height: 36px;
	float: left;
	display: block;
	margin-right: 2px;
	padding-right: 0;
}

a#twitter {
	background: url(/img/twitter.png) no-repeat;
}

a#hyves {
	background: url(/img/hyves.png) no-repeat;
}

a#facebook {
	background: url(/img/facebook.png) no-repeat;	
}

/* Homepage
-------------------------------------------------------------------*/
div.homeintroachtergrond {
	background: url(/img/homeintroback.jpg) no-repeat #838071;
	width: 762px;
	min-height: 381px;
	padding-bottom: 20px;
}

dl.homeintrotekst {
	padding: 25px 20px 5px 265px;
}

dl.homeintrotekst div.bold {
	color: #fff;
	font-size: 14px;
	font-weight: normal;
}

dl.homeblokken {
	height: 291px;
}

dl.homeblok { 
	width: 258px;
	float: left;
	margin: 4px 4px 0 0;
}

dl.homeblok dt {
	font-size: 16px;
	font-weight: bold;
	padding: 15px 15px 10px 15px;
}
dl.homeblok dt, dl.homeblok dt a { color: #364525; }

dl.homeblok dd {
	color: #4b4942;
	font-size: 14px;
	height: 50px;
}

dl.homeblok p {
	padding: 0 15px 0 15px;
}

dl.groen {
	background: #a9da6f;
	padding: 0px;
	height: 274px;
}

dl.groen img {
	margin: 16px 0 0 0;
	vertical-align: bottom;
}

dl.wit {
	width: 220px;
	padding: 25px 0 0 8px;
	height: 250px;
	background: #ffffff url(/img/gradientback.gif) repeat-x bottom;
}

dl.wit dd { height: 50px; }

dl.wit dd.icons { padding-left: 15px; }

.clickable-hover {
    cursor: pointer;
}

dl#twitter { height: auto; min-height: 274px; padding-right: 8px; padding-top: 0; width: 212px; }
dl#twitter dt { padding: 6px 0 0; }
dl#twitter dt a { font-size: 12px; }
dl#twitter dt a img { margin-bottom: 6px; }
dl#twitter dd { font-size: 12px; height: auto; line-height: 120%; }
dl#twitter .ifader-item { padding: 5px 0; }
dl#twitter span.date { display: block; font-size: 11px; }
dl#twitter .user-name, dl#twitter .profile-pic { display: none; }

/* Fotoalbum
-------------------------------------------------------------------*/
a.albumfoto { margin: 0 4px 4px 0; float:left; }
a.albumfoto:hover { border: 1px solid #a9da6f; margin: 0 2px 2px 0; }

/* Formulier
-------------------------------------------------------------------*/
form.webbeheer-formulier {
	color: #585c47;
}

form.webbeheer-formulier legend {
	font-size: 14px;
	display: block;
	background: #a9da6f;
	border: 1px solid #9acb60;
	padding: 8px 0 8px 5px;
	width: 400px;
}

form.webbeheer-formulier fieldset {
	border: none;
}

form.webbeheer-formulier input.button {
	float: right;
	background: #9acb60;
	color: #fff;
	border: 1px solid #a9da6f;
	font-size: 1em;
	padding: 0px 4px;
	margin-top: 4px;
}

form.webbeheer-formulier input.button:hover { background: #a9da6f; border: 1px solid #9acb60; }

form.webbeheer-formulier h2 {
	margin-top: 5px;
	color: #202a23;
	font-weight: normal;
}

/* Footer
-------------------------------------------------------------------*/
div#footer { 
	padding: 10px; 
	width: 516px; 
	margin: 1em 0 1em 190px;
}
div#footer p { margin-bottom: 0; }

/* SupersizeMe
-------------------------------------------------------------------*/
#supersizeme {
	position: fixed;
}
#supersizeme img, #supersizeme a {
	height: 100%;
	width: 100%;
	position: absolute;
}

/* iFader
------------------------------------------------------------------*/
div.ifader { position: relative; }
div.ifader ul.ifader-nav { position: absolute; z-index: 5; }	/* Indien deze boven de items moet komen te liggen */
div.ifader div.ifader-item { left: 0; position: absolute; top: 0; z-index: 0; }