/* YANNZ.nl */
@font-face{font-display:swap;font-family:Rubik;font-style:normal;font-weight:300;src:url(https://fonts.gstatic.com/s/rubik/v21/iJWKBXyIfDnIV7nBrXw.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-display:swap;font-family:Rubik;font-style:normal;font-weight:400;src:url(https://fonts.gstatic.com/s/rubik/v21/iJWKBXyIfDnIV7nBrXw.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root {
    --breedte       : 900px;
    --geel          : #ffe745;
    --oranje        : #fe8414;
    --blauw         : #0a53b8;
    --groen         : #02930e;
    --lichtgroen    : #95e64f;
    --paars         : #6a4192;
}

body {
    font-family     : Rubik, "Open Sans", Helvetica, Arial, sans-serif;
    font-size       : 1em;
    margin          : 5px 0px 0px;
    background-color: #dbf7fb;
}

#navigation, #lastupdate, #freeText, #results {
    width           : var(--breedte);
    margin          : 0px auto;
}

img {
  border           : 0px;
}

a {
  color: black;
}

a:hover {
  color: blue;
}

.tab {
  border           : none;
  display          : none;
  vertical-align   : top;
    font-size: 1em;
    line-height: 1.5em;
}

.centerText {
    text-align: left !important;
}
/* Styles for sections */

#footer {
  display          : block;
  text-align       : center;
    background      : var(--groen);
    padding-bottom   : 100px; 
    padding-top      : 60px; 
}

#footer::after {
    content: " | colored by YANNZ.nl";
}

#header {
    font-weight     : bolder;
    background-image: url(paasYtoernooi.png), url(Het-y-Logo_blauw.svg);
    background-repeat: no-repeat;
    background-position: top, 100px;
    background-size : 250px, 150px;
    margin          : 0px auto;

    width           : calc(var(--breedte)+ 0px) !important;    
    height          : 180px;/*calc(250/695*305px);*/ 
    display         : flex;
    flex-direction  : column;
    justify-content : flex-end;
    color           : var(--blauw);
    font-size       : 1.5em;
}

#header table {
    margin: auto auto 0px auto;
    width           : var(--breedte);

}
#lastupdate {
  font-size        : 0.8em;
  margin-bottom    : 5px;
  text-align       : right;
  color: var(--paars);
}

#navigation {
    margin-top: 20px;
    padding-top: 20px;
    padding-bottom: 20px;
  border-top        : 4px solid var(--groen);
}

#navigation table {
    width: 20px !important;
    border-spacing: 25px 0px;
}

#navigation table td {
    width: 20px !important;
    white-space: nowrap;
    background: #fff;
    font-size: 0px;
    padding: 10px 0px;
    border-radius: 10px;
}

#navigation a {
    color: #3480c5;
    font-size: 1rem;
    padding: 10px;
    text-decoration-color: red green;
}

#navigation td:first-of-type a:first-child {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}
#navigation td:first-of-type a:last-child {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

#navigation td:last-child a{
    text-decoration-style: wavy;
    text-decoration-thickness: 0.1em;
    text-decoration-line:overline underline;
    text-underline-offset: 6px;
    text-overline-offset: 16px;
}

#navigation td:last-child a:hover {
    text-decoration-style: wavy !important;
    text-decoration-thickness: 0.1em;
    text-decoration-line:overline underline !important;
    text-underline-offset: 6px;
    text-overline-offset: 16px;
color: var(--groen);
}

#navigation table a:hover {
  color            : var(--blauw);
  text-decoration  : underline !important; 
  
}

#navigation a[style="font-weight: bold; text-decoration: none;"] {
  background-image : linear-gradient(to top, var(--oranje), var(--geel));
  color            : white;
    border-radius: 10px;
    font-weight: normal !important;
}
#noscript {
  border           : none;
  font-size        : 13px;
  font-weight      : bold;
  color            : red;
  margin-bottom    : 15px;
  text-align       : center;
  width            : 780px;
}

#freeText {
/*  background-color: #EFEFEF;*/
/*  border           : solid 1px black;*/
  color            : navy;
  font-weight      :400;
  padding-bottom    :15px;
/*  padding-left      :40px;*/
  padding-top       :10px;
/*  padding          : 3px;*/
  text-align       : left;
  vertical-align   : top;
}

#results {
  margin-bottom    : 15px;
  vertical-align   : top;
}


/* Styles for table rows */

.trList0 {
}

.trList1 {
  background-color: rgba(255,255,255,0.5);
}

.trTitle1 {
}

.trTitle2 {
/*  background-color: #CFCFCF;*/
    color: var(--oranje);
}

#tab0 td.title1[colspan]:not([colspan="6"]) {
    color: #dbf7fb;
}
#tab0 td.title1[colspan]:not([colspan="6"]):before {
    content: "Gemengd";
    color: var(--blauw);
}
/* Styles for table cells */

.title1 {
  font-size        : 1.8em;
    color: var(--blauw);
  font-weight      : bold;
  padding-bottom   : 8px;
}

.title2 {
  font-weight     : bold;
}

.leftText {
}

.centerText {
  text-align      : center;
}

.rightText {
  text-align      : right;
}
/* YANNZ.nl */