/***************************************
!! ALGEMEEN !!
***************************************/

body::-webkit-scrollbar {width: 5px;}
body::-webkit-scrollbar-track {background: #f1f1f1; }
body::-webkit-scrollbar-thumb {background: #888; }
body::-webkit-scrollbar-thumb:hover {background: #555;}
html{overflow-y:scroll;}
body{margin: 0px; font-family: Raleway, Sans-serif, arial, calibri; font-size: 17px; text-align: justify; color: rgb(50,50,50);cursor: default;}

.displayboven800none{display:none;}
.nohover:hover{background-color: rgb(206,64,62);}
/***************************************
!! TABEL !!
***************************************/
.tabel{width: 100%; height: auto; float: left; position: relative; padding: 6px 0px;}
.tabel-links{width: 180px; height: auto; float: left; position: relative; font-weight: bold;}
.tabel-links1{width: 300px; height: auto; float: left; position: relative; font-weight: bold;}
.tabel-links2{width: 110px; height: auto; float: left; position: relative; font-weight: bold;}
.tabel-rechts{width: calc(100% - 180px); height: auto; float: left; position: relative;}
.tabel-rechts1{width: calc(100% - 300px); height: auto; float: left; position: relative;}
.tabel-rechts2{width: calc(100% - 110px); height: auto; float: left; position: relative;}

.tabel-links3{width: 180px; height: auto; float: left; position: relative; font-weight: bold;}
.tabel-rechts3{width: calc(100% - 180px); height: auto; float: left; position: relative;}
/***************************************
!! CONTAINERS !!
***************************************/
#pagina {position: relative; min-height: 100vh;}
#pagina-content {width: 100%; height: auto; min-height: calc(100% - 50px); float: left; position: relative;}


#pagina-top{
  width: 100%;
  height: 530px;
  background: url('../afbeeldingen/testfoto-001.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
  float: left;
}

#pagina-mid{
  width: 100%;
  height: calc(100% - 900px);
  position: relative;
  float: left;
  margin-bottom: 50px;
}

#pagina-foot{
  width: 100%;
  height: auto;
  min-height: 100px;
  background-color: rgb(249,248,249);
  float: left;
  position: relative;
}
.titel{
  width: auto;
  height: auto;
  position: relative;
  margin: 20px 30px;
  font-size: 37px;
}

.tekst{
  width: calc(100% - 60px);
  height: auto;
  position: relative;
  margin: 0px 30px 20px;
  float: left;
}

.alleen-tekst{
  width: calc(100% - 60px);
  height: auto;
  position: relative;
  margin: 20px 30px 20px;
  float: left;
}
/***************************************
!! PAGINA TOP !!
***************************************/
#menu{
  width: 90%;
  height: 68px;
  color: black;
  background-color: white;
  margin: 20px 5% 0px;
  position: relative;
  float: left;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  border-radius: .4375rem;
  z-index: 9999999;
}

#menu-logo{
  width: 284px;
  min-width: 150px;
  height: 68px;
  float: left;
  color: white;
  background-color: rgb(222,111,33);
  background-image: url('../afbeeldingen/logo.png');
  background-repeat: no-repeat;
  background-size: 40px;
  background-position: 14px 14px;
  border-top-left-radius: .4375rem;
  border-bottom-left-radius: .4375rem;
}

#menu-logo::after{
  content: "Judo Grootegast";
  font-family: impact;
  font-size: 30px;
  line-height: 68px;
  padding: 0px 20px 0px 65px;
}

#menu-box{
  width: calc(100% - 284px);
  height: 68px;
  float: right;
  position: relative;
  background-color: white;
  border-top-right-radius: .4375rem;
  border-bottom-right-radius: .4375rem;
}

#menu-box-tekst{
   max-width: calc(100% - 20px);
   width: auto;
   height: 68px;
   float: right;
   position: relative;
   display: block;
   margin-right: 20px;
}

ul a {
 height: 68px; 
 width: auto;
 display: inline-block;
 color: rgb(0,0,0) !important;
 padding: 0px 15px;
 font-size: 20px;
 text-decoration:none;
 line-height: 68px;
}

.nav{
 width: 100%;
 height: auto;
 float: left;
 position: relative;
 display: block;
 z-index: 2;
 padding: 0;
 top: 0px;
 margin: 0px;
 color: white !important;
}

.navopen{display: none;}
.hamburger{display: none;}
.socialmedia{width: 60px; height: 25px; position: relative; margin: 40px auto 0px; font-size: 20px;display: flex;}
.menu-socials{width: 100%; float: left; position: relative; margin: 10px auto 0px; display: flex;}
/***************************************
!! MID !!
***************************************/
#headerbox{
  width: 90%;
  height: auto;
  margin: 20px 5% 0px;
  position: relative;
  float: left;
}

#headerbox-tekst{
  width: calc(100% - 60px);
  height: auto;
  position: relative;
  float: left;
  margin: 20px 30px;
  font-size: 37px;
}

#submenu{
  width: 90%;
  height: auto;
  margin: 50px 5%;
  position: relative;
  float: left;
}

.submenu-box{
  width: 120px;
  height: 120px;
  float: left;
  position: relative;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#headerbox-box{
  width: calc(100% - 60px);
  height: auto;
  float: left;
  position: relative;
  margin: 0px 30px 10px;
}

.headerbox-box{
  width: 160px;
  min-height: 170px;
  position: relative;
  float: left;
  padding: 0px 0px 0px 0px;
  margin: 0px 3.9px 10px 3.9px;
}

.headerbox-box-2{
  width: 160px;
  min-height: 170px;
  position: relative;
  float: left;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 10px 3.9px;
}

.headerbox-box-start{
  margin: 0px 30px 10px 50px;
}

.headerbox-box-foto{
  width: 160px;
  height: 130px;
  position: relative;
  float: left;
  margin: 0px 0px 15px 0px;
  border-radius: .4375rem;
}
.submenu-box-icon-start{background: url('../afbeeldingen/banner/start.png') no-repeat; background-size: cover;background-position: center;}
.submenu-box-icon-nieuws{background: url('../afbeeldingen/banner/nieuws.png') no-repeat; background-size: cover;background-position: center;}
.submenu-box-icon-over{background: url('../afbeeldingen/banner/over.png') no-repeat; background-size: cover;background-position: 72% center;}
.submenu-box-icon-over-judo{background: url('../afbeeldingen/banner/over-judo.png') no-repeat; background-size: cover;background-position: 72% center;}
.submenu-box-icon-over-albert{background: url('../afbeeldingen/banner/over-albert.png') no-repeat; background-size: cover;background-position: center 21%;}

.submenu-box-icon-proefles{background: url('../afbeeldingen/banner/proefles.png') no-repeat; background-size: cover;background-position: center right;}
.submenu-box-icon-lidmaatschap{background: url('../afbeeldingen/banner/lidmaatschap.png') no-repeat; background-size: cover;background-position: center 30%;}
.submenu-box-icon-trainers{background: url('../afbeeldingen/banner/trainers.png') no-repeat; background-size: cover;background-position: 22% center;}
.submenu-box-icon-waarom{background: url('../afbeeldingen/banner/waarom.png') no-repeat; background-size: cover;background-position: center 36%;}
.submenu-box-icon-examens{background: url('../afbeeldingen/banner/examens.png') no-repeat; background-size: cover;background-position: 83% center;}

.submenu-box-icon-wedstrijden{background: url('../afbeeldingen/banner/wedstrijden.png') no-repeat; background-size: cover;background-position: 24% center;}
.submenu-box-icon-ons-toernooi{background: url('../afbeeldingen/banner/ons-toernooi.png') no-repeat; background-size: cover;background-position: center;}
.submenu-box-icon-wedstrijdtraining{background: url('../afbeeldingen/banner/wedstrijdtraining.png') no-repeat; background-size: cover;background-position: center;}
.submenu-box-icon-verwachtingen{background: url('../afbeeldingen/banner/verwachtingen.png') no-repeat; background-size: cover;background-position: 19% center;}
.submenu-box-icon-jbn{background: url('../afbeeldingen/banner/judobond.png') no-repeat; background-size: cover;background-position: center;}


.submenu-box-icon-organisatie{background: url('../afbeeldingen/banner/organisatie.png') no-repeat; background-size: cover;background-position: center 12%;}
.submenu-box-icon-bestuur{background: url('../afbeeldingen/banner/bestuur.png') no-repeat; background-size: cover;background-position: center;}
.submenu-box-icon-agenda{background: url('../afbeeldingen/banner/agenda.png') no-repeat; background-size: cover;background-position: center 41%;}
.submenu-box-icon-contact{background: url('../afbeeldingen/banner/contact.png') no-repeat; background-size: cover;background-position: center 76%;}
.submenu-box-icon-sponsors{background: url('../afbeeldingen/banner/sponsors.png') no-repeat; background-size: cover;background-position: center 35%;}

.submenu-box-icon-trainingen{background: url('../afbeeldingen/banner/trainingen.png') no-repeat; background-size: cover;background-position: center 25%;}
.submenu-box-icon-techniektraining{background: url('../afbeeldingen/banner/techniektraining.png') no-repeat; background-size: cover;background-position: center;}
.submenu-box-icon-wedstrijdtraining{background: url('../afbeeldingen/banner/wedstrijdtraining.png') no-repeat; background-size: cover;background-position: center 25%;}
.submenu-box-icon-krachttraining{background: url('../afbeeldingen/banner/krachttraining.png') no-repeat; background-size: cover;background-position: center 80%;}

.submenu-box-icon-algemene-voorwaarden{background: url('../afbeeldingen/banner/algemene-voorwaarden.png') no-repeat; background-size: cover;background-position: center top;}
.submenu-box-icon-privacybeleid{background: url('../afbeeldingen/banner/privacybeleid.png') no-repeat; background-size: cover;background-position: center;}
.submenu-box-icon-huisregels{background: url('../afbeeldingen/banner/huisregels.png') no-repeat; background-size: cover;background-position: center;}
.submenu-box-icon-corona{background: url('../afbeeldingen/banner/corona.png') no-repeat; background-size: cover;background-position: center;}

.titel-in{
  width: calc(100% - 60px);
  height: auto;
  float: left;
  position: relative;
  font-size: 40px;
  text-align: left;
  margin: 20px 30px;
}

.titel-uit{
  width: calc(100% - 15px);
  height: auto;
  float: left;
  position: relative;
  font-size: 40px;
  margin-left: 15px;
  margin-bottom: 20px;
  text-align: left;  
}
/***************************************
!! START !!
***************************************/
#headerbox-start{
  width: 630px;
  height: 290px;
  position: relative;
  float: left;
  display: block;
  margin: -120px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#headerbox-start-tekst{
  width: auto;
  height: auto;
  position: relative;
  margin: 20px 30px 20px 30px;
  font-size: 41px;
  text-align: left;
}
.headerbox-start-box{
  width: 190px;
  height: 210px;
  position: relative;
  float: left;
  padding: 0px 10px 10px 10px;
}

.headerbox-start-box-titel, .headerbox-box-titel{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
  text-align: center;
  font-weight: bold;
  font-family: Roboto;
  font-size: 19px;
}

.headerbox-start-box-foto{
  width: 150px;
  height: 150px;
  position: relative;
  float: left;
  margin: 0px 20px 15px 20px;
  border-radius: .4375rem;
}

.headerbox-start-box-foto-1{
  background: url('../afbeeldingen/banner/proefles.png') no-repeat;
  background-size: cover;
  background-position: center;
}

.headerbox-start-box-foto-2{
  background: url('../afbeeldingen/banner/lidmaatschap.png') no-repeat;
  background-size: cover;
  background-position: center;
}

.headerbox-start-box-foto-3{
  background: url('../afbeeldingen/banner/corona.png') no-repeat;
  background-size: cover;
  background-position: center;
}

#headerbox-start-rechts{
  width: calc(100% - 690px);
  height: auto;
  float: right;
  position: relative;
}

.header-start-rechts-box{
  width: calc(100% - 20px);
  height: auto;
  float: left;
  position: relative;
  background-color: rgb(254,147,0);
  color: white;
  padding: 20px 10px;
  text-align: center;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 29px;
}

.header-start-rechts-box:hover{
  background-color: rgb(222,111,33);
}

#start-citaat{
  width: 90%;
  height: auto;
  margin: 90px 5% 50px;
  position: relative;
  float: left;
}

#start-citaat-titel, #start-nieuws-titel, #start-agenda-titel, #titel{
  width: calc(100% - 15px);
  height: auto;
  float: left;
  position: relative;
  font-size: 48px;
  margin-left: 15px;
  text-align: left;
}

#titel{margin-bottom: 10px;}
#start-banner-titel::before{
   content: "Wij zijn ";
}

#start-citaat-tekst{
  width: calc(93% - 15px);
  height: auto;
  float: left;
  position: relative;
  font-size: 20px;
  text-align: left;
  margin-left: 15px;
}

#start-citaat-icon{
  width: auto;
  height: auto;
  float: left;
  position: absolute;
  font-size: 50px;
  color: rgba(200,200,200,0.7);
  z-index: -1;
  top: 30px;
}

#start-nieuws{
  width: 90%;
  height: auto;
  margin: 50px 5%;
  position: relative;
  float: left;
}
#start-nieuws-groot, #start-nieuws-klein{
  width: calc(50% - 20px);
  height: auto;
  float: left;
  position: relative;
  margin-top: 0px;
}

#start-nieuws-groot{margin-right: 40px;}

#start-nieuws-groot-box{
  width: calc(100% - 0px);
  height: 464.5px;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  background-position: center center;
}

#start-nieuws-groot-box-tekst{
  width: auto;
  height: auto;
  float: left;
  position: absolute;
  text-align: left;
  bottom: 0;
  margin: 10px;
  font-family: Roboto;
  color: white;
  background-color: rgba(0,0,0,0.5);
  padding: 10px 15px;
  border-radius: .4375rem;
}
#start-nieuws-klein-box{
  width: calc(100% - 0px);
  height: 115px;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 20px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  background-position: center center;
}

#start-nieuws-box-datum, #start-nieuws-box-titel, #start-agenda-box-titel{
  width: 100%;
  float: left;
  position: relative;
  height: auto;
  color: white;
  font-weight: bold;
  font-size: 20px;
}
#start-nieuws-box-datum, #start-agenda-box-datum{font-size: 13px; font-weight: none;}

#start-nieuws-meer{
  width: calc(50% - 50px);
  height: auto;
  float: right;
  position: relative;
  border-radius: .4375rem;
  background-color: rgb(206,64,62);
  color: white;
  text-align: center;
  margin: 0px 0px 0px 0px;
  padding: 20px 15px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#start-nieuws-meer:hover{
  background-color: rgb(170,52,52);
}

#start-agenda{
  width: 90%;
  height: auto;
  margin: 50px 5%;
  position: relative;
  float: left;
}

#start-agenda-totaal{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
  margin-top: 0px;
}
.start-agenda-box{
  width: calc(100% - 0px);
  height: 209.5px;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  background-position: center center;
}

.start-agenda-box-3{
  width: calc(100% - 0px);
  height: 130px;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  background-position: center center;
}

.start-agenda-klein-1{
  width: calc(33.3% - 20px);
  height: auto;
  float: left;
  position: relative;
  margin-right: 30px;
}

.start-agenda-klein-2{
  width: calc(33.4% - 20px);
  height: auto;
  float: left;
  position: relative;
  margin-right: 30px;
}

.start-agenda-klein-3{
  width: calc(33.3% - 20px);
  height: auto;
  float: left;
  position: relative;
  margin-right: 0px;
}

#start-agenda-meer{
  width: calc(33.3% - 50px);
  height: auto;
  float: right;
  position: relative;
  border-radius: .4375rem;
  background-color: rgb(206,64,62);
  color: white;
  text-align: center;
  margin: 20px 0px 0px 0px;
  padding: 20px 15px;
}

#start-agenda-meer:hover{
  background-color: rgb(170,52,52);
}

#start-banner{
  width: 90%;
  height: auto;
  margin: 50px 5%;
  position: relative;
  float: left;
}
#start-banner-totaal{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
  margin-top: 0px;
}

.nieuws-bericht{
 width: calc(100% - 60px);
 height: 20px !important;
 float: left;
 position: relative;
 white-space: nowrap; 
 overflow: hidden;
 text-overflow: ellipsis;
 margin: 0px 30px;
}

#nieuws-foto{
  width: 200px;
  height: 142px;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  background: url('../afbeeldingen/judogrootegast.png') no-repeat;
  background-position: center center;
  background-size: cover;
}
#nieuws-bericht-box{
  width: calc(100% - 220px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 0px;
  margin-left: 20px;
}
#nieuws{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
  margin-top: 20px;
}
.nieuws-categorie-box{
 width: 100%;
 height: auto;
 float: left;
 position: relative;
}

.nieuws-categorie1{
 width: auto;
 height: auto;
 float: left;
 position: relative;
 padding: 10px;
 background-color: rgb(222,111,33);
 color: white;
 font-weight: bold;
  border-radius: .4375rem;
}

.nieuws-categorie2{
 width: auto;
 height: auto;
 float: left;
 position: relative;
 padding: 10px;
 background-color: rgb(222,111,33); 
 margin-left: 10px;
 color: white;
 font-weight: bold;
  border-radius: .4375rem;
}
#nieuws-box{
  width: 90%;
  height: auto;
  margin: 30px 5% 0px;
  position: relative;
  float: left;
}

#nieuws-nieuws-box{
  width: calc(100% - 0px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 0px;
}
.ganaar-box{
  width: 90%;
 height: auto;
 float: left;
 position: relative;
  margin: 30px 5% 0px;
}
.nieuws-foto-2{
    width: 100%;
    height: 150px;
    float: left;
    margin-bottom: 20px;
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    background-color: white;
    border-top-left-radius: .4375rem;
    border-top-right-radius: .4375rem;
    background-image: url('../afbeeldingen/judogrootegast.png');
  }

.nieuws-bericht-2{
 width: calc(100% - 60px);
 height: 20px !important;
 float: left;
 position: relative;
 white-space: nowrap; 
 overflow: hidden;
 text-overflow: ellipsis;
 margin: 0px 30px 30px;
}
/***************************************
!! INFORMATIE !!
***************************************/
#informatie-box{
  width: 90%;
  height: auto;
  margin: 30px 5%;
  position: relative;
  float: left;
}

#headerbox-informatie{
  width: auto;
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: -120px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  padding: 0px 0px 20px 0px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#informatie-inschrijven-box{
  width: calc(100% - 0px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 30px;
}

#informatie-inschrijven-opties{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
  margin-top: 20px;
}

.informatie-meer-uitleg{
  width: auto;
  height: auto;
  float: left;
  position: relative;
  border-radius: .4375rem;
  background-color: rgb(206,64,62);
  color: white;
  margin: 0px 10px 10px 0px;
  padding: 20px 25px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  text-align: center;
}

.informatie-meer{
  width: auto;
  height: auto;
  float: left;
  position: relative;
  border-radius: .4375rem;
  background-color: rgb(206,64,62);
  color: white;
  margin: 0px 10px 10px 0px;
  padding: 20px 25px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  text-align: center;
}
.informatie-leergeld-meer{
  width: calc(100% - 50px);
  height: auto;
  float: right;
  position: relative;
  border-radius: .4375rem;
  background-color: rgb(206,64,62);
  color: white;
  margin: 0px 0px 10px 0px;
  padding: 20px 15px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  text-align: center;
}

.informatie-meer:hover, .informatie-leergeld-meer:hover{background-color: rgb(170,52,52);}
.informatie-leergeld-meer{float: left; width: calc(60% - 40px);min-width: 392px;}
.informatie-contributie-box-1{
  width: calc(33.3% - 8px);
  height: auto;
  float: left;
  position: relative;
  margin-right: 12px;
  display: block;
  padding: 10px 15px
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.informatie-contributie-box-2{
  width: calc(33.4% - 8px);
  height: auto;
  float: left;
  position: relative;
  margin-right: 12px;
  display: block;
  padding: 10px 15px
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.informatie-contributie-box-3{
  width: calc(33.3% - 8px);
  height: auto;
  float: left;
  position: relative;
  display: block;
  padding: 10px 15px
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.informatie-contributie-foto{
  width: 100%;
  height: 130px;
  float: left;
  position: relative;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  background-color: white;
  border-top-left-radius: .4375rem;
  border-top-right-radius: .4375rem;

}

.fotoKrachttraining{
  background-image: url('../afbeeldingen/banner/krachttraining.png');
}
.fotoTechniektraining{
  background-image: url('../afbeeldingen/banner/techniektraining.png');
}
.fotoWedstrijdtraining{
  background-image: url('../afbeeldingen/banner/wedstrijdtraining.png');
}

.contributie-titel{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
  text-align: center;
  margin-top: 40px;
  font-family: Raleway-bold;
  font-weight: bold;
  font-size: 26px;
}

.contributie-prijs{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
  text-align: center;
  font-size: 50px;
  margin-top: 35px;
}

.contributie-info{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
  text-align: center;
  margin-top: 15px;
  margin-bottom: 15px;
}

.contributie-actie{
  width: 100%;
  height: auto;
  position: relative;
  float: left;
}

.contributie-proefles{
  background-color: rgb(222,111,33);
  height: auto;
  margin: 20px auto;
  padding: 9px 13px;
  position: relative;
  width: 152px;
  color: white;
  border-radius: .4375rem;
}

.contributie-proefles-overleg{
  background-color: rgb(254,147,0);
  height: auto;
  margin: 20px auto;
  padding: 9px 13px;
  position: relative;
  width: 194px;
  color: white;
  cursor: default;
  border-radius: .4375rem;
}

.contributie-meer{
  background-color: rgb(222,111,33);
  height: auto;
  margin: 0px auto 40px;
  padding: 9px 13px;
  position: relative;
  width: 124px;
  text-align: center;
  color: white;
  border-radius: .4375rem;
}

#informatie-opmerking, #training-opmerking{
  width: calc(100% - 60px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  background-color: rgb(254,147,0);
  color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 30px;
  padding: 20px 30px;
}

.informatie-kleding{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
  display: flex;
}

.informatie-kleding-judoshop, .informatie-kleding-clubkleding, .informatie-trainers{
  width: calc(100% - 20px);
  height: auto;
  min-height: 100px;
  position: relative;
  float: left;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  flex: 1;
}

.informatie-kleding-clubkleding{margin-left: 20px; margin-right: 0px;}

.informatie-kleding-clubkleding{
  float: right;
}

.informatie-kleding-judoshop-foto{
  width: 100%;
  height: 140px;
  float: left;
  margin-bottom: 40px;
  position: relative;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  background-color: white;
  border-top-left-radius: .4375rem;
  border-top-right-radius: .4375rem;
  background-image: url('../afbeeldingen/sponsors/judoshop.png');
}

.informatie-kleding-clubkleding-foto{
  width: 100%;
  height: 140px;
  float: left;
  margin-bottom: 40px;
  position: relative;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  background-color: white;
  border-top-left-radius: .4375rem;
  border-top-right-radius: .4375rem;
  background-image: url('../afbeeldingen/clubkleding.png');
}

.informatie-kleding-titel{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
  font-family: Raleway-bold;
  font-weight: bold;
  font-size: 26px;
}
.informatie-kleding-tekst{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
}

.informatie-kleding-meer{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
}

.informatie-kleding-judoshop-meer, .informatie-kleding-clubkleding-meer{
  width: calc(50% - 40px);
  height: auto;
  float: left;
  position: relative;
  border-radius: .4375rem;
  background-color: rgb(206,64,62);
  color: white;
  text-align: center;
  margin: 20px 20px 0px 0px;
  padding: 20px 15px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.informatie-kleding-judoshop-meer:hover, .informatie-kleding-clubkleding-meer:hover{
  background-color: rgb(170,52,52);
}
.informatie-kleding-clubkleding-meer{margin: 20px 0px 0px 0px;}

#informatie-leergeld, #informatie-proefles, #informatie-waarom, #informatie-over, #informatie-trainers, #informatie-examens, #wedstrijden-wedstrijden{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
  display: flex;
}
#informatie-leergeld-box, #informatie-waarom-box-2, #informatie-waarom-box-3, #informatie-over-box, #informatie-trainers-box, #wedstrijden-wedstrijden-box{
  width: calc(60% - 10px);
  height: auto;
  min-width: 422px;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 30px;
  margin-right: 20px;
  flex: 2 60%;
}

#informatie-trainers-box{min-height: 250px;}
#informatie-waarom-box-3{margin-left: 20px;margin-right: 0px;}

#informatie-leergeld-foto{
  width: calc(40% - 10px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 30px 0px 0px 0px;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  background: url('../afbeeldingen/leergeld.png') no-repeat;
  background-position: center center;
  background-size: cover;
  flex: 1 40%;
}

#informatie-leergeld-opties{
  width: calc(60% - 20px);
  height: auto;
  float: left;
  position: relative;
  margin-top: 30px;
  flex: 2 60%;
}

#voorwaarden-box{
  width: 90%;
  height: auto;
  margin: 50px 5% 0px;
  position: relative;
  float: left;
}
#informatie-voorwaarden-box{
  width: calc(100% - 0px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 30px;
}

.voorwaarden-totaal{
 width: 100%;
 height: auto;
 margin-bottom: 3px;
 float: left;
 position: relative;
}

.voorwaarden-nr{
 width: 25px;
 height: auto;
 min-height: 1px;
 float: left;
 position: relative;
 font-weight: bold;
}

.voorwaarden-lt{
 width: 25px;
 height: auto;
 min-height: 1px;
 float: left;
 position: relative;
 font-weight: bold;
}

.voorwaarden{
 width: calc(100% - 50px);
 height: auto;
 min-height: 1px;
 float: right;
 position: relative;
 text-align: left;
}

#informatie-proefles-box{
  width: calc(100% - 0px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 30px;
}


#informatie-proefles-box{
  width: calc(50% - 10px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 30px;
  margin-right: 20px;
  flex: 2 50%;
}

#informatie-proefles-formulier{
  width: calc(50% - 10px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 30px 0px 0px 0px;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  flex: 1 50%;
}

#informatie-waarom-box{
  width: calc(100% - 0px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 30px;
}

#informatie-waarom-foto-2, #informatie-waarom-foto-3{
  width: calc(40% - 10px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 30px 0px 0px 0px;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  background: url('../afbeeldingen/banner/waarom-2.png') no-repeat;
  background-position: center center;
  background-size: cover;
  flex: 1 40%;
}


#informatie-waarom-foto-3{
  background: url('../afbeeldingen/banner/waarom-3.png') no-repeat;
  background-position: center center;
  background-size: cover;
}
.informatie-trainers{display: none; width: 100%;}
#informatie-trainers-functie{width: 100%; height: auto; float: left; position: Relative; font-size: 13px; font-weight: bold; margin: 0px 30px 20px;}
#informatie-trainers-foto{
  width: calc(40% - 10px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 30px 0px 0px 0px;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  background: url('../afbeeldingen/judogrootegast.png') no-repeat;
  background-position: center center;
  background-size: cover;
  flex: 1 40%;
}

#informatie-examens-box{
  width: calc(100% - 260px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 30px;
  margin-right: 20px;
}

#informatie-examens-foto{
  width: 200px;
  height: 485px;
  position: relative;
  float: left;
  display: block;
  margin: 30px 0px 0px 0px;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  background: url('../afbeeldingen/gradaties.png') no-repeat;
  background-position: center center;
  background-size: cover;
  padding: 50px 20px;
}
/***************************************
!! OVER !!
***************************************/
#informatie-over-foto{
  width: calc(40% - 10px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 30px 0px 0px 0px;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  background: url('../afbeeldingen/over-judo-grootegast.png') no-repeat;
  background-position: center center;
  background-size: cover;
  flex: 1 40%;
}

#informatie-over-judo-foto{
  width: calc(40% - 10px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 30px 0px 0px 0px;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  background: url('../afbeeldingen/jigoro-kano.png') no-repeat;
  background-position: center center;
  background-size: cover;
  flex: 1 40%;
}

#informatie-over-albert-box{
  width: calc(100% - 0px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 30px;
  margin-right: 0px;
}

#informatie-over-albert-foto-001{
  width: calc(100% - 0px);
  height: 200px;
  position: relative;
  float: left;
  display: block;
  margin: 30px 0px 0px 0px;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  background: url('../afbeeldingen/albert-westerhof-001.png') no-repeat;
  background-position: center center;
  background-size: cover;
}

#informatie-over-albert-foto-002{
  width: calc(100% - 0px);
  height: 250px;
  position: relative;
  float: left;
  display: block;
  margin: 30px 0px 0px 0px;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  background: url('../afbeeldingen/albert-westerhof-002.png') no-repeat;
  background-position: center center;
  background-size: cover;
}

#informatie-over-albert-foto-003{
  width: calc(100% - 0px);
  height: 250px;
  position: relative;
  float: left;
  display: block;
  margin: 30px 0px 0px 0px;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  background: url('../afbeeldingen/albert-westerhof-003.png') no-repeat;
  background-position: center 47%;
  background-size: cover;
}

/***************************************
!! WEDSTRIJDEN !!
***************************************/
#wedstrijden-wedstrijden-box{
  width: calc(60% - 10px);
  height: auto;
  min-width: 422px;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 30px;
  margin-right: 20px;
  flex: 2 60%;
}

#wedstrijden-wedstrijden-foto-001, #wedstrijden-wedstrijden-foto-002, #wedstrijden-wedstrijden-foto-003{
  width: calc(40% - 10px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 30px 0px 0px 0px;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  background: url('../afbeeldingen/wedstrijden-001.png') no-repeat;
  background-position: center center;
  background-size: cover;
  flex: 1 40%;
}

#wedstrijden-wedstrijden-foto-002{
  background: url('../afbeeldingen/wedstrijden-002.png') no-repeat;
  background-position: center center;
  background-size: cover;
}

#wedstrijden-wedstrijden-foto-003{
  background: url('../afbeeldingen/wedstrijden-003.png') no-repeat;
  background-position: center center;
  background-size: cover;
}

.wedstrijden-ons-toernooi-archief{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
  margin: 0px 0px 8px 0px;
}

#wedstrijden-ons-toernooi-box-links{
  width: calc(100% - 360px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 30px;
  margin-right: 20px;
}

#wedstrijden-ons-toernooi-box-rechts{
  width: 340px;
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 30px;
}

/***************************************
!! ORGANISATIE !!
***************************************/
#organisatie-agenda, #organisatie-sponsors{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
  margin-top: 20px;
  display: flex;
}

#organisatie-agenda-box{
  width: calc(100% - 200px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 0px;
  margin-right: 20px;
}

#organisatie-agenda-foto{
  width: 200px;
  height: auto;
  position: relative;
  min-width: 150px;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  background: url('../afbeeldingen/wedstrijden-001.png') no-repeat;
  background-position: center center;
  background-size: cover;
}
.organisatie-agenda-titel{
  width: calc(100% - 60px);
  height: auto;
  float: left;
  position: relative;
  font-family: Raleway-bold;
  font-weight: bold;
  font-size: 26px;
  margin: 0px 30px 20px;
}
.organisatie-agenda-2, .organisatie-sponsors-2{
  width: calc(100% - 20px);
  height: auto;
  min-height: 100px;
  position: relative;
  float: left;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  flex: 1;
}

#organisatie-agenda-datum{width: calc(100% - 60px); height: auto; float: left; position: Relative; font-size: 13px; font-weight: bold; margin: 0px 30px 20px;}
.organisatie-agenda-foto-2{
    width: 100%;
    height: 105px;
    float: left;
    margin-bottom: 20px;
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    background-color: white;
    border-top-left-radius: .4375rem;
    border-top-right-radius: .4375rem;
    background-image: url('../afbeeldingen/judogrootegast.png');
  }

.pagination{
 min-width: 30px;
 width: auto;
 height: 30px;
 float: left;
 line-height: 30px;
 border: 1px solid black; 
 text-align: center;
 margin: 0px 3px;
}

.pagination-box{
  width: auto;
  height: 72px;
  margin: 0 auto;
  position: relative;
}

#organisatie-sponsors-box{
  width: calc(100% - 400px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 0px;
  margin-right: 20px;
}

#organisatie-sponsors-foto{
  width: 400px;
  height: auto;
  position: relative;
  min-width: 150px;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  background: url('../afbeeldingen/wedstrijden-001.png') no-repeat;
  background-position: center center;
  background-size: cover;
}
.organisatie-sponsors-foto-2{
    width: 100%;
    height: 150px;
    float: left;
    margin-bottom: 20px;
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    background-color: white;
    border-top-left-radius: .4375rem;
    border-top-right-radius: .4375rem;
    background-image: url('../afbeeldingen/judogrootegast.png');
  }

/***************************************
!! TRAININGEN !!
***************************************/
#trainingen-locatie{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
  margin-top: 20px;
}

#trainingen-locatie-box{
  width: calc(100% - 0px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 20px;
  margin-right: 0px;
}

#trainingen-locatie-links-box{
  width: calc(100% - 320px);
  height: auto;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 20px;
  margin-right: 20px;
}

#trainingen-locatie-rechts-box{
  width: 300px;
  height: 250px;
  position: relative;
  float: right;
  display: block;
  border-radius: .4375rem;
  background: url('../afbeeldingen/locatie.png') no-repeat;
  background-size: 800px;
  background-position: center 5%;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 20px;
  margin-right: 0px;
}

.locatie-training-groep{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
  font-weight: bold;
  font-size: 20px;
}
.locatie-training-tabel{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
  margin: 3px 0px;
}

.locatie-training-tabel-links{
  width: 110px;
  height: auto;
  float: left;
  position: relative;
}

.locatie-training-tabel-rechts{
  width: calc(100% - 110px);
  height: auto;
  float: left;
  position: relative;
}
/***************************************
!! CORONA !!
***************************************/
.container-radio {
  display: inline-block;
  position: relative;
  padding-left: 35px;
  margin-right: 15px;
  margin-top: 0px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  height: 32px;
  line-height: 32px;
}
.container-radio2 {
  display: inline-block;
  position: relative;
  padding-left: 35px;
  margin-right: 15px;
  margin-top: 0px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  height: auto;
}

.inschrijven-tabel{
 width: 100%;
 height: auto;
 float: left;
 position: relative;
 margin-bottom: 0px;
 margin-top: 0px;
}

.inschrijven-tabel-links{
 width: 250px;
 height: auto;
 min-height: 38px;
 line-height: 38px;
 float: left;
 position: relative;
 font-weight: bold;
}

.inschrijven-tabel-rechts{
 width: calc(100% - 250px);
 height: auto;
 float: left; 
 position: relative;
}

/***************************************
!! FOOTER !!
***************************************/
#footer{
  width: 90%;
  height: auto;
  margin: 60px 5%;
  position: relative;
  float: left;
  text-align: left;
}

#footer-1, #footer-2, #footer-3, #footer-4{
  width: 30%; 
  height: auto;
  float: left;
  position: relative;
}


#footer-2, #footer-3{
  width: 20%; 
  height: auto;
  float: left;
  position: relative;
}

.footer-subtitel{
  font-weight: bold;
  margin-bottom: 10px;
  width: 100%;
  height: auto;
  float: left;
}
.footer-links{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
}

.footer-links-tekst{
  width: auto;
  height: 20px;
  float: left;
  position: relative;
  margin: 4px 0px;
}

.footer-links-tekst:hover{
  color: rgb(222,111,33) !important;
}
.footer-links-icon{
  width: auto;
  float: left;
  position: relative;
  height: auto;
  color: rgb(222,111,33);
  margin: 7px 10px 7px 0px;
  font-size: 10px;
}

.footer-links-info{
  width: 100%;
  height: auto;
  float: left;
  position: relative;
}
#copyright{
  width: 90%;
  height: auto;
  float: left;
  position: relative;
  background-color: rgb(241,240,242);
  padding: 30px 5%;
}

#copyright-tekst{
  width: calc(100% - 100px);
  height: auto;
  float: left;
  position: relative;
}

#copyright-socialemedia{
  width: 100px;
  height: auto;
  float: left;
  position: relative;
  text-align: right;
}

.copyright-socialemedia-icon{
  width: auto;
  float: left;
  position: relative;
  margin-left: 10px;
  font-size: 20px;
}
/***************************************
!! MEDIA !!
***************************************/

@media screen and (max-width: 1000px) {
 .nav{display: none;}

 .navopen{
  width: 100%;
  height: calc(100% - 126px);
  float: left;
  position: fixed;
  background-color: rgb(254,147,0);
  display: none;
  padding: 125px 0px 0px 0px;
  z-index: -6;
  margin-top: -20px;
  left: 0;
  overflow: auto;
 }
 .menu-box{
  max-width: calc(100% - 0px);
  width: auto;
  position: absolute;
  right: 0;
  margin-right: 0px;
 }

 ul a {
  height: auto; 
  width: 100% !important;
  padding: 0px;
  float: left;
  position: relative;
  display: block;
   color: white !important;
  text-align: center;
 }

 .hamburger{
  padding: 15px;
  margin: 11px 0px 11px 9px;
  float: right;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  color: black !important;
  cursor: pointer;
 }
 
  #headerbox-start-rechts{
    width: calc(100% - 650px);
  }

  .start-agenda-box{height: 130px;}
  .start-agenda-klein-1{width: calc(50% - 15px); margin-right: 30px;}
  .start-agenda-klein-2{width: calc(50% - 15px); margin-right: 0px;}
  .start-agenda-klein-3{width: calc(50% - 15px); margin: 30px 20px 0px 0px;}

  
    #start-agenda-meer{
    width: calc(50% - 45px);
    height: 100px;
    line-height: 100px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    margin: 20px 0px 0px 0px;
  }
  .headerbox-box-start{margin: 0px 0px 10px 20px;}
  .headerbox-box, .headerbox-box-2{
    width: calc(100% - 0px);
    min-height: auto;
    position: relative;
    float: left;
    padding: 0px 0px 10px 0px;
    margin: 0px;
  }
   #headerbox-start-rechts{
     width: calc(100% - 0px);
     margin-top: 0px !important;
   }
  .headerbox-box-foto{
    width: calc(100% - 0px);
    height: 100px;
    position: relative;
    float: left;
    margin: 0px 0px 0px 0px;
    border-radius: .4375rem;  
  }
  
  .headerbox-box-titel{
    width: auto;
    height: auto;
    float: left;
    position: relative;
    padding: 15px 20px;
    border-radius: .4375rem;  
    background-color: rgba(0,0,0,0.5);
    color: white;
    margin-top: -60px;
    margin-left: 7px;
    text-align: left;
  }
  #headerbox-informatie{width: calc(100% - 0px);}
}
  
@media screen and (max-width: 900px) {
  #start-citaat-titel, #start-nieuws-titel, #start-agenda-titel, #start-banner-titel, #wedstrijd-banner-titel, .titel, #titel, .titel-in, .titel-uit{font-size: 35px;}    
  #headerbox-start{width: 100%; height: auto;}
  #headerbox-start-tekst{font-size: 30px;}
  .headerbox-start-box{
    width: calc(100% - 20px);
    height: 190px;
    position: relative;
    float: left;
    padding: 0px 10px 20px 10px;
  }

  .headerbox-start-box-titel{
    width: 100%;
    height: auto;  
    float: left;
    position: relative;
    text-align: center;
    font-weight: bold;
    font-family: Roboto;
    font-size: 19px;
  }

  .headerbox-start-box-foto{
    width: calc(100% - 40px);
    height: 130px;
    position: relative;
    float: left;
    margin: 0px 20px 15px 20px;
    border-radius: .4375rem;  
  }
 
  
   .header-start-rechts-box{
     margin-top: 20px;
   }
  
  #footer-1, #footer-2, #footer-3, #footer-4{
    width: 50%; 
    margin-bottom: 30px;
  }
  .footer-subtitel{
    font-size: 25px;
  }

  .informatie-contributie-box-1, .informatie-contributie-box-2, .informatie-contributie-box-3{
    width: calc(100% - 0px);
    margin-bottom: 20px;
  }
  #informatie-opmerking{margin-top: 0px;}
  
  #informatie-proefles-box, #informatie-proefles-formulier{
    width: calc(100% - 0px);
  }
  #informatie-proefles{display: block;}

}

@media screen and (max-width: 850px) {
  #wedstrijden-ons-toernooi-box-links, #wedstrijden-ons-toernooi-box-rechts{
    width: 100%;
    margin: 0px;
    float: left;
  }
  #wedstrijden-ons-toernooi-box-rechts{margin-top: 20px;}
}

@media screen and (max-width: 800px) {
  .display800none{display: none !important;}
  .displayboven800none{display:block;}
  #start-nieuws-groot, #start-nieuws-klein{
    width: 100%;
    height: auto;
    float: left;
    position: relative;
    margin-top: 0px;
  }
  #start-nieuws-klein{margin-top: 30px;}
  #start-nieuws-klein{
    margin-top: 20px;
  }
  
  #start-nieuws-groot-box, #start-nieuws-klein-box{
    width: calc(100% - 0px);
    height: 120px;
  }
  
  .start-agenda-box{height: 130px;}
  .start-agenda-klein-1{width: calc(100% - 0px); margin: 0px 0px 0px 0px;}
  .start-agenda-klein-2{width: calc(100% - 0px); margin: 20px 0px 0px 0px;}
  .start-agenda-klein-3{width: calc(100% - 0px); margin: 20px 0px 0px 0px;}
  
  #start-agenda-meer{
    width: calc(100% - 30px);
    height: auto;
    line-height: unset;
    margin: 20px 0px 0px 0px;
  }
  
  #start-nieuws-meer{
    width: calc(100% - 30px);
    margin: 0px 0px 0px 0px;
    padding: 20px 15px;
 }

  #informatie-inschrijven-box{width: calc(100% - 0px);}
  #informatie-inschrijven-opties{width: 100%; margin-top: 20px;} 
  .informatie-meer{width: calc(100% - 50px);}
  .informatie-meer-uitleg{display: none;}
  .informatie-kleding, .informatie-trainers{display: block;}
  #informatie-trainers-functie{margin: 20px 0px;}
  .informatie-trainers-foto{
    width: 100%;
    height: 200px;
    float: left;
    margin-bottom: 40px;
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    background-color: white;
    border-top-left-radius: .4375rem;
    border-top-right-radius: .4375rem;
    background-image: url('../afbeeldingen/judogrootegast.png');
  }
  
  #wedstrijden-wedstrijden-foto{
    width: 100%;
    height: auto;
    float: left;
    position: relative;
    display: block;
  }
  
  #wedstrijden-wedstrijden{display: block;}
  #wedstrijden-wedstrijden-foto-001, #wedstrijden-wedstrijden-foto-002, #wedstrijden-wedstrijden-foto-003{width: 100%; height: 200px;}
  .informatie-kleding-judoshop, .informatie-kleding-clubkleding, .informatie-trainers-foto{width: calc(100% - 0px); margin: 0px 0px 20px 0px;}
  .informatie-kleding-judoshop-meer, .informatie-kleding-clubkleding-meer{width: calc(100% - 30px); margin: 0px 0px 20px 0px; float: left;}
  
  #informatie-leergeld, #informatie-over, #informatie-trainers, #wedstrijden-wedstrijden-box{
   width: 100%;
   height: auto;
   float: left;
   position: relative;
   display: block;
  }
#informatie-leergeld-box, #informatie-over-box {
  width: calc(100% - 0px);
  height: auto;
  min-width: 0px;
  position: relative;
  float: left;
  display: block;
  margin: 0px 0px 0px 0px;
  background-color: white;
  border-radius: .4375rem;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin-top: 30px;
  margin-right: 20px;
  flex: 2 60%;
}
  #informatie-trainers-foto, #informatie-trainers-box{display: none;}
  #informatie-leergeld-foto{display: none;} 
  #informatie-over-foto, {width: 100%; height: 200px;}
  #informatie-over-judo-foto{width: 100%; height: 200px;}
  #informatie-leergeld-opties{width: calc(100% - 30px);}
  .informatie-leergeld-meer{width: 100%; min-width: 0px;}
  
  #informatie-waarom{display: block;}
  #informatie-waarom-box-2, #informatie-waarom-box-3{width: 100%; min-width: 0px; height: auto; float: left; margin-bottom: 0px;}
  #informatie-waarom-box-3{margin-left: 0px;}
  #informatie-waarom-foto-2, #informatie-waarom-foto-3{width: 100%; height: 175px; float: left; display: block; background-position: center 45%;}
  
  #trainingen-locatie-links-box{width: 100%;}
  #trainingen-locatie-rechts-box{width: 100%;}

}
  
@media screen and (max-width: 700px) {
  .tabel-links1, .tabel-rechts1 {width: 100%;}

  #informatie-examens-box{
    width: calc(100%);
  }
  #informatie-examens-foto {
    width: calc(100% - 40px);
    background-size: contain;
    background-repeat: no-repeat;
    height: calc(2 * 100vw);;
    
  }
}
@media screen and (max-width: 600px) {
  #menu-box{width: calc(100% - 251px);}
  #informatie-box{margin: 20px 5%;}
  #menu-logo::after{font-size: 25px;}
  #menu-logo {width: 251px;}
  #start-nieuws-box-titel, #start-agenda-box-titel{font-size: 18px;}
  #start-citaat-titel, #start-nieuws-titel, #start-agenda-titel, #start-banner-titel, #wedstrijd-banner-titel,.titel, #titel, .titel-in, .titel-uit{
    font-size: 30px;
  }  
  #start-banner-titel::before{content: "";}

  #headerbox-start-tekst{
    font-size: 5.25vw;
  }
  
  #footer-1, #footer-2, #footer-3, #footer-4{
    width: 100%; 
    margin-bottom: 30px;
  }
}