html,
body,
div,
span,
p,
a,
del,
em,
img,
ol,
ul,
li,
fieldset,
form,
label {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
@font-face {
  font-family: ProximaNova;
  src: url('ProximaNova-Bold.otf');
}
html,
body {
  line-height: 1;
  min-height: 100%;
  font-family: 'ProximaNova', sans-serif;
  font-size: 20px;
  line-height:40px;
  text-transform:uppercase;
  color: #000;
}
body {
  background: #fff;
}
ol,
ul {
  list-style: none;
}
p {
  margin: 1em 0;
  line-height: 1.1em;
}
q {
  font-style: italic;
  color: #333;
}
h1 {
  font-size: 2.91em;
  margin: 0;
}
h1 > small {
  text-align: right;
  display: inline-block;
  font-size: .71em;
  text-indent: 15em;
  color: #444;
}
h2 {
  color: inherit;
  font-size: 1.91em;
  margin: 2em 0 1em 0;
}
h2:first-child {
  margin-top: 0;
}
h3 {
  color: #333;
  font-size: 1.41em;
  margin: 1em 0;
}
h4 {
  color: #444;
  font-size: 1.11em;
  margin: 1em 0;
}
#progress {
  height: 2%;
  background: #444;
  bottom: 0;
  z-index: 200;
}
#bg1,
#bg2,
#bg3 {
  z-index: 50;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../images/bubbles.png) repeat 0 0;
}
#bg2 {
  z-index: 49;
  background-image: url(../images/bubbles2.png);
}
#bg3 {
  z-index: 48;
  background-image: url(../images/bubbles3.png);
}
#intro {
  width: 80%;
  left: 50%;
  top: 1em;
  margin-left: -40%;
  padding: 2em;
  background: #fff;
  text-align: center;
  -webkit-transform-origin: 0 0;
  -moz-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  -o-transform-origin: 0 0;
  transform-origin: 0 0;
  -webkit-border-radius: 1em;
  -moz-border-radius: 1em;
  border-radius: 1em;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#zachsfooter{
font-size:15px;
font-family: "Oswald", "Helvetica Neue", Helvetica, Arial, sans-serif;
line-height: normal;
}
#intro .arrows {
  font-size: 2em;
  color: #09f;
}
#transform {
  width: 70%;
  left: 50%;
  top: 20%;
  margin-left: -35%;
  text-align: center;
  font-size: 150%;
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}
#properties {
  width: 100%;
  height: 100%;
  padding-top: 10%;
  text-align: center;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#easing_wrapper {
  width: 100%;
  height: 100%;
}
#easing {
  top: 10%;
  width: 50%;
  z-index: 101;
}
.drop {
  background: #09f;
  font-weight: bold;
  padding: 1em;
}
.btn:hover {
  color: transparent;
  text-decoration: inherit;
  background-color: transparent;
}
#download {
  width: 80%;
  left: 10%;
  height: 80%;
  padding: 3em;
  border: 0 solid #222;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.twitter-share-button,
.twitter-follow-button {
  vertical-align: middle;
}

#title, #metaudio{display:none}
#aftiteling{position:fixed; width:950px; height:800px; left:50%; margin-left:-475px; z-index:1000}

#smoke{background-position:0px 0px}

.abs{position:absolute !important;}
.topleft{left:0px; top:0px;}

#animation{position:absolute; left:50%; top:50%;}

a img{border:none}

#flag{display:block; position:fixed; top:25px; right:100px; z-index:10000}

.skrollr-mobile #skrollr-body{width:950px;}
.bgcolor{position:fixed}
.skrollr-mobile .bgcolor{position:absolute}

.skrollr-mobile #skrollr-body{width:950px;}
.skrollr-mobile .resize{height:600px; margin-left:-400px !important;}
.skrollr-mobile .bottom{bottom:-65px !important}

.ipad, .noipad{display:none}

#scrolldown{display:none}

.scene{position:absolute; width:100%; height:100%; display:none}
.btn{cursor:pointer; opacity:0}
.btn:hover{opacity:1}
.txtbox{position:absolute !important; top:0px;  text-align:center;}
.no-borderimage .txtbox{
	border:1px #000 solid
}
.borderimage .txtbox{
	border:3px solid #000;
	-webkit-border-image:url(../images/kader/border.png) 3 3 round; /* Safari 5 */
	-o-border-image:url(../images/kader/border.png) 3 3 round; /* Opera */
	-moz-border-image:url(../images/kader/border.png) 3 3 round;
	-ms-border-image:url(../images/kader/border.png) 3 3 round;
	border-image:url(../images/kader/border.png) 3 3 round;
}
.txtbox .txt{
	background-color:#fff;padding:10px;
}
.tlk{
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
/*background:url(../images/kader/boven.png) 0px 0px no-repeat, url(../images/kader/onder.png) 0px 100% no-repeat, url(../images/kader/links.png) 0px 0px no-repeat, url(../images/kader/rechts.png) 100% 0px no-repeat;*/
.choice{opacity:1 !important; border:1px #f00 solid !important}
.over{color:#8b5d5f; border:#8b5d5f 2px solid}
.inlinechild span{display:inline !important; position:relative !important; text-transform:none;}
.talkright{position:absolute !important; right:10px; bottom:-45px; width:44px; height:50px; background:url(../images/TEKSTPIJLTJES-rechts.png)}
.talkleft{position:absolute !important; left:10px; bottom:-45px; width:44px; height:50px; background:url(../images/TEKSTPIJLTJES-links.png)}

#angel, #devil{cursor:pointer}

#start{margin-left:425px; display:block; background:0px 0px;}
#start:hover{background:0px -62px}

#reload{display:inline-block; vertical-align:middle; background:0px 0px;}
#reload:hover{background:0px -100px}

.btn{background:rgba(255, 255, 255, 0);}
img{
  max-width:inherit;}