@charset "utf-8";
/* CSS Document written by protolan.be */
/*        ALL RIGHTS RESERVED          */
/*      NO MODIFICATION ALLOWED        */

/*-- HTML ELEMENTS --*/
body{
	font-family: 'Open Sans', sans-serif;
	font-size: 1.5em;
	background:url(../htmimg/main-background.jpg) top center no-repeat #EFEFEF;
	margin: 0;
	padding: 0;
	color:#3F5765;
}

p, h1, h2, h3, h4{margin: 0; padding: 0; width: 100%; float: left;}
p{margin-bottom: 1em;}
h1{font-size: 2em; font-weight: bold;}
h3{font-size: 1.8em;}
h4{font-size: 1em; font-weight: bold;}

::selection{background:#FF7F0D; color:#FFFFFF;}

/*-- INPUT FIELDS --*/
input, select, textarea {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.inputfield{width: 100%; padding: 7px; border: 0px; -moz-border-radius: 7px; -webkit-border-radius: 7px; -khtml-border-radius: 7px; border-radius: 7px; color:#989B9D; background:#F0F0F0; border: #DADADA 1px solid; margin-bottom: 5px; font-size: 1em; font-family: 'Open Sans', sans-serif;}

/*-- LINKS --*/
a:link, a:visited{color:#4A606D; text-decoration: none;}
a:hover, a:active, #actief, a.actief{color:#FF7F0D; text-decoration: none;}

/*-- GENERAL ELEMENTS --*/
.fullwidth{
	width: 100%;
	float: left;
	margin: 0px;
	padding: 0px;
	position:relative;
	z-index: 100;
	/*overflow:hidden;*/
}
.strong{font-weight: 700;}
.light{font-weight: 300;}

/*-- LOGO --*/
#logo{width: 100%; float: left; margin-top: 20px; margin-bottom: 20px;}

/*-- SPACER --*/
.spacer{background:#FF7F0D; height: 10px;}

/*-- SEARCHBOX --*/
#zoeken .inputfield{background:#F0F0F0; border: 1px solid #DADADA; color:989B9D; margin: 40px 0px 40px 0px;}
#zoeken #btnZoeken{width: 20px; height: 20px; background:url(../htmimg/zoeken-btn.jpg) top center no-repeat; border: 0px; float:right; margin-top: -67px; padding: 0; margin-right: 10px;}

/*-- HEADER --*/
#header{background:url(../htmimg/transgray.png) repeat; border-bottom: 1px #CFD3D6 solid; font-size: 1.8em;}
#header a{float: left; margin-top: 50px; padding-bottom: 20px;}
#header .border{background:url(../htmimg/header-border.png) bottom right no-repeat;}
#header .row{margin-bottom: 0;}

/*-- CONTENT --*/
#content .row{margin-top: 20px; position:relative; /*display: flex; flex-flow: row column;*/}

/*-- IMAGES --*/
.img-image{width: 23%; float: left; margin: 0 2% 2% 0; background:#E8E8E8; padding-bottom: 4%; position:relative; box-shadow: 0px 25px 15px -20px #888888;}
.img-image img{width: 100%; height: 100%; float: left;}
.img-image .img-plus{width: auto; float: right; margin-top: -30px;}

/*-- NAVIGATIE --*/
#nav{margin-bottom: 20px;}
#nav a{width: 100%; float: left; padding: 5px 0px 5px 0px; background:url(../htmimg/submenu-item.png) bottom right no-repeat; font-size: 1.1em;}
#nav a:link, #nav a:visited{text-decoration: none;}
#nav a:hover, #nav a:active{}

/*-- SHORTCUTS AND INFO --*/
.shortcut{width: 48%; min-height: 280px; float: left; margin-left: 2%; margin-bottom: 20px; background:#E8E8E8;}
.shortcut h3{font-size: 1.2em; font-weight: bold; width: 96%; color:#3F5765; padding: 2%; margin-top: 10px;}
.shortcut p{float: left; width: 96%; padding: 2%;}
.shortcut img{width: 100%; float: left;}

#info h3{color:#3F5765;}
#info h4{color:#FF7F0D; background:url(../htmimg/laatste-posts-bg.jpg) top left no-repeat; padding-left: 20px;}
#info p{padding-bottom: 20px;margin-bottom: 20px; background:url(../htmimg/laatste-posts-bottom.jpg) bottom left no-repeat;}

/*-- CONTENT --*/
#content .main{background:url(../htmimg/content-bg.png) top left repeat-y; padding: 4%; width: 92%; margin: 10px 0 10px 0;}

/*-- FAQ --*/
#faq h3{font-size: 1.3em; font-weight: bold; margin-top: 20px; padding-top: 20px; background: url(../htmimg/spacer700.jpg) top left no-repeat;}
#faq p{margin-bottom: 0;}
#faq ol, #faq li{margin:0;}

/*-- GIDS --*/
.gids-item{ width: 25%; margin: 0 4% 4% 0; float: left; background:#E8E8E8; padding: 2%; word-wrap:break-word;}

/*-- LIST --*/
#list ul{width: 100%; float: left; margin: 0; padding: 0;}
#list li{margin: 0 0 10px 0; padding: 3px; padding-left: 10px; background:url(../htmimg/wizard-bg-blauw.png) left repeat-y; font-size: 16px; float: left;}
#list .up{list-style:url(../htmimg/wizard-right.jpg); list-style-position:inside; }
#list .down{list-style:url(../htmimg/wizard-bottom.jpg); list-style-position:inside; }
#list .green{background:url(../htmimg/wizard-bg-groen.png) left repeat-y; list-style:none;}

/*-- ITEMS --*/
.item{width: 96%; float: left; background:url(../htmimg/content-bg.png) left repeat-y; padding: 3%; margin-top: 20px;}
.item h3, .item p{width: 67%; float: left; margin-left: 3%;}
.item img{width: 30%; float: left;}

/*-- BLOGS --*/
#blogs h4{font-size: 0.9em; font-weight:normal;}
#blogs .spacer{width: 100%; float: left; background:url(../htmimg/spacer700.jpg) top left no-repeat;height: 2px; margin: 20px 0px 20px 0px;}

/*-- ZOEKRESULTATEN --*/
#zoekresultaten p{margin: 0; padding: 0;}
#zoekresultaten .spacer{width: 100%; float: left; background:url(../htmimg/spacer700.jpg) top left no-repeat;height: 2px; margin: 10px 0px 10px 0px;}

/*-- SITEMAP --*/
#sitemap ul, #sitemap li{font-size: 14px;}
#sitemap ul li{list-style-type:square; margin: 0; padding: 0;}

/*-- SUBFOOTER + REGISTRATIE --*/
#subfooter, .subrow{background:#BDD4DE; border-top: 1px #CFD3D6 solid; padding-top: 40px; margin-top: 40px; position:relative; z-index: 100;}
#subfooter h3{color:#3F5765; font-weight: bold;}
.subfooter-button{width: 100%;}
#up{margin: 0; padding: 0; position:relative; z-index: 100;}
#btn-up{float: right; position:relative; z-index: 1000; margin-top: -40px;}

/*-- REGISTRATIE --*/
#registreren{display: none;}

/*-- INLOGGEN --*/
#inloggen{display: none;}

/*-- INLOGGEN --*/
#wachtwoord{display: none;}

/*-- FOOTER --*/
#footer{background:#415968; color:#CCCCCC; border-top: 1px #CFD3D6 solid; padding-top: 20px;}
#footer a:link, #footer a:visited{color:#CCCCCC; text-decoration:underline;}
#footer a:hover, #footar a:active{color:#CCCCCC; text-decoration: none;}
#footer .row .column{text-align:center;}