table.tableSmall {--borderColor:rgba(0,83,159,1.0); --backColor:rgba(0,83,159,0.4); --backColor2:rgba(0,83,159,0.06); --shadowColor:rgba(0,0,0,0.2);
 border:2px solid var(--borderColor); border-collapse:collapse; background-color:white; text-align:left; font-size:smaller; box-shadow:5px 5px 10px var(--shadowColor)}
table.tableSmall thead {border-bottom:2px solid var(--borderColor); background-color:var(--backColor)!important; font-weight:700} 
table.tableSmall thead th, table.tableSmall tbody td {border:1px solid var(--borderColor); padding-top:0px; padding-left:4px; padding-right:4px; vertical-align:top}
/*table.tableSmall tbody tr:nth-child(odd) {background:rgba(218, 229, 239, 0.2)}*/
table.tableSmall tbody tr:nth-child(even){background:var(--backColor2)}
@media screen and (max-width:550px) {
 table.tableSmall {font-size:15px; box-shadow:4px 4px 8px var(--shadowColor)}
}

table.tableSmall.CompThuis {empty-cells:show; border-radius:5px}
table.tableSmall.CompThuis th {text-align:center}
table.tableSmall.CompThuis td {min-width:5ch; padding:0 0.5ch !important; text-align:center}
table.tableSmall.CompThuis td.teamNaam {min-width:12ch}
table.tableSmall.CompThuis td:nth-child(1)  {min-width:7ch; text-align:left}
/*table.tableSmall.CompThuis td:nth-child(n+4){min-width:13ch}*/
table.tableSmall.CompThuis thead th:nth-child(2)/* 2, not 3, because of colspan=2*/,
table.tableSmall.CompThuis tbody td:nth-child(3){border-right :2px solid var(--borderColor) !important}
table.tableSmall.CompThuis tbody tr.end-of-week {border-bottom:2px solid var(--borderColor) !important}
@media screen and (max-width:640px) {
   table.tableSmall.CompThuis {font-size:15px; box-shadow:4px 4px 8px var(--shadowColor)}
   table.tableSmall.CompThuis td.teamNaam {min-width:7ch}
   table.tableSmall.CompThuis th:nth-child(2), table.tableSmall.CompThuis td:nth-child(1) {display:none}
   table.tableSmall.CompThuis th:nth-child(1) {border-right:2px solid var(--borderColor) !important}
}

/* responsive containers for tableSmall Team:*/
div.smallTablesContainer{position:relative; display:table; width:100%}
/*div.smallTablesContainer div:nth-of-type(3n+4) {clear:left}*/
div.tableSmallContainer{float:left; display:table-cell; vertical-align:top; margin-right:12px; margin-bottom:12px}
@media screen and (max-width:900px) {
 div.smallTablesContainer div:nth-of-type(3n+4) {clear:none}
 div.smallTablesContainer div:nth-of-type(2n+3) {clear:left}
}
div.smallTablesContainer h.subTitle {clear:both; font-size:smaller; font-weight:bold; display:block; position:relative; top:-0.25em; line-height:0.5}
table.tableSmall.Team {width:12.5em !important; margin-right:12px; margin-bottom:12px; border-radius:5px}
table.tableSmall.Team thead tr {line-height:1.75em}
table.tableSmall.Team tbody tr {line-height:1.25em}
table.tableSmall.Team th div.teamName {display:inline-block; width:44%; text-align:left}
table.tableSmall.Team th div.teamClass{display:inline-block; width:40%; text-align:center}
table.tableSmall.Team th div.pouleNmbr{display:inline-block; width:16%; text-align:right}
   
div.tableSmallLegend {float:right; font-size:16px; font-style:italic; text-align:right; line-height:1.25em; height:0; margin-top:-1em;}
div.tableSmallLegend.boxed {display:block; opacity:0.75; box-shadow:3px 3px 7px var(--shadowColor); padding:0.5em; border:1px solid rgba(0,83,159,0.5); border-radius:0.25em; background:var(--backColor2)}
@media screen and (max-width:550px) {
 div.tableSmallLegend {float:none !important; height:auto}
}
@media screen and (max-width:950px) {
 div.tableSmallLegend.sticky {right:0.5em; bottom:0.5em}
}