/*
Theme Name: Spellen
Theme URI: 
Description:
Version: 
Author: Resultat
Author URI: http://www.resultat.nl
*/

/*

Kleur BLAUW licht : #79c8eb rgba(121, 200, 235, 1)
Kleur BLAUW donker : #364042 rgba(55, 64, 66, 0.7)
Kleur GEEL : #fff165
Kleur ROZE : #f4307f
Kleur ZWART TEXT : #07111c

*/



/*

++++++++++++++ G L O B A L ++++++++++++++

*/



html, body, div, span, applet, object, iframe,  h1, h2, h3, h4, h5, h6, p, blockquote, pre,  a, abbr, acronym, address, big, cite, code,  del, dfn, em, font, ins, kbd, q, s, samp,  small, strike, strong, sub, sup, tt, var,  dl, dt, dd, ol, ul, li,  fieldset, form, label, legend,  table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}
html, body {font-size: 1em;	width: 100%;padding: 0px;margin: 0px;font-family: 'Raleway', sans-serif;font-weight: 300; background-image:none !important}

body {	background: #f7f7f7;overflow: auto;}

img {
	display: block;
	border: 0;
	max-width: 100%;
	height: auto
}
:focus {/* remember to define focus styles! */
	outline: 0;
}
h1, h2, h3, h4, h5, h6 {font-weight: 800}

h1 {font-size: 2.2em;line-height: 1em;clear: both;}
h2 {font-size: 1.6em;line-height: 1.2em;clear: both;}
h3 {font-size: 1.4em;line-height: 1em;clear: both;}
h4 {font-size: 1.2em;line-height: 1em;clear: both;}

.thinCenterTitle { font-weight:300; text-align:center}

h2 a {color: #54c78e;transform: scale(1);display: block}

h2 a:hover {
	transform: scale(0.98);
	opacity: .8;
	text-decoration: none
}
p {
	margin-bottom: 1.625em;
	line-height: 175%;
	font-size: .9em
}
a, a.icon path, #homelogo img, .block, .wpml-ls, #homelogo, h1, #news .article, #news .article a:before, h3, h2, .button-wrap,  #primary, #primary li:before, #primary li:after, .owl-nav button, .button, .button:after, .mix, .wp-block-button__link, .selecting:before, .selecting:after {
	-webkit-transition: all .3s linear;
	transition: all .3s linear;
}
.wp-block-button__link,
.wpContent.bluebg a.wp-block-button__link,
.wp-block-button__link:visited,
.wpContent.bluebg a.wp-block-button__link:visited { color:#79c8eb; text-decoration:none; transform: scale(1)} 
.wp-block-button__link:hover,
.wpContent.bluebg a.wp-block-button__link:hover { transform: scale(1.02)} 

.wpContent  > *,
.wpContent div  > *{ max-width:100%}

a {	text-decoration: none;}
a:focus, a:active, a:hover {text-decoration: underline;}
.wpContent a { color:#79c8eb}
.wpContent a:visited { color: #4490b1}

.wpContent.bluebg a { color:#364042}
.wpContent.bluebg a:visited { color:#364042}

.article ul, ol, #sidebar ul {	margin: 0 0 1.625em 2.5em;}
.article ul, .sidebar ul {list-style: square;}
.article ol {list-style-type: decimal;}
.article ol ol {list-style: upper-alpha;}
.article ol ol ol {list-style: lower-roman;}
.article ol ol ol ol {list-style: lower-alpha;}
.article ul ul, ol ol, ul ol, ol ul {margin-bottom: 0;}

strong, #ticket {font-style: normal;font-weight: 700;}
em {font-style: italic;	font-weight: 400;}
em strong, strong em {font-style: italic;font-weight: 700;}

.videoOverlay p, .subtitleBlue { font-weight:300; font-size:1.8em; color:#79c8eb; margin-bottom: 1em; line-height: 125%;}

.imgSmallScreen {display:none}


/*

------- B U T T O N S -------

*/

.button { color:#07111c; border-radius: 8px;padding: 12px 16px; font-weight: 500; position:relative}
.button:hover { text-decoration:none}
.ticketsButton { background:#fff165;overflow:hidden;padding: 12px 36px;display: inline-block;}
.ticketsButton:hover {padding: 12px 60px 12px 12px;}
.ticketsButton:after { content:'';  background:#e0d241 url(gfx/ticket.svg) center center no-repeat; position:absolute; left:100%; top:0; width:48px; height:100%}
.ticketsButton:hover:after { left: calc(100% - 48px);}
.moreButton { background:#f4307f}
.ptButton { background:#f4307f; color:#fff; border-radius: 8px;padding: 10px 30px; font-weight: 800; text-transform: uppercase; display:block; margin-bottom:30px; height:120px; position:relative;}
.ptButton .thmb { width:125px; height:100%; position:absolute; left:4px; top:0}
.ptButton .thmb img { position:absolute; height:84%;top:50%;left:50%; transform:translate(-50%,-50%)}
.ptButton span { position:absolute;top:50%;left:130px; transform:translateY(-50%); width: calc(100% - 145px)}

.close { width:33px; height:33px; cursor:pointer}
.close:before, .close:after { content:''; width:40px; height:6px; background:#fff; border-radius:6px; transform:rotate(-45DEG); display: block;  position: absolute; top:13px; left:-4px}
.close:after { transform:rotate(45DEG)}

.owl-carousel {overflow-x: hidden;}
.owl-nav button.owl-prev span:before, .prev:before { content:''; display:block; width:30px; height:6px; background:#f4307f; border-radius:4px; transform:rotate(-45DEG); margin-top:7px}
.owl-nav button.owl-prev span:after, .prev:after { content:''; display:block; width:30px; height:6px; background:#f4307f; border-radius:4px; transform:rotate(45DEG);margin-top:-7px}
.owl-nav button.owl-prev:hover, .prev:hover { transform:translateX(-4px) }

.owl-nav button.owl-next span:before, .next:before { content:''; display:block; width:30px; height:6px; background:#f4307f; border-radius:4px; transform:rotate(45DEG); margin-top:7px}
.owl-nav button.owl-next span:after, .next:after { content:''; display:block; width:30px; height:6px; background:#f4307f; border-radius:4px; transform:rotate(-45DEG);margin-top:-7px}
.owl-nav button.owl-next:hover, .next:hover { transform:translateX(4px) }

.mc-button { position: relative;}
.btn {
	overflow:hidden;
	width: 60px;
	height: 44px;
    background: none;
    display: inline-block;
	text-indent: 9999em;
	background:#f4307f;
    position: absolute;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
	background: #f4307f url(https://i.cloudup.com/gBzAn-oW_S-2000x2000.png) no-repeat center center;
	cursor:pointer;
	border:0;
	background-size:80%;
}


.menu a{
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    position: relative;
    overflow: hidden;
  padding:10px 0;
}
.menu a:before {
    content: "";
    position: absolute;
    z-index: -1;
    left: 0;
    right: 100%;
    bottom: 0;
    background: #fff;
    height: 4px;
    -webkit-transition-property: right;
    transition-property: right;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}
.menu a:hover:before, .menu a:focus:before, .menu a:active:before {
    right: 0;
}

/*

------- L A Y O U T -------

*/

#top { position:fixed;top:0;left:0;right:0;width: 100vw; z-index:3;
	background: -moz-linear-gradient(top,  rgba(54,64,66,0.8) 0%, rgba(54,64,66,0.8) 41%, rgba(54,64,66,0) 100%); 
	background: -webkit-linear-gradient(top,  rgba(54,64,66,0.8) 0%,rgba(54,64,66,0.8) 41%,rgba(54,64,66,0) 100%); 
	background: linear-gradient(to bottom,  rgba(54,64,66,0.8) 0%,rgba(54,64,66,0.8) 41%,rgba(54,64,66,0) 100%); 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc364042', endColorstr='#00364042',GradientType=0 ); /* IE6-9 */
}
.scrolled #top { background: #364042;padding:5px 0; /* FF3.6-15 */	filter: none; /* IE6-9 */}
.scrolled .logo {font-size: 1em;}
.scrolled .logo span { display:inline;}
.scrolled .logo span.three { display:inline; margin-left:10px;font-size: 1em;}
.scrolled #primary {margin-top:6px}

.logo { color:#fff; text-transform:uppercase;font-family: superclarendon, serif;font-weight: 900;font-style: normal; text-align:center;font-size: 1.5em;line-height: 110%;}
.logo a { color:#fff;display:block;float: left; margin-top: 10px;z-index: 98; position: relative;}
.logo a:hover { text-decoration:none}
.logo span { display:block}
.logo a .three {color:#79c8eb;font-size: .9em;}

#primary {
	font-size:.9em;
	font-style: normal;
	font-weight: 300;
	float:right;
	margin-top: 30px;
}
#primary ul {float:right;}
#primary ul a{ text-decoration: none; font-style:normal}
#primary ul, #primary ul ul, #primary ul li {list-style-type: none;}
#primary ul li.menu-item { float: left; display:block; margin-left:12px; position:relative; cursor:pointer}
#primary li a {color: #fff; padding: 4px 0; display:block; }
#primary ul li.menu-item a:hover, #primary ul li.current-menu-item a, #primary ul li.current-menu-parent a, #primary li:hover a, #primary li li:hover a {color: #fff;}
#primary li.menu-item-has-children { padding-right: 18px; position:relative}

#primary li.menu-item-has-children:before,
#primary li.menu-item-has-children:after,
.selecting:before, .selecting:after { content:''; position:absolute; width:2px; height:10px; top:8px;  background:#fff;  border-radius:2px; cursor:pointer;    z-index: 1;}
#primary li.menu-item-has-children:after,
.selecting:after {  right:6px;transform:rotate(-45deg); }
#primary li.menu-item-has-children:before,
.selecting:before {right:0;transform:rotate(45deg);}
#primary li.menu-item-has-children a:before {  display: none }
#primary li.menu-item-has-children ul li a:before {  display: block }

#primary li.menu-item-has-children:hover:after {transform:rotate(45deg) }  
#primary li.menu-item-has-children:hover:before {transform:rotate(-45deg) }
/*
#primary li.menu-item-has-children:before,
#primary li.menu-item-has-children:after,
.filterSet fieldset:before, .filterSet fieldset:after { content:''; position:absolute; width:2px; height:10px; top:8px;  background:#fff;  border-radius:2px; cursor:pointer}
#primary li.menu-item-has-children:after, .filterSet fieldset:after {  right:7px;transform:rotate(-45deg); }
#primary li.menu-item-has-children:before, .filterSet fieldset:before {right:0;transform:rotate(45deg);}

#primary li.menu-item-has-children:hover:after, .filterSet fieldset:focus:after {transform:rotate(45deg) }  
#primary li.menu-item-has-children:hover:before, .filterSet fieldset:focus:before {transform:rotate(-45deg) }
*/
#primary ul li.menu-item ul, #primary ul li.menu-item ul li.menu-item ul{ display: none; }
#primary ul li.menu-item:hover ul { display: block;position: absolute;margin-top:0; left:-5px; top:100%}
#primary ul li.menu-item ul li.menu-item:hover ul { display: block;position: absolute; margin-top:0;left:100%; top:0}
#primary ul li.menu-item ul li {float:none; margin-left:0 }
#primary ul li ul li a { display: block; padding:10px;border: none; background: #364042;}
#primary ul li ul li a:hover, #primary ul li ul li a:hover {color: #26b8e3 !important;background-color: #222!important;}

.nav-icon {display:none;  width: 40px; top:5px; right:10px; position:absolute; z-index: 99; cursor:pointer}

.nav-icon:after, 
.nav-icon:before, 
.nav-icon div {
  background-color: #fff;
  border-radius: 3px;
  content: '';
  display: block;
  height: 4px;
  margin: 5px 0;
  transition: all .2s ease-in-out;
}
.nav-icon.active:before { transform: translateY(9px) rotate(135deg);}
.nav-icon.active:after { transform: translateY(-8px) rotate(-135deg);}
.nav-icon.active div { transform: scale(0);}

.content {     padding: 50px 0 0 0;}
.content::first-letter { font-size: 200%; color: #79c8eb; font-weight:800}
.page-id-187 .page-content { column-count: 2; column-gap: 40px; margin-bottom:40px;}
.page-id-187 .page-content hr { -webkit-column-break-before:always; column-break-before: always; border:0 } 
.page-id-187 .content::first-letter { font-size: 100%; color: #364042; }
.page-id-187 .page-content h2 { text-align:left; margin-top: auto;}

.page-id-187 .page-content > * {width: auto; max-width:100%; clear:none; padding:0}

.tabbed { color:#f4307f; position: relative;}
.tabbed a { position: absolute; left: 200px;}


.span_4-2:nth-child(odd) .ptButton {margin-right:15px}
.span_4-2:nth-child(even) .ptButton {margin-left:15px}
.home .ptButton {}

.videoWrapper {
	/* background: #1f1c1c; */
	height: 100vh;
}
#video {
	position: absolute;
	left: 0px;
	right: 0px;
	width: 100%;
	height: 100vh;
	overflow: hidden;
	z-index: 1;
	/* background: #1f1c1c; */
}
#video video {
	min-width: 100%;
	min-height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 1;
	webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	-o-object-fit: fill;
	-moz-object-fit: fill;
	-webkit-object-fit: fill;
	object-fit: fill;
	opacity: 0.8;
}
#ytspsp { position:absolute; width:100vw; height:100vh; left:0;top:0}
.videoOverlay { position:absolute; width:25vw; top:50%; right:10vw; transform: translateY(-50%); background:rgba(55, 64, 66, 0.8); padding:3vw; z-index:2; color:#fff; text-align:center}
.videoOverlay img { margin:0 auto 20px auto}

.section {position: absolute;height: 100vh;	left: 0px;	right: 0px;	overflow: hidden}

.filterHeader { text-align:center; font-weight:300; margin-bottom:20px}

.itemtxt { position:absolute;width:90%; max-width:640px; top:50%;left:50%; transform:translate(-50%,-50%);background:rgba(55, 64, 66, 0.7); padding:3vw; z-index:2; color:#fff; box-sizing:border-box}
.itemtxt h2 {font-size: 2.2em;}
.itemtxt a, .itemtxt a:hover { text-decoration:none}
.itemtxt a h2 { color:#fff; text-decoration:none}
.itemtxt h2 a:hover {text-decoration:none}
.itemtxt .moreButton {  float: right;}
.itemtxt .moreButton:hover {  margin-right:-4px;}


.owl-nav button, .spsp .owl-carousel .owl-nav button { position:absolute; top:50%; color:#f4307f; font-size:3em}
.owl-nav button.owl-prev { position:absolute; left:50%; margin-left:-336px}
.owl-nav button.owl-next { position:absolute; left:50%; margin-left:309px}
.owl-nav button span { font-size:0}



.owl-dots {  text-align: center;}
.spsp button.owl-dot {
    display: inline-block;
    height: 12px;
    width: 12px;
    border-radius: 12px;
    border: 4px solid #f4307f !important;
	margin:5px
}
.spsp button.owl-dot.active { background: #f4307f }

#footer { background:#364042; color:#fff; padding-top:50px; margin-top: 50px;}
#footer .col {margin-bottom:20px}
#footer .col h2 {margin-bottom:10px}
#footer .menu { list-style-type:none}
#footer .menu li { margin: 2px 0}
#footer .menu a { color:#d8d8d8; text-decoration:none;}
#footer .general { text-align:center}
#footer .general img { max-width:80%; margin:auto}
.general .logo span { display:block;}
.scrolled #footer .logo { font-size:1.8em; margin-top:10px;margin-bottom: 20px;}
.desc.subtitleBlue { margin-bottom:0}
#footer input#mce-EMAIL {	background:#fff;color:#000; width:100%; border-top-right-radius:0; border-bottom-right-radius:0;}
.formwrap {position: relative; width: 94%;min-height: 40px;
}
.icons a { display:block; float:left; width:40px; height:40px; border-radius:50%; margin:0 10px 10px 0; background-color:#f4307f; background-repeat:no-repeat; background-position:center center;background-size:100% }
.icons a:hover { transform:scale(1.1); background-color:#f2478c  }
.icons a.facebook { background-image: url(gfx/icon-facebook.svg);background-position:center 0; }
.icons a.instagram { background-image: url(gfx/icon-instagram.svg); }
.icons a.youtube { background-image: url(gfx/icon-youtube.svg) ; }
.icons a.bm { background-image: url(gfx/icon-bm.svg);background-size:110% }

.mc-field-group {width: calc(100% - 60px); overflow: hidden; float: left;}
.mc-button {
    position: absolute;
    right: 0;
    width: 60px;
    height: 44px;
    background: #f4307f;
    border-bottom-right-radius: 8px;
    border-top-right-radius: 8px;
}
.spsp #mc_embed_signup div.mce_inline_error {background: #cd3070; border-radius: 8px;font-size: .9em;font-weight: 500;}
.credits { font-size:.8em; color:#929292; margin: 0; text-align:center}
.credits a { color:#929292; font-weight: 500}
/*
++++++++++++++ P A G E ++++++++++++++
*/
header#header {position: relative; width: 100%; padding: 0; overflow: hidden;}
.headerMeta {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    color: #fff;
    background: rgba(0,0,0,0.7);
    padding: 40px;
}
.pageHeader img { max-width:none; min-width:100%}
.content:after { content:''; display:block; clear:both}
.intro {  font-size: 2em;  font-weight: 800; line-height: 130%; color:#364042;margin-bottom: .75em;}
.content .intro::first-letter { font-size: 200%; color: #79c8eb; font-weight:800}
.page-content ul, .modal-content ul { list-style-type: none;    margin-bottom: 1.625em;}
.page-content li, .modal-content li { padding-left:20px; position:relative; margin:2px auto;font-size: .9em;}
.modal-content .wp-block-gallery li, .page-content .wp-block-gallery li {padding-left:0;}
.modal-content .wp-block-gallery li:before, .page-content .wp-block-gallery li:before { display:none}
.modal-content .wp-block-gallery li:after, .page-content .wp-block-gallery li:after { display:none}
.modal-content li {display: table;}

.page-content li:before,
.page-content li:after,
.modal-content li:before,
.modal-content li:after {content:''; position:absolute; width:2px; height:8px; left:0;  background:#f4307f;  border-radius:2px; cursor:pointer;    z-index: 1;}
.page-content li:before, .modal-content li:before {top:3px;transform:rotate(-45deg);}
.page-content li:after, .modal-content li:after {  top:8px;transform:rotate(45deg); }

.page-content .wp-block-gallery li { padding-left: initial;}

.page-content .wp-block-gallery li:before,
.page-content .wp-block-gallery li:after { display:none}

.page-content h2 { text-align:center; margin-top:40px; margin-bottom:40px; color:#364042; font-size:2em}
.page-content a, .page-content a:hover {color:#79c8eb}

#demonstraties { margin-bottom:80px}
.mix { float:left; width:23%; margin:1%;text-align: center;transform:scale(1);line-height:100%}
.mix:hover { background:#fff}
.mixThumb { width:90%;padding-top:90%; position:relative; margin:10px auto}
.mixThumb img { position:absolute; width:auto; max-width:100%; max-height:100%; top:50%;left:50%; transform: translate(-50%,-50%)}
.mix:hover { background:#fff; transform:scale(1.02); text-decoration:none}
.mix a, .mix a h2, .mix a span, .mix a:hover, .mix a:hover h2, .mix a:hover span, a.demonstratiemodal:hover,
.mix a:visited, .mix a:visited h2 { color:#000; text-decoration:none; }
.mixMeta { min-height: 110px; padding-bottom: 5px;}
/* #demonstraties .mix:nth-child(4n+1) { clear:left}
.mixMeta span:after { content:'-'; margin: auto 4px; } */
.mixMeta span.moretxt, .mix a span.moretxt, .mix a:hover span.moretxt { display:block; color:#79c8eb}
.mixMeta span:last-child:after { display:none}
.mix a h2 {line-height: 100%;}

.single-deelnemers #header,
.single-toernooi #header { background:#364042; padding:80px 0 40px 0 ; text-align:center}
.single-deelnemers #header h1,
.single-toernooi #header h1 { color:#fff}
/* The Modal (background) */
#modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 99; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: hidden; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.6); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
    background-color: #fff;
    margin: auto;
    padding: 20px;
    width: 80vw;
    height: 80vh;
    position: fixed;
	z-index: 120;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%) translateZ(0) translate3d(0,0,0);
    max-width: 769px;
    text-align: center;
    border-radius: 8px;
    overflow-y: scroll;
    overflow-x: hidden;
	box-sizing: border-box;
    backface-visibility: hidden;
    -webkit-font-smoothing: subpixel-antialiased;
	-webkit-overflow-scrolling: touch;
    overflow-scrolling: touch;
}

body.modalOpen {
    overflow: hidden;
}

/* The Close Button */
.modalClose { position:absolute; bottom:90vh; left:90vw; margin: -60px -60px auto auto}

.modalnav { position:absolute; top:50%; margin-top:-10px}
.modalnav.prev { right:90vw;}
.modalnav.next { left:90vw;}
.prev:after, .next:after { margin-top: 11px;}

.modal-content img { width: 80%; max-width: 340px;  margin: auto;}

.content.deelnemer { padding-top:0; background:#79c8eb; color:#fff;position: relative;  margin-bottom: 40px;}
.deelnemer .columnLeft {padding:40px 20px 40px 0 }
.deelnemer .columnRight {padding:40px 0 40px 20px }
.postNav a.prev { position:absolute;top:50%; right: calc(50% + 500px); }
.postNav a.next {position:absolute;top:50%; left: calc(50% + 500px);} 
/*
++++++++++++++ F O R M S ++++++++++++++
*/
::-webkit-input-placeholder {color:#fff; }
:-moz-placeholder { color:#fff; }
::-moz-placeholder { color:#fff;}
:-ms-input-placeholder {color:#fff; }
input, textarea {-webkit-appearance: none; border-radius:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
input[type=text],
input[type=email],
input[type=password] {
	color:#000;
	font-size:1em; 
	font-weight:500; 
	border:0;
	line-height:36px;
	background: #dfdfdf;
	border-radius:8px;
	padding: 4px 10px;
	box-sizing:border-box;
}
textarea {
	padding-left: 3px;
	font-family:"proxima-nova",sans-serif; 
	font-weight:500; 
	width: 99%;
}
input[type=text] {
}
select { background:#f4307f; padding:13px; box-sizing:border-box;border: none; border-radius: 8px; color: #fff;position:relative; font-size:1em; cursor:pointer;-webkit-appearance: none;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}

.selecting:before { right: 12px; top:16px} .selecting:after { right: 19px; top:16px}
.selecting.open:after {transform:rotate(45deg) }  
.selecting.open:before {transform:rotate(-45deg) }

.filterWrap { clear:both; padding-top:15px}
.filterSet { text-align:center}
.filterSet fieldset { display:inline-block; width:31%; position:relative}
.filterSet fieldset select { width:100%}
.typeahead input { width:100%; margin:0; cursor:pointer }


/*!
 * Gridpak Beta
 */
  
/* Reusable column setup */
.col {
    border:0px solid rgba(0,0,0,0);
    float:left;
	margin:0;
	padding:0;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    -moz-background-clip:padding-box !important;
    -webkit-background-clip:padding-box !important;
    background-clip:padding-box !important;
}
.row, .row-pad, .row-wide, .page-content > *, .page-id-187 .page-content {width: 94%;margin: auto; clear:both;box-sizing: border-box;}
.row:after, .row-pad:after, .row-wide:after { content:''; display:block; clear:both;}
.row .col:first-child, .row-pad .col:first-child, .row-wide .col:first-child {margin-left:0;}
.wp-block-embed__wrapper { width:100%; position: relative; overflow: hidden; margin:auto;  padding-top: 43%;}
.wp-block-embed__wrapper iframe {position: absolute;top: 0;left: 0;width: 100%; height: 100%;border: 0;}

.page-content > p, .page-content > ul { margin-bottom:1.5em}
.page-content >  .wp-block-embed { width:100%; max-width:auto; padding:0; background:#364042}
.wp-block-gallery.columns-3 .blocks-gallery-image figcaption,
.wp-block-gallery.columns-3 .blocks-gallery-item figcaption {
    width: calc(100% - 20px);
}


/* iphone 4 */
@media only screen and (max-height: 480px) {

}

/* Mobiel staand */
@media only screen and (max-width: 769px) {

	.row-pad, .page-content > * {width: 92%;padding-left:4%; padding-right: 4%;}
	.page-id-187 .page-content > * {width: auto; max-width:100%; clear:none; padding:0}
	.span_4-1 {width:100%;}
    .span_4-2 {width:100%;}
    .span_4-3 {width:100%;}
	.span_4-4 {width:100%;}
	.span_3-1 {width:100%;}
    .span_3-2 {width:100%;}
    .span_3-3 {width:100%;}
	
	p { font-size: 1.1em;}
	#top {  background: #364042;  padding: 5px 0;  filter: none;}
	.logo { font-size:1em}
	.logo a {margin: 8px 0; }
	.logo span { display:inline;}
	.logo span.three { display:inline; margin-left:10px;font-size: 1em;}

	
	h1 { font-size: 1.8em; line-height: 1em;}
		
	#main-menu {width: 100%;position: fixed; top: 0; left: 0; right: 0; margin-bottom:0;height: 36px; z-index: 99;}
	.nav-icon {	display:block;}
	#primary {clear:both; position: absolute; margin: 0; width: 100%; background: #364042; left: 0; right: 0; top:0; border:0; z-index:97; padding-top:100px }
	#primary ul { float:none}
	#primary ul li.menu-item {margin:0; display: block; width:100%; border-top:1px solid #fff; text-align:center;}
	#primary ul li.menu-item a { display: block; background: #364042; color:#fff; padding: 18px 0;font-size: 4.1vw;margin: 0 2vw;}
	#primary ul li.menu-item:before a { display: block;background: #26b8e3; color:#fff; padding: 14px 0;}
	#primary ul li.menu-item a:hover, #primary ul li.current-menu-item a, #primary ul li.current-menu-parent a, #primary li:hover a, #primary li li:hover a { color:#fff}
	#primary ul li.menu-item ul li { border:0}
	#primary ul li.menu-item a::before, .archive .article h2 a::before { display:none}
	#menu-primary { background:#333; width:100%}
	#primary ul li.menu-item:hover ul {position: relative; }
	
	#primary li.menu-item-has-children:after { left: calc(50% + 73px); right:auto;top: 16px;}
	#primary li.menu-item-has-children:before { left: calc(50% + 80px); right:auto;top: 16px;}
	.imgSmallScreen {display:block}
	.imgBigScreen {display:none}
	.filterSet fieldset, .typeahead { display:block !important; width:80%; margin:0 auto 15px auto}
	.modal-content {  transform:translateX(-50%) translateY(-46%) translateZ(0) translate3d(0,0,0)}
	.modalClose {   bottom: 87vh;}
	
	.videoOverlay { width: 50vw;right: 25vw;}
	.videoOverlay p, .subtitleBlue { font-size: 1.2em;}
	.videoOverlay img { width: 70%}
	.headerMeta {   padding:28px;}
	.content { padding-top: 50px;}
	.intro {  font-size: 1.6em;}
	
	.itemtxt h2 { font-size: 1.6em;}
	.owl-carousel .button { padding: 6px 10px;}
	.owl-nav button.owl-prev { left: 2px;  margin-left: 0;transform: scale(0.8); margin-top:-10px;}
	.owl-nav button.owl-next {left: auto; margin-left: 0; right: 2px; transform: scale(0.8);margin-top:-10px;}	
	.ptButton {height: 110px;}
	.ptButton .thmb { width:101px;}
	.span_4-2:nth-child(even) .ptButton,
	.span_4-2:nth-child(odd) .ptButton { margin:auto 0 30px auto}
	.ptButton span {left:120px; width: calc(100% - 135px)}
	#footer .col { }

	.mix {width: 48%;}
   	.mix h2 {  font-size: 1.4em;}
	
	.page-id-187 .page-content {  column-count: auto; column-gap: 0;}
	.tabbed a {position: relative; left: auto;  display: block;}
	
	.deelnemer .columnRight {   padding: 40px 0;}
	.credits {   font-size: 1.1em;}
	#footer {  text-align: center;}
	.icons a {  display: inline-block;    float: none;}
	.credits span{ display:block}
}
/* Mobiel Liggend */
@media only screen and (min-width: 480px) and (max-width: 769px) {

#video .videoOverlay { width: 65vw; right: auto; left: 17.5vw;}
#video .videoOverlay img { width: 34%; float: left;}
#video .videoOverlay p { float: right; width: 50%;}
#video .ticketsButton { left: 50%;  position: relative;}
#video h1 { float: right; clear: right;  width: 50%;}
#primary ul li.menu-item a {    font-size: 2.4vw;}

}

/* tablet staand */
@media screen and (min-width: 770px) and (max-width: 959px) {

	.row-pad, .page-content > * {width: 92%;padding-left:4%; padding-right: 4%;}
	.page-id-187 .page-content > * {width: auto; max-width:100%; clear:none; padding:0}
	.span_4-1 {width:50%;}
    .span_4-2 {width:50%;}
    .span_4-3 {width:75%;}
	.span_4-4 {width:100%;}
	.span_3-1 {width:33.3333%;}
    .span_3-2 {width:66.6667%;}
    .span_3-3 {width:100%;}
	.postNav a.prev { right: auto; left:5px; transform:scale(.8)}
	.postNav a.next { left: auto; right:5px; transform:scale(.8)}

}

@media screen and (min-width: 960px) and (max-width: 1259px) {

	.row-pad, .page-content > * {width: 92%;padding-left:4%; padding-right: 4%;}
	.page-id-187 .page-content > * {width: auto; max-width:100%; clear:none; padding:0}
	.span_4-1 {width:50%;} .wpContent .span_4-1{ width:25%}
    .span_4-2 {width:50%;}
    .span_4-3 {width:50%;} .wpContent .span_4-3{ width:75%}
	.span_4-4 {width:100%;}
	.span_3-1 {width:33.3333%;}
    .span_3-2 {width:66.6667%;}
    .span_3-3 {width:100%;}
	.modalClose { left: calc(50% + 388px);}
	.modalnav.prev { right: calc(50% + 388px);}
	.modalnav.next { left: calc(50% + 388px);}
	.postNav a.prev { right: auto; left:5px; transform:scale(.8)}
	.postNav a.next { left: auto; right:5px; transform:scale(.8)}

}

@media screen and (min-width: 1260px) {


	.row, .page-id-187 .page-content {max-width: 960px;}
	.row-wide {max-width: 1240px;}
	.row-pad, .page-content > * {max-width: 820px;padding-left:80px; padding-right: 80px;}
	.headerMeta.row-pad { max-width:660px;}
	.page-id-187 .page-content > * {width: auto; max-width:100%; clear:none; padding:0}
	.page-id-187 .page-content  { margin-bottom:40px !important}
	.page-content > .wp-block-gallery  { width:100%; max-width:none; margin-bottom:1em}
	.page-content > .wp-block-embed  { width:100%; max-width:none; background:#364042; margin-bottom:1em}
	.wp-block-embed__wrapper {max-width: 800px;}	

	.span_4-1 {width:25%;}
    .span_4-2 {width:50%;}
    .span_4-3 {width:75%;}
	.span_4-4 {width:100%;}
	.span_3-1 {width:33.3333%;}
    .span_3-2 {width:66.6667%;}
    .span_3-3 {width:100%;}
	.modalClose { left: calc(50% + 388px);}
	.modalnav.prev { right: calc(50% + 388px);}
	.modalnav.next { left: calc(50% + 388px);}

}