﻿html, body {
  width:100%;
  margin: 0px;
  padding: 0px;
  position: relative;
}

.mainContainer{
  position: relative;
  width: 1194px;   /* was 1195 maa dan zag je een zwarte lijn bij de video links in chrome */
  margin: auto;
  margin-top: 2%;
}


.blokA{
  position: absolute;
  width: 100%;
  height: 100%;
  float: left;
}



/* uitzondering voor IE ivm pointer events none */
.filmsKaderImageInternetExplorer{
  display: none;
}

/* ------------------------------------------------------------------------------------------------- */
/* --- Kaders ----------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------- */

#grafischKaderContainer{ position: absolute; display: none; }
.grafischKaderImage{ z-index: 101; position: relative;}

#logosKaderContainer{ position: absolute; display: none; }
.logosKaderImage{ z-index: 101; position: relative;}

#websKaderContainer{ position: absolute; display: none; }
.websKaderImage{ z-index: 101; position: relative;}

#moodsKaderContainer{ position: absolute; display: none; }
.moodsKaderImage{ z-index: 101; position: relative;}

#filmsKaderContainer{ position: absolute; display: none; overflow: hidden; background-color: #fff;}
.filmsKaderImage{ z-index: 101; position: relative;}
.filmsKaderImageInternetExplorer{ z-index: 101; position: relative;}

.myAnythingContainer{ position: relative;}


/* ------------------------------------------------------------------------------------------------- */
/* --- Control Buttons ----------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------- */

/* --- Control Buttons > Grafisch ------------------------------------------------------------------ */

.myControlsGrafisch{
  position : absolute;
  z-index: 102;
  height:75px;
  margin-left: 248px;
  margin-top: 5px;
  width: 745px;
  background-image: url(../img/trans.png);
}

.myControlsGrafisch .arrows {
 margin-top:10px;
 margin-left:250px;
}

/* --- Control Buttons > Logos ------------------------------------------------------------------ */

.myControlsLogos{
  position : absolute;
  z-index: 102;
  height:75px;
  margin-left: 248px;
  margin-top: -158px;
  width: 745px;
  background-image: url(../img/trans.png);
}

.myControlsLogos .arrows {
 margin-top:10px;
 margin-left:250px;
}

/* --- Control Buttons > Webs -------------------------------------------------------------------- */

.myControlsWebs{
  position : absolute;
  z-index: 102;
  height:75px;
  margin-left: 50px;
  margin-top: -50px;
  width: 745px;
  background-image: url(../img/trans.png);
}

.myControlsWebs .arrows {
 margin-top:10px;
 margin-left:250px;
}

/* --- Control Buttons > Moods -------------------------------------------------------------------- */

.myControlsMoods{
  position : absolute;
  z-index: 102;
  height:75px;
  margin-left: 280px;
  margin-top: -170px;
  width: 745px;
  background-image: url(../img/trans.png);
}

.myControlsMoods .arrows {
 margin-top:10px;
 margin-left:250px;
}

/* --- Control Buttons > Films -------------------------------------------------------------------- */

.myControlsFilms{
  position : absolute;
  z-index: 102;
  height:75px;
  margin-left: 20px;
  margin-top: -90px;
  width: 745px;
  background-image: url(../img/trans.png);
}

.myControlsFilms .arrows {
 margin-top:20px;
 margin-left:170px;
}



/*#websKader .myControls{
   margin-left: 50px;
   margin-top: -100px;

}

#filmsKaderContainer .myControls{
   margin-left: 50px;
   margin-top: -100px;

}*/

/* ------------------------------------------------------------------------------------------------- */
/* --- Opening buttons ----------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------- */

/* Opening buttons > grafisch --------------------------------------------------------------------- */

.but-grafisch{
   position: absolute;
   margin-top: 166px;
   margin-left: 548px;
   width: 167px;
   height: 71px;
   background-image: url(../img/trans.png);
   z-index: 2;
}

.but-grafisch:hover{
   background-image: url(../img/grafisch-but.png);
   background-repeat: none;
   cursor: pointer;
}

/* Opening buttons > logos --------------------------------------------------------------------- */

.but-logos{
   position: absolute;
   margin-top: 202px;
   margin-left: 727px;
   width: 103px;
   height: 43px;
   background-image: url(../img/trans.png);
   z-index: 2;
}

.but-logos:hover {
   background-image: url(../img/logos-but.png);
   background-repeat: none;
   cursor: pointer;
}

/* Opening buttons > Webs --------------------------------------------------------------------------------- */

.but-webs{
   position: absolute;
   margin-top: 305px;
   margin-left: 739px;
   width: 96px;
   height: 41px;
   background-image: url(../img/trans.png);
   z-index: 2;
}

.but-webs:hover{
   background-image: url(../img/webs-but.png);
   background-repeat: none;
   cursor: pointer;
}

/* Opening buttons > moods --------------------------------------------------------------------------------- */

.but-moods{
   position: absolute;
   margin-top: 334px;
   margin-left: 384px;
   width: 110px;
   height: 50px;
   background-image: url(../img/trans.png);
   z-index: 2;
 }

.but-moods:hover{
   background-image: url(../img/moods-but.png);
   background-repeat: none;
   cursor: pointer;
}

/* Opening buttons >  films ------------------------------------------------------------------------------------------------------ */

.but-films{
   position: absolute;
   margin-top: 450px;
   margin-left: 768px;
   width: 173px;
   height: 87px;
   background-image: url(../img/trans.png);
   z-index: 2;
}

.but-films:hover{
   background-image: url(../img/films-but.png);
   background-repeat: none;
   cursor: pointer;
}

/* Opening buttons >  ik ben loeszie ------------------------------------------------------------------------------------------------------ */

.but-ik-ben-loeszie{
  position: absolute;
  margin-top: 518px;
  margin-left: 683px;
  width: 292px;
  height: 156px;
  background-image: url(../img/trans.png);
}

.but-ik-ben-loeszie:hover{
/*   background-image: url(../img/but-ik-ben-loeszie.png);
   background-position: right;*/
   cursor: pointer;
}

/* ------------------------------------------------------------------------------------------------- */
/* --- Opening buttons ----------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------- */

/* home buttons > home ------------------------------------------------------------------------------------------------------ */

.homeBut{
  pointer-events:auto;
  position: absolute;
  margin-top: -107px;
  margin-left: 713px;
  cursor: pointer;
  width: 260px;
  height: 126px;
  background-image: url(../img/trans.png);
  z-index: 999;
}

/* home buttons > grafisch ------------------------------------------------------------------------------------------------------ */

.homeBut.grafisch{
  margin-top: -159px;
  margin-left: 716px;
  width: 257px;
  height: 132px;
}

.homeBut.grafisch:hover{
/*   background-image: url(../img/home-but-grafisch.png);
   background-position: right;
   cursor: pointer;*/
}

/* home buttons > logos ------------------------------------------------------------------------------------------------------ */

.homeBut.logos{
  margin-top: -154px;
  margin-left: 682px;
  width: 291px;
  height: 153px;
}

.homeBut.logos:hover{
/*   background-image: url(../img/home-but-logos.png);
   background-position: right;
   cursor: pointer;*/
}

/* home buttons > webs ------------------------------------------------------------------------------------------------------ */

.homeBut.webs{
  margin-top: -75px;
  margin-left: 713px;
  cursor: pointer;
  width: 260px;
  height: 126px;
}

.homeBut.webs:hover{
/*   background-image: url(../img/home-but-webs.png);
   background-repeat: none;
   cursor: pointer;*/
}
/* home buttons > moods ------------------------------------------------------------------------------------------------------ */

.homeBut.moods{
  margin-top: -188px;
  margin-left: 715px;
  cursor: pointer;
  width: 259px;
  height: 120px;
}

.homeBut.moods:hover{
/*   background-image: url(../img/home-but-moods.png);
   background-repeat: none;
   cursor: pointer;*/
}

/* home buttons > films ------------------------------------------------------------------------------------------------------ */

.homeBut.films{
  margin-top: -150px;
  margin-left: 730px;
  width: 224px;
  height: 98px;
}

.homeBut.films:hover{
/*   background-image: url(../img/home-but-films.png);
   background-position: right;
   cursor: pointer;*/
}

/* home buttons > ik ben loeszie ------------------------------------------------------------------------------------------------------ */

.homeBut.ik-ben-loeszie{
  margin-top: 519px;
  margin-left: 682px;
  width: 291px;
  height: 153px;
}

.homeBut.ik-ben-loeszie:hover{
/*   background-image: url(../img/home-but-ik-ben-loeszie.png);
   background-position: right;
   cursor: pointer;*/
}

/*@media screen and (-webkit-min-device-pixel-ratio:0) {

.homeBut.webs{
  margin-top: -104px;
  margin-left: 713px;
 }

     .homeBut.films{
  margin-top: -180px;
  margin-left: 730px;
}
}*/




.arrowBut{
  cursor: pointer;
}



/* overrule anythingslider.css */

.anythingControls{
  visibility: hidden;
  display: none;
  z-index: -999;
  margin-top: -30px;
}

.anythingControls a span {
  visibility: hidden;
}

a.start-stop span {
  visibility: hidden;
  display: none;
}




.onderschrift{height: 560px; background-repeat:  no-repeat; background-position: bottom right; background-color: #fff}

.onderschrift.kc {background-image: url(../img/onderschriften/gif/onderschrift-KC.gif);}
.onderschrift.autodrop-operatie { background-image: url(../img/onderschriften/gif/onderschrift-autodrop-operatie.gif); }
.onderschrift.lexus-gevangenis {background-image: url(../img/onderschriften/gif/onderschrift-lexus-gevangenis.gif);}
.onderschrift.bonprix {background-image: url(../img/onderschriften/gif/onderschrift-bonprix.gif);}
.onderschrift.hi {background-image: url(../img/onderschriften/gif/onderschrift-hi.gif);}
.onderschrift.nina-satana {background-image: url(../img/onderschriften/gif/onderschrift-nina-satana.gif);}
.onderschrift.sizz{background-image: url(../img/onderschriften/gif/onderschrift-sizz.gif);}
.onderschrift.tomtom-darth-vader {background-image: url(../img/onderschriften/gif/onderschrift-tomtom-darth-vader.gif);}
.onderschrift.autodrop-kantoor {background-image: url(../img/onderschriften/gif/onderschrift-autodrop-kantoor.gif);}
.onderschrift.friesche-vlag {background-image: url(../img/onderschriften/gif/onderschrift-friesche-vlag.gif);}
.onderschrift.loi {background-image: url(../img/onderschriften/gif/onderschrift-loi.gif);}

.onderschrift.vitalu-vragenvuur {background-image: url(../img/onderschriften/gif/onderschrift-vitalu-vragenvuur.gif);}
.onderschrift.iglo-viscuisine {background-image: url(../img/onderschriften/gif/onderschrift-iglo-viscuisine.gif);}
.onderschrift.mikrogids {background-image: url(../img/onderschriften/gif/onderschrift-mikrogids.gif);}

.onderschrift.vodafone-fietsen {background-image: url(../img/onderschriften/gif/onderschrift-vodafone-fietsen.gif);}
.onderschrift.vodafone-tickets {background-image: url(../img/onderschriften/gif/onderschrift-vodafone-tickets.gif);}
.onderschrift.vodafone-zweefmolen {background-image: url(../img/onderschriften/gif/onderschrift-vodafone-zweefmolen.gif);}
.onderschrift.prorail {background-image: url(../img/onderschriften/gif/onderschrift-prorail.gif);}


/* uit 1920 stylesheet */




.hoofd../img{
/*  height: 750px;   */
}

/*../img.kader {
 height: 750px;
}*/



/* ------------------------------------------------------------------------------------------------- */
/* --- sliders  -------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------- */

#sliderGrafisch {
	width: 730px;
	height: 575px;
  background-color: #fff;
}

#sliderLogos {
	width: 490px;
	height: 575px;
  background-color: #fff;
}

#sliderWebs {
	width: 730px;
	height: 575px;
  background-color: #fff;
}

#sliderMoods {
	width: 681px;
	height: 575px;
  background-color: #fff;
}

#sliderFilms {
 width: 795px;
 height: 475px;
 background-color: #000;

}

/*#slider ../img {
  width: 870px;
}*/


/* ------------------------------------------------------------------------------------------------- */
/* --- my AnythingSlider Containers   -------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------- */

.myAnythingContainerGrafisch{
  position: relative;
  margin-top: -590px;
  margin-left: 308px;
  z-index: 3;
}

.myAnythingContainerLogos{
  position: relative;
  margin-top: -680px;
  margin-left: 280px;
  z-index: 3;
}

.myAnythingContainerWebs{
  position: relative;
  margin-top: -702px;
  margin-left: 58px;
  z-index: 3;
}

.myAnythingContainerMoods{
  position: relative;
  margin-top: -720px;
  margin-left: 472px;
  z-index: 3;
}

.myAnythingContainerFilms{
  position: relative;
  margin-top: -570px;
  margin-left: 0px;
  z-index: 3;
}



.res1920{
  display: block;
}

/*.myControls{
  position: absolute;
  top: 650px;
   background-color:  #009999;
    margin-left: 100px;

}*/

/*.homeBut{
   background-color:  #009999;
margin-left: 100px;
}*/

