/* @import url('https://fonts.googleapis.com/css2?family=Raleway:wght@100;200;300;400;500;600;700;800;900&family=Source+Sans+Pro:wght@200;300;400;600;700;900&display=swap'); */

@font-face {
	font-family: "Raleway";
	src: url(../fonts/Raleway400.woff2);
}
@font-face {
	font-family: "Raleway";
	src: url(../fonts/Raleway600.woff2);
	font-weight: 600;
}
@font-face {
	font-family: "Source Sans Pro";
	src: url(../fonts/SourceSansPro400.woff2);
}
@font-face {
	font-family: "Source Sans Pro";
	src: url(../fonts/SourceSansPro600.woff2);
	font-weight: 600;
}

:root{
	--font-body:"Source Sans Pro";
	--font-headings:"Raleway";
	--color-primary:#333;
	--color-secondary:#555;
}
html,body{width:100%;height:100%;margin:0;padding:0;background:transparent;font-size:16px;color:#000}
h1,h2,h3,h4,h5,h6,select,textarea,input,button{font-family:inherit;font-size:inherit}
h1{font-size:clamp(1.3rem, .6rem + 1.0vw, 3.9rem)}
h2{font-size:clamp(1.2rem, .6rem + 0.7vw, 3.4rem)}
h3{font-size:clamp(1.1rem, .6rem + 0.5vw, 2.9rem)}
h4{font-size:clamp(1.0rem, .6rem + 0.3vw, 2.6rem)}
h5{font-size:clamp(0.9rem, .6rem + 0.1vw, 2.4rem)}
h6{font-size:clamp(0.8rem, .6rem + 0.1vw, 1.7rem)}
*:not(h1,h2,h3,h4,h5){font-family:var(--font-body)}
h1,h2,h3,h4,h5{font-family:var(--font-headings);color:var(--color-primary);margin:0 0 5px}
a,a:hover,a:focus,label,button{-webkit-tap-highlight-color:transparent}
a,a:hover,a:focus{color:var(--color-primary);text-decoration:none}
img{max-width:100%;display:block}
button{background:none;appearance:none;border:none;padding:0;margin:0;cursor:pointer}
input:focus-visible{outline:none}
button,label{user-select:none}
span,label{word-break:break-word}
div{box-sizing:border-box}
table{border-spacing:0}
td{padding:0;vertical-align:text-bottom}
td+td{padding-left:20px}
::-webkit-scrollbar{width:8px}
::-webkit-scrollbar-track{background:#fff}
::-webkit-scrollbar-thumb{background:#aaa}
::selection{color:#fff;background:var(--color-primary)}
.diptych{display:grid}
	.diptych__left{padding:40px;display:flex;flex-direction:column;align-content:center;justify-content:center;align-items:center;text-align:center;background-position:center;position:relative;background-size:cover;box-sizing:border-box}
	.diptych__right{padding:60px 5vw;overflow:auto;position:relative;display:flex;flex-direction:column}
	.overlay{max-height:calc(100vh - 50px)}
.logo{width:100%;margin-bottom:40px;display:flex;align-items:center;gap:5px;max-width:100%;justify-content:flex-end}
.logo img{width:100%;max-width:230px}
.logo span{text-transform:uppercase}
.form-fields{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.form-field{position:relative;margin-bottom:10px}
	.form-field [disabled],.form-field [readonly]{opacity:.75;cursor:not-allowed}
	.form-field [disabled] + span,.form-field [readonly] + span{opacity:.75;cursor:not-allowed}
	.form-field__input{width:100%;box-sizing:border-box;appearance:none;padding:21px 12px 8px 12px;border:1px solid var(--color-primary);height:55px;outline:none;background:#fff;color:#000}
	.form-field--textarea .form-field__input{min-height:150px}
	.form-field--select:after{position:absolute;content:'';border-style:solid;border-width:0.1em 0.1em 0 0;display:inline-block;height:0.4em;right:17px;width:0.4em;top:22px;transform:rotate(135deg)}
	.form-field--select:invalid{border-color:red !important}
	.form-field--checkbox .form-field__label{position:static;padding-left:25px}
	.form-field--checkbox input{width:1px;height:1px;position:absolute;left:0;top:1px;margin:0}
	.form-field--checkbox input:before{content:'';width:15px;height:15px;border:1px solid var(--color-primary);display:block;position:absolute;left:0;top:0}
	.form-field--checkbox input:after{left:7px;color:#fff;position:absolute;content:'';border-style:solid;border-width:0.02em 0.02em 0 0;display:inline-block;height:0.025em;width:0.045em;top:6px;transform:rotate(100deg);transition:all .2s ease}
	.form-field--checkbox input:checked:after{left:3px;color:#111;border-width:0.2em 0.2em 0 0;height:0.25em;width:0.45em;top:3px;transform:rotate(135deg)}
	.form-field__option{position:relative}
	.form-field--radios{position:relative;display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px;flex-direction:column;align-items:flex-start}
	.form-field--radios .form-field__label{position:static;padding-left:25px}
	.form-field--radios input{width:1px;height:1px;position:absolute;left:2px;top:4px;margin:0}
	.form-field--radios input:before{content:'';width:15px;height:15px;border:1px solid var(--color-primary);display:block;position:absolute;left:-2px;top:-3px;border-radius:50%}
	.form-field--radios input:after{left:6px;background:#fff;position:absolute;content:'';display:inline-block;height:0;width:0;top:5px;border-radius:50%;transition:all .2s ease}
	.form-field--radios input:checked:after{left:1px;background:#111;height:11px;width:11px;top:0px}
	.form-field__label{left:15px;position:absolute;top:16px;transition:transform 0.25s ease-out}
	.form-field__input:focus, .form-field__input:not(:placeholder-shown){border:1px solid var(--color-primary)}
	.form-field__input:focus + .form-field__label, .form-field__input:not(:placeholder-shown) ~ .form-field__label{transform:translate(-11%, -52%) scale(0.8);width:120%}
	.form-field__input::placeholder{color:transparent}
	.form-field-header{display:block;font-weight:600;margin-bottom:10px}
	.form-field-header+div{margin-left:10px}
	.form-field--fullwidth{grid-column:1/3}
	.form-field--hidden{opacity:.85}
	.form-field--phone select, .form-field--phone input{padding-top:8px}
	.form-field--checkbox{display:block}
	.phone-number{display:flex;gap:6px}
.pull-right{margin-left:auto}
.introduce-question{margin-bottom:25px}
.introduce-container{display:flex;flex-wrap:wrap;margin-bottom:25px}
.introduce{width:100%;position:relative}
.introduce+.introduce{margin-top:25px}
.introduce .remove{position:absolute;right:-5px;top:-26px;z-index:2;padding:5px}
.button,.button:focus{text-decoration:none;appearance:none;outline:none;box-shadow:none;touch-action:manipulation;cursor:pointer;display:inline-block;text-align:center;font-size:16px;font-weight:500;padding:12px 48px;background-color:var(--color-primary);border:1px solid var(--color-primary);color:#fff;position:relative;transition:all .2s ease;z-index:1;font-weight:600}
.button--small,.button--small:focus{padding-left:10px;padding-right:10px}
.button:hover{background-color:var(--color-secondary);border:1px solid var(--color-secondary);color:#fff}
.visitorcontrol{display:flex;padding-top:20px;margin-top:auto;gap:5px;align-items:center;font-size:10px;color:#545454;justify-content:center;align-content:center}
.visitorcontrol a{color:inherit}
.poweredby svg{vertical-align:text-top}
.langswitch{position:absolute;right:10px;top:25px;display:flex;gap:8px}
.tabs{display:flex;gap:10px;border-bottom:1px solid var(--color-primary);margin-bottom:15px}
.tabs a, .tabs button{padding:10px 10px;background:#f7f7f7}
.tabs a.active, .tabs button.active{background:var(--color-primary);color:#fff}
.registratie form p:first-of-type{margin-block-start:0}
.message{position:fixed;pointer-events:none;top:50%;left:50%;padding:8px;background:#0cb50c;z-index:2;color:#fff;text-align:center;transform:translate(-50%,-50%);border-radius:5px;transition:opacity .3s ease-in}
.message--fixed-to-top{top:15px;left:50%;transform:translateX(-50%)}
.message--red{background:red}
.hidden{opacity:0}
.video-container{position:relative;padding-bottom:52.6%;padding-top:30px;height:0;overflow:hidden;margin-bottom:20px}
.video-container iframe, .video-container object, .video-container embed{position:absolute;top:0;left:0;width:100%;height:100%}
.grid{display:grid;gap:0 20px;grid-template-columns:repeat(12, 1fr)}
.grid__cell--1-1,.grid__cell--2-2,.grid__cell--3-3{grid-column:12 span}
.grid__cell--1-2{grid-column:6 span}
.grid__cell--1-3{grid-column:4 span}
.grid__cell--2-3{grid-column:8 span}
.grid__cell:has(.form-field--fullwidth){grid-column:12 span}
.phone-number{display:flex;gap:7px;height:100%;flex-direction:row;flex-wrap:nowrap;align-items:stretch;width:100%}
.phone-number select, .phone-number input{border:1px solid var(--color-primary);border-radius:0;box-sizing:border-box;appearance:none;padding:8px 12px;outline:none;background:#fff;height:55px}
.phone-number input{width:100%}
.deelname{display:block;margin-bottom:5px}
.voorwaarden{position:relative}
.close{position:absolute;right:-10px;padding:10px;font-size:24px;top:-12px;line-height:1}
.details{background:#e6ebed;position:absolute;bottom:25px;left:0;width:100%;right:0;padding:25px}
.details h1,.details h2{color:#394384}
.gorinchem_theme .details h1,.gorinchem_theme .details h2{color:#BA975F}
.after-reg{font-size: 90%;margin-bottom: 30px;}

@media (max-width:720px){
	.diptych{grid-template-rows:300px auto}
	.diptych__left,.diptych__right{padding:25px}
	.overlay{max-height:100%}
	.logo{max-width:190px}
	.visitorcontrol{flex-direction:column}
}
@media (min-width:721px){
	.diptych{grid-template-columns:50% 50%;height:100vh}
	.poweredby:after{content:' -'}
	.diptych__left{height:100vh}
	.diptych__right{overflow-y:scroll;height:100vh}
}
@media (max-width:1200px){
	.form-fields{display:flex;flex-direction:column}
	.grid{display:flex;flex-direction:column}
}