/* fonts 2024 start Adobe webfont */
@import url("https://use.typekit.net/jte1ffz.css");

:root {
  --wit: #ffffff;
  --bijnawit:#fafafa;
  --geel: #ffcc00;
  --rood: #dd0000;
  --oranjerood:orangered;
  --blauw: #274968;
  --zwart: #000000;
  --bijnazwart: #333333;
  --groen: #009f00;
  --odd: #fff4bb; /*#f6e698; /*background lichtergeel oud:  #f6e698;*/
  --even: #fdea98; /*background lichtgeel*/
  --prizefighter_odd: #faec36; /*lichtergroen*/
  --prizefighter_even: #f8e436; /*lichtgroen*/
  --uitgelicht: #fcf8e4; /*lichtgeel*/
  --tabelcorps_klein: 14px; 
  --tabelcorps_groot: 16px; 
  --interlinie: 30px;
  --broodtekst: "itc-avant-garde-gothic-pro", sans-serif;
  --poolfont1: "P22Underground-Mono-Medium", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --poolfont2: "P22Underground-Mono-Demi", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --poolkopfont: "itc-avant-garde-gothic-pro", Helvetica, Arial, sans-serif;
  --tooltipfont: "Roboto-Medium", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --eregallerij: 'Neutra2Text-Demi', "Helvetica Neue", Helvetica, Arial, sans-serif;
  --tickerfont: var(--poolfont1);
}

.wit {
color:#fff;
}
/*
2024
Geel: # e8b631
Rood: # bd0000

2021
Webkleuren Jan (spaties opzettelijk)
Geel: # f4dc26
Rood: # e35 (#ee3355)
Blauw: # 274968 (zelfde)
.odd{background:# f6e698;}.even{background:# f1e169;


geel: # fece09 of rgb(236,211,36)
rood: # cb5656 of rgb(203,86,86)
blauw: # 274968 of rgb(39,73,104)
kleuren: rood: RGB = 203/86/86, blauw: 39/73/104 geel: 236/211/36

2018
rood: # ff0000 of rgb(255,0,0)
geel: # ffff99 of rgb(255,255,153)

2016
blauw: rgb(0,0,0)
		# 0f5180
rood: rgb(216,33,60)
		# d8213c
*/


/* fonts 2024 start Adobe webfont */

/*
font-family: "itc-avant-garde-gothic-pro", sans-serif;

Book:   font-weight: 300;
Medium: font-weight: 500;
Bold:   font-weight: 700;

*/

/* fonts 2024 end */


/* fonts 2021 start */

@font-face {
    font-family: 'Roboto-Medium';
	src: url('/typo3conf/ext/poolbode/Resources/Public/Fonts/Roboto-Medium.ttf');
}

/* fonts 2021 end */

/* @import 'font-awesome.css'; */

@font-face {
    font-family: 'P22Underground-Mono-Medium';
    src: url('/typo3conf/ext/poolbode/Resources/Public/Fonts/P22Underground-Mono-Medium.otf');
}
@font-face {
    font-family: 'P22Underground-Mono-Demi';
    src: url('/typo3conf/ext/poolbode/Resources/Public/Fonts/P22Underground-Mono-Demi.otf');
}

@font-face {
    font-family: 'P22Underground-Medium';
    src: url('/typo3conf/ext/poolbode/Resources/Public/Fonts/P22Underground-Medium.otf');
}

/*
@font-face {
    font-family: 'neutra';
    src: url('/typo3conf/ext/poolbode/Resources/Public/Fonts/NeutraDisplay-Titling.otf');
}
@font-face {
    font-family: "Neutra2Text-Demi";
    src: url("/fileadmin/Resources/Fonts/Neutraface2Text-Demi.eot");
    src: url("/fileadmin/Resources/Fonts/Neutraface2Text-Demi.eot?#iefix") format("embedded-opentype"),
    url("/fileadmin/Resources/Fonts/Neutraface2Text-Demi.woff") format("woff"),
    url("/fileadmin/Resources/Fonts/Neutraface2Text-Demi.ttf") format("truetype"),
    url('/fileadmin/Resources/Fonts/Neutraface2Text-Demi.svg#Neutra2Text-Demi') format('svg');;
    font-style: normal;
    font-weight: normal;
}
*/

.textwrapper {
  width: 100%;
  height: 20px;
}
.textwrapper .text {
  font-family: var(--broodtekst);
  font-size:13px;
  text-align:center;
  position: relative;
}

.words-wrapper {
  display: inline-block;
  position: relative;
  text-align: center;
}  
.words-wrapper  b {
  opacity:0;
  display: none;
  position: absolute;
  white-space: nowrap;
  left: 0;
  top: 0;
}
  
.words-wrapper .is-visible {
    position:relative;
    display:inline-block;
    opacity:1;
    -webkit-animation: push-in 0.6s;
    -moz-animation: push-in 0.6s;
    /*animation: push-in 0.6s;*/
}
  
.words-wrapper .is-hidden {
    -webkit-animation: push-out 0.6s;
    -moz-animation: push-out 0.6s;
    /*animation: push-out 0.6s;*/
    display:none;
    opacity:0;
}


body * {
    margin: 0;
    padding: 0;
}

html,
body {
    height: 100%;
    /*scroll-snap-type:y proximity;*/
}

body {
    font-family: var(--broodtekst);
    font-weight: 500;
    /*line-height: var(--interlinie);*/
    letter-spacing: 0px;
    color: var(--zwart);
    margin: 0;
    padding: 0;
    font-size: 1em;
    background: url(../Images/duits.gif) repeat-x 0 0 var(--bijnawit);
}

body.layout2 {
    color: rgb(0, 0, 0);
    background-image: linear-gradient(to bottom, #ffffff,  #ffffff, #d9a326, #b7311e);
    background-attachment: fixed;
    overflow-y: hidden;
}

body.layout1 {
    background-color: var(--bijnawit);
}

body.fixed {
	position: fixed;
	height:100vh;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--poolkopfont);
    font-weight: 700;
    letter-spacing: 1px;
    color: var(--rood);
}

h1 {
    font-size: 1.5em;
}

h2 {
    font-size: 1.2em;
    margin-bottom:10px;
}
h2.csc-firstHeader {
clear:both;
}
h3, h4 {
    font-size: 1.1em;
    margin-bottom: 5px;
}

h5, h6 {
    font-size: 1em;
    margin-bottom: 5px;
}

b, strong {
    font-weight: bolder;
}

p {
    margin: 0 0 20px;
    font-weight: 500;
}

footer {
	font-family: var(--tickerfont);
	background: var(--geel) url(../Images/duits.gif) repeat-x 0 0;
}
footer p {
	margin:0;
}

hr {
    border-color: var(--blauw);
    border-width: 2px;
    margin:5px 0;
}

a.logo img {
    margin: 20px 0 0 9px;
}

form.contactform {
    margin-top: 32px;
}

label {
    font-weight: normal;
}

.green {
    color: #ffff99;
}

.top {
    vertical-align: top;
}

.biggertext p {
    font-size: 1.3em;
}

.marquee {
    height: 42px;
}

/* webticker start */

.tickercontainer { /* the outer div */
	/*line-height: .7;*/
	position: relative;
	height: 42px; /*30px;*/
	margin: 0;
	padding: 0;
	overflow: hidden;
	scroll-snap-align:start;
}

.tickeroverlay-left {
    /*background-image:url('/typo3conf/ext/poolbode/Resources/Images/left.png');*/
    display: block;
    pointer-events: none;
    position: absolute;
    z-index: 30;
    height: 25px;
    width: 150px;
    top: 0;
    left: -2px;
}

.tickeroverlay-right {
	/*background-image: url('/fileadmin/Resources/Images/2018/right_red.png');*/
    display: block;
    pointer-events: none;
    position: absolute;
    z-index: 30;
    height: 25px;
    width: 150px;
    top: 10px;
    right: -2px;
}

.tickercontainer .mask { /* that serves as a mask. so you get a sort of padding both left and right */
    position: relative;
    padding-left: 10px;
    padding-right: 10px;
    top: 0px;
    height: 42px;
    overflow: hidden;
}

ul.newsticker { /* that's your list */
    /*Transitions have been added in order set css3 transitions; and have linear easing. Changing these lines you might have unexpected results */
    font-family:var(--tickerfont);
    font-style:normal;
    -webkit-transition: all 0s linear;
    -moz-transition: all 0s linear;
    -o-transition: all 0s linear;
    transition: all 0s linear;
    position: relative;
    margin-left: 20px;
    list-style-type: none;
    margin: 0;
    padding: 20px 0 0;
    color: var(--zwart);
}

ul.newsticker li {
    float: left; /* important: display inline gives incorrect results when you check for elem's width */
    margin: 0;
    padding-right: 40px;
    /*background: #fff;*/
}
ul.newsticker li:before, footer li:before {
  content: "\2605";  /* Add content: \2605 is the CSS Code/unicode for a blackstar */
  color: var(--rood); /* Change the color */
  display: inline-block; /* Needed to add space between the bullet and the text */
  width: 1em; /* Also needed for space (tweak if needed) */
}
ul.newsticker li:before {
  margin: 0 38px 0 0px; /* Also needed for space (tweak if needed) */

}
footer li:before {
  margin: 0 20px 0 0px; /* Also needed for space (tweak if needed) */

}

ul.newsticker li.webticker-init:before {
	display:none; 
}

/* webticker end */

/* HOME START */
#c180 {
    font-family: var(--broodtekst);
    text-align: center;
    color: var(--zwart);
    margin-top: 0;
    text-transform: lowercase;
}

#c181 h1,
#c181 h2,
#c181 h3
{
    text-align: center;
    font-size: 2rem;
    margin-bottom: 1.5rem;
}

#c238 {
    position: relative;
    font-family: var(--poolfont1);
    align-items: center;
    display: flex;
    flex-direction: column;
}

#c238 h1 {
    font-family: var(--poolkopfont);
    font-size: 2.6rem;
    color: var(--rood);
    margin-bottom: 1.5rem;
}

#c238 h2 {
    font-family: var(--poolkopfont);
    font-size: 1.4rem;
    color: var(--rood);
    margin-top:5px;
}

#c238 p {
    margin-bottom: 0.8rem;
}

#c238 img {
    width: 50px;
}

#c238 a:link,
#c238 a:visited {
    color: #000;
}

#c238 a:hover {
    color: #000000;
}

#c238 a:active {
    color: #ffff99;
}

#c160 {
    margin-top: 30px;
    position: relative;
    z-index: 1;
}

#c289 {
	background-image:url("/fileadmin/Resources/Images/ubu-cup.svg");
	background-size: 45%;
  	background-repeat: no-repeat;
  	background-position: center 80px;
  	padding-top:200px;
}
div.home {
    position: relative;
}

div.home .links h1,
div.home .links h2 {
    text-align: center;
    font-size: 60px;
}

div.home .links h2 {
    margin-top: 0;
}

img.poolbodelogo {
    margin: 0 auto 4rem auto;
    position: relative;
}

div.home .homece {
    position: relative;
    z-index: 3;
}

div.home .homece.links {
    top: 80px;
    left: 0;
/*    width: 300px;*/
    z-index: 4;
}

div.home .homece.links img {
    max-width: 200px;
}

div.home .homece.links .csc-header {
    text-align: center;
}

div.home .homece.links .csc-default {
    margin-bottom: 7rem;
}

div.home .homece.rechts {
    top: 28px;
    z-index: 88;
}

div.home .homece.links h2 {
    font-family: var(--poolfont1);
    font-size: 16px;
    margin-bottom: 2rem;
    padding-left: 1rem;
    color: #000;
}

div.home .homece.links img {
    transform: rotate(-7deg);
    -ms-transform: rotate(-7deg); /* IE 9 */
    -webkit-transform: rotate(-7deg); /* Opera, Chrome, and Safari */
}

div.home .homece.rechts .csc-textpic-caption{
    transform: rotate(7deg);
    -ms-transform: rotate(7deg); /* IE 9 */
    -webkit-transform: rotate(7deg); /* Opera, Chrome, and Safari */
    text-align: center;
    margin-top: 12px;
    margin-left: 0px;
    font-family: "p22_constructivistregular", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: rgb(255,255,153);
    font-size: 0.8em;
}

div.home .homece.onder {
    bottom: 0px;
    /*left: 128px;*/
}

div.home .homece.onder img {
    transform: rotate(-7deg);
    -ms-transform: rotate(-7deg);
    -webkit-transform: rotate(-7deg);
}

div.home .homece h1,
div.home .homece h2,
div.home .homece h3,
div.home .homece h4 {
    font-size: 2.6em;
}

.is-countdown {
    border: none;
    background-color: transparent;
}

#aftellen p {
    font-size: 1rem;
    margin-bottom: 0;
}
.countdown-amount {
    font-size: 2rem;
    color: var(--rood);
    margin-bottom: 1rem;
    display: block;
}

#countdowntext {
    clear: both;
    margin-top: 0;
    color: var(--zwart);
}

.countdown-period {
    display: block;
    font-size: 2rem;
    margin-top: -20px;
    color: var(--zwart);
}

.countdown-beker img {
    width: 100px;
    margin: 0 auto;
}

/* HOME END */

.navbar-toggle {
    border: none;
    outline: none;
    z-index: 1;

    position: absolute;
    float: none;
    padding: 0;
    margin-top: 0;
    margin-right: 0;
    margin-bottom: 0;

    right: 5px;
    top: -11px;
}

.navbar-header .navbar-toggle .icon-bar {
    background-color: #633910;
}

.hamburger {
    position: relative;
    top:15px;
    width: 30px;
    height: 27px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 4px;
}

.hamburger .bun, .hamburger .burger, .hamburger .toppings {
    position: absolute;
    left: 0;
    width: 100%;
    height: 0;
    border-bottom: 3px solid black;
    transform-origin: 0 50%;
    transition: top .4s ease;
    transition: width .4s ease;
    transition: transform .4s ease;
}

.hamburger .toppings {
    top: 4px;
}

.hamburger .burger {
    top: 50%;
    margin-top: -1px;
}

.hamburger .bun {
    bottom: 3px;
}

.open .hamburger .toppings {
    top: 2px;
    left: 2px;
    transform: rotate(45deg);
}

.open .hamburger .burger {
    width: 0;
}

.open .hamburger .bun {
    bottom: 2px;
    left: 2px;
    transform: rotate(-45deg);
}

#headerruler {
    border-top: none;
    border-bottom: 2px solid var(--blauw);
    margin-left: 420px;
}

.colleft {
    border-right: none;
    min-height: 350px;
    margin-top: 200px;
}

.colcontent {
    border-left: 4px solid #ddd);
    min-height: 350px;
    margin-bottom:1em;
}

.colleft > div,
.colcontent > div {
    padding-left: 15px;
}

.eregallerij {
    display: none;
	position:absolute;
    color: var(--rood);
    width: 200px;
}

.eregallerij img {
width: 55px;
height:83px;
margin:40px 0 10px 48px;
}

.eregallerij h2,
.eregallerij h3,
.eregallerij h4 {
    font-size: 0.8em;
}

.eregallerij p {
    font-family: var(--eregallerij);
    font-size: 0.9em;
    letter-spacing: 0px;
    text-transform: uppercase;
    font-weight: 300;
}


.subheader {
    display: none;
}

.poolbodebalk {
    position: absolute;
    right: auto;
    left:27px;
    z-index: 0;
    width: 90%;
    height: 200px;
    top: 115px;
}

.poolbodebalk a {
    display: block;
}

.poolbodebalk a img {
    position: absolute;
    height: 150px;
}

.poolbodebalk a.minibode:first-child img,
.poolbodebalk a.first img {
    transform: rotate(-7deg);
    -ms-transform: rotate(-7deg); /* IE 9 */
    -webkit-transform: rotate(-7deg); /* Opera, Chrome, and Safari */
    left: 0px;
    z-index: 100;
}

.poolbodebalk a.minibode:first-child img:nth-child(2) {
    display: none;
}

.poolbodebalk a.minibode:nth-child(2) img:nth-child(1),
.poolbodebalk a.minibode:nth-child(3) img:nth-child(1),
.poolbodebalk a.minibode:nth-child(4) img:nth-child(1),
.poolbodebalk a.minibode:nth-child(5) img:nth-child(1),
.poolbodebalk a.minibode:nth-child(6) img:nth-child(1),
.poolbodebalk a.minibode:nth-child(7) img:nth-child(1),
.poolbodebalk a.minibode:nth-child(8) img:nth-child(1),
.poolbodebalk a.minibode:nth-child(9) img:nth-child(1),
.poolbodebalk a.minibode:nth-child(10) img:nth-child(1),
.poolbodebalk a.minibode:nth-child(11) img:nth-child(1),
.poolbodebalk a.minibode:nth-child(12) img:nth-child(1) {
    display: none;
}

.poolbodebalk a.minibode:nth-child(2) img,
.poolbodebalk a.second img {
    transform: rotate(3deg);
    -ms-transform: rotate(3deg); /* IE 9 */
    -webkit-transform: rotate(3deg); /* Opera, Chrome, and Safari */
    z-index: 95;
    left: 35px;
}

.poolbodebalk a.minibode:nth-child(3) img,
.poolbodebalk a.third img {
    transform: rotate(-2deg);
    -ms-transform: rotate(-2deg); /* IE 9 */
    -webkit-transform: rotate(-2deg); /* Opera, Chrome, and Safari */
    z-index: 90;
    left: 70px;
}

.poolbodebalk a.minibode:nth-child(4) img,
.poolbodebalk a.fourth img {
    transform: rotate(2deg);
    -ms-transform: rotate(2deg); /* IE 9 */
    -webkit-transform: rotate(2deg); /* Opera, Chrome, and Safari */
    z-index: 85;
    left: 105px;
}

.poolbodebalk a.minibode:nth-child(5) img,
.poolbodebalk a.fifth img {
    transform: rotate(-3deg);
    -ms-transform: rotate(-3deg); /* IE 9 */
    -webkit-transform: rotate(-3deg); /* Opera, Chrome, and Safari */
    z-index: 80;
    left: 140px;
}

.poolbodebalk a.minibode:nth-child(6) img,
.poolbodebalk a.sixth img {
    transform: rotate(4deg);
    -ms-transform: rotate(4deg); /* IE 9 */
    -webkit-transform: rotate(4deg); /* Opera, Chrome, and Safari */
    z-index: 75;
    left: 175px;
}

.poolbodebalk a.minibode:nth-child(7) img,
.poolbodebalk a.seventh img {
    transform: rotate(-5deg);
    -ms-transform: rotate(-5deg); /* IE 9 */
    -webkit-transform: rotate(-5deg); /* Opera, Chrome, and Safari */
    z-index: 70;
    left: 210px;
}

.poolbodebalk a.minibode:nth-child(8) img,
.poolbodebalk a.eighth img {
    transform: rotate(2deg);
    -ms-transform: rotate(2deg); /* IE 9 */
    -webkit-transform: rotate(2deg); /* Opera, Chrome, and Safari */
    z-index: 65;
    left: 245px;
}

.poolbodebalk a.minibode:nth-child(9) img,
.poolbodebalk a.nineth img {
    transform: rotate(-4deg);
    -ms-transform: rotate(-4deg); /* IE 9 */
    -webkit-transform: rotate(-4deg); /* Opera, Chrome, and Safari */
    z-index: 60;
    left: 280px;
}

.poolbodebalk a.minibode:nth-child(10) img,
.poolbodebalk a.tenth img {
    transform: rotate(3deg);
    -ms-transform: rotate(3deg); /* IE 9 */
    -webkit-transform: rotate(3deg); /* Opera, Chrome, and Safari */
    z-index: 55;
    left: 315px;
}

.poolbodebalk a.minibode:nth-child(11) img,
.poolbodebalk a.eleventh img {
    transform: rotate(-4deg);
    -ms-transform: rotate(-4deg); /* IE 9 */
    -webkit-transform: rotate(-4deg); /* Opera, Chrome, and Safari */
    z-index: 50;
    left: 350px;
}

.poolbodebalk a.minibode:nth-child(12) img,
.poolbodebalk a.twelfth img {
    transform: rotate(3deg);
    -ms-transform: rotate(3deg); /* IE 9 */
    -webkit-transform: rotate(3deg); /* Opera, Chrome, and Safari */
    z-index: 45;
    left: 385px;
}

ul.abc-menu {
    height: 40px;
    margin: 0 0 20px 0;
    z-index: 98;
    position: relative;
}

.abc-menu li {
    float: left;
    padding: 0 1px 0 0;
    margin: 0;
}

.abc-menu li a {
    display: block;
    background: url('/typo3conf/ext/poolbode/Resources/Images/2024/abctabs-sprite2021-vs3.png') no-repeat;
    background-position: 0px 0px;
    height: 36px;
    width: 50px;
    margin: 0;
    text-indent: 50px;
    overflow: hidden;
    cursor: pointer;
}

.abc-menu li a.af.current,
.abc-menu li a.af:hover {
    background-position: 0px -36px;
}

.abc-menu li a.gl {
    background-position: -50px 0px;
}

.abc-menu li a.gl.current,
.abc-menu li a.gl:hover {
    background-position: -50px -36px;
}

.abc-menu li a.mr {
    background-position: -100px 0px;
}

.abc-menu li a.mr.current,
.abc-menu li a.mr:hover {
    background-position: -100px -36px;
}

.abc-menu li a.sz {
    background-position: -150px 0px;
}

.abc-menu li a.sz.current,
.abc-menu li a.sz:hover {
    background-position: -150px -36px;
}

.vertical.menu {
    margin: 20px 0;
}

.users-list-view li a {
    font-weight: 400;
}

.submenu {
    margin-left: 20px;
}

.error,
.red {
    color: var(--rood);
}

.rightcol .error {
    text-align: center;
}


.yellow,
tr.current td,
tr.current td a,
a.current,
li.current a {
    color: var(--rood);
}

/* POOL KLASSEMENT START */

.poolsubs {
    margin-top: 23px;
}

.poolsubs ul a {
    padding-bottom: 5px;
}
.poolsubs ul li {
    display:block;
    padding-bottom: 5px;
}

div.general ul {
    border-bottom: 2px solid var(--blauw);
    padding-bottom: 15px;
    padding-right: 5px;    
}

table {
    scroll-snap-align:start;
    width: 100%; /* verwijder 100% van bootstrap */
    border-collapse: separate;
    /*margin-top: 10px;*/
    table-layout:fixed;
    /*margin-bottom:20px;*/
}
table a {
	cursor:pointer;
}
table  th {
   position:sticky; /*top:0;*/
}

tr {
	line-height: var(--interlinie);
}

th, td {
	white-space:nowrap;
	font-family:var(--poolfont2);
	line-height: var(--interlinie);
	outline: none;
	padding:0 2px;
}

th a, th a,
th div, tr div {
text-align:inherit;
user-select:none;
text-decoration:none;
}
.standings {
	margin-top:8px;
   /* min-width:500px; */
   /* vaststellen in php */
}
.voorspellingen {
	min-width:700px;
	margin-bottom:18px;
}
.standings th,
.standings td,
.voorspellingen th,
.voorspellingen td
 {
	width:auto;
	font-size:var(--tabelcorps_klein);
}
.standings .prizefighter td,
.standings .prizefighter td a {
    color:var(--groen);
}
th {
    font-family:var(--poolfont2);
    font-weight:100;
    top:0;
    background:var(--geel);
    border-bottom: 0px solid var(--blauw);
}

th.spacer {
	width:10px;
    min-width:10px;
    max-width:10px;
}
th.deelnemerklassement {
	width:20px;
	min-width:20px;
    max-width:20px;
}
th.colposition {
	width:40px;
	min-width:40px;
	max-width:40px;
}

th.prize {
	width:80px;
	min-width:80px;
	max-width:80px;
}
/* voorspellingen */

th.klein {
	width:30px;
	min-width:30px;
	max-width:30px;
}
th.middel {	
	width:60px;
	min-width:60px;
	max-width:60px;
}

.nr,.punten,.ts {
	text-align:right;
}
.punten {
	padding-right:10px;
}
.groep, .dag, .datum, .tijd, .voorsp, .uitslag, .pt {
	text-align:center;
}
td.tegenstanders {
	font-size:var(--tabelcorps_groot);
	text-align:left;
	padding-left:10px;
	overflow:hidden;
	text-overflow:ellipsis;
}

th.pool-name {
width: 25%;
}
th.tegenstanders {
width: 25%;
}
th.datum {
width: 80px;
min-width: 80px;
max-width: 80px;
}
th.nax {
text-align:right;
line-height:inherit;
}
th.nax a {
box-shadow: 0 0 0 rgba(0,0,0,.3);
float:right;
margin-top:-2px;
line-height:24px;
height:22px;
width:22px;
vertical-align:middle;
background:var(--odd);
border-radius:11px;
text-decoration:none;
text-align:center;
font-weight:100;
font-size:12px;
}
th.nax.sorted a {
background-color:var(--rood);
color:var(--geel);
}

.standings th, .standings td {
text-align:right; /* tenzij hieronder */
}
.standings .deelnemerklassement,
.standings .deelnemerklassement,
.standings .pool-name {
text-align:left;
}

th.deelnemerklassement a {
	background-position: left top;
}
th.sorted a {
color: var(--rood);
}
th.deelnemerklassement.sorted a {
	background-position: right top;
}
td.deelnemerklassement input[type=checkbox] {
    display: none;
}
th.deelnemerklassement a,
td.deelnemerklassement label,
td.deelnemerklassement div {
    display:inline-block;
    width:16px;
    height:16px;
    vertical-align:text-bottom;
    background-image:url('/fileadmin/Resources/Images/2024/ballen-16x16-v5.png');
    background-repeat:no-repeat;
}
}
td.deelnemerklassement label {
	background-position: right bottom;
	cursor:pointer;
}
td.deelnemerklassement input:checked ~ label {
    background-position: left bottom;
}

tr.pers_klass td.deelnemerklassement input:checked label {
    background-position: left bottom;
}

/* Deze zijn geen checkboxes: */

/* BEGIN (tot de knoppen werken) */
tr:not(.pers_klass) td.deelnemerklassement div { 
	background-image: none;
}
tr.pers_klass td.deelnemerklassement div { /* tot de knoppen werken */
	background-position: left top;
}
/* EIND (tot de knoppen werken) */


/* deze moet blijven, je kunt jezelf niet uitklikken */
tr.pers_klass.zelf td.deelnemerklassement div { 
	background-position: right top;
}

.pool-name,
.pool-last,
.tegenstanders {
padding-left:10px;
}
td.pool-name,
td.tegenstanders {
overflow:hidden;
text-overflow:ellipsis;
font-family:var(--poolfont1);
font-size:var(--tabelcorps_groot);
}
   
th.prize,
td.prize,
.prizefighter td.prize { 
	text-align:right;
}
td.prize a { 
	font-family: var(--poolfont2);
	font-size:14px;
	color:var(--rood) !important;
	text-decoration:none;
	cursor:pointer;
}

.klassementspulldown {
    margin: 25px 0;
}

td.lijn {
    height: 6px;
    background-color: var(--blauw);
}

.standings tbody tr:nth-child(odd),
.voorspellingen tbody tr:nth-child(odd) { 
background-color: var(--odd);
}
.standings tbody tr:nth-child(even), 
.voorspellingen tbody tr:nth-child(even) { 
background-color: var(--even);
}

.deelnemerklassement a,
.deelnemerklassement input[type='checkbox'] {
background: url('/fileadmin/Resources/Images/2018/ballen-16x16-v4.png') no-repeat right bottom;
display: block;
width: 16px;
height: 16px;
}

.deelnemer-foto {

}

.user-name h1 {
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.user-name h2 {
    margin-top: 0;
    margin-bottom: 10px;
}

.user-image {
    display: none;
    visibility: hidden;
    width: 93px;
    height: 86px;
    position: absolute;
    top: 91px;
    left: 50%;
    outline: none;
    margin-top: 20px;
}

.user-image a {
    outline: none;
}

.user-image img {
    border-radius: 50%;
    outline: none;
	border: 2px solid black;
    position: relative;
    margin-left: -50%;
}

tr.uitgelicht{
    background-color: var(--uitgelicht) !important;
}
tr.uitgelicht a.similar {
    color: var(--rood);
}
tr.hr {
    background-color: var(--wit) !important;
}

a.posnawe,
a.metstip {
    cursor: pointer;
    text-decoration: none;
    position: relative;
    z-index: 99;
}

/* POOL KLASSEMENT END */

/* POOL FORMS  START */

/*
input, select[multiple], textarea
{
	background-color: #fff;
	margin-bottom: 2px;
	border-top: 2px solid rgb(255,255,153);
	border-left: 2px solid rgb(255,255,153);
	border-right: 2px solid rgb(255,255,153);
	border-bottom: 2px solid rgb(255,255,153);
	padding: 0 5px;
}
*/

.inlinediv {
    display: inline;
}

.floatingdiv {
    float: left;
    margin-right: 10px;
}

legend {
    border-bottom: none;
    color: var(--zwart);
}

.btn-default,.btn-default:hover {
    color: var(--zwart);
    background-color: var(--geel);
    border:2px solid var(--zwart);
    font-size: 1em;
    line-height:1em;
	letter-spacing:1px;
    text-transform: uppercase;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.3);
}

/*
geel: var(--geel) of rgb(236,211,36)
rood: var(--rood) of rgb(203,86,86)
blauw: var(--blauw) of rgb(39,73,104)
*/

.btn-default.bevestig {
    background-color: var(--geel);
    font-size: 1em;
    line-height:1em;
    border-radius:6px;
	color: var(--zwart);
    letter-spacing:1px;
}
.btn-default:focus, .btn-default:active, .open .dropdown-toggle.btn-default {
    color: var(--zwart);
    background-color: var(--geel);
	border-color: var(--zwart);
}

select[size] {
    background-color: var(--geel);
    color: var(--zwart);
    cursor: pointer;
    height: 30px;
    margin-bottom: 10px;
    border-color: var(--zwart);
    border-radius:6px;
    border-width:1px;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5);
    padding: 0 10px;
    letter-spacing:1px;
}

/*
blauw: rgb(0,0,0)
rood: rgb(255,255,153)
*/

input.uitslaginvoer,
.wedstrijden.voorspellingen input.vrspllng {
    width: 25px;
    text-align: center;

    background-color: #fafafa;
    margin: 4px;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: none;
    padding: 0px;
    border-radius: 12px;

}

/* POOL FORMS  END */

form.contactform input,
form.contactform textarea {
    width: 290px;
}

.menunolink {
    font-size: 12px;
}

.canvasjs-chart-credit,
.displaynone {
    display: none;
}

/* orderform */

form#contactform,
form#orderform {
    padding: 0px;
}

form#contactform fieldset,
form#orderform fieldset {
    border: none;
    margin: 0;
    padding: 0;
}

form#orderform fieldset h2,
form#orderform fieldset label,
form#orderform fieldset span {
    font-size: 1em;
}

#orderform.columnar div.type-check input.checkbox,
div.radios {
    display: inline;
    margin-top: 0px;
    margin-left: 35%;
    padding-top: 2px;
}

#orderform.columnar div.type-check div.radios input {
    margin-left: 0;
    padding: 2px 5px;
}

#orderform.columnar div.type-check div.radios input.number {
    width: 30px;
    height: 25px;
}

#orderform h2 {
    margin: 30px 0 5px 0;
}

#orderform div.type-check > label {
    position: absolute;
    padding-top: 2px;
}

#orderform div.type-check > label,
.columnar .type-text label,
.columnar .type-select label {
/*    text-transform: lowercase;*/
}

#orderform.columnar div.type-check input {
    margin-left: 35%;
}

.yform div.type-check div.radios input,
.yform div.type-check div.radios input:hover,
.yform div.type-check div.radios input:active {
    border: 1px solid #E6E6E6;
    border-color: #C4C4C4 #E9E9E9 #E9E9E9 #C4C4C4;
}

#shippingcheck,
.radios span {
    margin: 0 4px 0 0;
}

label.sizelabel {
    margin-left: 50px;
}

span.euro {
    margin-left: 50px;
}

#orderform.columnar div.type-check div.radios input.total {
    border: none;
    font-size: 1em;
}

#orderform.columnar .totals {
    margin-top: 30px;
}

#orderform.columnar .totals span,
#orderform.columnar .totals input {
    font-weight: bold;
    font-size: 18px;
    line-height: 21px;
    letter-spacing: normal;
    border: 0;
}

/*responsive images*/
img {
    height: auto;
    width: auto;
    max-width: 100%;
    display: block;
}

ul, ol {
    margin-left: 0;
    list-style-type: none;
}

/*link color*/

a,
a:hover,
a:focus {
    color: var(--zwart);
}

p a:link,
a.mail {
    color: var(--rood);
}

a.mail {
    font-size: 0.8em;
}

p a:hover,
a.mail:hover {
    color: var(--zwart);
}


body.layout2 a {
    color: var(--zwart);
}

.col-sm-8 a {
    text-decoration: underline;
}

.col-sm-8 a:hover {
    text-decoration: overline;
}

/* Wrapper for page content to push down 
 */
#wrap {
    min-height: 100%;
    height: auto !important;
    /* Negative indent footer by its height */
    margin: 0 0 -42px;
    /* Pad bottom by footer height */
    padding: 0 0 46px;
}

div.row.above {
    text-align: center;
    padding-top: 3rem;
}

div.sidebar-offcanvas {
    /*	position: fixed;*/
}

div.sidebar-offcanvas ul {
    margin: 20px 0 0 20px;
    list-style-type: none;
}

div.sidebar-offcanvas ul li a {
    font-size: 1.2em;
}

/* Set the fixed height of the footer here */
footer {
    position: relative;
    height:42px;
    overflow:hidden;
    line-height:1.5em;
    clear: both;
    z-index: 99;
    /*text-transform: lowercase;*/
}

body.layout2 div.home {
    padding-top: 6rem;

}

footer > .container {
text-align:center;
   	padding:20px 15px 0;;
    margin: 0;
    max-width:100%;
}

footer > .container div {
    padding-left: 15px;
}

footer > .container ul.admin,
footer > .container ul.user {
    padding-left: 10px;
}

footer > .container ul.admin li,
footer > .container ul.user li {
    display: inline;
    padding: 0px 10px;
}

.layout2 footer > .container ul.user {
    display: none;
}

footer div.container div, footer div.container ul {
    display: inline-block;
}

.headerservice {
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}

.marginbottom {
    margin-bottom: 1.5em;
}

.topheader {
    margin: 0;
    width:100vw;
}

.topheader a.logo-link {
    display: block;
    position: absolute;
    width: 100%;
    top: 18px;
    pointer-events: none;
    cursor: default;
}

.topheader a.logo-link img {
    position: relative;
}

.topheader a img.logo {
    margin-top: 32px !important;
}


.topheader .eregallerij a img {
    position: relative;
    margin: 0;
}

.topheader .row {
    position: relative;
}

.topheader .hmenu {
    z-index: 99;
    margin-right: 0;
}



img.logo {
    width: 200px;
    margin: 0 auto;
}

.topheader .hline {

}

.navbar-nav > li > a {
    font-family: var(--poolkopfont);
    font-weight: 700;
    font-size: 1.5rem;
    padding: 15px 10px 0;
    line-height: .8;
}

.navbar-collapse {
    max-height: none;
    border-top: none;
    box-shadow: none;
    /*padding-top: 156px;*/

    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.nav > li > a:hover,
.nav > li > a:focus {
    text-decoration: none;
    background-color: Transparent;
    color: var(--rood);
}


.topheader {
    background-image: none !important;
    min-height: 270px;
    text-align: center;
}

@media (min-width: 400px) {
    a.mail {
        font-size: 1em;
    }
}

@media (max-width: 450px) {
    .smallViewHide {
        /*display: none;*/
    }
}
@media (max-width: 768px) {
    /*.smallViewHide {
        display: none;
    }*/
	.topheader a.logo-link {
		display: block;
		position: relative;
		width: 200px;
		margin:0 auto;
		top: 18px;
		pointer-events: none;
		cursor: default;
	}
	.marquee {
		position: absolute;
		width:100vw;
		top: 0;
	}

	.navbar-header .navbar-toggle {
	}
	
	.navbar-collapse {
		background: url(../Images/duits.gif) repeat-x 0 0 var(--geel);

	}
	.navbar-collapse .navbar-nav {
		margin-top:	100px;
		display: none;
	}	
	.navbar-collapse.plop .navbar-nav {
		margin-top:	100px;
		display: block;
	}	
    .topheader .row {
		position:absolute;
		width:100vw;
		top:50px;
    }

    .poolbodebalk {
        top: 216px;
    }

    .colleft {
        min-height: 10px;
    }

    .colcontent {
        border-left: none
    }

    .affix {
        position: static;
    }
    .colcontent {
        border:none;
        padding:0 15px;
    }
    
    .colleft > div, .colcontent > div {
        padding-left:0;
        margin-left:0;
    }

    .csc-firstHeader {
        margin-left:0;
    }
    .vertical-menu {
        margin: 15px 0;
    }
    .standings {
		width:100vw;
		min-width:unset;
	}
    .voorspellingen {
		width:100vw;
		margin-left:-15px;
	}
    #chartContainer {
        margin-left:-15px;
        overflow-x: auto;
    }

    .table-container {
        overflow-x: auto;
        margin-left: -15px;
        margin-right: -15px;        
    }

    .standings-table {

        
    }

    .nav.navbar-nav {
        margin-top: 18px;
    }

    .nav > li.active > a,
    .nav > li > a:hover,
    .nav > li > a:focus {
        text-decoration: none;
        background-color: Transparent;
        color: var(--rood);
    }
}

@media (min-width: 768px) {
   .topheader a img.logo {
        left: 190px;
        margin: 0;
    }
    
    .eregallerij {
        display: block;
    }
    

    .colleft {
        width: 260px;
        margin-top: 0;
    }

    .col-sm-9 {
        width: 66%;
    }

    .poolbodebalk {
        left: 490px;
        top: 130px;
        right: 15px;
         width: 300px;
    }

    .affix {
        position: fixed;
        top: -20px;
        width: 205px;
    }

    .navbar-nav {
        margin-left: 440px;
        text-wrap:nowrap;
    }

    .navbar-collapse {
        max-height: none;
        border-top: none;
        box-shadow: none;

        position: absolute;
        background-color: transparent;
        top: 0;
        left: 0;
        right: 0;
        bottom: auto;
    }
}

@media (max-width: 920px ) { /*991px) { */

    /*.smallViewHide {
        display: none;
    }*/

    .navbar-nav {
        text-wrap:nowrap;
    }
    .container {
        max-width: 920px; /* 991px;*/
    }

    div.home .links h1,
    div.home .links h2 {
        font-size: 50px;
    }


}

@media (min-width: 992px) {
    .topheader {
        /*max-width: 940px;*/
    }

    .col-sm-9 {
        width: 74%;
    }
    .poolbodebalk {
        top: 100px;
        width: 600px;
    }
    div.home .links h1,
    div.home .links h2 {
        font-size: 50px;
    }

}

@media (min-width: 1200px) {
    .topheader {
        /*max-width: 1140px;*/
    }

    .container {
        max-width: 1244px;
    }

    .poolbodebalk {
        top: 100px;
        width: 600px;
    }

    div.home .links h1,
    div.home .links h2 {
        font-size: 60px;
    }

}

/* ---Language Menu --- */
div.sidebar-offcanvas ul.flagmenu {
    margin: 60px 0 0 20px;
    padding: 0;
    overflow: hidden;
}

.flagmenu li {
    padding: 1em 0 0 0;
    margin: 0;
    list-style: none;
    color: #ccc;
}

.flagmenu li a, .flagmenu li span {
    display: block;
    text-indent: -9999px;
}

.flagmenu.noflags li a, .flagmenu.noflags li span {
    text-indent: 0;
    display: inline;
}

/*
.flagmenu.noflags li + li:after {
    content: "|";
    padding: 0 0 0 5px;
    color: #ccc;
}
*/
.flagmenu.noflags li {
    padding-top: 0.5em;
}

.flagmenu a.flags, .flagmenu span.flags {
    width: 20px;
    height: 20px;
    background: url(../Images/flagsprite.gif) no-repeat 0 0;
}

.flagmenu a.flags0 {
    background-position: 0 0;
}

.flagmenu span.flags0 {
    background-position: -20px 0;
}

.flagmenu a.flags1 {
    background-position: 0 -20px;
}

.flagmenu span.flags1 {
    background-position: -20px -20px;
}

/*css styled content*/
.csc-textpic-intext-right-nowrap .csc-textpic-text {
    margin-right: 0 !important;
}

.csc-textpic-intext-left-nowrap .csc-textpic-text {
    margin-left: 0 !important;
}

@media screen and (min-width: 420px) {
    .csc-textpic-intext-left > .csc-textpic-imagewrap,
    .csc-textpic-intext-left-nowrap > .csc-textpic-imagewrap,
    .csc-textpic-intext-right-nowrap > .csc-textpic-text {
        float: left;
        width: 50%;
    }

    .csc-textpic-intext-left-nowrap > .csc-textpic-text,
    .csc-textpic-intext-right > .csc-textpic-imagewrap,
    .csc-textpic-intext-right-nowrap > .csc-textpic-imagewrap {
        float: right;
        width: 50%;
    }

    .csc-textpic-intext-left .csc-textpic-imagewrap {
        margin-right: 10px;
    }

    .csc-textpic-intext-right .csc-textpic-imagewrap {
        margin-left: 10px;
    }
}

.csc-textpic:before, .csc-textpic-imagewrap:before,
.csc-textpic:after, .csc-textpic-imagewrap:after {
    content: "";
    display: table;
}

.csc-textpic:after, .csc-textpic-imagewrap:after {
    clear: both;
}

.csc-textpic-imagewrap img, .csc-textpic-imagerow img {
    border: medium none;
    margin-bottom: 0;
    vertical-align: bottom;
}

.csc-textpic-imagecolumn {
    max-width: 100%;
    float: left;
}

.csc-textpic-imagecolumn.csc-textpic-col,
.csc-textpic-imagecolumn.csc-textpic-lastcol {
    margin-right: 0;
}

.csc-textpic-left > .csc-textpic-imagewrap {
    text-align: left;
}

.csc-textpic-intext-left-nowrap .csc-textpic-text {
    margin-left: auto !important;
}

.imagewidth30 .csc-textpic-intext-left-nowrap > .csc-textpic-text {
    width: 70%;
}

.imagewidth15 .csc-textpic-intext-left-nowrap > .csc-textpic-text {
    width: 83.3333333333%;
}

.csc-textpic-center img {
    margin: 0 auto;
}

.csc-textpic-center > .csc-textpic-text {
    text-align: left;
}

.csc-textpic-caption {
    margin-bottom: 20px;
}

[data-csc-cols="1"] .csc-textpic-imagecolumn {
    max-width: 100%;
}

[data-csc-cols="2"] .csc-textpic-imagecolumn {
    max-width: 50%;
}

.csc-textpic-below figure,
.csc-textpic-above figure {
    margin: 0 0 20px 0;
}

.csc-textpic-imagewrap figure,
.csc-textpic-imagewrap figure {
    margin: 0 10px 20px 0px;
}

.csc-textpic-imagewrap {
    margin: 0 0 0 0;
}

div.csc-textpic, div.csc-textpic div.csc-textpic-imagerow, ul.csc-uploads li {
    overflow: hidden;
}

.csc-textpic-intext-left ol, .csc-textpic-intext-left .csc-textpic-text ul {
    overflow: auto;
}

[data-csc-cols="2"] .csc-textpic-imagecolumn {
    width: 50%;
}

[data-csc-cols="3"] .csc-textpic-imagecolumn {
    width: 33.3%;
}

[data-csc-cols="4"] .csc-textpic-imagecolumn {
    width: 25%;
}

div.csc-frame-rulerBefore {
    border-top: 1px solid #ccc;
    margin: 1.5em 0 0 0;
}

div.csc-frame-rulerAfter {
    border-bottom: 1px solid #ccc;
    margin: 0 0 1.5em 0;
}

div.csc-frame-indent {
    padding-left: 100px;
}

div.csc-frame-indent3366 {
    padding-left: 33%;
}

div.csc-frame-indent6633 {
    padding-right: 33%;
}

.csc-frame-frame1 {
    background-color: #f5f5f5;
    padding: 1.5em;
    margin-bottom: 1.5em;
}

.layout2 .csc-frame-frame1 {
    min-height: 20em;
}

.csc-frame-frame2 {
    background-color: #414141;
    padding: 1.5em;
    margin-bottom: 1.5em;
    color: #fff;
}

.csc-frame h1, .csc-frame h2, .csc-frame h3, .csc-frame h4, .csc-frame h5 {
    margin-top: 0;
}

.csc-uploads:before,
.csc-uploads:after {
    content: "";
    display: table;
}

.csc-uploads:after {
    clear: both;
}

ul.csc-uploads {
    margin: 0 0 20px 0;
}

ul.csc-uploads li {
    border-bottom: none;
}

ul.csc-uploads span {
    display: block;
}

ul.csc-uploads span.csc-uploads-description {
    width: 80%;
    float: left;
}

ul.csc-uploads img {
    width: auto;
    float: left;
    margin-right: 6px;
}

ul.csc-uploads span.csc-uploads-fileSize {
    width: 20%;
    text-align: right;
    float: right;
}

/*table {
    min-width: 100%;
}*/

/* Anpassungen fÃ¼r form */
.csc-form-element-submit input,
.csc-form-confirmation-false input,
.csc-form-confirmation-true input {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.428571429;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}

.csc-form-element-submit input:focus,
.csc-form-confirmation-false input:focus,
.csc-form-confirmation-true input:focus {
    outline: thin dotted #333;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}

.csc-form-element-submit input:hover,
.csc-form-element-submit input:focus,
.csc-form-confirmation-false input:hover,
.csc-form-confirmation-true input:hover,
.csc-form-confirmation-false input:focus,
.csc-form-confirmation-true input:focus {
    color: #333333;
    text-decoration: none;
}

.csc-form-element-submit input:active,
.csc-form-element-submit input .active,
.csc-form-confirmation-false input:active,
.csc-form-confirmation-true input:active {
    background-image: none;
    outline: 0;
    -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

.csc-form-confirmation-false input {
    background: red;
    color: #fff;
}

.csc-form-confirmation-true input {
    background: #228811;
    color: #fff;
}

.csc-form-confirmation li {
    float: left;
}

.btn {
    height: 34px;
}

/* rootline navigation */
ul.breadcrumb {
    margin-left: 0;
    font-size: 80%;
    padding: 0;
    background-color: transparent;
}

@media only screen and (max-width: 520px) {
    ul.breadcrumb {
        display: none;
    }
}

/* news pagination */
.page-navigation {
    font-size: 80%;
    text-align: center;
}

.news .page-navigation p {
    float: none;
}

.news .page-navigation ul {
    float: none;
    margin: 0;
}

.news .page-navigation ul li {
    float: none;
    display: inline;
}

.news .page-navigation ul li a {
    display: inline;
    padding: 1px 2px;
}

/* adjustments for print */
@media print {

    .news .article .news-img-wrap a, .news-list-view .dl-horizontal dt a {
        padding: 0;
        border: 0 none;
    }

}

.flexslider {
    margin: 0;
    border: none;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    -o-border-radius: 0px;
    border-radius: 0px;
    box-shadow: 0 0px 0px rgba(0, 0, 0, .2);
    -webkit-box-shadow: 0 0px 0px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 0px 0px rgba(0, 0, 0, .2);
    -o-box-shadow: 0 0px 0px rgba(0, 0, 0, .2);
}

.flex-control-nav {
    display: none;
}

/* login forms start */

form.login {
    position: relative;
    margin: 0 auto 10px auto;
    z-index: 2;
}

.tx-felogin-pi1,
form.login fieldset {
    position: relative;
    z-index: 4;
    display: flex;
    flex-direction: column;
    align-items: center;
}

#c166 {
    position: relative;
    z-index: 5;
    text-align: center;
}

#c166 a {
    padding: 10px;
}

div.forgot {
    clear: both;
    float: none;
    margin-top: 15px;
}

div.forgot p {
    /*float: right;*/
}

#c160 h2 {
    text-align: center;
    color: var(--blauw);
    font-size: 2rem;
}


.tx-felogin-pi1 .form-group {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.tx-felogin-pi1 .form-group label {
    font-family: var(--poolfont1);
    color: var(--zwart);
    padding-top: 2px;
    letter-spacing: 1px;
    display: block;
    font-size: 2rem;
    text-align: center;
}

.tx-felogin-pi1 .form-group.permalogincontainer label {
    width: auto;
    display: inline-block;
    font-family: var(--poolfont1);
    font-size: 1rem;
    color: rgb(0, 0, 0);
}

.tx-felogin-pi1 .form-group input[type="password"],
.tx-felogin-pi1 .form-group input[type="text"] {
    background-color: #FCF0CA !important;
    font-family: var(--poolfont1);
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: none;
    padding: 3px 0 0 0 ;
    border-radius: 12px;
    text-align: center;
    font-size: 1rem;
    height: 40px;
    width: 250px;
    vertical-align: baseline;

    /*
    color: rgb(0, 0, 0);
    background-color: var(--blauw);
    border-radius: 0;
    margin-top: -5px;
    text-transform: lowercase;
    width: 150px;
    display: inline-block;
    text-align: center;

    border-top: 2px solid var(--blauw);
    border-left: 2px solid var(--blauw);
    border-right: 2px solid var(--blauw);
    border-bottom: 2px solid var(--blauw);
    padding: 0 5px;
    */
}

.tx-felogin-pi1 .form-group input#pass {
    /*margin-right: 3px;*/
}

.tx-felogin-pi1 .form-group input#permalogin {
}

 
/* This will style all login input and textarea placeholders: */

.tx-felogin-pi1 form.login .form-group input::-webkit-input-placeholder {
    color: #aaa;
}

.tx-felogin-pi1 form.login .form-group input:-moz-placeholder {
    /* FF 4-18 */
    color: #aaa;
}

.tx-felogin-pi1 form.login .form-group input::-moz-placeholder {
    /* FF 19+ */
    color: #aaa;
}

.tx-felogin-pi1 form.login .form-group input:-ms-input-placeholder {
    /* IE 10+ */
    color: #aaa;
}

.form-group {
    margin-bottom: 15px;
    position: relative;
    /*width: 300px;*/
}

.form-group.permalogincontainer {
    clear: both;
}

.form-control {
    width: 200px;
    height: 26px;
}

div.kickoff {
    clear: both;
}

.forgotpassword input {
    margin-bottom: 10px;
}

div.felogindiv {
    position: relative;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

div.felogindiv form fieldset {
    display: flex;
    flex-direction: column;
    align-items: center;

}

div.felogindiv input.btn {
    margin: 10px 0;
}

/* login forms end */

/* algemeen klassement start */
td.colposition,
td.coltotaalscore {
    color: var(--rood);
}
table:not(.sorted-table) tr.sameposition td.colposition {
	opacity:.3;
}

/* algemeen klassement end */

/*
 * Bootstrap js
*/

.tooltip.top {
  padding: 5px 0;
  margin-top: -10px;
}
.tooltip-inner {
    min-width: 100px;
    max-width: 350px;
    font-family: var(--tooltipfont);
	color: var(--zwart);
    background-color: #fff;
    font-size: 12px;
    box-shadow:0 2px 4px rgba(0,0,0,.2);
}

.tooltip .tooltip-arrow,
.tooltip.top .tooltip-arrow,
.tooltip.right .tooltip-arrow {
    border-top-color: #fff;
    border-bottom-color: #fff;
}

/* Canvasjs start */
#chartContainer {
    margin: 0 0 10px;
	z-index:10;
	background-color: var(--bijnawit);
    padding:0;
    min-height:250px;
}
#chartContainer canvas {
	display:block;
	}

/**
  * stijlen voor het aanmeldformulier
*/

.layout3 #wrap {
    font-weight: 700;
    margin: 0;
    padding: 0;
    font-size: 1rem;
}

.layout3 #wrap label {
    font-weight: 700;
}

.layout3 .aanmeldform-footer,
.layout3 .aanmeldform-header {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.layout3 .aanmeldform-header {
    background-color: var(--rood);
    margin-bottom: 1rem;
}

.layout3 .aanmeldform-subheader,
.layout3 .aanmeldform-subsubheader {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.layout3 .aanmeldform-subheader {
    margin-top: -15px;
    background-color: var(--wit);
}

.layout3 .aanmeldform-subsubheader .beker {
    display: none;
    padding: 1rem 0;
}

.layout3 .aanmeldform-header h1 {
    font-size: 1.2rem;
    color: var(--geel);
    font-family: var(--poolkopfont);
}

.layout3 .aanmeldform-subheader h2 {
    font-size: 2rem;
    text-transform: uppercase;
    margin-top: 14px;
    margin-bottom: 0;
    color: var(--rood);
    font-family: var(--poolkopfont);
}

.layout3 .aanmeldform-subsubheader h3 {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 0;
    color: var(--zwart);
    font-family: var(--broodtekst);
    text-transform: uppercase;
    text-align: center;
    padding: 0 3rem;
}

.layout3 .aanmeldform-subsubheader .editie {
    margin-top: 1rem;
}


.layout3 .aanmeldform-subsubheader h3.poolbode-toernooi {
    color: var(--rood);
}

.layout3 .aanmeldform-subsubheader h3 .small-captital {
    text-transform: uppercase;
    font-size: 1rem;
}

.layout3 .aanmeldform-subheader .star img {
    width: 65px;
    margin: 0 20px;
}

.layout3 .aanmeldform-subheader .logo-2024 {
    display: none;
}

.layout3 .aanmeldform-subheader .logo-2024 img {
    margin-bottom: -47px;
}

.layout3 .star img {
    width: 30px;
}

.layout3 .beker img {
    width: 57px;
}

.layout3 .voetbal img {
    width: 85px;
}

.layout3 .aanmeldform-subheader .star {
    color: var(--rood);
}

.layout3 .aanmeldform-footer .star {
    color: #0c4560;
}

.layout3 .aanmeldform-footer h3 {
    color: var(--rood);
    font-family: var(--poolkopfont);
    font-weight: 700;
    margin: 0;
}

.layout3 .aanmeldform-footer h3 a {
    color: var(--rood);
    text-transform: uppercase;
}

.layout3 .title,
.layout3 .poolbodejaar {
    text-align: center;
    position: relative;
    z-index: 1;
}

.layout3 .middle-col {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

.layout3 .middle-col .ek-titel {
    padding: 90px 0;
}

.layout3 .middle-col .ek-titel h3 {
    color: #0c4560;
    font-size: 3rem;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    transform:rotate(90deg);
    font-family: var(--poolkopfont);
    white-space: nowrap;
    margin-left: -5px;
}

.linkertanden,
.rechtertanden {
    position: fixed;
    top: 0;
    width: 36px;
    height: 100vh;
    background: url('/resources/Formhandler/aanmeldform/skin/images/Zwartblok.png');
    background-repeat: repeat-y;
    content: '.';
    z-index: -1;
}

.rechtertanden {
    right: 0;
}

.layout3 .editie,
.layout3 .title {
    color: var(--geel);
    font-size: 1.3em;
}

.layout3 .poolbodejaar {
    font-family: "kremlin_chairmanbold", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 2em;
    text-transform: uppercase;
}

.layout3 .poolbodenl {
    margin-top: 30px;
}

.layout3 .poolbodenl p {
    font-family: "p22_constructivistregular", "Helvetica Neue", Helvetica, Arial, sans-serif;
    text-align: center;
    text-transform: uppercase;
}

.layout3 .form {
    padding: 15px;
    min-height: 620px;
    font-family: var(--broodtekst);
    font-weight: 500;
}

.layout3 .form textarea,
.layout3 .form input[type='text'] {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.layout3 .form input[type='file'] {
    font-family: var(--broodtekst);
    text-transform: uppercase;
    display: none;
}


.layout3 .form .file-selected {
    text-align: center;
}

.layout3 .form .fileupload-info {
    font-family: var(--broodtekst);
    width: 80%;
    margin: 0 auto;
    text-align: center;
    color: var(--wit);
    font-size: 0.8rem;
}

.layout3 .rightcol .form label,
.layout3 .form .type-file label {
    text-align: center;
    cursor: pointer;
    color: var(--rood);
    font-size: 1rem;
}

.layout3 .rightcol .form label.extra {
    font-size: 0.8rem;
}

.layout3 .form .type-file label:hover {
    color: var(--rood);
}

.layout3 .form .type-file label figure {
    margin-bottom: 1rem;
}

.layout3 .form .type-file label figure img {
    margin: 0 auto;
    width: 100px;
}

.layout3 .form .type-file label:hover figure img {
    border: 1px solid var(--rood);
}

.layout3 .form .type-file.file-file label:hover figure img {
    border: 1px solid var(--rood);
}

.layout3 .leftcol .form textarea[type='text'],
.layout3 .leftcol .form input[type='text'] {
    width: 63%;
}

.layout3 .leftcol .form .type-check {
    font-family:var(--broodtekst);
}

.layout3 .leftcol .form .type-check .contact-type {
    margin-bottom: 1rem;
}

.layout3 .leftcol .form .type-text label {
    max-width: 180px;
}

.layout3 .form .type-text {
    position: relative;
    margin: 0 0 15px 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.layout3 .form .type-file {
    flex-direction: column;
}

.layout3 .form .info-file {
    display: none;
}

.yellow-bg {
    background-color: var(--geel);
}

.layout3 .arrow-down {
    width: 89px;
    margin: 0 auto;
}

.layout3 .lenin {
    position: absolute;
    left: -7px;
    top: 77px;

    height: 189px;
    width: 132px;

    transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
}

.layout3 .lenin img {
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;

    transition: all 0.7s linear;
    -moz-transition: all 0.7s linear;
    -webkit-transition: all 0.7s linear;

    /*z-index: 1;*/
    /*position: relative;*/
}

.layout3 .lenin.turned img {
    transform: scale(1, -1);
    -moz-transform: scale(1, -1);
    -webkit-transform: scale(1, -1);

    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
}

.layout3 .wereldster {
    padding-top: 100px;
}

.layout3 .wereldster img {
    width: 217px;
    margin: 100px auto 30px auto;
}

.layout3 .editie p {
    text-align: center;
}

.layout3 .lines-container {
    padding: 0;
}

.layout3 .lines {
    position: relative;
    height: 40px;
    width: 100%;
    display: inline-block;
    vertical-align: middle;
}

.layout3 .lines .bun,
.layout3 .lines .burger,
.layout3 .lines .toppings {
    position: absolute;
    left: 0;
    width: 100%;
    height: 0;
    border-bottom: 2px solid #ffff99;
}

.lines .toppings {
    top: 6px;
}

.lines .burger {
    top: 50%;
    margin-top: -2px;
}

.lines .bun {
    bottom: 8px;
}

.formcol {
    padding-left: 15px;
    padding-right: 15px;
}

.layout3 .balls-container {
    margin-top: 0;
}

.layout3 .ball {
    display: none;
}

.layout3 .form-container {
    margin-top: 50px;
}

.layout3 .ball img {
    margin: 0 auto;
}

.layout3 .rightcol .form .number {
    position: absolute;
}

.layout3 .type-check.sexe div {
    display: inline-block;
}

.tx-femanager textarea,
.tx-femanager input[type=text],
.layout3 input,
.layout3 select[multiple],
.layout3 textarea {
    background-color: var(--wit);
    margin-bottom: 2px;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: none;
    padding: 5px 5px;
    border-radius: 0px;
}


.layout3 .verzend {
    display: flex;
    align-items: center;
    justify-content: center;
    background: url("/fileadmin/Resources/Images/2024/pijl-rechts-verzend.png");
    background-size: 100px 100px;
    background-position: center;
    height: 100px;
    background-repeat: no-repeat;
    margin: 50px auto 0 auto;
}

.layout3 .verzend:hover {
    background: url("/fileadmin/Resources/Images/2024/pijl-rechts-verzend-zwart.png");
    background-size: 100px 100px;
    background-position: center;
    background-repeat: no-repeat;
}

.layout3 .verzend .type-button {
    position: relative;
}

.layout3 .verzend .type-button span {
    position: absolute;
    color: var(--rood);
    font-weight: 700;
    font-size: 1rem;
    left: 15px;
}

.layout3 .verzend input {
    height: 150px;
    text-align: right;
    color: transparent;

    background-color: transparent;
    margin-bottom: 2px;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: none;
    outline: none;
}


.layout3 .verzend input:hover {
    
}

.type-check.sexe {
    margin: 15px 0 10px;
}

.layout3 .type-file input[type='submit'] {
    display: none;
}

.layout3 .type-file input#file {
    position: relative;
    width: 100%;
    right: 0;
    line-height: 34px;
    border: 1px dashed rgba(0, 0, 0, 0.5);
    color: #000;
}

.layout3 #remarks {
    height: 75px;
    /*
        background-attachment: local;
        background-image:
                linear-gradient(to right, transparent 10px, transparent 10px),
                linear-gradient(to left, transparent 10px, transparent 10px),
                repeating-linear-gradient(transparent, transparent 30px, #000 30px, #000 31px, transparent 31px);
        line-height: 31px;
        padding: 8px 10px;
    */
}

.layout3 .thankyou {
    text-align: center;
    font-family: var(--broodtekst);
    margin: 10rem 0;
}

.layout3 .thankyou h3 {
    font-family: var(--poolkopfont);
    color: var(--rood);

}

/* RADIO */

.type-check label {
    margin-right: 5px;
}

input[type=radio].with-font,
input[type=checkbox].with-font {
    border: 0;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    border-color: var(--rood);
}

input[type=radio].with-font ~ label:before,
input[type=checkbox].with-font ~ label:before {
    font-family: FontAwesome;
    display: inline-block;
    content: "\f096";
    letter-spacing: 7px;
    font-size: 1.2em;
    color: #000000;
    width: 1.8rem;
}

input[type=radio].with-font:checked ~ label:before,
input[type=checkbox].with-font:checked ~ label:before {
    content: "\f046";
    font-size: 1.2em;
    letter-spacing: 5px;
}

input[type=checkbox].with-font ~ label:before {
    content: "\f096";
}

input[type=checkbox].with-font:checked ~ label:before {
    content: "\f046";
    color: #000000;
    font-weight: bold;
}

input[type=radio].with-font:focus ~ label:before,
input[type=checkbox].with-font:focus ~ label:before,
input[type=radio].with-font:focus ~ label,
input[type=checkbox].with-font:focus ~ label {
    color: #000000;
    font-weight: bold;
}

.radio-container {
    display: flex;
}

.radio-container label {
    margin-right: 1rem;
}


/* RADIO */


.tx-femanager textarea,
.tx-femanager input[type=text],
.tx-femanager input[type=submit]
{
    width: 100%;
}

.tx-femanager .femanager_fieldset {
    max-width: 500px;
}

.tx-femanager .femanager_submit {
    padding-top: 15px;
}

.alert-success,
.tx-femanager .btn-default#femanager_field_submit {
    color: # var(--zwart);
    background-color: var(--geel);
    border-color: var(--zwart);
}

@media (min-width: 350px) {
    .user-image {
        visibility: visible;
    }
}

@media (min-width: 520px) {
    .layout3 .poolbodenl p,
    .layout3 .poolbodejaar,
    .layout3 .title {
        font-size: 2.3em;
    }

    .layout3 .leftcol .form textarea[type='text'],
    .layout3 .leftcol .form input[type='text'] {
        width: 63%;
    }
}

@media (max-width: 768px) {
    /*.smallViewHide {
        display: none;
    }*/
    .topheader .row {

    }

    .poolbodebalk {
        top: 260px;
    }

    .colleft {
        min-height: 10px;
    }

    .colcontent {
        border-left: none
    }

    .affix {
        position: static;
    }
    .colcontent {
        border:none;
        padding:0 15px;
    }
    
    .colleft > div, .colcontent > div {
        padding-left:0;
        margin-left:0;
    }

    .csc-firstHeader {
        margin-left:0;
    }
    .standings {
		width:100vw;
		min-width:unset;
	}
    .voorspellingen {
		width:100vw;
		margin-left:-15px;
		margin-bottom:18px !important;
	}
    #chartContainer {
        margin-left:-15px;
        overflow-x: auto;
    }

    .table-container {
        overflow-x: auto;
    }

    .standings-table {
       /* margin-left: -15px;
        margin-right: -15px;*/
    }

    .nav.navbar-nav {
        margin-top: 18px;
    }

    .nav > li.active > a,
    .nav > li > a:hover,
    .nav > li > a:focus {
        text-decoration: none;
        background-color: transparent;
        color: var(--rood);
    }
}

@media (min-width: 768px) {

    .user-image {
        left: 244px;
    }

    .user-image img {
        margin-left: 0;
    }

    .layout3 #wrap {
        font-size: 1.5rem;
    }

    .layout3 .poolbodejaar,
    .layout3 .title {
        font-size: 3.3em;
    }

    .layout3 .leftcol .form textarea[type='text'],
    .layout3 .leftcol .form input[type='text'] {
        width: 63%;
    }

    .layout3 .aanmeldform-header h1 {
        font-size: 3rem;
        text-transform: uppercase;
        padding: 10px 0;
    }

    .layout3 .aanmeldform-subheader h2 {
        font-size: 4.5rem;
        padding: 0 4rem;
    }

    .navbar-collapse {
        padding-top: 8px;
    }
    
    .layout3 .aanmeldform-subsubheader .beker {
        display: block;
    }

    .layout3 .aanmeldform-subsubheader h3 {
        font-size: 3rem;
    }

    .layout3 .aanmeldform-subsubheader h3 .small-captital {
        font-size: 2rem;
    }

    .layout3 .aanmeldform-subsubheader .logo-2024 {
        display: none;
    }

    .layout3 .aanmeldform-subheader .logo-2024 img {
        margin-bottom: -122px;
    }

    .layout3 .aanmeldform-subheader .logo-2024 {
        display: block;
    }

    #c181 h1,
    #c181 h2,
    #c181 h3
    {
        font-size: 2.6rem;
    }


}

@media (min-width: 992px) {
    .layout3 .poolbodejaar,
    .layout3 .title {
        font-size: 4.3em;
    }

    .formcol {
        padding-left: 0;
        padding-right: 0;
    }

    .layout3 .leftcol .form textarea[type='text'],
    .layout3 .leftcol .form input[type='text'] {
        width: 63%;
    }

    .layout3 .balls-container {
        margin-top: -161px;
    }

    .layout3 .ball {
        display: block;
    }

    .layout3 .arrow-down {
        display: none;
    }

    .layout3 .aanmeldform-subheader h2 {
        font-size: 6.5rem;
    }

}

@media (min-width: 1200px) {
    .layout3 .poolbodejaar,
    .layout3 .title {
        font-size: 2.5em;
    }

    .radio-container,
    .layout3 .leftcol .form textarea[type='text'],
    .layout3 .leftcol .form input[type='text'] {
        width: 75%;
    }

    .layout3 .balls-container {
        margin-top: -186px;
    }
}
