@font-face {
	font-family: DIN;
	src: url("./fonts/DIN-Medium.otf") format("opentype");
}
@font-face {
	font-family: DIN-Light;
	src: url("./fonts/DIN-Light.otf") format("opentype");
}
body {
	background-attachment: fixed;
	background-image: url(../images/background.jpg);
	background-repeat: no-repeat;
	background-position:center center;
	font: 15px/1.55 DIN, sans-serif, Helvetica, Arial;
	-webkit-background-size: cover; 
	-moz-background-size: cover; 
	-o-background-size: cover;
	background-size: cover;
}
*{
	margin:0;
	padding:0;
}
a {
	color: #504f50;
}
a:hover {text-decoration:none; color: #9ac23b}
.container {
	width: 820px;
	margin: 0 auto;	
	background: #9ac23b;	
}
.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
.clearfix {
    display: inline-block;
}
html[xmlns] .clearfix {
    display: block;
}
* html .clearfix {
    height: 1%;
}
.header {
	margin-bottom: 15px;
	height: 165px;
	background-image: url(../images/header.jpg);
	background-repeat: no-repeat;
	background-position: bottom left;
}
tr.header {
	margin-bottom: 15px;
	height: 10px;
	background-image: none;
	background-repeat: no-repeat;
	background-position: bottom left;
}
.topmenu {
	width: 492px;
	background: #504f50;	
	float: left;
	padding-left: 10px;
}
.topmenu ul, #menu ul {
	list-style:none;
	margin: 0;
	padding: 0;
	z-index: 9999;
}
.topmenu a, #menu a {
	color: #fff;
    text-decoration:none;	
}
.topmenu ul > li {
	display: inline;
	display:inline-block;
	float:left;
	padding: 1px 9px;
	border-left: 2px solid #9ac23b;
	border-right: 2px solid #9ac23b;
	font-size: 17px;
}
.topmenu ul > li ul > li {
	border-left: 0px solid #9ac23b;
	border-right: 0px solid #9ac23b;
	font-size: 14px;
}
.fb_iframe_widget span{
    vertical-align: top !important;
    /*width: auto !important;*/
    height: auto !important;
    display: inline-block !important;
}
.logo-box {
	width: 318px;
	background: #504f50;
	float: left;
}
.logo-box a{
	float:left;
}
.lang-box {
	float:right;
	padding: 15px;
}
.lang-box img {
	width: 33px;
}
.logo-box a img {
    vertical-align: bottom;
}

.lang-box a {
	margin-left:3px;
	float: left;
}
.lang-box a img{ vertical-align:top;}
.search-box {
	float: right;
	margin-top: 34px;
	margin-right: 15px;
}
.search-box input{
	border:none;
	padding: 3px 10px;
	width: 155px;
}
#menu {
	border-top:6px solid #aedfe5;
	font-size: 17px;
}
#menu > ul > li a*{
	text-decoration:none;
	display:inline-block; width:100%;
	position:relative;
    text-decoration:none;
}
#menu > ul > li {
	display: inline;
	display:inline-block;
	width: 172px;
	margin: 0 2px 3px;
	background: #504f50;
	color: #fff;
	float:left;
	padding: 1px 15px;
	font-family:DIN-Light;
	font-weight:bold;
	font-size: 15px;
}
#menu .first {
	margin-left: 0;
}
#menu .last {
	margin-right: 0;
}
#menu > ul > li > ul {
	display:none;
	background: #FFF;
	position:absolute;
	width: 187px;
}
#menu > ul > li:hover, #menu > ul > li:active {
	background: #9ac23b;
}
#menu > ul > li:hover > ul {
	display: block;
}
#menu > ul > li > ul a{
	display: block;
	color: #504f50;
	padding: 0px 15px;
}
#menu > ul > li > ul a:before, .more-info:before{
	content:'\2192\0000a0';
}
#menu > ul > li > ul a:hover{
	font-weight:bold;
}
#menu .row2{
	margin-bottom: 0 !important;
}
.slideshow {vertical-align: bottom; width:100%;}
.content {
	background:#fff;
	border-bottom: 6px solid #9ac23b;
	position:relative;
	font-size: 14px;
	width:100%;
	box-sizing:border-box;
}

.article {
	padding: 10px 15px 10px 15px;
	width: 800px;
	float: left;
	box-sizing:border-box;
	text-align:justify;
}
.articlefp {
	width: 520px;
}
.article table, .articlefp table, .article td, .articlefp td {
	border: 0;
}
.article {
	overflow: scroll;
}
.article h1 {
	color: #9ac23b;
	font-weight: normal;
	line-height: 28px;
	margin-bottom: 0px;
	text-align: left;
}
.article h2 {
	color: #9ac23b
}

.articlefp p {
	margin-bottom: 0px;
	padding-bottom: 0px;
}

.aside {
	height:180px;
	width: 265px;
	float: right;
	padding: 0px 10px 15px;
	background: url(../images/mariengaarde.jpg) no-repeat;
	margin-top: 0px;
}
.articlef .table-box, .articlefp .table-box{  margin: 10px auto;}
.articlef .table-box td, .articlefp .table-box td{ border:1px solid #dadada;}

.btn-green {
	color: #504f50;
	font-size: 20px;
	font-weight: 600;
	background-color: transparent;
	padding: 3px 100px;
}
.page-header {
	width: 202px;
	height: 66px;
	color: #9ac23b;
	bottom: 100%;
	position: absolute;
	left: 0;
	font-size: 40px;
	line-height: 40px;
	font-weight: normal;
	background: #504f50;
}

.page-header2 {
	width: 202px;
	min-height: 300px;
	height:100%;
	color: #9ac23b;
	position: relative;
	padding-top: 5px;
	font-size: 43px;
	font-weight: normal;
	background: #504f50;
	float:left;
	margin-top: 3px;

}
.page-header2 a {
	color: #9ac23b;
}
.page-header2 p {
	font-size: 12px;
	padding-left: 15px;
	padding-right: 10px;
	font-style: italic;
}
.page-header2 p span{ font-size:12px !important;}
.page-header2 p:first-child {
    font-style: normal;
	font-size:14px;
}
.page-header2 h1 {
	font-size: 20px;
	padding-left: 15px;
	padding-right: 10px;
}
.page-header2 hr {
	margin: 10px 0;
	border: solid 1px #9ac23b;
}

.caption {
	width: 202px;
	height: 64px;
	cursor: pointer;
	background: url(../images/evenementenagenda.png) no-repeat left top;
}

.slider-wrapper{
	float: right;
	width: 614px;
}
.fullscreen {
	width:100%;	
	/*height: 350px;	*/
}
/****** Spotlight Start ******/
.spotlight {
	margin: 15px 0;
}
.spotlight .row {
	display:block;
}
.spotlight .col {
	display: inline;
	display: inline-block;
	width: 250px;
	background-color: #fff;
	padding: 10px;
}
.spotlight img, .spotlight .desc {
	float:left;
}
.spotlight .desc {
	margin: 0 5px;
	width: 100px;
}
.spotlight h3 {
	color: #504f50;
	font-size: 15px;
	font-weight: normal;
}
.spotlight a:hover {
	font-weight:bold;
}
/****** Footer Start ******/
.footer {
	background: #fff;
	border-top: 6px solid #9ac23b;
	padding: 15px;
}
.footer ul {
	list-style: none;
	float: left;
	width: 195px;
}
.footer a:hover {
	font-weight:bold;
}

p.paragraph {
	text-indent: 40px;	
}
.page {
	padding-top: 15px;
	margin-top: 20px;
	margin-bottom: 15px;
	border-bottom: none;
}
.page h1 {
	color: #9ac23b;
	margin-bottom: 0px;
}


/*********CLEANER | STUFF********/
.cleaner {clear: both; height: 0px; margin-top: -1px; line-height: 0px;}
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}

	.imageeditdiv 								{position:absolute;display: none;left:100px;}
	.imageeditpopup 							{background-color: #DEDEDE;border: solid #0062c4 1px;	padding-left:40px;width: 375px; height: 205px;}
	.artikelpopupheader 					{background-color:#0062c4;}
	.imagedetail									{padding: 20px;}
	.imageoverview								{cursor:pointer; padding: 19px;}
	.RRT													{height: 10px; width: 7px; background-image: url(../images/cp/RRT.png);background-repeat: no-repeat;}
	.RR														{width: 7px; background-image: url(../images/cp/RR.png);background-repeat: repeat-y;}
	.BBL													{height: 7px; width: 9px; background-image: url(../images/cp/BBL.png);background-repeat: no-repeat;}
	.BB														{height: 7px; background-image: url(../images/cp/BB.png);background-repeat: repeat-x;}
	.BBR													{height: 7px; width: 9px; background-image: url(../images/cp/BBR.png);background-repeat: no-repeat;}
	
	.tablecontent1								{font-size:11px; color:#000}
	.tablecontent2								{font-size:10px; color:#222}
	.tablecontent3								{font-size:9px; color:#777}

	.artikeloverzichtwidth				{width:560px;}
	.afrekenblokje								{width:560px; BACKGROUND:  #f1f9fe;border: solid 1px #bbc3d3;}
	.afrekenblokjeitemname				{width:120px; color: #333;}
 	.betaalmethodeitem						{width:300px; color: #333;}
 	.printfactuurheader 					{height: 100px;}
	.button 											{cursor:pointer; border:solid 1px #ccc; color:white; font-size:11px; font-weight:normal; padding: 2px 2px; background:#ad3537;}

	.agendayweekdagkopcel					{font-weight:bold; color:#444}
	.agendamaintable							{font-weight:bold;}
	.agendatoptable								{margin-top:10px;}
	.agendaafspraak								{font-size:12px;color:#717171;font-weight:normal; padding-top:5px;}
	.agendadagcel									{width:120px; border: solid #999 1px;}
	.agendamaandcel								{width:40px; text-align:center;}
	.agendadagvandemaand					{font-size: 12px; color:#ad3537}
	.agendaafspraken							{font-weight:bold;}
	a.agendaafspraaklink					{color: #555; font-size:11px; font-weight:normal; text-decoration:underline;}
	a#agendajaarlink							{font-weight:bold;}
	

	.zoekwoordgevonden						{font-weight:bold; color:#222;}

	#contactform td {padding:15px 5px 0px 0;}
	
	#admincontent 								{}
	
	.reserveer {background:url("../images/Reserveer-nu.jpg") no-repeat top left !important; width:80px; height:18px; border:0; cursor:pointer; }
	.reserveer:hover {background:url("../images/Reserveer-nu-Mouseover.jpg") no-repeat top left !important; }
	.reserveer-meerdaags {background:url("../images/Meerdere-evenementen.jpg") no-repeat top left !important; width:226px; height:23px; border:0; cursor:pointer; }
	.reserveer-meerdaags:hover {background:url("../images/Meerdere-evenementen-Mouseover.jpg") no-repeat top left !important; }
	.start-slideshow {background:url("../images/Start-Slideshow.jpg") no-repeat top left !important; width:112px; height:23px; border:0; cursor:pointer; }
	.start-slideshow:hover {background:url("../images/Start-Slideshow-Mouseover.jpg") no-repeat top left !important; }
	
/* ------------- menu css ------------ */
#menu{ position:relative; display:block;}
#menu .mobile-menu{ position:relative; display:none;}
td.agendadagcel {text-align: center;}
.agendadagvandemaand a {float: none !important; vertical-align: middle;}
.table-box table  tr td, .table-box table  tr th{ border-right:1px solid #dadada; border-bottom:1px solid #dadada;}
.table-box table{ border-top:1px solid #dadada; border-left:1px solid #dadada;}
.images3-box:after{ content:''; display:block; line-height:0; clear:both;}
.images3-box{ width:100%; display:block; margin:0 auto 15px;}
.images3-box .col-md-4{ width:32%; float:left;}
.images3-box .col-md-4:nth-child(2){ margin:0 2%;}
.images3-box .col-md-4 img{ width:100%;}

/* ------------- inner page css ------------ */
.article h1 { margin-bottom:15px;}
.img-box-2 {text-align: left;}
.img-box-2:after{ content:''; display:block; line-height:0; clear:both;}
.right {float: right; margin-left: 2%;width: 48%;}
.left {float: left;margin-right:2%; width: 48%;}


.img-box-3 {text-align: left;}
.img-box-3:after{ content:''; display:block; line-height:0; clear:both;}
.col-md-3{ width:32%; float:left;}
.col-md-3 img{ height:100%;     width: 100% !important;}
.col-md-3:nth-child(2){ margin:0 2% 10px;}
.article.articlefp img { display: block; margin: 0 auto;}
.article h1 .full { display:inline-block; width:45%; text-align:left;}
.img img { display: block;  text-align: center;  margin: 0 auto 20px;}
.theme-bar .nivo-directionNav a{ text-decoration:underline;}
.theme-bar .nivo-directionNav a:hover, .theme-bar .nivo-directionNav a:focus{ text-decoration:none;}
/* ------------- media css ------------ */
.page-header .caption { display:none;}
.article li {list-style-type: none;}

@media only screen and (max-width:1280px){
	/* ------ universal css ----- */
	img{ width:auto !important; max-width:100% !important; height:auto;}
	 ul, .fb_reset, .fb_iframe_widget{ display:inline-block; vertical-align:bottom;}
	 img {width: auto;  max-width: 100%; height:auto;}
     ul:after, .spotlight:after, .spotlight .row:after	{ content:''; display:block; line-height:0; clear:both;}
	 .fb_iframe_widget{margin: 2px auto 0 !important; vertical-align: text-top !important;}
	 
	 #menu > ul > li{ position:relative; transition:all 0.5s ease-in-out 0s;}
	 #menu > ul > li a{position:relative; transition:all 0.5s ease-in-out 0s;}
	 #menu > ul > li > ul{ transform:translateX(100%); opacity:0; visibility:hidden; transition:all 0.5s ease-in-out 0s;top:100%; left:0; display:static;}
	 #menu > ul > li:hover ul, #menu > ul > li a:hover + ul{transform:translateX(0%); opacity:1; visibility:visible;transition:all 0.5s ease-in-out 0s;}
	 .more-info { text-align: left;  display: inline-block;  font-size: 14px; text-transform: capitalize;}
	 .article ul li { list-style-position: inside; text-align: left;}
	 #menu .menu { vertical-align: bottom;}
	 .articlef .table-box, .articlefp .table-box{  margin: 10px auto;}
	 .articlefp{ width:100%;}
	 img{ min-height:auto !important;}
	}
@media only screen and (max-width:1024px){
	.container{ width:auto; max-width:95%; margin:0 auto;}
	.header { background: #fff url(../images/header.jpg) no-repeat;   background-position: 6% 80%;  background-size: 80%; width:100% !important; margin-bottom:0;}
	.header #menu{ width:50%; position:relative; height: auto !important; box-sizing: border-box;padding:0 4px;}
	.header #menu > ul > li{ width:auto !important; display:inline-block; box-sizing:border-box; margin:0 auto !important; border-left:none;}
	#menu ul li .dropdown{ position:absolute; width:30px; height:25px; top:0; right:0; background:#4a4a4a url(../images/down-arrow.png) no-repeat center center; z-index:999;cursor:pointer;}
    .header #menu ul li .dropdown{  width:24px; height:24px;}
	.header #menu ul { width: 45%;}
	.header #menu ul li { width: 50% !important;}
	.header #menu ul ul{ width:100%;}
	
	.logo-box {  width: 50%;  position: relative;  padding: 0px;   text-align: right;    box-sizing: border-box;}
	.logo-box a { width: 26%; display: inline-block;  float: left;}
	.lang-box { float: right; padding: 15px;  width: 30%;  text-align: right;}
	.lang-box a { display: inline-block; float: none;}
	.search-box {float: right; margin: 32px 15px 0px;}
	
	#menu > ul.menu > li{ width:24.6%; box-sizing:border-box;}
    #menu > ul > li > ul { width:100%; opacity: 1; visibility: visible; transition: all 0.5s ease-in-out 0s; top: 100%; left: 0; display: none; transform: inherit;}
	.theme-bar.slider-wrapper{ margin-top:3px; width: 75%;}
	.slideshow .page-header2{ top:0; right:-1px; width:24.5%; height:auto; box-sizing:border-box;} 
	.page-header { left: 0; right: 0; width: 24.6%; height: 111px;}
	.page-header .caption{ width: 100%; height: 100%; background: url(../images/evenementenagenda.png) no-repeat center;}
	.fb_iframe_widget_fluid span{ vertical-align:text-top !important;}
	
	 .content, .article{ width:100%; box-sizing:border-box;}
	 .articlefp{ width:65%; float:left; box-sizing:border-box;}
	 .aside{ width:35%; box-sizing:border-box;}
	 .spotlight .row{ text-align:center;}
	 .spotlight .col{ width:290px;}
	 .spotlight {margin: 10px auto; display: inline-block;  width: 100%;  box-sizing: border-box;  padding: 0 6px;}
	}
@media only screen and (max-width:992px){
	.header #menu{ width:60%;}
	.logo-box{ width:40%;}
	.search-box {margin: 1% 15px 0px;}
	.spotlight .col {width: 32%;  box-sizing: border-box;}
	.header #menu ul li:hover{ background:#504f50;}
	.header #menu ul li:hover a{ color:#fff;}
	.article .table-box { margin: 10px auto;}
	.spotlight img { width: 50%;}
	.table-box table{ min-width:1000px;}
	.page-header2 { width: 202px; min-height: 290px;}
	
	}
@media only screen and (max-width:802px){
	.header #menu ul{ position:relative; display:inline-block; top:0; width:auto;vertical-align: bottom;}
	.header #menu ul li{ height:auto; width:auto !important; display:inline-block; margin: 0 13px 0 0 !important; border-left:none; position:relative; z-index:0; padding: 0 35px 0 7px;}
	.header #menu ul li ul{ position:absolute; top:100%; left:0; display:none;transform:initial; transition:none; opacity:1; visibility:visible;}
	.header #menu ul li{ margin: 4px auto	!important;}
	.header #menu > ul > li > ul{ background:#504f50;}
	.header #menu > ul > li > ul a{ color:#fff; padding:0;}
	.search-box { float: right;  margin:-3% 15px 0px;}
	
	#menu .mobile-menu{ position:relative; display:block; font-size:16px; text-transform:uppercase; color:#fff; background:url(../images/mobilemenu-icon.png) no-repeat center right; width:95%; margin:0 auto; padding:8px 0;}
	#menu ul.menu{ display: none; width:100%; position:absolute; top:100%; left:0; right:0; margin:0 auto; } 
	#menu ul.menu li{ width:100%; margin:0 auto; position:relative; box-sizing:border-box; border-bottom:1px solid #fff; padding:1px 0;}
	#menu ul.menu li a{ width:100%; box-sizing:border-box; padding:5px 15px; text-decoration:none; display:inline-block;}
	#menu ul li .dropdown{ position:absolute; width:30px; height:34px;}
	#menu ul.menu li ul{ position:relative; transform:initial; transition:none; opacity:1; visibility:visible; display:none; width:100%; padding:0 12px; box-sizing:border-box;}
	#menu ul.menu li:hover ul, #menu ul li a:hover + ul{ display:none;} 
	
    .theme-bar .nivoSlider{ height:320px;}
	.page-header{ display:none;}
	.theme-bar.slider-wrapper { margin-top: 3px; width: 69%;}
	.slideshow .page-header2 { width: 30.5%;}
	#slider { height:290px !important;}
	.theme-bar .nivo-controlNav{ bottom:0; height:36px; padding:5px 0;}
	.theme-bar .nivo-controlNav a{ margin:8px 2px 0 2px;}
	.articlefp{ width:65%;box-sizing: border-box; padding: 10px 11px;}
	.aside{ width:35%; margin: 10px auto; box-sizing: border-box;}
	
	.spotlight .col {width: 33%; display: inline-block;float: left;box-sizing: border-box;margin-bottom: 4px;}
	.spotlight .col:nth-child(2){ margin:0 0.5% 5px;}
	.spotlight .col img { float: left;  width: 40% !important;}
	.spotlight .desc { margin: 0 5px; width: 50%; float: right;}
	
	.page-header2 p{ font-size:12px;}
	 #contactform table  td:first-child { width: 40%;}
     #contactform table  td:last-child { WIDTH: 60%;}
     #contactform table  td:last-child input, #contactform table  td:last-child textarea { width: 100%; box-sizing: border-box; min-height: 30px;    line-height: 30px;  padding-left: 10px;}
     #contactform table  tr:last-child input { width: 29%; float: left; margin-left: 33%; font-size:14px;  text-transform:uppercase;}
	 .theme-bar .nivo-directionNav a{ bottom:14px;}
	 .spotlight h3{ display:inline-block;}
	 .spotlight .desc .more-info { display: inline-block;  float: none;}
	 .spotlight .row:nth-child(1) .col:last-child .desc h3 { font-size: 13px;}
	 .article h1 .full { display:inline-block; width:100%; text-align:left; margin-bottom:10px; font-size: 12px !important;}
	}
@media only screen and (max-width:700px){
	.header{height: 130px; background-position: 52% 85%; background-size: 85%; width: 100%;}
	.header #menu { width: 55%;}
	.logo-box { padding: 2px 0 3px;  width: 45%;}
	
	.header #menu ul{position: relative;display: inline-block;top: 0;width: auto;vertical-align: sub;}
	.header #menu ul li .dropdown{ width:18px; height:20px;}
	.header #menu ul li {font-size: 14px; margin: 0 auto !important; padding-right: 23px;}
	 
	
	.fb_iframe_widget { display: inline-block;  position: relative;  width:auto; float: none; margin: 0px auto 0 !important; vertical-align: text-top !important;}
	
	.logo-box {padding: 0px 0 1px;}
	.logo-box > a { position: absolute; top:123%; left: -97%; display:none;}
	.lang-box {padding: 3px 4px; float: left; display: inline-block; vertical-align: top; width: auto;}
	.lang-box a {display: inline-block; float: none;width: 40%; vertical-align: sub;}
	
	.search-box {float: right;display: inline-block;vertical-align: top; margin: 5px 12px;}
	.slideshow .slider-wrapper, .slideshow .page-header2{ width:100%;}	
	.article {  text-align: left;}
	.article h1 {line-height: 30px; margin-bottom: 10px; font-size: 17px;}
	
	.slideshow{ display:block;}
	#slider {height: auto !important;}
	.theme-bar.slider-wrapper{ width:100%; margin-bottom:1px;}
	.slideshow .page-header2{ width:100%; right: 0;  padding: 10px 0;}
	.table-box table{ min-width:500px;}
	}
@media only screen and (max-width:640px){
	 .container{ overflow:hidden;}
	 h1{ font-size:16px ; margin-bottom:8px} 
	 h2{ font-size:16px ; margin-bottom:8px} 
	 h3{ font-size:15px ; margin-bottom:8px}
	 h4{ font-size:14px ; margin-bottom:8px}
	 
	 form#contactform + br + form h1{ display:inline-block; width:100%;}
	 form#contactform + br + form input{ display:inline-block; text-align:center;}
	 form#contactform + br + form input[name="saddr"]{ min-height:30px; line-height:30px; padding-left:10px;}
	 form#contactform + br + form input[type="submit"] { padding:9px 20px; font-size:13px; text-transform:uppercase;}
	 
	 .header #menu, .logo-box{ width:60%; display:inline-block;}
	 .header #menu{ padding:3px;}
	 .logo-box{ width:40%; display:inline-block;}
	 .logo-box > a{ display:none;}
	 
	 .search-box{ width:50%}
	 .search-box input{ width:100%; box-sizing: border-box;}
	 .content{ width:100%; margin:0 auto; box-sizing:border-box;}
	 .articlefp, .aside{ width:100%; margin:0 auto 20px;}
	 
	 .col-md-3, .right, .left { width:100%; margin:0 auto 10px !important;}
	 .article h1 { font-size: 22px;}
	}
@media only screen and (max-width:570px){
	.spotlight .col{ width:100%; margin:0 auto 8px !important;}
	.aside{ background-position:center center;}
	.header #menu, .logo-box{ width:100%; margin:0 auto;}
	.header {height: 145px;}
	.images3-box { text-align:center;}
	.images3-box .col-md-4{ width:100%; float:none; margin:0 auto 10px !important}
	    .spotlight .col img { float: left;  width: 40% !important;}
        .spotlight .col{text-align:center;}
        .spotlight .desc{ width:55%; display:block;  }
     p.right img { display: block; margin: 0 auto; float: none !important;  height: auto !important;}
	}
@media only screen and (max-width:500px){
		
	}
@media only screen and (max-width:360px){
		#contactform table  td:first-child,  #contactform table  td:last-child{ width: 100%;  box-sizing:border-box;  display:inline-block;}
	}