/* Dit is de CSS voor Reguliers.net versie 2020 */


/* Hieronder worden lettertype en lettergrootte vastgesteld */

p,td,div {font-family: Arial, sans-serif; font-size: 13pt; line-height: 1.5;}

@media only screen and (max-width: 600px) {
p,td,div {font-family: Verdana, Helvetica, sans-serif; font-size: 12pt; }
}

.gr1 { color: #444444;}
.gr2 { color: #777777;}
.gr3 { color: #999999;}

.gr1kl {font-family: Verdana, sans-serif; font-size: 10pt; color: #444444;}


.kleiner{font-family: Verdana, sans-serif; font-size:10pt;}

@media only screen and (max-width: 600px) {
.kleiner {
font-family: Verdana, sans-serif;
font-size:9pt;
}
}

.groter{font-family: Arial, sans-serif; font-size: 18pt; font-weight: bold;}

@media only screen and (max-width: 600px) {
.groter {
font-family: Verdana, sans-serif;
font-size:14pt;
font-weight: bold;
}
}


.anchor{
  display: block;
  height: 10px; /*same height as header*/
  margin-top: -10px; /*same height as header*/
  visibility: hidden;
}

@media only screen and (max-width: 600px) {
.anchor {
  display: block;
  height: 50px; /*same height as header*/
  margin-top: -50px; /*same height as header*/
  visibility: hidden;
}
}


/* Hieronder wordt het boxmodel in verschillende browsers gelijkgeschakeld */

div {-moz-box-sizing:border-box; box-sizing:border-box; margin:0; padding:0;}


/* Hieronder worden afbeeldingen en video aangepast voor mobiele weergave */

.afb250 {
   width: 100%;
   max-width: 250px;
   margin-bottom: 7px;
   padding: 0px;
}

.afb300 {
   width: 100%;
   max-width: 300px;
   margin-bottom: 7px;
   padding: 0px;
}

.afb350 {
   width: 100%;
   max-width: 350px;
   margin-bottom: 7px;
   padding: 0px;
}

.afb400 {
   width: 100%;
   max-width: 400px;
   margin-bottom: 7px;
   padding: 0px;
}

.afb450 {
   width: 100%;
   max-width: 450px;
   margin-bottom: 7px;
   padding: 0px;
}

.afb500 {
   width: 100%;
   max-width: 500px;
   margin-bottom: 7px;
   padding: 0px;
}

.afb550 {
   width: 100%;
   max-width: 550px;
   margin-bottom: 7px;
   padding: 0px;
}

.afb600 {
   width: 100%;
   max-width: 600px;
   margin-bottom: 7px;
   padding: 0px;
}

.afb650 {
   width: 100%;
   max-width: 650px;
   margin-bottom: 7px;
   padding: 0px;
}

.afb700 {
   width: 100%;
   max-width: 700px;
   margin-bottom: 7px;
   padding: 0px;
}


.afb850 {
   width: 100%;
   max-width: 850px;
   margin: 0px;
   padding: 0px;
}

.video-container-4x3 {
    position: relative;
    padding-bottom: 75%;
    padding-top: 5px;
    height: 0;
    overflow: hidden;
}

.video-container-4x3 iframe {
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
}

.video-container-16x9 {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 5px;
    height: 0;
    overflow: hidden;
}

.video-container-16x9 iframe {
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
}



/* Hieronder staat wat de achtergrond is afhankelijk van het formaat devices */

@media only screen and (min-width: 900px) {
html { 
  background: url('http://www.reguliers.net/elements/background-2020a.jpg') no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
      }
}

@media only screen and (min-width: 600px) and (max-width: 900px) {
html {
  background: url('http://www.reguliers.net/elements/backgroundblack2.jpg') repeat center; 
     }
}

@media only screen and (max-width: 600px) {
html {
  background: #000000;
     }
}


/* Hieronder staat de opmaak van links in het algemene menu */

a.org:link{color: white; text-decoration: none}
a.org:visited{color: white; text-decoration: none}
a.org:hover{color: black}
a.org:active{color: white}

a.org1:link{color: #B2B2B2; text-decoration: none}
a.org1:visited{color: #B2B2B2; text-decoration: none}
a.org1:hover{color: white}
a.org1:active{color: white}

a.org2:link{color: white; text-decoration: none}
a.org2:visited{color: white; text-decoration: none}
a.org2:hover{color: #ff0000}
a.org2:active{color: white}

a.org3:link{color: black; text-decoration: none}
a.org3:visited{color: black; text-decoration: none}
a.org3:hover{color: #990000}
a.org3:active{color: black}

a.org4:link{color: gray; text-decoration: underline}
a.org4:visited{color: gray; text-decoration: underline}
a.org4:hover{color: #990000}
a.org4:active{color: gray}



/* Hieronder wordt verticale positionering geregeld */

div.valign { height: 36px; text-align: center; line-height: 36px; }

div.valigndatum { height: 20px; text-align: center; line-height: 20px; }


/* Hieronder staat de opmaak van links in de verschillende hoofdkleuren */

a.nav0:link{color:#666666; text-decoration: none}
a.nav0:visited{color:#666666; text-decoration: none}
a.nav0:hover{color:white; text-decoration: none}
a.nav0:active{color:#666666}

a.nav1:link{color:#E70E0E; text-decoration: none}
a.nav1:visited{color:#E70E0E; text-decoration: none}
a.nav1:hover{color:white; text-decoration: none; background-color:#E70E0E}
a.nav1:active{color:#E70E0E}

a.nav2:link{color:#FF6600; text-decoration: none}
a.nav2:visited{color:#FF6600; text-decoration: none}
a.nav2:hover{color:white; text-decoration: none; background-color:#FF6600}
a.nav2:active{color:#FF6600}

a.nav2a:link{color:#FF3399; text-decoration: none}
a.nav2a:visited{color:#FF3399; text-decoration: none}
a.nav2a:hover{color:#FFFFFF; text-decoration: none; background-color:#FF3399}
a.nav2a:active{color:#FF3399}

a.nav2b:link{color:#BB4415; text-decoration: none}
a.nav2b:visited{color:#BB4415; text-decoration: none}
a.nav2b:hover{color:white; text-decoration: none; background-color:#BB4415}
a.nav2b:active{color:black}


a.nav3:link{color:#fa7102; text-decoration: none}
a.nav3:visited{color:#fa7102; text-decoration: none}
a.nav3:hover{color:white; text-decoration: none; background-color:#FF9000}
a.nav3:active{color:#fa7102}

a.nav3a:link{color:#ff9900; text-decoration: none}
a.nav3a:visited{color:#ff9900; text-decoration: none}
a.nav3a:hover{color:white; text-decoration: none; background-color:#ff9900}
a.nav3a:active{color:#ff9900}

a.nav4:link{color:#339900; text-decoration: none}
a.nav4:visited{color:#339900; text-decoration: none}
a.nav4:hover{color:white; text-decoration: none; background-color:#339900}
a.nav4:active{color:#339900}

a.nav5:link{color:#0000CC; text-decoration: none}
a.nav5:visited{color:#0000CC; text-decoration: none}
a.nav5:hover{color:white; text-decoration: none; background-color:#0000CC}
a.nav5:active{color:#0000CC}

a.nav6:link{color:#9900CC; text-decoration: none}
a.nav6:visited{color:#9900CC; text-decoration: none}
a.nav6:hover{color:white; text-decoration: none; background-color:#9900CC}
a.nav6:active{color:#9900CC}


/* Hieronder staat de opmaak van links in de kleuren van afzonderlijke zaken */

a.navdt:link{color:#E00202; text-decoration: none}
a.navdt:visited{color:#E00202; text-decoration: none}
a.navdt:hover{color:black; text-decoration: underline}
a.navdt:active{color:#E00202}

a.navap:link{color:#EB1B11; text-decoration: none}
a.navap:visited{color:#EB1B11; text-decoration: none}
a.navap:hover{color:red; text-decoration: underline}
a.navap:active{color:#EB1B11}

a.navec:link{color:#0173BA; text-decoration: none}
a.navec:visited{color:#0173BA; text-decoration: none}
a.navec:hover{color:black; text-decoration: underline}
a.navec:active{color:#0173BA}

a.navmix:link{color:#CC33CC; text-decoration: none}
a.navmix:visited{color:#CC33CC; text-decoration: none}
a.navmix:hover{color:white; text-decoration: none; background-color:#CC33CC}
a.navmix:active{color:#CC33CC}

a.navso:link{color:#311377; text-decoration: none}
a.navso:visited{color:#311377; text-decoration: none}
a.navso:hover{color:red; text-decoration: underline}
a.navso:active{color:black}

a.navade:link{color:#000000; text-decoration: none; background-color:#ffff00}
a.navade:visited{color:#000000; text-decoration: none; background-color:#ffff00}
a.navade:hover{color:#ffff00; text-decoration: none; background-color:#000000}
a.navade:active{color:#000000; text-decoration: none; background-color:#ffff00}


a.navx:link{color:#444444; text-decoration: none}
a.navx:visited{color:#444444; text-decoration: none}
a.navx:hover{color:#990000; text-decoration: none}
a.navx:active{color:#444444}

a.navy:link{color:#777777; text-decoration: none}
a.navy:visited{color:#777777; text-decoration: none}
a.navy:hover{color:#990000; text-decoration: none;}
a.navy:active{color:#990000}

a.txt:link{color:#000000; text-decoration: none}
a.txt:visited{color:#000000; text-decoration: none}
a.txt:hover{color:#000000; text-decoration: none;}
a.txt:active{color:#000000}

a.txt2:link{color:#000000; text-decoration: none}
a.txt2:visited{color:#000000; text-decoration: none}
a.txt2:hover{color:#ffffff; text-decoration: none; background-color:#000000}
a.txt2:active{color:#000000}

a.ade:link{color:#000000; text-decoration: none;}
a.ade:visited{color:#000000; text-decoration: none;}
a.ade:hover{color:#ffff00; text-decoration: none; background-color:#000000}
a.ade:active{color:#000000; text-decoration: none;}

a.nws:link{color:#444444; text-decoration: none}
a.nws:visited{color:#444444; text-decoration: none}
a.nws:hover{color:#990000; text-decoration: underline;}
a.nws:active{color:#990000}

a.nws2:link{color:#b80c0c; text-decoration: none;}
a.nws2:visited{color:#b80c0c; text-decoration: none}
a.nws2:hover{color:##E70E0E; text-decoration: underline;}
a.nws2:active{color:#b80c0c}

a.nws3:link{color:#444444; text-decoration: none}
a.nws3:visited{color:#444444; text-decoration: none}
a.nws3:hover{color:#990000; text-decoration: none;}
a.nws3:active{color:#990000}


/* Hieronder staat de opmaak van de rand rondom enkele tabelcellen */

td.blackborder { border-width: 1px; border-color: #000000; border-style: solid;}
td.grayborder { border-width: 1px; border-color: #777777; border-style: solid;}

.blackborder { border-width: 1px; border-color: #000000; border-style: solid;}
.grayborder { border-width: 1px; border-color: #b5b2b2; border-style: solid;}


/* Hieronder staat de opmaak en de werking van het uitklapmenu */

#navbar {
   margin: 0;
   padding: 0;
   height: 1em; 
   z-index:100;}

#navbar li {
   float: left;
   list-style: none;
   position: relative;
   z-index:100; }

/* Hieronder staat de opmaak van het eerste niveau van het uitklapmenu */

#navbar li a {
   display: block;
   padding: 3px 0px;
   background-color: #ffffff;
   font-family: Verdana, sans-serif;
   font-size: 20px;
   text-decoration: none;
   z-index:100; }

/* Hieronder staat de werking van het tweede niveau van het uitklapmenu */

#navbar li ul {
   display: none; 
   width: 12em; /* Width to help Opera out */ee
   color: #000000;
   border-left: 1px solid #000000;
   border-right: 1px solid #000000;
   border-bottom: 1px solid #000000;
   background-color: #ffffff;
   box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
   z-index:100; }

#navbar li:hover ul, #navbar li.hover ul {
   display: block;
   position: absolute;
   margin: 0;
   padding: 0; }

#navbar li:hover li, #navbar li.hover li {
   float: none; }

#navbar li:hover li a, #navbar li.hover li a {
   background-color: #ffffff;
   border-bottom: 1px solid #ffffff;
   padding: 5px 0px;
   font-family : verdana;
   font-size : 13px;
   color: #000000; 
   z-index:100; }

/* Hieronder staat de werking van het derde niveau van het uitklapmenu */

#navbar li:hover ul li ul {
   display: none; 
   position: absolute;
   border-top: 1px solid #000000;
   border-left: 1px solid #000000;
   border-right: 1px solid #000000;
   border-bottom: 1px solid #000000;
   top: 0px;
   left: 206px;
   box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

#navbar li:hover ul li:hover ul {
   display: block; 
   position: absolute;
}

/* Hieronder staat de opmaak van de gekleurde onderdelen van het uitklapmenu */

#navbar1 a {
   color: #E70E0E;
   font-weight: bold; }
#navbar1 a:hover, ul#navbarli1 li a:hover {
   background-color: #E70E0E;
   color: #ffffff;  }

#navbar2 a {
   color: #FF6600;
   font-weight: bold; }
#navbar2 a:hover, ul#navbarli2 li a:hover {
   background-color: #FF6600;
   color: #ffffff;  }

#navbar2a a {
   color: #FF3399;
   font-weight: bold; }
#navbar2a a:hover, ul#navbarli2a li a:hover {
   background-color: #FF3399;
   color: #ffffff;  }

#navbar2b a {
   color: #BB4415;
   font-weight: bold;  }
#navbar2b a:hover, ul#navbarli2b li a:hover {
   background-color: #BB4415;
   color: #ffffff;  }

#navbar3 a {
   color: #FF9900;
   font-weight: bold;  }
#navbar3 a:hover, ul#navbarli3 li a:hover {
   background-color: #FF9900;
   color: #ffffff;  }

#navbar4 a {
   color: #339900;
   font-weight: bold;  }
#navbar4 a:hover, ul#navbarli4 li a:hover {
   background-color: #339900;
   color: #ffffff;  }

#navbar5 a {
   color: #0000CC;
   font-weight: bold;  }
#navbar5 a:hover, ul#navbarli5 li a:hover {
   background-color: #0000CC;
   color: #ffffff;  }

#navbar6 a {
   color: #9900CC;
   font-weight: bold;  }
#navbar6 a:hover, ul#navbarli6 li a:hover {
   background-color: #9900cc;
   color: #ffffff;  }

#navbar a span.pijltje {
   display: block;
   background-image: url('../elements/pijltje-2020.png');
   background-repeat: no-repeat; 
   background-position: center center; 
   text-align: center;
   cursor: pointer;
}

/* Hieronder staat de breedte van de nederlandse menu-onderdelen */

.nav1brnl {
   width: 105px;
   text-align: center;
}

.nav2abrnl {
   width: 155px;
   text-align: center;
}

.nav2brnl {
   width: 165px;
   text-align: center;
}

.nav2bbrnl {
   width: 155px;
   text-align: center;
}

.nav3brnl {
   width: 115px;
   text-align: center;
}

.nav4brnl {
   width: 165px;
   text-align: center;
}

.nav5brnl {
   width: 110px;
   text-align: center;
}

.nav6brnl {
   width: 75px;
   text-align: center;
}


/* Hieronder staat de breedte van de engelse menu-onderdelen */

.nav1bren {
   width: 114px;
   text-align: center;
}

.nav2abren {
   width: 162px;
   text-align: center;
}

.nav2bren {
   width: 172px;
   text-align: center;
}

.nav2bbren {
   width: 167px;
   text-align: center;
}

.nav3bren {
   width: 103px;
   text-align: center;
}

.nav4bren {
   width: 127px;
   text-align: center;
}

.nav5bren {
   width: 97px;
   text-align: center;
}

.nav6bren {
   width: 104px;
   text-align: center;
}


/* Hieronder staat de opmaak voor het hoofdmenu op tabletbreedte */

.navtab {
display: inline;
padding: 3px 20px;
background-color: #ffffff;
font-family: Verdana, sans-serif;
font-size: 18px;
font-weight: bold;
z-index:100; }
}


/* Hieronder wordt de header voor mobiele devices geregeld  */


@media only screen and (max-width: 600px) {
.headertablet {
display: none;
}
}

@media only screen and (min-width: 800px) {
.headertablet {
display: none;
}
}

@media only screen and (min-width: 600px) {
.headermobiel {
display: none;
}
}

@media only screen and (max-width: 600px) {
.headerdesktop {
display: none;
}
}

@media only screen and (max-width: 800px) {
.headerdesktopmenu {
display: none;
}
}

.socmedmen {
padding-top: 8px;
}



/* Hieronder staan de containers voor de contentblokken  */

@media only screen and (max-width: 800px) {
#frontWrapper {
width: 100%; 
display: block;
text-align: left;
}
}

@media only screen and (min-width: 800px) {
#frontWrapper {
width: 1020px; 
display: block;
text-align: left;
}
}

@media only screen and (max-width: 600px) {
#mobielheaderwrapper {
width: 100%; 
display: block;
}
}

@media only screen and (min-width: 600px) {
#mobielheaderwrapper {
display: none;
}
}

@media only screen and (max-width: 800px) {
#tekstWrapper {
width: 100%; 
display: block;
text-align: left;
}
}

@media only screen and (min-width: 800px) {
#tekstWrapper {
width: 1020px; 
display: block;
text-align: left;
}
}


#kolomlinks {
float: left;
padding: 0px;
}


#kolomrechts {
float: right;
padding: 0px;
}

@media only screen and (max-width: 600px) {
#kolomrechts {
float: left;
margin: 0px;
padding: 0px;
     }
}



/* Hieronder staat de positionering van de blokken op de voorpagina */

.menumobiel0 {
position: fixed;
float: left;
width: 100%;
margin-left: 0px;
margin-right: 0px;
margin-top: 9px;
margin-bottom: 0px;
font-weight: bold;
font-size: 125%;
background-color: #888888;
z-index: 80;
}


@media only screen and (min-width: 600px) {
.menumobiel0 {
display: none;
  overflow: hidden;
  position: fixed;
padding-top: 0px;
padding-bottom: 0px;
padding-left: 0px;
padding-right: 0px;
}
}

.menumobieltoplinks {
display: inline;
float: left;
margin-top: 0px;
padding-top: 8px;
padding-bottom: 0px;
padding-left: 12px;
padding-right: 8px;
}

.menumobieltopmidden {
display: inline;
margin-top: 0px;
padding-top: 10px;
padding-bottom: 0px;
padding-left: 6px;
padding-right: 0px;
}

.menumobieltoprechts {
display: inline;
float: right;
margin-top: 0px;
padding-top: 6px;
padding-bottom: 5px;
padding-left: 0px;
padding-right: 8px;
}

.menumobiel2 {
  overflow: hidden;
  position: fixed;
float: left;
width: 100%;
height: 40px;
margin: 0px;
padding: 0px;
margin-top: -20px;
background-color: #000000;
z-index: 80;
}

@media only screen and (min-width: 600px) {
.menumobiel2 {
display: none;
}
}

.menumobiel3 {
  overflow: hidden;
  position: fixed;
float: left;
z-index: 60;
width: 100%;
height: 6px;
margin: 0px;
padding: 0px;
margin-top: 48px;
margin-bottom: 8px;
background-color: #ffffff;
}

@media only screen and (min-width: 600px) {
.menumobiel3 {
display: none;
}
}

#headermobiel {
float: left;
width: 100%;
margin-top: 54px;
padding-top: 0px;
padding-bottom: 0px;
background-color: #ffffff;
}

@media only screen and (min-width: 600px) {
#headermobiel {
display: none;
}
}

.menumobiel {
float: left;
width: 100%;
margin: 10px 0px 10px 0px;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 20px;
padding-right: 0px;
line-height: 125%;
font-size: 125%;
background-color: #ffffff;
}

@media only screen and (min-width: 600px) {
.menumobiel {
display: none;
}
}

.blokmobiel {
float: left;
width: 100%;
margin: 10px 0px 1px 0px;
padding-top: 10px;
padding-bottom: 5px;
padding-left: 20px;
padding-right: 20px;
background-color: #ffffff;
}

@media only screen and (min-width: 600px) {
.blokmobiel {
display: none;
}
}

#bloklinksboven {
float: left;
width: 404px;
height: 439px;
margin-left: 30px;
margin-right: 0px;
margin-top: 30px;
margin-bottom: 15px;
padding: 11px;
border-radius: 12px;
background-color: white;
opacity: 0.95;
z-index: 30;
}

@media only screen and (max-width: 600px) {
#bloklinksboven {
display: none;
}
}

@media only screen and (min-width: 600px) and (max-width: 800px) {
#bloklinksboven {
float: left;
width: 400px;
height: 425px;
margin-left: 30px;
margin-right: 0px;
margin-top: 30px;
margin-bottom: 15px;
padding: 9px;
border-radius: 12px;
background-color: white;
opacity: 0.95;
z-index: 30;
}
}


#bloklinks1 {
float: left;
width: 404px;
height: 44px;
margin-left: 25px;
margin-right: 0px;
margin-top: 30px;
margin-bottom: 5px;
padding: 11px;
border-top-left-radius: 12px;
border-top-right-radius: 12px;
background-color: white;
opacity: 0.95;
z-index: 30;
}

@media only screen and (max-width: 600px) {
#bloklinks1 {
display: none;
}
}


#bloklinks2 {
float: left;
width: 404px;
margin-left: 25px;
margin-right: 0px;
margin-top: 10px;
margin-bottom: 5px;
padding: 13px;
background-color: white;
opacity: 0.95;
z-index: 30;
}

@media only screen and (max-width: 600px) {
#bloklinks2 {
display: none;
}
}


#bloklinks3 {
float: left;
width: 404px;
margin-left: 25px;
margin-right: 0px;
margin-top: 10px;
margin-bottom: 5px;
padding: 13px;
background-color: white;
opacity: 0.95;
z-index: 30;
}

@media only screen and (max-width: 600px) {
#bloklinks3 {
display: none;
}
}

#bloklinks4 {
float: left;
width: 404px;
height: 44px;
margin-left: 25px;
margin-right: 0px;
margin-top: 10px;
margin-bottom: 5px;
padding: 11px;
background-color: white;
border-bottom-left-radius: 12px;
border-bottom-right-radius: 12px;
opacity: 0.95;
z-index: 30;
}

@media only screen and (max-width: 600px) {
#bloklinks4 {
display: none;
}
}


#bloknieuwsmobiel {
float: left;
width: 100%;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
margin-bottom: 10px;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 20px;
padding-right: 20px;
background-color: #ffffff;
text-align: left;
}

@media only screen and (min-width: 600px) {
#bloknieuwsmobiel {
display: none;
}
}

#bloklinksonder {
float: left;
width: 340px;
height: 390px;
margin-left: 70px;
margin-right: 10px;
margin-top: 30px;
margin-bottom: 5px;
padding: 10px;
background-image: url('../elements/bloklinksonder390.png');
background-position: top left; 
background-repeat: no-repeat;
z-index: 30;
}

@media only screen and (max-width: 600px) {
#bloklinksonder {
display: none;
}
}

@media only screen and (min-width: 600px) and (max-width: 800px) {
#bloklinksonder {
float: left;
width: 340px;
height: 390px;
margin-left: 30px;
margin-right: 10px;
margin-top: 30px;
margin-bottom: 5px;
padding: 10px;
background-image: url('../elements/bloklinksonder390.png');
background-position: top left; 
background-repeat: no-repeat;
}
}


#blokrechtsboven {
float: right;
width: 336px;
height: 154px;
margin-left: 10px;
margin-right: 30px;
margin-top: 30px;
margin-bottom: 25px;
padding-left: 14px;
padding-top: 12px;
padding-right: 12px;
padding-bottom: 12px;
border-radius: 12px;
background-color: white;
opacity: 0.95;
z-index: 30;
}

@media only screen and (max-width: 600px) {
#blokrechtsboven {
display: none;
}
} 


@media only screen and (min-width: 600px) and (max-width: 800px) {
#blokrechtsboven {
float: right;
width: 275px;
height: 130px;
margin-left: 5px;
margin-right: 15px;
margin-top: 30px;
margin-bottom: 25px;
padding: 9px;
background-image: url('../elements/blokrechtsboven.png');
background-position: top left; 
background-repeat: no-repeat;
}
}


#blokrechtsmidden {
float: right;
width: 342px;
height: 330px;
margin-left: 5px;
margin-right: 85px;
margin-top: 15px;
margin-bottom: 15px;
padding: 11px;
border-radius: 12px;
background-color: white;
opacity: 0.95;
z-index: 30;
}

@media only screen and (min-width: 600px) and (max-width: 800px) {
#blokrechtsmidden {
float: right;
width: 300px;
height: 320px;
margin-left: 5px;
margin-right: 45px;
margin-top: 15px;
margin-bottom: 15px;
padding: 10px;
border-radius: 12px;
background-color: white;
opacity: 0.95;
z-index: 30;
}
}

@media only screen and (max-width: 600px) {
#blokrechtsmidden {
display: none;
}
} 

#blokagendamobiel {
float: left;
width: 100%;
height: 320px;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
margin-bottom: 10px;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 20px;
padding-right: 20px;
background-color: #ffffff;
text-align: left;
}

@media only screen and (min-width: 600px) {
#blokagendamobiel {
display: none;
}
} 

#blokrechtsonder {
float: right;
width: 347px;
height: 384px;
margin-left: 5px;
margin-right: 30px;
margin-top: 15px;
margin-bottom: 5px;
padding: 11px;
border-radius: 12px;
background-color: white;
opacity: 0.95;
z-index: 30;
}

@media only screen and (max-width: 600px) {
#blokrechtsonder {
display: none;
}
} 

@media only screen and (min-width: 600px) and (max-width: 800px) {
#blokrechtsonder {
float: right;
width: 300px;
height: 260px;
margin-left: 5px;
margin-right: 15px;
margin-top: 15px;
margin-bottom: 5px;
padding: 10px;
background-image: url('../elements/blokrechtsonder300.png');
background-position: top left; 
background-repeat: no-repeat;
}
}


#blokrechtsonderste {
float: right;
width: 340px;
height: 390px;
margin-left: 10px;
margin-right: 90px;
margin-top: 30px;
margin-bottom: 5px;
padding: 10px;
border-radius: 12px;
background-color: white;
z-index: 30;
}

@media only screen and (max-width: 600px) {
#blokrechtsonderste {
display: none;
}
}

#blokweekagendamobiel {
float: left;
width: 100%;
height: 260px;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
margin-bottom: 0px;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 20px;
padding-right: 20px;
background-color: #ffffff;
text-align: left;
}

@media only screen and (min-width: 600px) {
#blokweekagendamobiel {
display: none;
}
} 

/* Hieronder staan de divs die eerdere opmaak clearen */

.anythingBelow {
clear:both;
}

#clearright {
clear:right;
}

#clearleft {
clear:left;
}


/* Hieronder staat de opmaak voor titels, kopjes en lijnen tussen de tekst */

#paginatitel {
margin-top: 0;
margin-bottom: 0;
font-size: 22px; 
font-style: italic;
font-weight: bold;
color: #000000;
}

@media only screen and (max-width: 600px) {
#paginatitel {
margin-top: 0;
margin-bottom: 0;
font-size: 22px; 
font-style: italic;
font-weight: bold;
color: #000000;
}
}

h2 {
font-size: 16pt;
margin-top: 0;
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
}

.nieuwstitel {
font-size: 16pt;
font-weight: bold;
color: black;
}

.bloktitel {
width: 100%;
padding: 2px;
background-color: #66cccc;
}

.tussentitel {
width: 100%;
color: #ffffff;
font-size: 16pt; 
text-align: center;
padding: 4px;
background-color: #B2B2B2;
}

.lijnfront {
border: 0;
width: 100%;
color: #990000;
background-color: #990000;
height: 2px;
}

.lijnagenda1 {
border: 0;
width: 90%;
color: #808080;
background-color: #808080;
height: 1px;
}

.lijnagenda2 {
border: 0;
width: 90%;
color: #808080;
background-color: #808080;
height: 1px;
}

.lijn100 {
border: 0;
width: 100%;
color: #808080;
background-color: #808080;
height: 1px;
}

.lijn350 {
border: 0;
width: 60%;
color: #808080;
background-color: #808080;
height: 1px;
}

.lijnzijmenu {
border: 0;
width: 80%;
color: #ffffff;
background-color: #ffffff;
height: 1px;
}

.lijnzijmenublack {
border: 0;
width: 80%;
color: #000000;
background-color: #000000;
height: 1px;
}


/* Hieronder staat  */

div.transbox
  {
  width: 236px;
  height: 20px;
  margin: 0px;
  background-color: #ffffff;
  border: 0px solid black;
  opacity: 0.6;
  filter: alpha(opacity=60); /* For IE8 and earlier */
  }

div.transbox p
  {
  margin: 2px;
  color:#000000;
  }


/* Met hetgeen hieronder worden diverse dingen niet weergegeven op mobiele devices  */

@media only screen and (max-width: 600px) {
.hidemobiel {
display: none;
}
}

@media only screen and (min-width: 600px) {
.hidedesktop {
display: none;
}
}

@media only screen and (max-width: 600px) {
.horecakaart {
display: none;
}
}

.horecamenumobiel {
line-height: 300%;
font-weight: bold;
font-size: 125%;
}

@media only screen and (min-width: 600px) {
.horecamenumobiel {
display: none;
}
}

.blockquote {
display: block;
margin: 12px 40px 0px 30px;
padding-left: 0px; 
}

@media only screen and (max-width: 600px) {
.blockquote {
display: block;
margin: 12px 0px 0px 10px;
padding-left: 0px; 
}
}


.blockquotevideo {
display: block;
width: 500px;
margin-bottom: 8px;
}

@media only screen and (max-width: 600px) {
.blockquotevideo {
display: block;
width: 100%;
margin: 0px 0px 0px 0px;
}
}


{
  overflow: hidden;
  background-color: #333;
  position: fixed;
  top: 0;
  width: 100%;
}

.vierkantje {
width: 90px;
}

@media only screen and (max-width: 600px) {
.vierkantje {
width: 70px;
}
}


/* Hieronder staat de opmaak voor de verschillende blokken met content */

#tekstblok {
float: left;
width: 720px;
margin-left: 10px;
margin-right: 35px;
margin-top: 40px;
margin-bottom: 0px;
padding-top: 30px;
padding-bottom: 10px;
padding-left: 60px;
padding-right: 65px;
border: 0;
background-color: #FFFFFF;
border-radius: 12px;
}

@media only screen and (min-width: 600px) and (max-width: 800px) {
#tekstblok {
float: left;
width: 90%;
margin-left: 5%;
margin-right: 5%;
margin-top: 40px;
margin-bottom: 0px;
padding-top: 30px;
padding-bottom: 10px;
padding-left: 60px;
padding-right: 65px;
border: 0;
background-color: #FFFFFF;
border-radius: 12px;
}
}

@media only screen and (max-width: 600px) {
#tekstblok {
float: left;
width: 100%;
margin-left: 0px;
margin-right: 0px;
margin-top: 62px;
margin-bottom: 0px;
padding-top: 20px;
padding-bottom: 5px;
padding-left: 20px;
padding-right: 20px;
border: 0;
border-radius: 12px;
background-color: #FFFFFF;
}
}


#picturesblok {
float: left;
width: 710px;
margin-left: 10px;
margin-right: 155px;
margin-top: 40px;
margin-bottom: 0px;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 10px;
border: 0;
border-radius: 12px;
background-color: #FFFFFF;
}

#breedblok {
float: left;
width: 800px;
margin-left: 60px;
margin-right: 100px;
margin-top: 10px;
margin-bottom: 0px;
padding-top: 40px;
padding-bottom: 10px;
padding-left: 50px;
padding-right: 50px;
border: 0;
border-radius: 12px;
background-color: #FFFFFF;
}

@media only screen and (max-width: 600px) {
#breedblok {
float: left;
width: 100%;
margin-left: 0px;
margin-right: 0px;
margin-top: 62px;
margin-bottom: 0px;
padding-top: 20px;
padding-bottom: 5px;
padding-left: 20px;
padding-right: 20px;
border: 0;
border-radius: 12px;
background-color: #FFFFFF;
}
}

#enkelblok {
float: left;
width: 570px;
height: 570px;
margin-left: 10px;
margin-right: 130px;
margin-top: 40px;
margin-bottom: 0px;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 10px;
border: 0;
border-radius: 12px;
background-color: #FFFFFF;
}


/* Hieronder staat de positionering van de blokken van de agenda */

#agendalinks {
float: left;
width: 380px;
height: 560px;
margin-left: 70px;
margin-right: 10px;
margin-top: 30px;
margin-bottom: 0px;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 17px;
padding-right: 17px;
border: 0;
border-radius: 12px;
background-color: #FFFFFF;
opacity: 0.95;
}

@media only screen and (max-width: 600px) {
#agendalinks {
display: none;
}
}

@media only screen and (min-width: 600px) and (max-width: 800px) {
#agendalinks {
float: left;
width: 340px;
height: 560px;
margin-left: 25px;
margin-right: 5px;
margin-top: 30px;
margin-bottom: 0px;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 17px;
padding-right: 17px;
border: 0;
border-radius: 12px;
background-color: #FFFFFF;
}
}

#agendalinksmobiel {
float: left;
width: 100%;
margin-left: 0px;
margin-right: 0px;
margin-top: 62px;
margin-bottom: 0px;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 17px;
padding-right: 17px;
border: 0;
background-color: #ffffff;
text-align: left;
}

@media only screen and (min-width: 600px) {
#agendalinksmobiel {
display: none;
}
}

#agendarechts {
float: left;
width: 380px;
height: 560px;
margin-left: 10px;
margin-right: 70px;
margin-top: 95px;
margin-bottom: 0px;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 17px;
padding-right: 17px;
border: 0;
border-radius: 12px;
background-color: #FFFFFF;
opacity: 0.95;
}

@media only screen and (max-width: 600px) {
#agendarechts {
display: none;
}
}

@media only screen and (min-width: 600px) and (max-width: 800px) {
#agendarechts {
float: left;
width: 340px;
height: 560px;
margin-left: 5px;
margin-right: 25px;
margin-top: 95px;
margin-bottom: 0px;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 17px;
padding-right: 17px;
border: 0;
border-radius: 12px;
background-color: #FFFFFF;
}
}


#agendarechtsmobiel {
float: left;
width: 100%;
margin-left: 0px;
margin-right: 0px;
margin-top: 15px;
margin-bottom: 0px;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 17px;
padding-right: 17px;
border: 0;
background-color: #FFFFFF;
text-align: left;
}

@media only screen and (min-width: 600px) {
#agendarechtsmobiel {
display: none;
}
}


/* Hieronder staat de opmaak van de gekleurde blokken met een zijmenu */

.zijmenu {
float: left;
width: 170px;
height: 430px;
display: block;
position: fixed;
margin-left: 37px;
margin-right: 10px;
margin-top: 40px;
margin-bottom: 10px;
padding: 10px 0px;
border-radius: 10px;
text-align: center;
opacity: 0.9;
z-index: 30;
}

@media only screen and (max-width: 800px) {
.zijmenu {
display: none;
}
  }

#menuactueel {
background-color: #999999;
  }

#menucolofon {
background-color: #999999;
  }

#menuevents {
background-color: #E70E0E;
  }

#menuhoho {
background-color: #FF3399;
}

#menubars {
background-color: #FF6600;
  }

#menurest {
background-color: #BB4415;
  }

#menuwinkels {
background-color: #FF9900;
  }

#menuade {
background-color: #FFFF00;
  }

#menugesch {
background-color: #339900;
  }

#menumensen {
background-color: #0000CC;
  }

#menulinks {
background-color: #9900CC;
  }

#menuapril {
background-color: #EB1B11;
  }

#menuexit {
background-color: #0173BA;
  }

#menusoho {
background-color: #311377;
  }


#zijmenufooter {
float: left;
width: 160px;
height: 35px;
display: block;
position: fixed;
margin-left: 40px;
margin-right: 10px;
margin-top: 413px;
margin-bottom: 10px;
padding: 10px 0px;
text-align: center;
z-index: 60;
}

@media only screen and (max-width: 800px) {
#zijmenufooter {
display: none;
}
  }

.openingstijden {
float: left;
display: inline;
}


/* Hieronder staat hoe de reclamebannercaroussels moeten worden weergegeven */

#bannercaroussel {
height: 80px;
width: 488px;
margin-top: 10px;
margin-bottom: 0px;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
border: 0;
border-radius: 10px;
background-color: #FFFFFF;
}

@media only screen and (max-width: 600px) {
#bannercaroussel {
display: none;
}
  }

#bannercarousselonder {
height: 80px;
width: 488px;
margin-left: 0px;
margin-bottom: 6px;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
border: 0;
border-radius: 10px;
background-color: #FFFFFF;

}

@media only screen and (min-width: 600px) and (max-width: 800px) {
#bannercarousselonder {
height: 80px;
width: 488px;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
border: 0;
border-radius: 10px;
background-color: #FFFFFF;
margin-left: 0px;
margin-bottom: 6px;
}
}

@media only screen and (max-width: 600px) {
#bannercarousselonder {
display: none;
}
  }


@media only screen and (max-width: 600px) {
#bannercarousselmobiel {
height: 60px;
width: 260px;
margin-top: 10px;
padding-top: 5px;
padding-bottom: 0px;
padding-left: 0px;
padding-right: 0px;
border: 0;
background-color: #ffffff;
}
}


/* Hieronder staat de opmaak voor de fotoseries met lightbox */

td.td_thumbnail_title {
	text-align: center;
	vertical-align: top;
}

a.a_thumbnail_title {
}

td.td_thumbnail_image
{
	text-align: center;
	vertical-align: middle;
}

img.img_thumbnail_image
{
    border: 0px none;
}

table.thumbs_table
{
    border: 0px none;
}

img.img_full_size_image
{
    border: 0px none;
}

.etg_link_text
{
	font-size: 10px;
	color: #999999;
	font-family: Verdana;
	text-decoration: none;
}

a:hover.etg_link_text
{
	color: black;
	text-decoration: underline;
}


/* Hieronder staat nog iets voor de nieuwsreacties */

input.my-url{display:none;}



/* Hieronder wordt het dropdownmenu voor de mobiele versie geregeld */

.dropbtn {
    background-color: #888888;
    color: white;
    padding: 1px;
    font-size: 16px;
    border: none;
    cursor: pointer;
}

.dropdown {
    position: relative;
    display: inline-block;
    z-index: 100;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    line-height: 1.2;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 100;
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    z-index: 100;
}

.dropdown-content a:hover {background-color: #CCCCCC}

.dropdown:hover .dropdown-content {
    display: block;
    z-index: 100;
}

.dropdown:hover .dropbtn {
    background-color: #808080;
}


/* Hieronder worden de fotosliders op de venuepaginas geregeld */

* {box-sizing:border-box}

/* Slideshow container */
.slideshow-container {
  max-width: 1000px;
  position: relative;
  margin: auto;
  z-index: 20;
}

/* Hide the images by default */
.mySlides {
    display: none;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}