@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

body { font-family: Verdana; font-weight: 400; color: #333; overflow-y:Scroll; }

h1,h2 { font-weight: 700; font-style: normal; color: #9c3872; }
a.button { background: #9c3872 url('/theme/img/arrow.png') right 25px top 18px no-repeat; padding: 10px 45px 10px 25px; color: #fff; border-radius: 8px; text-decoration: none; transition: .2s; display: inline-block; margin-bottom: 5px;}
a.button:hover { background: #333 url('/theme/img/arrow.png') right 20px top 18px no-repeat; transition: .3s;}

#mmenu { display: none; position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 1000; background: rgba(0,0,0,.9); text-align: center; color: #fff; }
#mmenu .button_inloggen { background: #9c3872; border-radius: 10px; padding: 6px 10px; color: #fff; text-decoration: none; width: 100%; }
#mmenu .button_boekingen { background: #9c3872; border-radius: 10px; padding: 6px 10px; color: #fff; text-decoration: none;  width: 100%;}
#mmenu h4 { font-weight: 700; font-family: "comic-sans-ms", sans-serif; font-style: normal; font-size: 30px; color: #9c3872; margin: 0; padding: 0; }
#mmenu ul { list-style: none; padding: 0px; margin: 0; } 
#mmenu ul li { padding: 2px; }
#mmenu ul li a { color: #fff; text-decoration: none; font-size: 20px; }
#mmenu .buttons { padding: 15px 0; }
#mmenu .holder { width: 100%; height: 100%; }
#mmenu .closebut { position: absolute; color: #fff; top: 15px; right: 15px; font-size: 25px; }

#menu { background: #fff; color: #333; position: fixed; top: 0; left: 0; width: 100%; z-index: 99; height: 100px; box-shadow: 0 5px 5px rgba(0,0,0,.1); transition: .2s; }
#menu .balk { background: #333; color: #fff; padding: 10px 0;}
#menu .balk span { padding: 0 10px; font-size: 14px; font-weight: 200; }
#menu .balk span i { padding-right: 5px; }
#menu .balk .seperator { display:inline-block; color: #717171; }
#menu ul.menu { list-style: none; margin:0; display: inline-block; height: 73px;}
#menu ul.menu li { display: inline-block;  position: relative; }
#menu ul.menu li a { display:inline-block; color: #333; font-weight: 600; text-decoration: none; padding: 26px 15px; transition: .4s; height: 75px; margin-top: 5px;}
#menu ul.menu li:hover { background: #9c3872; transition: .4s; color: fff; }
#menu ul.menu li:hover a { color: #fff ; }
#menu ul.menu li ul { display: none; position: absolute; top: 80px; left: 0; width: 250px; background: #fff; list-style: none; padding: 10px; margin: 0; text-align: left; float: none;}
#menu ul.menu li:hover ul { display: block; margin: 0; padding: 0; }
#menu ul.menu li:hover ul li { display: block; width: 100%; }
#menu ul.menu li:hover ul li a { display: block; width: 100%; color: #333; padding: 5px 15px; margin: 0; line-height: 30px; height: auto; }
#menu ul.menu li:hover ul li a:hover { color: #fff; }
#menu .mobilebutton { width: 30px; position: relative; display: block; z-index: 3000;  }

#menu ul.socials { list-style: none; margin-top: 11px; }
#menu ul.socials li { float: left; padding: 5px; }
#menu ul.socials li a { color: #fff; transition: .4s; }
#menu ul.socials li a:hover img { opacity: .7; transition: .4s; }
#menu .brand { padding: 30px 10px;  }
#menu .button_inloggen { background: #d4cdd1; border-radius: 10px; padding: 6px 10px; color: #fff; text-decoration: none; margin-left: 20px; }
#menu .button_boekingen { background: #9c3872; border-radius: 10px; padding: 6px 10px; color: #fff; text-decoration: none; }

#header { position: relative; margin-top: 40px; }
#header img { width: 100%; height: 800px; object-fit: cover; object-position: center center; }
#header h5 { font-weight: 700; font-family: "comic-sans-ms", sans-serif; font-style: normal; font-size: 50px; text-shadow: 2px 2px 5px #333;}
#header .divider { display: block; position: absolute; z-index: 90; bottom: -1px; left: 0; width: 100%; height: 56px; background:  url('/theme/img/tss-divider.png') top center repeat-x;  }
#header .bottom { position: absolute; bottom: 50px; width: 100%; text-align: center; z-index: 999; }
#header .bottom img { width: 35px; height: 35px; }

.bounce { animation: bounce 3s ease infinite; }

@keyframes bounce {

    0%,
    20%,
    50%,
    80%,
    100% {
        transform: translateY(0);
    }

    40% {
        transform: translateY(-30px);
    }

    60% {
        transform: translateY(-15px);
    }
}


#headersmall { position: relative; }
#headersmall img { width: 100%; height: 500px; object-fit: cover; }
#headersmall .divider { display: block; position: absolute; bottom: -1px; left: 0; width: 100%; height: 56px; background:  url('/theme/img/tss-divider.png') top center repeat-x; z-index: 90; }

#intro { padding: 80px 0; text-align: left; color: #222; background: url("/theme/img/bgmolen.webp") bottom right no-repeat; background-size: 75%; }
#intro h1 { font-weight: 900; font-style: normal; color: #9c3872; }
#intro p { font-size: 16px; line-height: 30px; font-weight: 400; }
#intro address { font-size: 16px; line-height: 30px; font-weight: 400; }
#intro address span { display: inline-block; width: 30px; }
#intro .buttons { padding: 10px 0 30px 0 ; }
#intro img { padding-bottom: 50px; } 

#agenda { padding: 80px 0; background: #e6e6e6 url("/theme/img/bg2.png") bottom -50px left 200px no-repeat; }
#agenda p { font-size: 16px; line-height: 30px; font-weight: 400; }
#agenda .agendaitem { background: #fff; border-radius: 10px; padding: 0px; text-align:center; height: 300px;}
#agenda .agendaitem img { width: 100%; height: 150px; object-fit: cover; border-radius: 10px 10px 0 0; }
#agenda .agendaitem .text { padding: 20px; }

#agenda h3 { font-size: 18px; color: #9c3872;}
#agenda h4 { font-size: 16px; }

#past h4 { font-size: 16px; padding: 0; margin: 0; }
#past h3 { font-size: 16px; font-weight: 800; padding: 0; margin: 0;}
#past p { margin: 0; padding: 0; }
#past .row { border-bottom: 1px solid #eee; padding: 10px; }

.coming h4 { font-size: 16px; padding-top: 10px; }
.coming h3 { font-size: 18px; font-weight: 800; }


#nieuws { padding: 80px 0; background: url("/theme/img/bg1.jpg") top center no-repeat; background-size: cover; }
#nieuws h2 { width: 100%; text-align:center; font-size: 40px; }
#nieuws h3 { font-size: 20px; }
#nieuws p { font-size: 16px; line-height: 30px; font-weight: 400; }
#nieuws .nieuwsimg { width: 100%; height: 250px; object-fit: cover; margin-bottom: 20px; border-radius: 8px; }
#nieuws .item { padding: 20px; }
#nieuws p.datum { color: #ccc; font-size: 10px; }

#verslag { padding: 80px 0; background: #e6e6e6; }
#verslag p { font-size: 16px; line-height: 30px; font-weight: 400; }

#sponsoren { padding: 80px 0;  }
#sponsoren h2 { width: 100%; text-align:center; font-size: 40px; }
#sponsoren p { font-size: 16px; line-height: 30px; font-weight: 400; }
#sponsoren .sponsorlogo { display: inline-block; width: 300px; height: 200px; object-fit: contain; margin: 20px; }

#page { margin-top: 50px; }
#page p { font-size: 16px; line-height: 30px; }
#page a { color: #9c3872; }
#page .agendaitem { padding: 15px; border-bottom: 1px dashed #ccc; }
#page .agendaitem h4 { font-size: 16px; color: #888; padding-top: 10px; }
#page .kader { padding: 25px; background: #f4f4f4; }
#page .kader .row { padding: 4px 0; }
#page .button { background: #9c3872 url('/theme/img/arrow.png') right 25px top 18px no-repeat; padding: 10px 45px 10px 25px; color: #fff; border-radius: 8px; text-decoration: none; transition: .2s; display: inline-block; margin: 5px 0; border:0;}
#page .button:hover { background: #333 url('/theme/img/arrow.png') right 20px top 18px no-repeat; transition: .3s;}

#footer { padding: 50px; background: #333; color: #fff; margin-top: 50px; }
#footer .logo { padding: 20px; }
#footer a { color: #fff; transition: .3s; text-decoration: none; }
#footer a:hover { color: #aaa; transition: .3s; }
#footer ul.footermenu { list-style: none; margin-top: 2px; display: inline-block;  }
#footer ul.footermenu li { display: inline-block; padding: 5px; } 
#footer ul.footermenu li a { display: inline-block; color: #FFF; font-weight: 600; text-decoration: none; padding: 10px; transition: .4s; }
#footer ul.footermenu li a:hover { color: #aaa; }
#footer .socials i { font-size: 40px; padding: 5px; color: #fff; transition: .3s; }
#footer .socials i:hover { color: #aaa; transition: .3s; }
#footer hr { margin: 30px 0; }
#footer h4 { font-weight: 700; font-family: "comic-sans-ms", sans-serif; font-style: normal; color: #fff; font-size: 30px;}

#fotos .foto { width: 200px; height: 200px; margin-bottom: 20px; object-fit: cover; }

#nieuwsitem { padding-top: 150px; background: url("/theme/img/bg1.jpg") top center no-repeat; background-size: cover; }
#nieuwsitem p { font-size: 16px; line-height: 30px; }
#nieuwsitem .fotos { padding: 80px 0; background: #e6e6e6;  }
#nieuwsitem .fotos img { width: 300px; height: 300px; object-fit: cover; margin-bottom: 20px; }
#nieuwsitem .item { padding: 0 0 50px 0;  }
#nieuwsitem p.datum { color: #999; font-size: 13px; }

#nieuwspagina { padding: 120px 0; background: #f9f9f9 url("/theme/img/bg1.jpg") top center no-repeat; background-size: cover; }
#nieuwspagina h2 { width: 100%; text-align:center; font-size: 40px; }
#nieuwspagina h3 { font-size: 20px; font-weight: 600; margin-top: 10px; }
#nieuwspagina p { font-size: 16px; line-height: 30px; font-weight: 400; }
#nieuwspagina .nieuwsimg { width: 100%; height: 250px; object-fit: cover; margin-bottom: 20px; border-radius: 8px; }
#nieuwspagina .item { padding: 20px; }
#nieuwspagina p.datum { display: inline-block; color: #999; font-size: 12px; margin: 0; padding: 0; }


@media (max-width: 1300px) {
	#menu ul.menu li a { font-size: 14px; padding: 26px 10px; }
	#menu { height: 90px; }
}

@media (max-width: 1100px) {
	#menu ul.menu li a { font-size: 13px; padding: 26px 5px; }
	#menu { height: 80px; }
}

@media (max-width: 990px) {

#menu { height: 70px; }
#menu .balk span {font-size: 12px; padding: 0; text-decoration: none; }
#menu .balk span a { font-size: 12px; padding: 0; text-decoration: none;}
#menu ul.menu { display: none;  }
	
#menu .brand { padding: 10px; height: 70px; }
#menu .button_inloggen, .button_boekingen { display: none; }

#past h3 { font-size: 16px; font-weight: 800; padding-top: 10px; margin: 0;}
#past p { font-size: 15px; color: #999; }

#header img { width: 100%; height: 400px; object-fit: cover; }
#headersmall img { width: 100%; height: 300px; object-fit: contain; }
#intro { padding: 40px 10px 10px 10px; text-align: center; background-size: 200%; }
#intro h1 { font-size: 30px; }
#agenda { text-align: center; }
#agenda h2 { font-size: 35px; color: #9c3872;}
#agenda h3 { font-size: 20px; color: #9c3872;}
#agenda h4 { font-size: 16px; }
#agenda .agendaitem { background: #fff; border-radius: 10px; padding: 25px; text-align:center; height: auto; margin: 15px 0;}
#verslag { padding: 40px 10px; }
#verslag p { font-size: 16px; line-height: 30px; font-weight: 400; }
#verslag h2 { padding-top: 10px; }
#nieuws h2 { font-size: 35px; }
#sponsoren h2 { font-size: 35px; }

	
	#footer { padding: 50px 0; text-align: center; }
#fotos .foto { width: 170px; height: 170px; margin-bottom: 20px; object-fit: cover; }
}