preloader@charset "utf-8";

.ie {
	display:none;
}

/* Preloader */
#preloader {
	color:#fff;
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	/*background-color:#f5d491;  change if the mask should have another color then white */
	z-index:3; /* makes sure it stays on top */
	
}
#preloader .h-text {
	
}

#status {
	font-family: 'Lato', sans-serif;
    font-size: 16px;
    font-weight: 100;
	width:200px;
	height:200px;
	text-align:center;
	position:absolute;
	left:30%; /* centers the loading animation horizontally one the screen */
	top:25%; /* centers the loading animation vertically one the screen */
	/*background-image:url(../img/schedaloading.gif); 
	background-repeat:no-repeat;
	background-position:center;*/
	margin:0px 0 0 -100px; 
}




#preloader .h-text h1 span {
	color:#f5d491;
	animation: myfirst 7s;
    -webkit-animation: myfirst 7s; /* Safari and Chrome */
}
#preloader .h-text h1 span.v {
	color:#f5d491;
	animation: myfirsthv 7s;
    -webkit-animation: myfirsthv 7s; /* Safari and Chrome */
}
#preloader .h-text h2.v {
	color: #f5d491;
	top:-140px;
	left:297px;
	font-size:55px;
	font-weight:lighter;
	position:absolute;
	animation: myfirsth2 7s;
    -webkit-animation: myfirsth2 7s; /* Safari and Chrome */
}
#preloader .h-text p span {
	color:#ffffff;
	animation: myfirstp 7s;
    -webkit-animation: myfirstp 7s; /* Safari and Chrome */
	
}
#preloader .h-text p.scroll {
	color: #ffffff;
	animation: myfirstscroll 12s;
    -webkit-animation: myfirstscroll 12s; /* Safari and Chrome */
}


/* animation fade img intro */

#imgintro{
  animation: animationFrames ease-in-out 7s;
  animation-iteration-count: 1;
  transform-origin: ;
  animation-fill-mode:forwards; /*when the spec is finished*/
  -webkit-animation: animationFrames ease-in-out 7s;
  -webkit-animation-iteration-count: 1;
  -webkit-transform-origin: ;
  -webkit-animation-fill-mode:forwards; /*Chrome 16+, Safari 4+*/ 
  -moz-animation: animationFrames ease-in-out 7s;
  -moz-animation-iteration-count: 1;
  -moz-transform-origin: ;
  -moz-animation-fill-mode:forwards; /*FF 5+*/
  -o-animation: animationFrames ease-in-out 7s;
  -o-animation-iteration-count: 1;
  -o-transform-origin: ;
  -o-animation-fill-mode:forwards; /*Not implemented yet*/
  -ms-animation: animationFrames ease-in-out 7s;
  -ms-animation-iteration-count: 1;
  -ms-transform-origin: ;
  -ms-animation-fill-mode:forwards; /*IE 10+*/
}

div.preloadmobile {
	 animation: animationFrames ease-in-out 3s;
  animation-iteration-count: 1;
  transform-origin: ;
  animation-fill-mode:forwards; /*when the spec is finished*/
  -webkit-animation: animationFrames ease-in-out 3s;
  -webkit-animation-iteration-count: 1;
  -webkit-transform-origin: ;
  -webkit-animation-fill-mode:forwards; /*Chrome 16+, Safari 4+*/ 
  -moz-animation: animationFrames ease-in-out 3s;
  -moz-animation-iteration-count: 1;
  -moz-transform-origin: ;
  -moz-animation-fill-mode:forwards; /*FF 5+*/
  -o-animation: animationFrames ease-in-out 3s;
  -o-animation-iteration-count: 1;
  -o-transform-origin: ;
  -o-animation-fill-mode:forwards; /*Not implemented yet*/
  -ms-animation: animationFrames ease-in-out 3s;
  -ms-animation-iteration-count: 1;
  -ms-transform-origin: ;
  -ms-animation-fill-mode:forwards; /*IE 10+*/
	
}

@keyframes animationFrames{
  0% {
    left:0px;
    top:0px;
    opacity:0;
    transform:  rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg) ;
  }
  30% {
    left:0px;
    top:0px;
    opacity:0;
    transform:  rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg) ;
  }
  100% {
    left:0px;
    top:0px;
    opacity:1;
    transform:  rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg) ;
  }
}

@-moz-keyframes animationFrames{
  0% {
    left:0px;
    top:0px;
    opacity:0;
    -moz-transform:  rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg) ;
  }
  30% {
    left:0px;
    top:0px;
    opacity:0;
    transform:  rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg) ;
  }
  100% {
    left:0px;
    top:0px;
    opacity:1;
    -moz-transform:  rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg) ;
  }
}

@-webkit-keyframes animationFrames {
  0% {
    left:0px;
    top:0px;
    opacity:0;
    -webkit-transform:  rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg) ;
  }
  30% {
    left:0px;
    top:0px;
    opacity:0;
    transform:  rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg) ;
  }
  100% {
    left:0px;
    top:0px;
    opacity:1;
    -webkit-transform:  rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg) ;
  }
}

@-o-keyframes animationFrames {
  0% {
    left:0px;
    top:0px;
    opacity:0;
    -o-transform:  rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg) ;
  }
  30% {
    left:0px;
    top:0px;
    opacity:0;
    transform:  rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg) ;
  }
  100% {
    left:0px;
    top:0px;
    opacity:1;
    -o-transform:  rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg) ;
  }
}

@-ms-keyframes animationFrames {
  0% {
    left:0px;
    top:0px;
    opacity:0;
    -ms-transform:  rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg) ;
  }
  30% {
    left:0px;
    top:0px;
    opacity:0;
    transform:  rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg) ;
  }
  100% {
    left:0px;
    top:0px;
    opacity:1;
    -ms-transform:  rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg) ;
  }
}

/* color h1 */
@keyframes myfirst
{
from {color: #000000;}
to {color: #f5d491;}
}

@-webkit-keyframes myfirst /* Safari and Chrome */
{
from {color: #000000;}
to {color: #f5d491;}
}

@keyframes myfirstp
{
from {color: #000000;}
to {color: #ffffff;}
}

@-webkit-keyframes myfirstp /* Safari and Chrome */
{
from {color: #000000;}
to {color: #ffffff;}
}

@keyframes myfirst
{
0%   {color: #000000;}
30%  {color: #000000;}
60%  {color: #f5d491;}
100% {color: #f5d491;}
}

@-webkit-keyframes myfirst /* Safari and Chrome */
{
0%   {color: #000000;}
30%  {color: #000000;}
60%  {color: #f5d491;}
100% {color: #f5d491;}
}


@keyframes myfirstp
{
0%   {color: #000000;}
25%  {color: #000000;}
60%  {color: #ffffff;}
100% {color: #ffffff;}
}

@-webkit-keyframes myfirstp /* Safari and Chrome */
{
0%   {color: #000000;}
25%  {color: #000000;}
60%  {color: #ffffff;}
100% {color: #ffffff;}
}

.h-text h1 {
	color:#f5d491;
	-webkit-animation: myfirst 7s ;
	-moz-animation: myfirst 7s;    
	-o-animation: myfirst 7s;      
	animation: myfirst 7s;
}

.h-text p {
	color:#ffffff;
	-webkit-animation: myfirstp 7s ;
	-moz-animation: myfirstp 7s;    
	-o-animation: myfirstp 7s;      
	animation: myfirstp 7s;
}