@font-face{
    font-display:swap;
    font-family:DIN Next;
    font-style:normal;
    font-weight:300;
    src:url(https://knzb-corporate-production.herokuapp.com/assets/fonts/DinNext/WOFF2/DINNextLTPro-Light.woff2) format("woff2"),url(https://knzb-corporate-production.herokuapp.com/assets/fonts/DinNext/WOFF/DINNextLTPro-Light.woff) format("woff"),url(https://knzb-corporate-production.herokuapp.com/assets/fonts/DinNext/OTF/DINNextLTPro-Light.otf) format("otf")
}
@font-face{font-display:swap;
    font-family:DIN Next;
    font-style:normal;
    font-weight:400;
    src:url(https://knzb-corporate-production.herokuapp.com/assets/fonts/DinNext/WOFF2/DINNextLTPro-Regular.woff2) format("woff2"),url(https://knzb-corporate-production.herokuapp.com/assets/fonts/DinNext/WOFF/DINNextLTPro-Regular.woff) format("woff"),url(https://knzb-corporate-production.herokuapp.com/assets/fonts/DinNext/OTF/DINNextLTPro-Regular.otf) format("otf")
}
@font-face{
    font-display:swap;
    font-family:DIN Next;
    font-style:normal;
    font-weight:500;
    src:url(https://knzb-corporate-production.herokuapp.com/assets/fonts/DinNext/WOFF2/DINNextLTPro-Medium.woff2) format("woff2"),url(https://knzb-corporate-production.herokuapp.com/assets/fonts/DinNext/WOFF/DINNextLTPro-Medium.woff) format("woff"),url(https://knzb-corporate-production.herokuapp.com/assets/fonts/DinNext/OTF/DINNextLTPro-Medium.otf) format("otf")
}
@font-face{
        font-display:swap;
        font-family:DIN Next;
        font-style:normal;
        font-weight:700;
        src:url(https://knzb-corporate-production.herokuapp.com/assets/fonts/DinNext/WOFF2/DINNextLTPro-Bold.woff2) format("woff2"),url(https://knzb-corporate-production.herokuapp.com/assets/fonts/DinNext/WOFF/DINNextLTPro-Bold.woff) format("woff"),url(https://knzb-corporate-production.herokuapp.com/assets/fonts/DinNext/OTF/DINNextLTPro-Bold.otf) format("otf")
}
@font-face{
        font-display:swap;
        font-family:DIN Next;
        font-style:normal;
        font-weight:750;
        letter-spacing:.1em;
        src:url(https://knzb-corporate-production.herokuapp.com/assets/fonts/DinNext/WOFF2/DINNextLTPro-HeavyItalic.woff2) format("woff2") url(https://knzb-corporate-production.herokuapp.com/assets/fonts/DinNext/WOFF/DINNextLTPro-HeavyItalic.woff) format("woff"),url(https://knzb-corporate-production.herokuapp.com/assets/fonts/DinNext/OTF/DINNextLTPro-HeavyItalic.otf) format("otf")}



/* OWW De Binnenmaas Livetiming – aangepaste stylesheet (2026)
   Stijl gebaseerd op logo/site: minimalistisch zwart-wit, rustig waterblauw,
   natuurlijke Binnenmaas-sfeer, veel witruimte, afgeronde vormen en subtiele golfaccenten.
   Technische layout/order-regels uit de oorspronkelijke stylesheet zijn behouden.
*/

body {
  font-family      : Rubik,Open Sans,Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,sans-serif;
  font-size        : 1.125rem;
  margin           : 0;
  padding          : 0; 

}

body { display: flex; flex-direction: column; }
#headerkop          { order: 1;}
#navigation         { order: 3;}
#header             { order: 2;}
#lastupdate         { order: 4;}
#freeText           { order: 5;}
#noscript           { order: 6;}
#results            { order: 7;}
#reclame            { order: 8;}
#footer             { order:10;}
#splashmeapp        { order: 9;}
a {
  color: #0b0b0b;
}

a:hover {
  color: #4f95b4;
}

.tab {
  border           : none;
  display          : none;
  vertical-align   : top;
}

.tab tr td:first-child {
    padding-left: 3px;
}

/* Styles for sections */

#footer {
  padding-bottom: 74px;
    padding-top: 86px;
  display          : block;
  text-align       : center;
  width            : 100%;
    background: #1f4f66;
    color: #fff;
    font-family: Rubik,Open Sans,Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,sans-serif;
}

#footer::before {
  content          : "OWW De Binnenmaas Livetiming | ";
}

#header {
  background       : linear-gradient(101.96deg,rgba(255,255,255,.94) 0%,rgba(215,232,237,.92) 48%,rgba(79,149,180,.78) 100%),
                     url("data:image/svg+xml;charset=utf-8,%3Csvg width='900' height='100' viewBox='0 0 900 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 62 C55 88 112 38 168 62 S280 87 336 62 448 38 504 62 616 88 672 62 784 38 900 62 L900 100 L0 100 Z' fill='%23ffffff' fill-opacity='.68'/%3E%3Cpath d='M0 72 C60 96 120 48 180 72 S300 96 360 72 480 48 540 72 660 96 720 72 840 48 900 72' fill='none' stroke='%23111111' stroke-width='4' stroke-linecap='round' opacity='.16'/%3E%3C/svg%3E");
/*  background: linear-gradient(101.96deg,rgba(11,11,11,.78) 2.45%,rgba(67,89,118,.78) 50.76%);*/
  background-repeat: no-repeat;
  background-size  : contain;
  background-position: 100%;
  border           : none;
  font-size        : 16px;
  font-weight      : bold;
  width            : 100%;
  height           : 100px;
  z-index          : -2;
}

#header table {
  font-family      : DIN Next,Open Sans,Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,sans-serif;
  border           : 0px yellow solid;
  width            : 1200px;
  color            : #111;
  margin           : 0px auto;
  font-size        : 24px;
  z-index          : 1;
}

#header table td {
    padding        : 8px;
    z-index: 1;
}

#headerkop {
    width            : auto;
    display: flex;
    justify-content: space-between;
    height: 80px;
}

#header table:before {
    background: linear-gradient(101.96deg,rgba(31,79,102,.92) 2.45%,rgba(79,149,180,.78) 50.76%,rgba(215,232,237,.65) 100%);
    -webkit-clip-path: polygon(40px 0,100% 0,100% 100%,0 100%);
    clip-path: polygon(40px 0,100% 0,100% 100%,0 100%);
    content: "";
    height: 100px;
    position: absolute;
    right: 0;
    width: 44%;
    z-index: -1;
    color            : #fff;
}

#headerkop img {
  height           : 61px;
  margin-top       : 8px;
}

#rechts img {
    margin-left    : 7px;
    margin-right   : 7px; 
}

#lastupdate {
  text-align       : right;
  width            : 884px;
  margin           : 5px auto;    
}

#navigation {
    background-color: #d7e8ed;
}

#navigation table {
  width            : 1200px;
  margin           : 0px auto;
  height           : 60px;
  font-size        : 0px;
}

#navigation a {
  font-size        : 16px;
  color            : #1f4f66;
  padding          : 8px;
}

#navigation table a:hover {
  color            : #0b0b0b;
  text-decoration  : underline !important; 
  
}

#navigation a[style="font-weight: bold; text-decoration: none;"] {
  color            : #fff;
  background       : #1f4f66;
  border-radius    : 999px;
}

a#href0, a#href1, a#href2, a#href3, a#href4 {
  text-decoration  : none !important;
  font-weight      : 500 !important;
}

#noscript {
  border           : none;
  font-size        : 13px;
  font-weight      : bold;
  color            : #0b0b0b;
  margin-bottom    : 15px;
  text-align       : center;
  width            : 780px;
}

#freeText {
  background-color: #f2f8fa;
  color            : #0b0b0b;
  margin           : 20px auto;
  padding          : 8px;
  text-align       : left;
  vertical-align   : top;
  width            : 900px;
}

#freeText a {
    color          : #1f4f66;
}

#freetext a:hover {
  color            : #0b0b0b;
  text-decoration  : underline;
}
#results {
  margin : 15px auto;
  vertical-align   : top;
  width            : 1200px;
  line-height: 1.7;
}

.fontS {
  font-size        : 14px;
  font-family      : DIN Next,Open Sans,Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,sans-serif;
}

/* Styles for table rows */

.trList0 {
}

.trList1 {
  background-color: #f2f8fa;
}

.trTitle1 {
}

.trTitle2 {
}


/* Styles for table cells */
.title1 {
  color            : #1f4f66;
  font-weight      : 750;
  font-size        : 24px;
  font-family      : DIN Next,Open Sans,Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,sans-serif;
}


#tab0 .title1 {
  font-family      : Rubik,Open Sans,Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,sans-serif;
  font-weight      : bold;
  padding-bottom   : 8px;
  color            : #4f95b4;
  font-size        : 24px;
  font-style       : italic;
}

.title2 {
  color            : #1f4f66;
  font-weight      : 750;
  font-size        : 24px;
  font-family      : DIN Next,Open Sans,Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,sans-serif;
}

.titleS {
  color            : #1f4f66;
  font-weight      : 750;
  font-size        : 14px;
  font-family      : DIN Next,Open Sans,Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,sans-serif;
}

.leftText {
}

.centerText {
  text-align      : left;
}

.rightText {
  text-align      : right;
}

.TextS {
  font-size        : 12px;
  font-family      : DIN Next,Open Sans,Helvetica Neue Light,Helvetica Neue,Helvetica,Arial,sans-serif;
}

td.leftText[colspan]:not([colspan="1"]) {
 color: #1f4f66;
}

.tab table:first-child tr:not(.trList1) a[href $='.pdf'], #freeText a[href $='.pdf'] { 
   background      : transparent url('../images/pdf.png') no-repeat center left;
   line-height     : 20px;
    padding        : 1px 0px 1px 18px;
}
.tab table:first-child tr.trList0 a[href $='.pdf'] { 
   background      : none;
    padding        : 0px;
}

#reclame {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(170px,1fr));
    margin-bottom: 2rem;margin-top: 2rem;
}

#reclame a {
    display: flex;
    text-align: center;
    vertical-align: baseline;
    justify-content: center;
    align-items: center;
}

#tab0 td.title1[colspan]:not([colspan="6"]):before {
    content: "Mixed";
    color: #4f95b4;
}

#tab0 td.title1[colspan]:not([colspan="6"]) {
    color: #fff;
}
#splashme { visibility: hidden; font-size: 1pt; }

/* OWW De Binnenmaas finishing touches */
#navigation a:hover,
#freeText a:hover {
  color: #0b0b0b;
  text-decoration-color: #4f95b4;
}

#results tr:hover td {
  background-color: rgba(94,145,181,.12);
}

.tab table:first-child {
  border-top: 4px solid #4f95b4;
}

#footer {
  border-top: 6px solid #d7e8ed;
}


/* Binnenmaas organic refinements */
body {
  background: linear-gradient(180deg,#ffffff 0%,#f8fbfc 46%,#eef6f8 100%);
  color: #111111;
}

#headerkop {
  background: #fff;
  border-bottom: 1px solid #e7eef0;
}

#navigation {
  background: linear-gradient(90deg,#f4fafb 0%,#d7e8ed 100%);
  border-top: 1px solid #edf3f5;
  border-bottom: 1px solid #c8dde3;
}

#navigation a {
  border-radius: 999px;
  margin-right: 4px;
  transition: background-color .18s ease,color .18s ease;
}

#navigation table a:hover {
  background-color: rgba(79,149,180,.14);
}

#freeText {
  border-left: 5px solid #4f95b4;
  border-radius: 14px;
  box-shadow: 0 8px 22px rgba(31,79,102,.08);
}

#results {
  background: rgba(255,255,255,.72);
  border-radius: 18px;
}

.tab table:first-child {
  border-top: 4px solid #4f95b4;
  border-radius: 12px 12px 0 0;
}

.title1,.title2,.titleS {
  letter-spacing: .01em;
}

.trList1 {
  background-color: #f2f8fa;
}

#results tr:hover td {
  background-color: rgba(79,149,180,.12);
}

#footer {
  background: linear-gradient(180deg,#1f4f66 0%,#123849 100%);
  border-top: 6px solid #d7e8ed;
}
