*{  
    border: none;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body{ 
        position: relative;
        margin-top:  20px;
        margin-left: 15px; 
        margin-right: 10px; 
        font-size: 15px;
        background-color: #FFFFE6; 
        max-width:  850px; 
      } 

.bijlage1{ font-family:'titillium-web-regular', sans-serif; font-size: 15px; }

h1      { font-family: "titillium-web-bold", sans-serif; text-align: center; font-size: 20px; color:black}

h2      { font-family: "titillium-web-regular", sans-serif; color:black; font-size: 20px;}
.h2-bijlage2{ font-family: "titillium-ol-A", "sans-serif";  color:  #008000;}


h3      { font-family: "titillium-web-regular", sans-serif; color:black;  } 
h4      { font-family: "titillium-web-regular", sans-serif; color:black;  }
h5      { font-family: "titillium-web-light", sans-serif; margin-left: 18px; color:black} 

p       { font-family: "titillium-web-regular", sans-serif; } 
.p1     { font-family: "titillium-web-regular", sans-serif; } 
.p2     { font-family: "titillium-web-regular", sans-serif; padding-top: 3px; padding-bottom: 15px;} 

/* Lijst opmaak */
ol      { margin-left: 18px; }
ol li   { padding-bottom: 3px;}   /*ruimte tussen li van 3px */

/* tekst onder het hoofd artikel */
.Inhoud1{ font-family: "titillium-web-semibold", sans-serif; text-align: center; font-weight: 600; font-size: 18px;} 

.button1, .button2{  /* home is button1 en van de opmerkingen is button2    */
  font-family: "titillium-web-regular", sans-serif;
  background-color: #EF7D00;
  border: 1.8px solid black;  
  color: white;
  padding: 4px 12px;
  text-decoration: none;
  border-radius: 21px; 
  cursor: pointer;
  font-size: 14px;
  margin-left: 8px;
}
.button1:hover, .button2:hover{ 
  background-color: #023E8A;  
}

.link1{   /* opmerking onder verantwoording peter*/
  font-family: "titillium-web-regular", sans-serif;
  border: none;
  font-style: italic;
  font-weight:       430;
  color: #023E8A;
  padding: 8px;
  font-size: 15px;
  cursor: pointer;
}


.link2 {   /* link van de opmerkingen */
  font-family: "titillium-web-regular", sans-serif;
  border: none;
  font-style: italic;
  font-weight: 400;
  color: #EF7D00;
  padding: 8px;
  font-size: 15px;
  cursor: pointer;
}

.link2:active { 
  color: #023E8A;
}

.button3 {   
  font-family: "titillium-web-regular", sans-serif;
  background-color: #EF7D00;
  border: 1.8px solid black;  
  color: white;
  padding: 4px 12px;
  text-decoration: none;
  border-radius: 27Px; /* de button zou vierkant zijn maar willen afgerond. rekenuit( 1em + de padding*/
  font-size: 13px;
  margin-top: 20px;
  cursor: pointer;
  position: fixed;   /* zet de button vast */
  top: 30px;
  left: 18px;
} 


img{      /* de afbeeldingen van schoppen, harten, ruiten en klaver*/
  width: 12px;
  height: 11px;
}


table, th, td {
  border: 1px solid black;
  border-collapse: collapse;
  width:360px;
  padding: 3px;
  text-align: center;
  font-family:  "titillium-web-regular", sans-serif;
  font-size: 15px;
}

th{
  background-color: #c2c1c3;
}

.scoretable {
  border: 1px solid black;
  border-collapse: collapse;
  max-width: 360px;
  padding: 3px;
  text-align: center;
  font-family:  "titillium-web-regular", sans-serif;
  font-size: 15px;
}

/* de opmaak van de imp tabel */
.impscore {
    font-family: "titillium-web-regular", sans-serif;
    border: 1px solid black;
    border-collapse: collapse;
    width: 360px;
    font-style: normal;   /* toegevoegd: breekt overerving van de <li> */
}

.impscore th{
    font-weight: 700;     /* kop: vet */
    font-style: normal;   /* kop: rechtop, niet schuin */
    background-color: #c2c1c3;
}

.impscore1{
    font-family: "titillium-web-regular", sans-serif;  /* was per ongeluk een niet-bestaand font */
    font-weight: 400;     /* data: licht */
    font-style: normal;   /* data: rechtop */
}

.biedtabel, .biedtabel th, .biedtabel td{
  width: 360px;
}

    /*Popup 3.2 versie 01072026*/

/*Popup-link*/
.popup-link {
    cursor: pointer;
    color: #0438c7;
    
    text-decoration: underline;
}
.popup-link:hover {
    text-decoration-thickness: 2px;
}
/*Popup */
.popup {
  font-family: "titillium-web-regular", sans-serif;
    position: absolute;
    display: none;
    box-sizing: border-box;
    background: #FFFCC0;
    border: 2px solid #F28824;
    padding: 10px 10px;
    z-index: 5000;
    overflow: visible;
    opacity: 0;
    transform: translateY(-1px);
    transition:
       opacity .25s ease,
        transform .25s ease;
}

/* popup-inhoud om de linken zwart te maken*/
/*Vervang door zoek: class="popup-link".    en vervang door: class="popup-link popup-link-ref"    */
/*Vervang door zoek: --<a class="popup-link" data-popup=  Verang door:--  <a class="popup-link popup-link-ref" data-popup=  --. om de linken zwart te maken in de popup */

.popup-link-ref {
    color: inherit;
    text-decoration: none;
}
/* zichtbaar */
.popup.open {
    opacity: 1;
    transform: translateY(0);
}
/*Templates zijn onzichtbaar*/
template {
    display:none;
}
/* Mobiele telefoon*/
@media (max-width:700px){
    .popup{
        border-radius:6px;
        padding:12px 14px;
    }
}
/*Desktop*/
@media (min-width:701px){
    .popup{
        border-radius:8px;
    }
}



/* De fontregels */
@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700&display=swap');

.titillium-web-regular {   /* body */
  font-family: "titillium-web-regular", sans-serif;
  font-weight: 400;
  font-size: 15px;
  font-style: normal;
}

.titillium-ol-A{  /*  artikel font met A.*/
  font-family: "titillium-web-regular", sans-serif;
  list-style-type: upper-alpha;  /* de A */
  font-weight: 400;
  font-size: 15px;
  font-style: normal;
  }
   
  .titillium-ol-A-1{  /* artikel font met A.1*/
    font-family: "titillium-web-regular", sans-serif;
    list-style-type: decimal;  /* de 1 */
    font-weight: 400;
    font-size: 15px;
    font-style: normal;
    /*padding-top:  3px;*/
    }

  .titillium-ol-A-1a{  /*  artikel font met de a*/
    font-family: "titillium-web-regular", sans-serif;
    list-style-type: lower-alpha;   /* de a */
    font-weight: 400;
    font-size: 15px;
    font-style: normal;
    padding-top:  3px;
    }

  .titillium-ol-A-1ai{  /* artikel font met i.*/
    font-family: "titillium-web-regular", sans-serif;
    list-style-type:   lower-roman;     /* de i */
    font-weight: 400;
    font-size: 15px;
    padding-top: 3px;
    font-style: normal;
    }
    
    .titillium-li{   /* eerste artikel kopje schuin en vet */
      font-family: "titillium-web-regular", sans-serif;
      font-weight: 600;
      font-size: 15px;
      /*padding-bottom: 3px;*/
      font-style: italic;
    }

      .titillium-li-p{   /*  tekst na de kopje */
      font-family: "titillium-web-regular", sans-serif;
      font-weight: 400;
      padding-top: 0px;
      font-size: 15px;
      font-style: normal;
      padding-top: 1px;
    }

  
    .titillium-li-t{   /*   tweede en volgende artikel kopje   */
      font-family: "titillium-web-regular", sans-serif;
      font-weight: 600;
      font-size: 15px;
      padding-top: 12px;
      /*padding-bottom: 3px;*/
      font-style: italic;
      }

      .titillium-li-2{   /* itillium-web-semibold-italic  definities */
        font-family: "titillium-web-regular", sans-serif;
        font-weight: 600;
        font-size: 15px;
        padding-top: 3px;
        padding-bottom: 3px;
        font-style: italic;
        }


    .titillium-web-light {  /* h5 */
      font-family: "Titillium Web", sans-serif;
      font-weight: 300;
      font-style: normal;
    }