/*MAIN STYLES*/

/* Reset styles */
html, body, body div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  	margin: 0;
  	padding: 0;
  	border: 0;
  	font-size: 100%;
  	vertical-align: top;
	}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  	display: block;
	}

* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

/*
.header-container .buyTicketsLink r.1306 - display none
.header-container .shopIconTemp r.1305
.indexNL #mobileMenu .shopIconTempMobNL r.1327

*/

@font-face {
    font-family: 'GarageGothic-Black';
    src: url('fonts/GarageGothic-Black.eot');
    src: url('fonts/GarageGothic-Black.eot?#iefix') format('embedded-opentype'),
         url('fonts/GarageGothic-Black.woff2') format('woff2'),
         url('fonts/GarageGothic-Black.woff') format('woff'),
         url('fonts/GarageGothic-Black.ttf') format('truetype'),
         url('fonts/GarageGothic-Black.svg#GarageGothic-Black') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'GarageGothic-regular';
    src: url('fonts/GarageGothic-Regular.eot');
    src: url('fonts/GarageGothic-Regular.eot?#iefix') format('embedded-opentype'),
         url('fonts/GarageGothic-Regular.woff2') format('woff2'),
         url('fonts/GarageGothic-Regular.woff') format('woff'),
         url('fonts/GarageGothic-Regular.ttf') format('truetype'),
         url('fonts/GarageGothic-Regular.svg#GarageGothic-regular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Sofia-pro-light';
    src: url('fonts/329E65_2_0_Sofia_Pro_light.eot');
    src: url('fonts/329E65_2_0_Sofia_Pro_light.eot?#iefix') format('embedded-opentype'),
         url('fonts/329E65_2_0_Sofia_Pro_light.woff2') format('woff2'),
         url('fonts/329E65_2_0_Sofia_Pro_light.woff') format('woff'),
         url('fonts/329E65_2_0_Sofia_Pro_light.ttf') format('truetype'),
         url('fonts/329E65_2_0_Sofia_Pro_light.svg#Sofia-pro-light') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Sofia-pro-regular';
    src: url('fonts/329E65_3_0_Sofia_Pro_regular.eot');
    src: url('fonts/329E65_3_0_Sofia_Pro_regular.eot?#iefix') format('embedded-opentype'),
         url('fonts/329E65_3_0_Sofia_Pro_regular.woff2') format('woff2'),
         url('fonts/329E65_3_0_Sofia_Pro_regular.woff') format('woff'),
         url('fonts/329E65_3_0_Sofia_Pro_regular.ttf') format('truetype'),
         url('fonts/3329E65_3_0_Sofia_Pro_regular.svg#Sofia-pro-regular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Sofia-pro-bold';
    src: url('fonts/329E65_1_0_Sofia_Pro_bold.eot');
    src: url('fonts/329E65_1_0_Sofia_Pro_bold.eot?#iefix') format('embedded-opentype'),
         url('fonts/329E65_1_0_Sofia_Pro_bold.woff2') format('woff2'),
         url('fonts/329E65_1_0_Sofia_Pro_bold.woff') format('woff'),
         url('fonts/329E65_1_0_Sofia_Pro_bold.ttf') format('truetype'),
         url('fonts/329E65_1_0_Sofia_Pro_bold.svg#Sofia-pro-regular') format('svg');
    font-weight: normal;
    font-style: normal;

}


.divgumbuttons {line-height:1.0em}
.gbPos {position:absolute; top: -2px; left: 8px; width: 150px; height: 15px; z-index: 100}


html, body {margin:0; padding:0;height:100%;}
body {
	font-family: 'Sofia-pro-light', Verdana, Arial, sans-serif;
	font-weight:normal;
	font-size: 20px; 
	line-height: 1.5em;
	color: #000;
}

.container {min-height:100%; position:relative;}
.wrapper {padding-bottom:450px;}
.bgGrijs {background: #e6e6e6; padding: 50px 0}

/* Contentwrapper vaste breedte ================================================== */
.row { width: 1140px; margin: 0px auto 0px auto; position: relative; text-align: left}
.filmrow { width: 1140px; margin: 0px auto 0px auto; position: relative; text-align: left}
.row  .col-66 .filmrow {width: 100%}

.row::after {
    content: "";
    clear: both;
    display: block;
}

.col-33 .row {width: 100%}

/* Kolommen ================================================== */
[class*="col-"] {
    float: left;
	padding: 20px 0 20px 0;
}

.col-25 {width: 22.75%; margin-right: 3%;}
.col-25:last-child, .col-33:last-child, .col-50:last-child, .col-75:last-child {margin-right: 0}
.col-50 .col-25 {width: 48%; margin-right: 4%}
.col-50 .col-25:last-child {margin-right: 0}
.col-33 {width: 31.333%; margin-right: 3%;}
.col-50 {width: 48.5%; margin-right: 3%}
.col-66 {width: 65.666%}
.col-75 {width: 74.25%;}
.col-75:last-child {width: 74.5%}
.col-100, .col-25 .col-25 {width: 100%}

.halfColumn {width: 45%; float: left; margin: 0px 0px 10px 0px}

/* Header ================================================== */
#header {position: relative}
/*.logo {position: absolute; top: 0px; left: 0px;}*/
.logoSub {/*width: 450px;*/ position: absolute; top: 0; left: 0;}
.logoSub a {cursor: pointer}


/* Fixed header - Scrollmenu*/
.header-container.fixed 					{ position: fixed; top: 0px; z-index: 400; width:100%; /*width: 1140px; left: calc(50% - 1140px /2);*/ background: #FFF; border-bottom: 1px solid #666; }
.header-container.fixed #header		{ width: 1140px; /*left: calc(50% - 1140px /2);*/ margin: 0 auto; }
.header-container.fixed #topMenu	{ display: none; }

.header-container.fixed .langExtra {
    position: relative;
    top: 0px;
    right: 0px;
    display: inline-block;
    float: right;
}

.header-container.fixed .lang			{ margin: 36px 6px 0 0;  }

.header-extra-padding							{ padding-top: 236px; }
.hide															{ display: none; }
ul.mobile_menu										{ display: block; opacity: 1; position: absolute; visibility: visible;}


.menu-button-scroll								{ display: none; float: right; margin: 40px 13px 0; cursor: pointer;}
.menu-button-scroll:hover .fa					{ color: #ffcc00; }
.header-container.fixed	 .menu-button-scroll { display: inline; }

.scrollmenu-container							{ display: none; position: absolute; top: 90px; width: 340px; /*heeight: 600px;*/ right: 0px; z-index: 100; background: #ffcc00; }
.scrollmenu-container.open				{ display: block; }
.scrollmenu-container	ul					{ margin: 0 0 0 0; }

.scrollmenu-container li {
    list-style: none;
    margin-left: 0px;
    font-size: 100%;
    position: relative;
    overflow: hidden;
    width: 100%;
    background: #ffcc00;
    display: block;
    padding: .4em .8em;
    font-family: 'Sofia-pro-bold',/*'GarageGothic-Black',*/ Arial, Verdana, sans-serif;
    /*text-transform: uppercase;*/
    font-weight: normal;
}

.scrollmenu-container li a {
    position: relative;
    padding: .2em .5em;
    z-index: 2;
    overflow: hidden;
    color: #000;
    /*text-transform: uppercase;*/
    text-decoration: none;
    background: #fff;
    /*border-bottom: 1px solid rgba(0, 0, 0, 0.15);*/
    font-size: 1.0em;
    font-weight: normal;
    line-height: 1.0em;
}

.scrollmenu-container li a:hover {background: #000; color: #ffcc00}
.scrollmenu-container li li a:hover {background: none; color: #fff}

/* Scorlmenu sub tweede niveau */
.scrollmenu-container li li  {
	padding: .1em .1em;
	font-family: arial;
	
}

.scrollmenu-container li li a {font-size: 1.0em; text-transform: lowercase;background: none;}


/* LEESMEER FOTO KNOP
==================================================================*/

.fotoKnop {
	min-height: 315px;
	width: 100%;
	position: relative;
	overflow: hidden;
	margin: 0px auto 10px auto;
	height: auto;
}

.fotoKnopBreed {
	max-height: 545px;		
}

.fotoKnop img {width: 100%}


.fotoKnopOverlay {
	position: absolute;
	top: 45%;
	left: 0;
	width: 100%;
	text-align: center;	
	z-index: 100;
}

.fotoKnopOverlay span {
	background: #ffcc00 url(/images/vlinder_mtm_wit.png) no-repeat top right; 	
	padding: 10px 60px 15px 15px; 
	font-family: 'Sofia-pro-bold',/*'GarageGothic-Black',*/ Arial, Verdana, sans-serif; 
	font-size: 1.5em; 
	/*text-transform: uppercase;*/
}

.fotoKnop a:link, .fotoKnop a:visited, .fotoKnop a:hover {color: #000; text-decoration: none; cursor: pointer}

/* Talen 
==================================================================*/
.lang {
	margin: 36px 10px 0 0; 
	font-weight: normal;
	font-size: 1.2em; 
	color: #ffcc00;
	font-family: 'Sofia-pro-bold',/*'GarageGothic-Black',*/ Arial, Verdana, sans-serif; 
	/*text-transform: uppercase;*/
}

.lang a:visited, .lang a:link {
	color:#000;
	text-decoration: none;
}

.lang a:active, .lang a:hover {
	color:#000;
	text-decoration: underline;
}

.langExtra {position: absolute; top: 25px; right: 0px}



.arab {
	font-size: 18px;
	text-align:  right;
}

#breadcrumb {
	width: 100%;
	padding: 0 0px 5px 0px;
	font-size: 0.7em;
	clear: both;
	margin: 0;
	color: #666;
}

#breadcrumb a:link, #breadcrumb a:visited {color: #666; text-decoration: none}
#breadcrumb a:hover {color: #666; text-decoration: underline}

.fixed #breadcrumb {display: none}

/* footer ================================================== */
.footer {position:absolute;	bottom:0; background: #000; color:#fff; height: 450px; width: 100%; padding: 15px 0; font-family: 'Sofia-pro-regular', Verdana, Arial, sans-serif; font-weight: normal; color: #fff; font-size: inherit }
.footer p {margin-bottom: 0px}
.footer a:link, .footer a:visited {color: #fff; text-decoration: none}
.footer a:hover {color: #ffcc00}
.footer h3 {color: #fff}
.footer .partnerlogo {margin-right: 20px}

/*logo's hoofdpartners in footer*/
.logoAmnesty {background: url(/images/logo-partner-amnesty-wit.jpg) no-repeat; width: 149px; height: 63px; float:left; margin: 10px 25px 0 0}
.logoAmnesty:hover {background: url(/images/logo-partner-amnesty-geel.jpg) no-repeat;}
/*.logoVfonds {background: url(/images/logo-partner-vfonds-wit.jpg) no-repeat; width: 81px; height: 64px; float:left; margin: 10px 0 0 0 }
.logoVfonds:hover{background: url(/images/logo-partner-vfonds-geel.jpg) no-repeat;}*/
.logoNPL {background: url(/images/logo-nationale-postcode-loterij-wit.png) no-repeat; width: 96px; height: 63px; float:left; margin: 10px 25px 0 0}
.logoNPL:hover {background: url(/images/logo-nationale-postcode-loterij-kleur.png) no-repeat;}


/* footer aanmelden nieuwsbrief Crossmarx*/
#nieuwsbr h3 {color: #ffcc00; margin-bottom: 20px; font-size: inherit}
#nieuwsbr .buttonNormal {background: #000; border: 3px solid #ffcc00; color: #ffcc00;}
#nieuwsbr .buttonNormal:hover {color: #fff; border-color: #fff;}
#nieuwsbr .ac_input {background: #d6d6d6; /*border: 3px solid #fff; */ padding: 12px;}

/* Social Media Volg buttons - fontawesome - icons */
.socMedVolg {margin-top: 45px}
.footer .fa {font-weight: normal; color: #fff; font-size: 2.0em; line-height: 1.6em; margin: 0 10px 0 2px;}
.footer .fa:hover {color: #ffcc00;}

/* Social media Deel buttons*/
.socMedDeel .fa {font-size: 1.2em; margin: 5px}
.socMedDeel  a:link, .socMedDeel a:visited {color: #000; }
.socMedDeel a:hover {color: #ffcc00}



/* Headers 
=========================================================================================*/
h1, h2 {font-family: 'Sofia-pro-bold',/*'GarageGothic-Black',*/ Impact, Arial, Verdana, sans-serif; /*text-transform: uppercase;*/ font-weight: normal; line-height: 0.9em}
/*h1 {font-size: 3.4em;}
h2 {font-size: 2.6em}*/
h1 {font-size: 2.4em;}
h2 {font-size: 2.0em}
.artikel h2 {margin-bottom: 10px}
h3 {font-family: 'Sofia-pro-regular', Arial, Verdana, sans-serif; font-size: 1.2em; line-height: 1.0em; color: #000; font-weight: normal}
h4 {font-family: 'Sofia-pro-regular',/*'GarageGothic-Black',*/, Arial, Verdana, sans-serif; font-size: 1.0em; /*text-transform: uppercase;*/}
h5 {font-family: 'Sofia-pro-regular', Arial, Verdana, sans-serif; font-size: 1.1em; line-height: 1.0em; color: #000; font-weight: normal}


/* BUTTONS 
================================================================*/

.ButtonNormal, .buttonNormal, input.buttonNormal {
	/*text-align: center;*/
	color: #000;
	padding: 12px 20px 12px 20px;
	margin: 20px 0px 0px 0px;
	clear: both;
	background-color: #ffc309;
	/*background-image: url('../images/zoekpijl.gif');
	background-repeat: no-repeat;
	background-position: right 3px;*/
	/*text-transform: uppercase;*/
	font-family: 'Sofia-pro-bold', Verdana, Arial, sans-serif;
	font-size: 0.78em;
	font-weight: normal;
	border: 0;
}

.ButtonNormal:hover, .buttonNormal:hover, .ButtonHigh {
	/*text-align: center;*/
	color: #ffcc00;	
	padding: 12px 20px 12px 20px;
	margin: 20px 0px 0px 0px;
	clear: both;
	background-color: #000;
	/*background-image: url('../images/zoekpijl_h.gif');
	background-repeat: no-repeat;
	background-position: right 3px;*/
	cursor: pointer;
}

a.filmSearchBackButton:link {text-decoration:none}

/* ZOEKEN 
=========================================================================*/

#zoeken {
	width: 20%;
	float:right;
	margin: 36px 0 0 0;
}

.ac_input{
	margin: 0px;
	padding: 4px;
	float:left;
	border: 1px solid #ccc;
	/*height: 18px;*/
	width: 80%;
	margin-right: 2%;
	font-size: inherit;
}

#zoeken .submit {
	background: url(../images/bt_search.png) no-repeat 0px 0px;
	text-indent:-999999em;
	cursor: pointer;
	width: 28px;
	height: 28px;
	float:left;
	border:0;
}


/* ZOEKRESULTATENPAGINA
===========================================================================*/

.xsearchKeyword , .xsearchHighlightedKeyword {
	font-weight: bold; 
	color: #000;
}

.xsearchResultsMessageContainer {
	margin-bottom: 10px;	
}

.xsearchNavbarContainer {
	margin: 10px 0px;	
}

.xsearchNavbarContainer a {margin-right: 5px;}

.xsearchResultsContainer {
	margin-bottom:5px;
	border-bottom: 1px solid #DADADA;
}

.xssearchResult {padding: 8px 0px; border-top: 1px solid #DADADA;} 

.searchResultSearchBox {margin: 10px 0px; display: block; padding: 8px 0px; border-top: 1px solid #DADADA; border-bottom: 1px solid #DADADA;}
.searchResultSearchBoxInput  {margin-right: 5px; padding: 10px; border: 1px solid #ccc; font-size: inherit}


/*zoeken in films 
=================================================================*/
.filmzoekenContainer { margin-bottom: 50px; height: 545px}
.filmzoekenContainerEducatie { margin-bottom: 50px; height: 625px}
.filmzoeken {position: absolute; top:0; left:0; text-align: center; width: 100%; height: 100% }
.filmzoeken .row {margin: 0 auto}

.filmzoekenContainer .img100 {
	max-height: 545px;
	min-height: 545px;
	min-width: 1140px;
			
	/* Set up proportionate scaling */
	width: 100%;
	height: auto;
}

.filmzoekenContainerEducatie.img100 {
	max-height: 625px;
	min-height: 625px;
	min-width: 1140px;
			
	/* Set up proportionate scaling */
	width: 100%;
	height: auto;
}

.filmzoekenLeft {
	position: relative;
	/*height: 100%;*/
	height: 545px;
}
.filmzoekenRight {
	background: #fff;
	padding: 0 0 0 20px;
	/*height: 100%;*/
	height: 545px;
}
.filmzoekenRight h3 { margin-bottom: 10px}

.filmzoekenLeft .filmzoekenOverlay {position: absolute; bottom:5%; left:0; background: #ffcc00; width: 80%; padding: 20px}

.filmzoeken .buttonNormal {margin-bottom: 20px}

/* algemene stylen ================================================== */
p {	margin: 0 0 20px 0;}

.whitespace {clear: both; position: relative; margin-bottom: 20px;}
.whitespace p:last-child {margin-bottom: 0}

hr {
	border: 0px solid #9c9c9c;
	height: 1px;
	color: #9c9c9c;
	background: #9c9c9c;
	margin:5px 13px 5px 0px;
	clear:both;
}


.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

.clr {clear: both;}
.rel {position: relative;}
.displayNon, .displayN {display: none}
.displayBlock {display: block}
.fixed{	position:fixed;}

.fltL {float: left}
.fltR {float: right}
.alignCenter {text-align: center}
.alignRight {text-align: right}

.introresp {display: none}


/* LIST ==================================================*/

ul{
margin: 0px 0px 0px 18px;
padding: 0 0 0 0;
list-style: outside;
}

ul li{
	margin: 0px;
	padding: 0px;
	/*background: url(../images/arrows.gif) no-repeat 0px 9px;*/
	/*padding-left: 12px;*/
}

ol{
margin: 0px 0px 0px 18px;
padding: 0 0 0 3px;
background: none;
}

ol li {/*padding-left: 10px; margin-left: 20px;*/ padding: 0;  background: none; }

/* LINKS ================================================== */

a, a:link	{
  color: #000;	
	text-decoration:underline;
}

a:visited {
  color: #000;
	text-decoration:underline;
}

a:hover  {
  color: #333;	
	text-decoration: underline; 
}

a:active  {
  color: #333;
	text-decoration:underline;
}

/* images ================================================== */	
.imgFloatR, .rightPos {float: right; margin: 5px 0px 12px 15px;}
.imgFloatL, .leftPos {float: left; margin: 5px 15px 12px 0px;}

.img100 {width: 100%}


/* Fotoblokken */
.fotoBLok h2, .fotoBLok .col-50 h2, .fotoBLok .col-33 h2  {position: absolute; left: 0; bottom: 10%; background: #ffcc00; padding: 10px 15px 15px 15px; margin: 0 0 30px 0}
.fotoBLok [class*="col-"] {	padding: 0px 0 30px 0;}
.fotoBLok a {color: #000}
.sticker {position: absolute; top: 10%; right: 5%; width:140px; height:140px; border-radius: 50%; display: table; overflow: hidden;}
.sticker div {display: table-row; width: 100%}
.sticker div p {display: table-cell; text-align: center; padding: 10%; vertical-align: middle; font-family: 'Sofia-pro-bold',/*'GarageGothic-Black',*/ Arial, Verdana, sans-serif; /*text-transform: uppercase;*/ font-weight: normal; font-size: 1.2em; line-height: 0.9em}
.stickerWit {background: #fff;}
.stickerGeel {background: #ffcc00;}
.noSticker {display: none}

/* gele overlay */
.fotoBLok .fotoBlokOverlay {opacity: 0; filter: alpha(opacity=0); position: absolute; top: 8%; left: 0; background: #ffcc00; width: 100%; height: 75%; padding: 50px 20px 10px 20px; color:#000;}
.fotoBLok .fotoBlokOverlay:hover {opacity: 1; filter: alpha(opacity=100);}
.fotoBLok .fotoBlokOverlay h2 {position: relative; margin: 0; padding: 0}
.fotoBLok a {text-decoration: none}

.fotoBLokTekst .col-33 h2 {bottom: 0;}
.fotoBLokTekst .fotoBlokOverlay {height: 83%;}
.fotoBLokTekst .rel {margin-bottom: 15px; }

/*artikel responsive*/
.h1Hide {margin-top: 11px}
.tekstDesktop {margin: 0 0 35px 0}
.tekstMob {margin: 0}

/* NIEUWS 
===========================================================*/
/*nieuwsoverzicht home en nieuwsoverzicht*/
/*.nieuwsOverzicht {padding: 30px 0}*/
.nieuwsOverzicht h2 span, .filmOverzicht h2 span {background: #fff; padding: 10px 15px;}
.nieuwsOverzicht h2, .filmOverzicht h2{margin-bottom: 30px}
.nieuwsOverzicht a {text-decoration: none;}
.nieuwsOverzicht .col-33:nth-child(3n+3)  {margin-right: 0}
.nieuwsOverzicht .col-33 .imgNieuwsArtikel {background: #ccc; overflow: hidden; text-align: center}
.nieuwsOverzicht .col-33 .datum, .agendaOverzicht .col-33 .datum  {font-size: 0.9em; position: absolute; bottom: 0; left: 0; background: #000; padding: 5px 10px; font-family: 'Sofia-pro-bold',/*'GarageGothic-Black',*/ Arial, Verdana, sans-serif; /*text-transform: uppercase;*/}
.nieuwsOverzicht .col-33 a {text-decoration: none}
.nieuwsOverzicht .col-33 a:link h3, .nieuwsOverzicht .col-33 a:visited h3 {text-decoration: none; background: #fff; color: #000; display: block; padding: 20px; height: 120px; overflow: hidden}
.nieuwsOverzicht .col-33  a:link .datum, .nieuwsOverzicht .col-33 a:visited  .datum  {color: #ffcc00}

.nieuwsOverzicht .col-33 .textNieuwsArtikel {display: none}
/* gele overlay
.nieuwsOverzicht .col-33 .textNieuwsArtikel {opacity: 0; filter: alpha(opacity=0); position: absolute; top: 0; left: 0; background: #ffcc00; width: 100%; height: 100%; padding: 10px 20px; color:#000; text-align: left }
.nieuwsOverzicht .col-33 .textNieuwsArtikel:hover {opacity: 1; filter: alpha(opacity=100); }
*/

.paginatie {cleae: both; margin-top: 30px}
.paginatie .volgende {font-size: 1.5em; margin-left: 25px}
.paginatie .vorige {font-size: 1.5em; margin-right: 25px}
.paginatie a, .selectedPageNum {text-decoration: none; padding: 0 7px; color: #000}
.selectedPageNum {background: #000; color: #ffcc00;}

/* zoom */
.nieuwsOverzicht .col-33 .imgNieuwsArtikel img { transition: all .8s ease-in-out; max-height: 210px; }
.nieuwsOverzicht .col-33 .imgNieuwsArtikel img:hover { 
	-webkit-transform: scale(1.05);  /* Chrome, Opera 15+, Safari 3.1+ */
	-moz-transform: scale(1.05);  /* FF3.5+ */
	-ms-transform: scale(1.05); /* IE 9 */
	-o-transform: scale(1.05);  /* Opera 10.5+ */
	transform: scale(1.05);  /* Firefox 16+, IE 10+, Opera */
	filter: progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand',
    M11=1.5320888862379554, M12=-1.2855752193730787,
    M21=1.2855752193730796, M22=1.5320888862379558);
	}
  
 /*nieuws artikel*/
 /*.nieuwsArtikel .imgNieuwsArtikel {margin-bottom: 50px}*/
 
 

/* FILM PROGRAMMA BLOKKENSCHEMA
======================================================================*/

/*.filmProgramContainer {background: #dbdddc; padding: 30px}*/

/*TABS op overzichtspagina's */
.tabs {
	margin: 20px 0px 40px 0px;
	border-bottom: 0px solid #000;
	padding-bottom: 6px;
}

.tabs a {padding: 12px 20px 12px 20px; margin-right: 20px; /*text-transform: uppercase;*/ font-weight: normal; font-family: 'Sofia-pro-bold',/*'GarageGothic-Black',*/ Arial, Verdana, sans-serif; font-size: 1.9em}
.tabs a:link, .tabs a:visited {background: #fff; color: #000; text-decoration: none; line-height: 2.5em;}
.tabs a:active, .tabs a:hover {background: #000; color: #fff; text-decoration: none; }

.tabs a.tabActive:link, a.tabActive:visited {background: #ffcc00; color: #000; }

/* TAB specificaties*/
.dagTabs .dag {/*display:none*/}
.dag {
	text-decoration: none; 
	color: #000; 
	padding: 10px 1%;
	margin: 0px 0px 35px 0px; 
	width:11%;  
	/*background: #fff;*/
	border-right: 1px solid #000;
	float: left;
	text-align: center;
	white-space: normal;
	cursor: pointer;
	font-size: 0.8em;
}

.dag h4 {font-size: 1.1em}

.dag:hover {background: #ffcc00; cursor: pointer}
.dagActive {background: #ffcc00;}


/*a:link .dag {background: #fff; cursor: pointer}
a:hover .dag {background: #ccc; cursor: pointer}*/

.dag a:link, .dag a:visited {
	text-decoration: none; 
	color: #000;
}
.dag a:active, .dag a:hover {
	text-decoration: none; 
	color: #000;
}

p.selectie {margin: 10px 0px 15px 0px; color: #e6e6e6; font-size: 0.9em; line-height: 3.2em; } /* color makes that the divider | is not visisble anymore*/
p.selectie a:visited, p.selectie a:link{ margin: 0; padding: 10px 12px; text-decoration: none; white-space: nowrap; background: #fff; }
p.selectie a:active, p.selectie a:hover{ margin: 0; padding: 10px 12px; text-decoration: none; color: #000; background: #ffcc00}
p.selectie a.selectionSelected:link, p.selectie a.selectionSelected:visited {background: #ffcc00}

.filmpage p.selectie {color: #fff}
.filmpage p.selectie a:visited, .filmpage p.selectie a:link {background: #e6e6e6}

a.selectionSelected:link,a.selectionSelected:visited {color:#000;}



/*FILMOVERZICHT
========================================================= */

.filmOverzicht {
	/*float: left;
	width: 360px;
	margin: 10px 14px 10px 0px; 
	xheight: 300px; 
	background: #fff;
	overflow: hidden;
	border-bottom: 5px solid #d5d5d5;
	color:#000*/
}

.filmOverzicht .col-33:nth-child(3n+3)  {margin-right: 0}
.filmOverzicht .col-33  {padding-bottom: 10px}

.filmOverzicht .col-33 .filmOverzichtImg, #tdProgramList .col-33 .filmOverzichtImg {
	background: #ccc; overflow: hidden; text-align: center; height: 210px
}

.filmOverzicht .col-33 .filmOverzichtImg img {height: 100%}

.filmOverzicht .col-33 .filmOverzichtKenmerken { 	margin: 0; padding: 10px 20px; background: #fff; /*height: 225px;*/ height: 160px; }
 #tdProgramList .col-33 .filmOverzichtText { 	margin: 0; padding: 10px 20px; background: #fff; height: 325px; overflow: hidden }

.filmOverzicht h3 { 	margin: 0px 0px 7px 0px; line-height: 1.0em }

.filmOverzicht a {text-decoration: none; color: #000}


/*.filmOverzicht a:link, .filmOverzicht a:visited {color: #bc1215; text-decoration: none}
.filmOverzicht a:active, .filmOverzicht a:hover {color: #000; text-decoration: none}*/

/* gele overlay*/
.filmOverzichtImg .filmOverzichtText {opacity: 0; filter: alpha(opacity=0); position: absolute; top: 15%; left: 0; background: #ffcc00; width: 100%; height: 70%; padding: 10px 20px; color:#000; text-align: left}
/*.filmOverzichtImg .filmOverzichtText {opacity: 0; filter: alpha(opacity=0); position: absolute; top: 0 left: 0; background: #ffcc00; width: 100%; height: 100%; padding: 10px 20px; color:#000; text-align: left}*/
.filmOverzichtImg .filmOverzichtText:hover {opacity: 1; filter: alpha(opacity=100); }

.filmOverzicht .datum {
    position: absolute;
    bottom: 0;
    left: 0;
    background: #000;
    padding: 5px 10px;
    font-family: 'Sofia-pro-bold',/*'GarageGothic-Black',*/ Arial, Verdana, sans-serif;
    /*text-transform: uppercase;*/
	color: #ffcc00;
}

.vervolg .filmOverzicht .datum {display: none}
.vervolgEn .dag, .filmpageEn .vertoningsdata strong{text-transform: capitalize}

/*.filmOverzicht .col-33 a:link .datum, .filmOverzicht .col-33 a:visited .datum {
    color: #ffcc00;
}*/

/* F I L M P A G I N A 
==================================================================*/

h2.showKenmerkenButton, h2.showKenmerkenButton i.fa, h2.showSynopsisButton, h2.showSynopsisButton i.fa {display:none; color:#ccc;}

.itemContent {padding: 0 0 0 30px}
div.itemContent h3 i.fa {display:none;color:#ccc;}
div.orderFilmSnippet h3 i.fa-caret-square-o-down {display:none;color:#ccc;}
div.orderFilmSnippet h3 i.fa-caret-square-o-up {display:none;color:#ccc;}
div.itemContent strong i.fa {display:none;color:#ccc;}
div.itemContent div.itemBody {display:block;}
div.itemContent div.itemBody .col-33 {background: #fff; padding: 20px}
.filmKenmerken p {margin: 0;padding: 0}

.filmKolommen h5, .filmrow h5 {font-family: 'Sofia-pro-regular', Verdana, Arial, sans-serif; font-size: 1.4em; line-height: 1.2em; color: #000; font-weight: normal; margin: 10px 0}

/* talkshows en deabetten lijst onder film*/
.talkEnD {padding: 30px 0}
.talkEnD .col-33 {min-height: 375px}
.talkEnD .col-33:nth-child(3n+3) {margin-right: 0;}
.talkEnD h3 {font-family: 'Sofia-pro-bold',/*'GarageGothic-Black',*/ Arial, Verdana, sans-serif; font-size: 1.7em; /*text-transform: uppercase;*/ margin-bottom: 10px}
.talkEnD .col-33  h3 {font-size: 1.2em}
.talkEnD a {text-decoration: none}
.talkEnD .col-33 {background: #fff; padding: 20px; margin-bottom: 25px}

.bekijkOnline {margin-top: 30px; margin-left: 30px }
.bekijkOnline a {text-decoration: none;}
.bekijkOnline  i {color: #000; margin-right: 5px}

/*Screenings info*/
/*.col-33 .itemContent {padding: 0 0 0 30px}*/
.col-33 .itemContent H3 {font-family: 'Sofia-pro-bold',/*'GarageGothic-Black',*/ Arial, Verdana, sans-serif; font-size: 1.7em; /*text-transform: uppercase;*/}
.col-33 .itemContent .vertoningsdata  strong{font-family: 'Sofia-pro-bold', Verdana, Arial, sans-serif; font-size: 1em; /*text-transform: lowercase*/}
.col-33  .itemBody ul {list-style: none; margin: 0}
.col-33  .itemBody li .buyTicketsLink, .row .buyTicketsLink { background: #ffcc00 url(/images/vlinder_mtm_wit.png) no-repeat top right; background-size: 45px;	
	padding: 10px 40px 10px 15px; margin-top: 10px; display: inline-block; text-decoration: none; 
	font-family: 'Sofia-pro-bold', Arial, Verdana, sans-serif; font-size: 1.2em;
	}
.col-33  .itemBody li .buyTicketsLink:hover, .row .buyTicketsLink:hover {background: #000; color: #fff}

.fa-shopping-cart {margin-top:4px}

/* FILM META DATA INFO */
div.mData {
	margin-top:10px;
}
.hideBlock {
	display:none;
}

/* CONTENt-TYPE RESPONSIVE*/
.tekstMob, .imgMob {display: none}


/*TL:201203:p-tags met witruimte eronder in film-synopsis*/
.synopsis p {margin-bottom: 10px;}

.mDataTop {margin-bottom: 15px;}
.mDataTop p {margin-bottom: 0}
.mDataTop, .filmKolommen .whitespace .whitespace, .festivalYearMarker {font-size: 0.85em; line-height: 1.4em}

/* Film credits openklap */
h2.showSynopsisButton {display:none;position:relative;width:100%;cursor:pointer; background: #d5d5d5; color: #000; padding: 10px 5px 8px 8px; margin: 10px 0 0 0;  font-size: 1.2em; line-height: 1.0em; width: 96%;}
h2.showKenmerkenButton {display:block;position:relative;width:100%;cursor:pointer; background: #d5d5d5; color: #000; padding: 10px 5px 8px 8px; margin: 10px 0 0 0;  font-size: 1.2em; line-height: 1.0em; width: 96%;}

h2.showKenmerkenButton i.fa, h2.showSynopsisButton i.fa {display:inline-block;float:right;color:#999;} /*pijltje rechts*/
div.foldMarkerStart {display:block;}
div.filmKenmerken {display:none;}
h2.showKenmerkenButton {margin-top:30px;}

/* Tickets rechterkolom filmpagina - widget: festival_film_screenings_info screenings*/
.buyTickets {/*display: none;*/}
.buyTicketsLink img {width: 100%}
.bannerColor {background: #ffcc00; /*width: 75%;*/ margin-top: 15px; display:block}
.bannerColor p {padding: 10px 15px 10px 15px; line-height: 1.2em }
.bannerColor p i {font-size: 70%; }

/* Theme and section Tags on filmpage*/
.themeTags {margin-top: 20px; font-size: 0.60em; text-transform: uppercase }
.themeTags a {color: #333; padding: 7px 15px 7px 30px; margin: 0 10px 20px 0; text-decoration: none; line-height: 3.0em;
background: #d5d5d5 url(../images/bg-tag.png) no-repeat}
.themeTags a:hover {background-color: #ffcc00}


/*film header foto
===============================================*/
.fotoHeader {
	height: 545px;
	width: 100%;
	/*max-width: 1440px;*/
	position: relative;
	overflow: hidden;
	margin: 0px auto 10px auto;
	background: #000;
	text-align: center;
}

.fotoHeader img {
	/*position: absolute;
	top: 0;
	left: 0;
	max-height: 545px;
	min-width: 600px;*/
	/*max-width: 1200px;*/
	width: 100%;
	height: auto;
	margin: 0px auto 0px auto;
}


.fotoHeaderOverlay {
	position: absolute;
	bottom: 10%;
	left: 50%;
	background: #ffcc00;
	padding: 5px;
	width: 60%;
	max-width: 650px;
	margin-left: -570px
}

/* Fotoheader als start afbeelding voor video
================================================*/

.fotoHeaderVideo {
	height: 545px;
	width: 100%;
	/*max-width: 1440px;*/
	position: relative;
	overflow: hidden;
	margin: 0px auto 10px auto;
	background: #000;
	text-align: center;
}

.fotoHeaderVideoImg {
	height: auto;
	width: 100%;
	/*max-width: 1440px;*/
	position: relative;
	margin: 0px auto 10px auto;
	background: #000;
	text-align: center;
}

.vimeo-start-image	{ 
	background-color: #000;
	max-width: 100%;
	overflow: hidden;
	position: relative;
	cursor: hand;
	cursor: pointer;
}

.fotoHeaderVideo .youtube {height: 545px;}
.fotoHeaderVideo  iframe, .xvideoWrapper iframe {height: 545px}


.fotoHeaderVideo img, .fotoHeaderVideoImg  img  {
	/*position: absolute;
	top: 0;
	left: 0;
	max-height: 545px;
	min-width: 600px;*/
	/*max-width: 1200px;*/
	width: 100%;
	height: auto;
	margin: 0px auto 0px auto;
}



/* VIDEO 
===============================================*/

/*VideoIframe embeded Youtube of video player*/

.videoWrapper {
    width: 100%;
    position: relative;
	/*padding-bottom: 36%;*/
	height: 545px;
	background: #000;
}

.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/*
.videoWrapper .videoHeaderOverlay {
	position: absolute;
	bottom: 10%;
	left: 0;
	width: 100%;
}

.videoWrapper .videoHeaderOverlay div {
	width: 1140px;
	margin: 0 auto;
	text-align: left;
}

.videoWrapper .videoHeaderOverlay div span {
	background: #ffcc00;
	padding: 10px 15px;
}

.videoHeaderOverlay {font-family: 'GarageGothic-Black', Verdana, Arial, sans-serif; text-transform: uppercase; font-weight: normal; line-height: 0.9em; font-size: 1.4em}
.headerFotoVideoContainer .videoHeaderOverlay {font-family: 'GarageGothic-Black', Verdana, Arial, sans-serif; text-transform: uppercase; font-weight: normal; line-height: 0.9em; font-size: 3.4em}
*/

.play-knop {
	filter:alpha(opacity=80);
	opacity:.8;
	/*height:77px;
	width:77px;*/
	height: 100px;
	width: 100px;
	left:50%;
	/*margin-left:-38px;
	margin-top:-38px;*/
	margin-left:-50px;
	margin-top:-50px;
	position:absolute;
	top:50%;
	/*background:url("https://lh3.ggpht.com/vo4W82YNfpJDsttqn-22YsLtEJjmOtIB-54yIxR5wQA0Ucs5leNIu-W8iEmyY8-Pf7RWHk4=w64") no-repeat;*/
	background: url(../images/mtm_playbutton_normal.png) no-repeat center center;
}

.play-knop:hover {background: url(../images/mtm_playbutton_rollover.png) no-repeat center center;}

/* CUSTOM PLAYKNOP*/
.fotoHeaderVideo .youtube .play {background: url(../images/mtm_playbutton_normal.png) no-repeat center center; xz-index: 1000; width: 100px; height: 100px; margin-left:-50px;	margin-top:-50px;}
.fotoHeaderVideo .youtube:hover .play { background: url(../images/mtm_playbutton_rollover.png) no-repeat center center}
 


/* FILM PROGRAMMA 
============================================= */
/*table#filmProgramList*/ #filmProgramList, #tdProgramList {
 /*background-color:#FFFFFF;*/
 padding: 14px 0 30px; 0;
 margin-bottom: 30px;
}

#filmProgramList {
	display:none;
}

#tdProgramList .col-33:nth-child(3n+3) {margin-right: 0;}


#programma_tijd {
	font-weight: bold;
	float:left;
	margin-right:5%;

}

#programma_icon {
	text-align: center; 
	margin-bottom: 5px;
	float:left;

}


#tdProgramList .filmOverzichtText {min-height: 200px}

#programma_tekst {clear:both; width: 100%; }
#programma_tekst a {text-decoration: none;}
#programma_zaal {margin-bottom: 20px}


.programItems {
	border-bottom: 1px solid #999; 
	clear: both; 
	padding: 0 0 14px 0;
	margin: 0 0 14px 0;
}

/*#programma_zaal {
	text-align: left; 
	padding: 6px; 
	color: #000; 
}*/


/* PROGRAMMA OVERZICHT TALKSHOWS & DEBATES */
.TD_overzicht{
	width:100%;
	margin-top:0px;
	margin-bottom:0px;
	background: #fff;
}

.TD_datumBalk {
	/*display:block;
	position:relative;
	width:730px;
	height:50px;
	margin-bottom:30px;
	border:0px solid #000;*/
}

/* Partner logo's 
============================================================================== */
.partnerLogo {float:left; width: 102px; height: 102px; margin: 10px 3% 25px 0; border: 1px solid #ccc;display: table; position: relative}
.partnerLogo p {display: table-cell; vertical-align: middle; width: 100%*; height: 100%; text-align: center;}
.partnerLogo p img { width: 90%; max-height: 90%; }
.partnerLogo  span {height: 100%; vertical-align: middle}

/* EDUCATIE 
===============================================================================*/
.inlogKnopCM {width:25%}
.orderFilmSnippet  h3{font-family: 'Sofia-pro-bold',/*'GarageGothic-Black',*/ Arial, Verdana, sans-serif; /*text-transform: uppercase;*/ font-weight: normal; font-size: 1.7em}
.orderFilmSnippet, .shoppingCartViewer {padding-left: 30px}
.shopCheckoutButton {
	/*background: #ffcc00 url(/images/vlinder_mtm_wit.png) no-repeat top right; background-size: 45px;*/	
	padding: 10px 40px 10px 15px; margin-top: 10px; display: inline-block; text-decoration: none; 
	font-family: 'Sofia-pro-bold',/*'GarageGothic-Black',*/ Arial, Verdana, sans-serif; font-size: 1.0em; /*text-transform: uppercase;*/ border:0; cursor: pointer;
}
.eduLesmateriaalItem i {margin: 5px 10px 0 0}
/*.itemContent strong {font-family: 'GarageGothic-Black', Verdana, Arial, sans-serif; font-size: 1.6em; text-transform: uppercase;}*/
.lesMateriaal strong, .eduFilmExtraInfo strong {font-family: 'Sofia-pro-bold',/*'GarageGothic-Black',*/ Arial, Verdana, sans-serif; font-size: 1.6em; /*text-transform: uppercase;*/}

/*BANNER*/
.bannerblok  img {width: 100%}

/* FILM SHOPPING CART 
=========================================== */

div.shoppingCartViewer {
	box-sizing:border-box;
	/*width:90%;*/
	padding:20px 0 0 30px;
	margin-bottom:15px;
	/*border: 1px solid #ccc;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	-o-border-radius:4px;
	border-radius:4px;*/
}

#columnRight div.shoppingCartViewer {
	/*width:146px;*/
}

div.shoppingCartViewer h3 {
	/*color:#bc1215;*/
}

/*div.shoppingCartViewer button {
	font-weight: bold;
	text-align: center;
	color: #f1ba13;
	width:100%;
	padding: 2px 16px 2px 8px;
	margin: 10px 0px 0px 0px;
	clear: both;
	background-color: #000000;
	background-repeat: no-repeat;
	background-position: right 3px;
}

div.shoppingCartViewer button:hover {
	color: #000;
	background-color: #f1ba13;
}*/

div.shopOrderList {}
div.shopOrderList div.orderRow {
	display:block;
	position:relative;
	width:400px;
	padding: 5px 20px 5px 4px;
	border-bottom:1px solid #f1f1f1;
}
div.shopOrderList div.orderRow:last-child {
	border-bottom:0px solid #ccc;
}
div.shopOrderList div.orderRow button {
	position:absolute;
	right:5px;
}
div.shopOrderList a.orderLink:link, 
div.shopOrderList a.orderLink:visited, 
div.shopOrderList a.orderLink:active {
	display:block;
	font-weight: bold;
	text-align: center;
	text-decoration:none;
	color: #f1ba13;
	width:400px;
	padding: 5px 12px 5px 12px;
	margin: 10px 0px 0px 0px;
	clear: both;
	background-color: #000000;
	background-repeat: no-repeat;
	background-position: right 3px;
}
div.shopOrderList a.orderLink:hover {
	color: #000;
	background-color: #f1ba13;
}

div.orderFilmSnippet {
	margin-bottom:5px;
}

.addToShoppingCartButton {
	cursor:pointer;
	background: #ffcc00;
	padding: 10px;
	font-size: 80%;
}

.shopMeerFilmsBestellen {
	margin:5px 0 30px 0;

}

/* EDUCATIEF DOWNLOAD PDF LESMATERIAAL*/
.eduLesmateriaalItem {
	position:relative;
	margin:5px 0 5px 0;
	padding-left:25px;
}
.eduLesmateriaalItem i.fa {
	position:absolute;
	top:2px;
	left:0px;
	/*color: #BC1215;*/
}

.fa-file-pdf-o {margin-right: 10px; margin-top: 5px}

/* Lesmateriaal lijst A-Z*/
.lmListAZ  ul {padding: 0; margin: 0}
.lmListAZ  li {padding: 0; margin: 0 0 0 15px}
.lmListAZ .paginationBlock {margin-top: 15px}

/* COOKIE-FACTORY ;-) */
.cookie-notification-container{
	background: #ffcc00;
	color: #000000;
	text-align: center;
	padding: 10px 5% 0 5%;
	text-align: center;
    position:fixed;
    width:100%;
    bottom:0px;
    z-index: 100;
	font-size: 0.75em;
}

.cookie-notification-container a {
	color: #000000;
}

.cookie-notification-text{
	display: inline-block;
	text-align: right;
}

.cookie-form {
	display: inline-block;
	margin: 0 0 0 5%;
}

.cookie-accept-button {
	color: #fff;
	background-color: #000000;
	border-radius: 15px;
	padding:5px 15px;
	margin: 0 5% 10px 5%;
	border: 0;
	cursor: pointer;
	font-weight: bold;
}
/*text in popup*/
.cookie-policy {font-size: 0.8em}

/* COOKIE-FABRIEK 

.cookie-notification-container{
	width:100%;
	padding:0;
	margin:0;
	background:#333;
	opacity:1.0;
}
#cookie-notification{
	width:980px;
	padding:10px;
	color:#FFF;
	margin:0 auto;
}
.cookie-notification-text{
	float:left;
	width:780px;
	min-height:30px;
	line-height:30px;
}
.cookie-button-wrapper {
	float:left;
	width:auto;
	min-height:30px;
	padding-top:3px;
}
.cookie-button-wrapper a {
	display:inline-block;
	color:#FFF;
	background-color:#bc1215;
	padding:5px 5px;
	font-size:0.9em;
	text-decoration:none;
	text-transform:uppercase;
}


.cookie-button-wrapper.disabled .tail{background-position:-354px -168px}
*/


/* SHOP-ICON - TIJDENS FESTIVAL OP TEMPLATE*/
.header-container .shopIconTemp {margin: 42px 0 0 0; display:none}
.header-container .buyTicketsLink {/*ackground: none; padding: 0; xmargin-top: 42px; display: inline; font-size: 1.0em*/ display:none}
.header-container .buyTicketsLink:hover {background:#fff; color:#000}

/* SHOP-ICON - NA FESTIVAL OP VERBERGEN
.header-container .shopIconTemp {display: none}
*/


/* ===================================================================================================================
#Media Queries 
================================================== */


/* Smaller than 1200px (devices and browsers) 
=========================================================*/

@media only screen and (max-width: 1200px) { 

/*SHOP-ICON - DIT TIJDENS FESTIVAL ACTIEF ZETTEN*/
.header-container .shopIconTemp {display: none; margin: 36px 8% 0 0; font-size: 120%; padding: 6px 7px}
.shopIconTempMobNL, .shopIconTempMobEN {margin: 5px 10px 0 0; padding: 6px; font: normal normal normal 18px/1 FontAwesome; text-rendering: auto;}
.indexNL #mobileMenu .shopIconTempMobNL, .vervolgNL #mobileMenu .shopIconTempMobNL {/*display: inline-block;*/ display:none}
.indexNL #mobileMenu .shopIconTempMobEN, .vervolgNL #mobileMenu .shopIconTempMobEN {display: none;}
.indexEn #mobileMenu .shopIconTempMobEN, .vervolgEN #mobileMenu .shopIconTempMobEN {display: inline-block;}
.indexEn #mobileMenu .shopIconTempMobNL, .vervolgEN #mobileMenu .shopIconTempMobNL {display: none;}


/*SHOP-ICON - DIT TIJDENS FESTIVAL VERBERGEN, de rest van het jaar
.shopIconTemp .shopIconTempMobNL, .shopIconTempMobEN, .menuButtonBar .fa-shopping-cart {display: none}
*/

.row, .filmrow {width: 100%; padding-left: 2%; padding-right: 2% }

.fotoHeaderOverlay, .videoWarpper .onderschrift {	left: 2%; margin-left: 0}
.nieuwsOverzicht .col-33 .textNieuwsArtikel {display: none}
.filmOverzicht .col-33 .filmOverzichtImg, #tdProgramList .col-33 .filmOverzichtImg { height: 160px}
.nieuwsOverzicht .col-33 .imgNieuwsArtikel img, .filmOverzicht .col-33 .filmOverzichtImg img {width: 100%; height: auto}
.filmOverzichtImg .filmOverzichtText, .fotoBLok .fotoBlokOverlay  {display: none}
.filmOverzicht .col-33 .filmOverzichtKenmerken { 	height: 255px; }


.fotoBLok h2 {font-size: 2.0em}

.inlogKnopCM {width:30%} 
/*.fotoKnop {background: #cc3333}
.fotoKnop img, .fotoKnopBreed img {left: 50%;	margin-left: -600px;}
.fotoKnop .img100, .fotoKnopBreed .img100 {width: 100%}*/

.fotoHeader  {height: auto}
.fotoHeaderVideo, .videoWrapper {height: 500px}
/*.fotoHeaderVideo img {min-width: 1200px; min-height: 574px; left: 50%;}*/
.fotoHeaderVideo img {/*min-width: 1200px; min-height: 574px; left: 50%;*/}
.fotoHeaderVideo .youtube {height: 500px}
.fotoHeaderVideo .youtube img {min-width: 1200px; min-height: 574px; left: 50%; margin-left: -600px;}
.fotoHeaderVideo  iframe {height: 500px}

.header-container.fixed #header		{ width: 100%;}

.talkEnD .col-33 {min-height: 475px}


}


/* Smaller than 980px (devices and browsers)  
=========================================================*/
@media screen and (max-width:980px) {
	
h1 {font-size: 3.0em;}
h2 {font-size: 2.2em}

.fotoBLok h2 {font-size: 1.8em}
	
/* flexnav menu show/hide */
#header .lang, #header #zoeken {display:none;}

/* film program list */
#filmProgramList {border: 0;display:block;}

.header-container.fixed	 .menu-button-scroll { display: none; }
.header-container.fixed 					{ position: relative; top: auto; z-index: 100; width: auto; left: auto; background: #FFF; border-bottom: 0px; }
.header-container.fixed #header		{ width: 100%; margin: 0 auto; }
.header-extra-padding							{ padding-top: 0px; }
.header-container.fixed .lang			{ margin: 0 6px 0 0;  }
.header-container.fixed #topMenu	{ display: block; }

.scrollmenu-container							{ display: none; position: relative; top: 0px; width: auto; }
.scrollmenu-container.open				{ display: none; }

.fotoHeaderVideo, .videoWrapper {height: 450px}
.fotoHeaderVideo .youtube {height: 450px}
.fotoHeaderVideo .youtube img {min-width: 980px; min-height: 469px; left: 50%; margin-left: -490px;}
.fotoHeaderVideo  iframe {height: 450px}

.filmOverzicht .col-33 .filmOverzichtKenmerken { 	height: 275px; font-size: 95%; line-height: 1.4em}
.filmOverzicht .col-33 .filmOverzichtImg, #tdProgramList .col-33 .filmOverzichtImg { height: 140px}

/*Film overzicht en TALKSHOWS EN DEBATTEN*/
.TD_datumBalk {width: 100%;}
/*.dag {padding: 6px 6px; margin: 0px 4px 15px 0px; width: 120px; border: 1px solid #000; word-break: break-word;}*/
.dag {font-size: 0.8em; 	padding:  3px 2%; 	margin: 0px 1% 7px 0px; width: 31%;border: 1px solid #000; word-break: break-word; }
.dag h4 {font-size: 1.3em}

.talkEnD .col-33 {min-height: auto; height: auto; width: 100%; float: none}
#programma_tekst {/*min-height: 45px;*/ font-family: 'Sofia-pro-bold',/*'GarageGothic-Black',*/ Impact, Arial, Verdana, sans-serif; font-size: 1.0em; line-height: 1.0em; /*text-transform: uppercase*/}
#filmProgramList div {padding: 0 10px}
#filmProgramList div.clearfix {background: #fff; padding-top: 8px; padding-bottom: 0px}
#filmProgramList div.clearfix:nth-child(2n+1) {background: #d5d5d5}
#filmProgramList .activeTicketsIconLink {background:#f1ba13; padding: 2px 4px 2px 4px; margin-bottom: 10px; font-family: 'Sofia-pro-bold', Verdana, Arial, sans-serif; font-size: 0.8em; text-decoration: none;}
#filmProgramList .activeTicketsIconLink .fa, #filmProgramList .talkShowAndDebateLink .fa {margin-top: 5px}

#filmProgramList .talkShowAndDebateLink {font-family: 'Sofia-pro-bold', Verdana, Arial, sans-serif; font-size: 0.8em; text-decoration: none}

#programma_zaal {margin-bottom: 10px; font-size:0.9em}
#programma_icon {float: right; line-height: 1.2em; padding-bottom: 5px;}


}


/* for 800px or less
=========================================================*/
@media screen and (max-width: 800px)  {

.fotoHeaderVideo, .videoWrapper {height: 380px}
}


/* for 768px or less
=========================================================*/
@media screen and (max-width: 768px)  {

.halfColumn {float: none; width: 100%}
.fotoBLok h2 {font-size: 1.5em}
.sticker {display: none}
.fotoBLok h2, .fotoBLok .col-50 h2, .fotoBLok .col-33 h2  {bottom: 15%; padding: 8px}
.fotoBLokTekst .col-33 h2 {font-size: 1.5em; bottom: 5%}

.nieuwsOverzicht .col-33 h3 {font-size: 1.0em}
.introresp {display: block}
.filmzoeken {position: relative; height: auto}
.filmzoeken .col-66 {display: none;}
.filmzoeken .col-33, .filmzoeken .col-66  {width: 100%; float: none; clear: both; margin: 0 0 20px 0; padding:0; }
.filmzoekenRight {height: auto}
.filmzoekenContainer {height: auto}
.filmzoekenContainer .img100 {display: none}

.tabs a {padding: 10px 15px 10px 15px; margin-right: 15px; font-size: 1.8em; font-family: 'Sofia-pro-bold',/*'GarageGothic-Black',*/ Arial, Verdana, sans-serif;}

.inlogKnopCM {width:50%}

.talkEnD .col-33 {float: none; display: block; width: 97%; height: auto; margin-bottom: 10px}
.filmKolommen .col-66, .filmKolommen .col-33 {float: none; display: block; width: 100%}
.filmKolommen .col-33 .itemContent  {padding: 0}
.orderFilmSnippet, .shoppingCartViewer {padding-left: 0}

.filmOverzicht .col-33 .filmOverzichtKenmerken { 	height: auto}
h2.showKenmerkenButton, h2.showSynopsisButton {display:block; }
div.filmKenmerken, div.foldMarkerStart {display:none;}
.filmOverzicht .hideKenmerken2, .filmOverzicht .col-33 .hideKenmerken2 {display: none}
.filmOverzicht .col-33 .filmOverzichtImg, #tdProgramList .col-33 .filmOverzichtImg { height: 115px}

.fotoHeaderVideo, .videoWrapper {height: 350px}
.fotoHeaderVideo .youtube {height: 350px}
.fotoHeaderVideo .youtube img {min-width: 768px; min-height: 367px; left: 50%; margin-left: -384px;}
.fotoHeaderVideo  iframe {height: 350px}

.bannerblok {text-align: center}
.bannerblok  img {width: 96%; }

.bgGrijs {padding: 30px 0}
.bekijkOnline {margin-left:0}
div.shoppingCartViewer {padding-left: 0}
}

/* for 600px or less
=========================================================*/
@media screen and (max-width: 600px)  {
	
.wrapper {padding-bottom:0;}
	
#header img {width: 96%}
h1 {font-size: 2.6em;}
h2 {font-size: 1.8em}

.fotoBLok h2 {font-size: 1.2em}
.fotoBLok .col-33 h2 {font-size: 1.0em; }
.fotoBLokTekst .col-33 {width: 100%; float: none; clear: both; margin: 0 0 20px 0; padding:0;}
.fotoBLokTekst .col-33 h2 {font-size: 2.2em; bottom: 0}

.footer {height: auto; position: relative}
.footer .col-33, .nieuwsOverzicht .col-33, .filmOverzicht .col-33, .filmzoeken .col-33, .filmzoeken .col-66 {width: 100%; float: none; clear: both; margin: 0 0 20px 0; padding:0; }
.nieuwsOverzicht .col-33 {background: #fff;}
.nieuwsOverzicht .col-33 .imgNieuwsArtikel, .filmOverzicht .col-33 .filmOverzichtImg {width: 40%; float: left}
.nieuwsOverzicht .col-33 a:link h3, .nieuwsOverzicht .col-33 a:visited h3 /*, .filmOverzicht .col-33 .filmOverzichtKenmerken*/ {background: #fff; display: block; padding: 20px; height: auto; overflow: auto}
.nieuwsOverzicht {padding-bottom: 10px}
.index .paginatie {display: none}
.filmOverzicht .col-33  {background: #fff}
.filmOverzicht .col-33 .filmOverzichtKenmerken {float: left; width: 55%; margin-left: 2%}
.filmOverzicht .hideKenmerken1 {display: none}
.filmOverzicht .col-33 .filmOverzichtImg, #tdProgramList .col-33 .filmOverzichtImg { height: auto; margin: 15px 0 0 10px}

/*Film overzicht en TALKSHOWS EN DEBATTEN*/
/*#programma_tekst {width: 100%; border-bottom: 1px solid #ccc}*/
#programma_tekst .filmOverzicht {width: 97%; height: auto;}
#programma_zaal {width: 100%}
/*#programma_icon {display: none}*/

#tdProgramList .col-33 {float: none; width: 100%; display: block}
#tdProgramList .col-33 .filmOverzichtText {height: auto}
#programma_tekst {min-height: auto; height: auto}

.dag h4 {font-size: 1.1em}

.nieuwsOverzicht .col-33:after , .filmOverzicht .col-33:after{
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

.fotoKnop {	min-height: 70px; overflow: auto;}
.fotoKnop img {display: none}
.fotoKnopOverlay { position: relative; top: 10px; left: 0;}
.fotoKnopOverlay  span {display: block}

/* CONTENt-TYPE ARTIKEL RESPONSIVE*/
.tekstDesktop {margin: 0}
.tekstDesktop, .h1Hide {display: none}
.tekstMob {margin: 0 0 35px 0;}
.tekstMob h1 {margin-top: 10px}
.tekstMob, .imgMob {display: block; width: 100%}
.imgMob {margin-bottom: 10px}


/*EDUCATIONAL FILMS*/
#columnLeft div.orderFilmSnippet h3:not(.addToShoppingCartButton) {text-transform: uppercase; display:block;position:relative; cursor:pointer; background: #d5d5d5; color: #000; padding: 10px 5px 8px 8px; margin: 0; font-size: 1.2em; line-height: 1.0em; }
div.orderFilmSnippet h3 i.fa {display:inline-block; /*color:#999;*/}
div.orderFilmSnippet h3 i.fa-caret-square-o-down, div.orderFilmSnippet h3 i.fa-caret-square-o-up {float: right;}

#columnLeft div.bekijkOnline h3 {text-transform: uppercase; display:block;position:relative; cursor:pointer; background: #d5d5d5; color: #000; padding: 10px 5px 8px 8px; margin: 0; font-size: 1.2em; line-height: 1.0em; }
#columnLeft div.bekijkOnline a {color: #000}
div.bekijkOnline h3 i.fa {display:inline-block;color:#999;}

.tabs a {padding: 8px 10px 8px 10px; margin-right: 10px; font-size: 1.5em}

.inlogKnopCM {width:100%}

h2.showKenmerkenButton, h2.showSynopsisButton {display:block;position:relative;width:100%;cursor:pointer; background: #d5d5d5; color: #000; padding: 10px 5px 8px 8px; margin: 10px 0 0 0;  font-size: 1.2em; line-height: 1.0em; width: 96%;}
h2.showKenmerkenButton i.fa, h2.showSynopsisButton i.fa {display:inline-block;float:right;color:#999;} /*pijltje rechts*/
div.filmKenmerken, div.foldMarkerStart {display:none;}
h2.showKenmerkenButton {margin-top:30px;}

.calendarBlock .col-66, .calendarBlock .col-33 {float: none; width: 100%}

.fotoHeaderVideo, .videoWrapper {height: 250px}
.fotoHeaderVideo .youtube {height: 250px}
.fotoHeaderVideo .youtube img {min-width: 600px; min-height: 287px; left: 50%; margin-left: -300px;}
.fotoHeaderVideo  iframe {height: 250px}

}


/* for 480px or less
=========================================================*/
@media screen and (max-width: 480px)  {

/*.col-25, .col-33, .col-50, .col-75 {width: 100%; float: none; clear: both; margin: 0; }*/

.fotoBLok h2 {font-size: 1.0em}
.fotoBLok .col-33 h2 {font-size: 0.80em; line-height: 1.1em}
.fotoBLokTekst .col-33 h2 {font-size: 1.5em;}

.tabs {margin: 20px 0px 20px 0px;}
.tabs a {padding: 6px 8px 6px 8px; margin-right: 8px; margin-bottom: 20px; font-size: 1.0em}
.nieuwsOverzicht .col-33 .datum  {font-family: 'Sofia-pro-bold',/*'GarageGothic-Black',*/ Arial, Verdana, sans-serif; font-size: 0.9em}

.fotoHeaderVideo, .videoWrapper {height: 200px}
.fotoHeaderVideo .youtube {height: 200px}
.fotoHeaderVideo .youtube img {min-width: 480px; min-height: 230px; left: 50%; margin-left: -240px;}
.fotoHeaderVideo  iframe {height: 200px}

.dag {font-size: 0.8em; 	padding:  5px 1% 0px 1%; margin: 0px 1% 10px 0px; width: 32%;border: 1px solid #000; word-break: break-word; line-height: 1.2em }
.bgGrijs {padding: 15px 0}


}


/* for 360px or less
=========================================================*/
@media screen and (max-width: 360px)  {
	
.fotoHeaderVideo {height: 150px}
.fotoHeaderVideo .youtube {height: 150px}
.fotoHeaderVideo .youtube img {min-width: 360px; min-height: 172px; left: 50%; margin-left: -180px;}
.fotoHeaderVideo  iframe {height: 150px}

.fotoBLok .col-33 h2 {font-size: 0.65em; line-height: 1.0em}
.fotoBLokTekst .col-33 h2 {font-size: 1.5em}
	
}