/* eigen CSS specifiek */
.lighttext{color:rgb(255,244,202)}
.textframe-light{background:rgb(255,244,202);color:#333333;}
.textframe-dark{background:#333333;color:rgb(255,244,202);}
#pages h1, .textframe-dark h2, .textframe-dark h3{color:rgb(255,244,202)}
#pages .textframe-light a{border-color:#333333}
#pages .textframe-dark a{border-color:rgb(255,244,202)}
#logo p{text-align:right}
#pages h1{font-weight:normal;font-size:51px;line-height:58px;}

#pages div.laatste{padding:120px}
#pages div.laatste .subheader{margin-bottom:10px;font-size:28px}

#pages .stationsnaam{color:#333333;position:absolute;z-index:100;left:15px;top:15px;font-family:FuturaCondensedMedium, sans-serif; font-size:18px;}


#auteur{
	left:305px;margin-bottom:-5px;text-align:right;
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
}
#auteur p{font-size:20px}

#taal{top:260px}

#cups{width:472px;bottom:30px;height:130px;}
#vsoe-amsterdam{width:216px;height:490px;margin-bottom:20px;}
#vsoe-amsterdam img{width:1024px;height:665px;margin-left:-560px;}
#muurschildering img{margin-left:-512px;width:768px;height:512px}
#fotomontage-tekst{width:290px;height:280px;top:266px;right:200px}
#freriks{height:768px;width:1024px;}
#posters img{display:inline-block;margin-left:22px;margin-top:28px}
#posters{height:261px;}
#fedde{height:146px;}
#expo{height:356px}
#expo p{margin-right:400px}
#atelier{margin-bottom:-6px}
@media only screen and (max-width:1022px) {
  #cassandre{height:206px;width:148px;margin-right:20px;}
  #kick{margin-left:50px}
  #vsoe-amsterdam{width:472px;height:206px;margin-right:20px;}
  #vsoe-amsterdam img{margin-top:-200px;margin-left:-530px;}
  #muurschildering{height:276px}
  #muurschildering img{margin-top:-236px;margin-left:0}
  #fotomontage img{height:100%;width:auto;margin:0 0 0 -55%}
  #fotomontage-tekst{top:340px}
  #fragment-placeholder{display:none}
  #cups{width:216px;bottom:30px;height:216px;padding:0}
  #cups img{margin-left:-185px}
  #affiche-detail{background:rgb(252,251,232);padding:0}
  #freriks{width:1365px;height:1024px;margin-left:-50px}
  #posters img{width:115px !Important;height:auto !important;display:inline-block;margin:20px 0 0 20px}
  #posters{height:990px;width:155px;padding-top:10px;overflow:hidden;}
  #fedde{width:357px;height:100%;padding-top:377px;}
  #fedde .col1{width:auto;margin:0}
  #atelier{left:155px;top:0;bottom:inherit}
  #expo{height:1024px;}
  #expo img{float:none;margin-bottom:20px;margin-top:10px}
  #expo p{margin-right:0}
}

.picto, .fraglink{background-position:center center;background-repeat:no-repeat;width:100%;height:100%;position:absolute;z-index:50;left:0;top:0px;border:0 !important;text-align:center;cursor:pointer}
.play{background-image:url(/graph/play-creme.png);background-size:102px 102px;top:-10px;}
.map{background-image:url(/graph/map-creme.png);background-size:102px 102px;top:-10px;}
.plus{width:60px;height:60px;background-image:url(/graph/plus-creme.png);background-size:52px 52px;}
.audio{background-image:url(/graph/audio-creme.png);background-size:202px 202px;top:-10px;}
.fraglink{display:inline-block;width:55px;height:55px;background-image:url(/graph/circle-creme.png);background-size:52px 52px;position:relative;color:white !important;font-size:22px;line-height:55px;font-family:FuturaCondensedExtraBold}
.fraglink.sel{color:#b77880 !important;}
.audio.active{opacity:0.6}
#time{position:absolute;left:0;bottom:20px;width:100%;color:rgb(255,244,202)}



/* InDesign CSS: */

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, p, pre, code, blockquote {
	margin:0;
	padding:0;
	border-width:0;
}
td, th {
	border-style:solid;
	border-width:1px;
}
table {
	border-collapse:collapse;
}
body {
	font-size:12px;
	-epub-hyphens:auto;
}


#pages .subheader {
	color:white;
	font-family:FuturaCondensedMedium, sans-serif;
	font-size:32px;
	font-style:normal;
	font-variant:normal;
	font-weight:500;
	line-height:1;
	margin-bottom:0px;
	margin-left:0px;
	margin-right:0px;
	margin-top:0px;
	text-align:left;
	text-decoration:none;
	text-indent:0px;
}

p.darktext-medium {
	-epub-hyphens:none;
	color:#333333;
	font-family:FuturaMedium, sans-serif;
	font-size:16px;
	font-style:normal;
	font-variant:normal;
	font-weight:500;
	line-height:1.5;
	margin-bottom:10px;
	margin-left:0px;
	margin-right:0px;
	margin-top:0px;
	text-align:left;
	text-decoration:none;
	text-indent:0px;
}
p.lighttext-medium {
	-epub-hyphens:none;
	font-family:FuturaMedium, sans-serif;
	font-size:16px;
	font-style:normal;
	font-variant:normal;
	font-weight:500;
	line-height:1.5;
	margin-bottom:10px;
	margin-left:0px;
	margin-right:0px;
	margin-top:0px;
	text-align:left;
	text-decoration:none;
	text-indent:0px;
}
p.lighttext-small {
	-epub-hyphens:none;
	font-family:FuturaCondensedMedium, sans-serif;
	font-size:16px;
	font-style:normal;
	font-variant:normal;
	font-weight:500;
	line-height:1.5;
	margin-bottom:10px;
	margin-left:0px;
	margin-right:0px;
	margin-top:0px;
	text-align:left;
	text-decoration:none;
	text-indent:0px;
}
img.frame-1 {
	height:769px;
	width:769px;
}
div.frame-2 {
	margin:0px auto 0px 0px;
	text-align:left;
}
img.frame-3 {
	height:601px;
	width:392px;
}
img.frame-4 {
	height:472px;
	width:769px;
}
img.frame-5 {
	height:293px;
	width:211px;
}
img.frame-6 {
	height:607px;
	width:250px;
}
img.frame-7 {
	height:609px;
	width:250px;
}
img.frame-8 {
	height:768px;
	width:512px;
}
img.frame-9 {
	height:216px;
	width:216px;
}
img.frame-10 {
	height:170px;
	width:216px;
}
img.frame-11 {
	height:256px;
	width:512px;
}
img.frame-12 {
	width:216px;height:216px;
}
img.frame-13 {
	height:454px;
	width:301px;
}
img.frame-14 {
	height:256px;
	width:768px;
}
img.frame-15 {
	height:512px;
	width:255px;
}
img.frame-16 {
	height:479px;
	width:768px;
}
img.frame-17 {
	height:490px;
	width:217px;
}
img.frame-18 {
	height:768px;
	width:1024px;
}
img.frame-19 {
	height:256px;
	width:472px;
}
img.frame-20 {
	height:216px;
	width:472px;
}
img.frame-21 {
	height:512px;
	width:768px;
}
img.frame-22 {
	height:365px;
	width:284px;
}
img.frame-23 {
	height:216px;
	width:140px;
}
img.frame-24 {
	height:216px;
	width:134px;
}
img.frame-25 {
	height:216px;
	width:132px;
}
img.frame-26 {
	height:216px;
	width:154px;
}
img.frame-27 {
	height:216px;
	width:155px;
}
img.frame-28 {
	height:311px;
	width:196px;
}
img.frame-29 {
	height:357px;
	width:357px;
}

@media only screen and (max-width:750px) {
  #pages p{-webkit-hyphens: manual !important;hyphens: manual !important;-epub-hyphens: manual !important;}
  #pages h2.subheader {font-size: 14px !important; font-size: 4.6vw !important}
  #logo p.override span{font-size:42px !important}
  .textframe-light.transp {background: rgb(255,244,202) !important}
  #pages #sliderinner > div{background:#333333 !important}
  #pages h1{line-height: inherit !important;}
  #pages #sliderinner #logotext{font-size:42px !important}
  #pages #sliderinner > div #logo, h2.v-abs, #anp{position:static  !important;}
  #pages #sliderinner #taal{bottom: 150px !important;}
  #pages #sliderinner #auteur{display:none !important;}
  #pages #sliderinner #weidema-pullman{position:absolute !important;width:70% !important;top:90px !important}
  #pages #sliderinner img.frame-4 {width: 115% !important;margin-left:-10% !important}
  #pages #sliderinner img.frame-5 {width: 50% !important;margin:0 20px 5px 0 !important;padding:0 !important}
  #pages #sliderinner #folder{position:absolute !important;width:50% !important;height:150px !important}
  #pages #sliderinner #welge{text-align:left !important;padding-right:14px !important}
  #pages #sliderinner #kick{width:55% !important;padding: 0 0 10px 20px !important}
  #pages #sliderinner p.stationsnaam{display:none}
  #pages #sliderinner div.w1.h1 img{padding:0 !important;bottom:auto !important}
  #pages #sliderinner #nsfilm{width:50% !important;float:right!important;padding:0 !important;margin-left:10px !important}
  #pages #sliderinner .play{top:0 !important}
  #pages #sliderinner img#cm {width: 150% !important;margin-left:-35% !important}
  #pages #sliderinner div.fll.m-half{margin-right:10px !important}
  #pages #sliderinner img.frame-16 {width: 120% !important;margin:-5% 0 -5% -10% !important}
  #pages #sliderinner #muur {width: 200% !important; height: auto !important;margin: 0 !important;margin-left: -100% !important;margin-top: -50% !important;}
  #pages #sliderinner #vsoe-amsterdam{padding:0 2px 15px 0 !important;}
  #pages #sliderinner img.frame-18 {width: 150% !important;margin-left:-25% !important}
  #pages #sliderinner h2.abs{display:none}
  #pages #sliderinner div.w2.h3.down{bottom:auto !important;padding:0 !important;}
  #pages #sliderinner #cups{padding:10px 0 0 0 !important}
  #pages #sliderinner #affiche-detail{padding-bottom:0 !important}
  #pages #sliderinner #posters{padding-top:0 !important;}
  #pages #sliderinner #expo .frame-28{padding-bottom:15px}
  #pages #sliderinner #atelier{padding:0 !important}
   #pages #sliderinner #freriks{height:400px !important;width:auto !important;margin:-100px 0 0 0 !important}

  #pages #sliderinner #audiotitel{position:absolute !important;background:transparent !important;z-index:102 !important}
  #pages #sliderinner #knop{position:absolute !important;top:70px !important;left:50% !important;margin-left:-90px !important;height:200px !important;width:180px !important}
  #pages #sliderinner #knop>div{width:70px !important;height:75px !important;margin-left:35px !important;}
  #pages #sliderinner #knop .picto{background-size:contain !important;top:0 !important}
  #pages #sliderinner #time{display:none !important}
  #pages #sliderinner #nummers{position:absolute !important;left:auto !important;right:0 !important;text-align:right;top:220px !important}
  #pages #sliderinner #credits{width:50% !important}
}
