body {
	width: 95%;
	margin: 15px auto;
	font-family: "Lucida Sans", sans-serif;
}

* {
    box-sizing: border-box;
}

a:link, a:visited {
	text-decoration: none;
	color: inherit;
}
a:hover, a:active {
	text-decoration: underline;
	color: inherit;
}

.pagina {
	padding-top: 15px;
}

.row::after {
    content: "";
    clear: both;
    display: table;
}

[class*="col-"] {
    float: left;
    padding: 15px;
    width: 100%;
}

/* Header */
.header_foto {
	display: none;
	position: relative;
	float: right;
	width: 600px;
	max-width: 60%;
	height: 180px;
	border-radius: 7px 7px 0 0;
}
.header_img {
	position: absolute;
	top: 0;
	width: 100%;
	height: auto;
}


/* Menu */
.menu {
	display: none;
	width: 100%;
}

.menu_content {
	float: right;
	width: 100%;
	background-color: green;
	border-radius: 0 0 7px 7px;
}

.menu_content a {
	display: inline-block;
	color: white;
	padding: .7em 1.4em;
	text-decoration: none;
	text-align: center;
	float: left;
	border-right: 1px solid white;
	transition: .1s;
	-webkit-transition: .1s;
}

.menu_content a:first-child {
	border-radius: 0 0 0 7px;
}
.menu_content a:last-child {
	float: right;
	border-right: none;
	border-left: 1px solid white;
	border-radius: 0 0 7px 0;
}

.menu_content a:hover {
	background-color: #2BA31D;
}

.active {
	background-color: #2BA31D;
}

/* Dropdown Menu */
.dropmenu {
	width: 100%;
	position: relative;
}

.dropbtn {
	background-color: green;
	color: white;
	padding: 5px;
	font-size: 40px;
	border: none;
	border-radius: 0 0 7px 7px;
	cursor: pointer;
	width: 100%;
	text-align: center;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.dropdwn_content {
	display: none;
	position: absolute;
	width: 100%;
	background-color: rgba(255, 255, 255, 0.4);
}

.dropdwn_content a {
	display: block;
	color: white;
	padding: 5px;
	margin: 1px 0;
	text-decoration: none;
	background-color: green;
	text-align: center;
	border-radius: 7px;
	transition: .1s;
	-webkit-transition: .1s;
}

.dropdwn_content a:hover {
	background-color: #2BA31D;
}

.dropmenu:hover .dropdwn_content,
.dropmenu:focus .dropdwn_content {
	display: block;
}

.dropmenu:hover .dropbtn, 
.dropmenu:focus .dropbtn { 
	background-color: #2BA31D;
}


/* Home */
.home_stuk {
	padding-right: 30px;
}

.home_img {
	display: block;
	width: 100%;
	height: 250px;
	margin-bottom: 20px;
	overflow: hidden;
}
.home_img2 {
	display: none;
	width: 100%;
	height: 130px;
	overflow: hidden;
}

.home_titel {
	text-transform: uppercase;
	text-align: center;
	font-size: 85%;
	border-bottom: 1px solid green;
}

.home_tekst {
	
}


/* Campagnes */
.project {
	position: relative;
	display: inline-block;
	float: left;
	padding: 0;
	margin-bottom: 20px;
}

.project_img {
	width: 90%;
	height: 110px;
	margin: 0 10px;
}

.project_content {
	width: 100%;
	display: none;
	position: absolute;
	box-shadow: 3px 2px 8px rgba(0, 0, 0, 0.6);
	z-index: 999;
	background-color: white;
	border-radius: 4px;
}
.project_content img:focus .project_content {
	display: none;
}

.project_tekst {
	text-align: center;
	padding: 10px;
}

.project:hover .project_content,
.project:focus .project_content {
	display: block;
}


/* Aanbevelingen */
.aanbeveling {
	width: 100%;
	border: 1px solid green;
	box-shadow: 1px 2px 7px rgba(0, 0, 0, 0.4);
	border-radius: 8px;
	margin-bottom: 25px;
	transition: .7s;
}

.aanbeveling:hover, 
.aanbeveling:focus {
	box-shadow: 2px 3px 8px rgba(0, 0, 0, 0.8);
}

.aanbeveling_persoon {
	width: 100%;
	height: 100px;
	background-color: rgba(52, 120, 35, 0.2);
	margin: 0;
	padding: 10px 15px;
	border-radius: 8px 8px 0 0;
}

.aanbeveling_persoon img {
	float: left;
	width: 80px;
	height: 80px;
	border-radius: 50%;
}

.aanbeveling_persoon p {
	float: left;
	padding-left: 25px;
	font-size: 14px;
}

.aanbeveling_tekst {
	padding: 15px;
}


/* Nieuws */
#nieuwsitem {
	margin-bottom: -10px;
}



/* Sidebar */
.sidebar {
	background-color: rgba(43, 163, 29, .14);
	text-align: center;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
}

.contact {
	width: 50%;
	float: left;
}

.fb_plugin_kl {
	width: 50%;
	float: right;
	text-align: center;
	
}
.fb_plugin_m {
	display: none;
	width: 50%;
	float: right;
	text-align: center;
}
.fb_plugin_gr {
	display: none;
	width: 100%;
	float: none;
	text-align: center;
}



/* Mobiele telefoons */
[class*="col-"] {
    width: 100%;
}


@media only screen and (max-width: 460px) {
	/* Alleen Aanbevelingen */
	
	.aanbeveling_persoon {
		height: 70px;
	}
	.aanbeveling_persoon img {
		width: 50px;
		height: 50px;
	}
	.aanbeveling_persoon p {
		font-size: 12px;
		margin-top: 3px;
	}
	
}

@media only screen and (min-width: 641px) {
    /* Tablets */
	body {
		width: 90%;
		margin: 15px auto;
	}
	
	.header_foto {
		display: block;
		overflow: hidden;
		padding: 0 !important;
	}
	
	.fb_plugin_kl {
		display: none;
	}
	.fb_plugin_m {
		display: block;
	}
	
	.project_content {
		width: 115%;	}

    .col-m-1 {width: 8.33%;}
    .col-m-2 {width: 16.66%;}
    .col-m-3 {width: 25%;}
    .col-m-4 {width: 33.33%;}
    .col-m-5 {width: 41.66%;}
    .col-m-6 {width: 50%;}
    .col-m-7 {width: 58.33%;}
    .col-m-8 {width: 66.66%;}
    .col-m-9 {width: 75%;}
    .col-m-10 {width: 83.33%;}
    .col-m-11 {width: 91.66%;}
    .col-m-12 {width: 100%;}
}

@media only screen and (min-width: 1025px) {
    /* Desktop */
	body {
		width: 85%;
		margin: 15px auto;
	}
	
	.dropmenu {
		display: none;
	}	
	.menu {
		display: block;
	}
	
	.header_img {
		top: -80px;
	}
		
	.fb_plugin_m {
		display: none;
	}
	.fb_plugin_kl {
		display: block;
		float: none;
	}
	.contact {
		width: 100%;
		float: none;
	}
	
	.home_stuk {
		float: left;
	}
	.home_img {
		display: none;
	}
	.home_img2 {
		display: block;
	}
	.home_titel {
		margin-bottom: 2em;
		font-size: 70%;
		height: 60px;
	}
	
	.project_content {
		width: 150%;
	}
	
	.col-1 {width: 8.33%;}
    .col-2 {width: 16.66%;}
    .col-3 {width: 25%;}
    .col-4 {width: 33.33%;}
    .col-5 {width: 41.66%;}
    .col-6 {width: 50%;}
    .col-7 {width: 58.33%;}
    .col-8 {width: 66.66%;}
    .col-9 {width: 75%;}
    .col-10 {width: 83.33%;}
    .col-11 {width: 91.66%;}
    .col-12 {width: 100%;}
}

@media only screen and (min-width: 1300px) {
	/* Alleen FB-Plugin */
	.fb_plugin_kl {
		display: none;
	}
	.fb_plugin_m {
		display: block;
		float: none;
	}
}
@media only screen and (min-width: 1500px) {
	/* Alleen FB-Plugin */
	.fb_plugin_m {
		display: none;
	}
	.fb_plugin_gr {
		display: block;
	}
}