@charset "UTF-8";
/* CSS Document */
body{
                margin:0;
				
                font-size: 18px;
				line-height:26px;
                  font-family: 'Helvetica Neue','Arial', sans-serif;
				color: #312B25;
	
  				background: radial-gradient(#97b6ca, #66899d);
 }
 
 
 
 #impress{
	 -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transform-style: preserve-3d;
	 

 }

#overlay{
	
	position:absolute;
	z-index:-1000;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-image:url(../images/bg/noise.jpg);
	background-repeat:repeat;
	opacity:0.4;
	
}

#logo img{
	position:absolute;
	
	
}

#logo img{
	
	margin:20px;
	margin-left:10px;
	width:160px;
	
}


.step .fading{
	
	opacity:0;
	transition: opacity 1s;

}

.step.active .fading{
	opacity:1;
	transition: opacity 2s;
}



.illu {
	position: absolute;
	opacity:0;
	transition: transform 3s, opacity 3s;
	transition-delay: 0s;
}


.illu img{
transition: all 5s;
transform: scale(0.1);
transition-delay: 0s;
}


.illu .container{
transition: all 5s;
transform: scale(0.1);
transition-delay: 0s;
}

.illu .container img{
		

transition: all 5s;
transform: scale(1);
transition-delay: 0s;
}




.step.active .illu{
opacity:1;	
}
.step.active .illu img{

transform:  scale(1.1);
}

.step.active .illu .container{

transform:  scale(1.1);
}





.title{

transform: translateZ(-1px);
	opacity:0;
	transition: top 1s, opacity 1.5s;
	top:-350px;
	transition-timing-function: ease;
	transition-delay: 1s;
	position: relative;
	color: #fff;
	font-size:52px;
	text-align:left;
	line-height:52px;
	margin-left:auto;
	margin-right:47px;
	letter-spacing:-2.5px;
	margin-bottom:35px;
	
	width:375px;	
}



.step .column{

	height:100%;
	position:relative;
	transition: top 1s, opacity 1.5s;
	transition-delay: 1.5s;
	opacity:0;
	top:50px;
	margin-top:-10px;
	margin-left:auto;
	margin-right:40px;
	
	
	width:380px;	
	
}
.step .column p{
	-webkit-margin-after: 2em;
	margin-after: 2em;
	
}


.step p a{
	
	
	color:#fff;
}

#startCircle{
	
	
	background-color:#6EC7E1;
	border-radius: 50%;
	transform:translateZ(-300px);
	width:550px;
	height:550px;
	position:absolute;
	top:-40px;
	left:-40px;
	
}


#startButton{
	
	
	cursor:pointer;
	color:#fff;
	text-align:center;
	width:470px;
	height:470px;
	
}


#startButton h1{
	font-size:35px;
	opacity:0.5;
	letter-spacing:-1px;
	
	margin-top:100px;
	margin-bottom:0;
	
}

#startButton h2{
	font-size:50px;
	line-height:50px;
	letter-spacing:-3px;
	margin:10px;
	padding:0;
}


#startButton p{
	margin:10px;	
}


#startButton h3{
	color:#4B6875;
	font-size: 20px;
	letter-spacing:-1px;
	line-height: 30px;
	margin: auto;
	margin-top: 10px;
	margin-bottom: 25px;
	text-align: center;
	width: 350px;
}


.button{
	white-space: nowrap;
	position:relative;
	opacity:0;
	transition: top 1s, opacity 1s;
	transition-delay: 1.8s;
	cursor:pointer;
	background-color:#6EC7E1;	
	padding-left:2px;
	border-radius: 50%;
	margin-left:-5px;
	margin-right:15px;
	margin-top:15px;
	width:38px;
	height:40px;
	color:#fff;
	font-family: 'ArrrowsRegular';
	font-size:28px;
	line-height:40px;
	text-align:center;
	top:50px;
}

.arrow{
	position:relative;
	top:2px;
	
	font-family: 'ArrrowsRegular'; 
	font-size:18px;
	
}

.buttonText{
	float:left;
	text-align:left;
	margin-left:-5px;
	font-family: 'Helvetica Neue','Arial', sans-serif;
	width:auto;
	padding-left:21px;
	padding-right:21px;
	font-size:18px;
	line-height:39px;
	border-radius:25px;
	font-weight:bold;
	letter-spacing:-0.5px;
	display: inline-block;
}

.buttonTeaser{
	letter-spacing:-0.5px;
	background-color:#fff;	
	color:#6EC7E1;
	text-align:left;
	font-family: 'Helvetica Neue','Arial', sans-serif;
	display: inline-block;
	float:none;
	width:auto;
	position:absolute !important;
	
	margin-left:-5px;
	padding-left:21px;
	padding-right:21px;
	font-size:18px;
	line-height:39px;
	border-radius:25px;
	font-weight:bold;
	opacity:0;
	text-decoration:none;
	top:580px !important;
	left:605px;
	transition-delay: 2s;
	
	
}





.step.active .column{
opacity:1;
top:0;
}

.step.active .title{
top:0;
opacity:1;	
}

.step.active .button{
opacity:1;	
top:0;
}

.step.active .buttonTeaser{
	opacity:1;
	top:580px !important;
	
	
}






.step {

pointer-events: none;
 margin: 0;
    opacity: 1;
  
	
     width:1024px;
	 height:650px;	
	
}





.step.active { 

 pointer-events: auto;
}


 

            #start{
                text-align:center;
                width:1024px;
				
               
            }
           

         
            .hint_text{
				margin-top: 120px;
                
                background-color:#282a2f;
                padding:15px;
				border: 1px solid #484d52;
				border-radius: 5px;
				font-size: 18px;
				
            }



            .fallback-message {
               	color: #eee;
                line-height: 1.3;
                width: 780px;
                padding: 10px 10px 0;
                margin: 20px auto;
                border: 1px solid #E4C652;
                border-radius: 10px;
              
            }

            .fallback-message p {
                margin-bottom: 10px;
            }

            .impress-supported .fallback-message {
                display: none;
            }
			em{
				font-style: normal;
				border-bottom: 1px solid #484d52;
				padding-bottom: 2px;
				color: #d5a830;
			}


#menu{
	display: none;
	opacity:1;
	width:250px;
	height:220px;
	background-color:#6EC7E1;
	position:absolute;
	
	top:0px;
	right:0px;
	padding-top:25px;
	z-index:0;
	
	
}

#menu ul{
	list-style-type:none;
	
	padding:0;
	padding-left:35px;
}

#menu ul li{
	list-style-type:none;
	margin:0;
}


#menu ul a{
	opacity: 0.7;
	transition: opacity 0.15s;
	line-height:35px;
	text-decoration:none;
	color:#fff;
	font-weight:bold;
}


#menu ul a:hover{
	opacity: 1;
	
}


#lang-nav{
	
	margin-left:35px;
	font-size:12px;
	font-weight:bold;
color:#fff;

opacity:1 !important;
	
}

#lang-nav span{
	margin-left:5px;
	margin-right:5px;
	cursor:default;
	opacity:0.25;
}


#lang-nav a{
	text-decoration:none;
	color:#fff;
	opacity:0.5;
	
}


.hamburger {
	transform:scale(0.9);
outline: 0; 
box-shadow: none !important; 
position:absolute;
top:10px;
right:0px;
  padding: 15px 15px;
  display: inline-block;
  cursor: pointer;
  transition-property: opacity, -webkit-filter;
  transition-property: opacity, filter;
  transition-property: opacity, filter, -webkit-filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
 
  border: 0;
  margin: 0;
  overflow: visible; }
  .hamburger:hover {
  opacity: 0.7; }

.hamburger-box {
  width: 40px;
  height: 24px;
  display: inline-block;
  position: relative; }

.hamburger-inner {
  display: block;
  top: 50%;
  margin-top: -2px; }
  .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    width: 30px;
    height: 4px;
    background-color: #fff;
    border-radius: 4px;
    position: absolute;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    transition-duration: 0.15s;
    transition-timing-function: ease; }
  .hamburger-inner::before, .hamburger-inner::after {
    content: "";
    display: block; }
  .hamburger-inner::before {
    top: -10px; }
  .hamburger-inner::after {
    bottom: -10px; }


/*
 * Hamburger Menu Squeeze
 */
.hamburger--squeeze .hamburger-inner {
  transition-duration: 0.1s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--squeeze .hamburger-inner::before {
    transition: top 0.1s 0.14s ease, opacity 0.1s ease; }
  .hamburger--squeeze .hamburger-inner::after {
    transition: bottom 0.1s 0.14s ease, -webkit-transform 0.1s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.14s ease, transform 0.1s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.14s ease, transform 0.1s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.1s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--squeeze.is-active .hamburger-inner {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  transition-delay: 0.14s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  .hamburger--squeeze.is-active .hamburger-inner::before {
    top: 0;
    opacity: 0;
    transition: top 0.1s ease, opacity 0.1s 0.14s ease; }
  .hamburger--squeeze.is-active .hamburger-inner::after {
    bottom: 0;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    transition: bottom 0.1s ease, -webkit-transform 0.1s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease, transform 0.1s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease, transform 0.1s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.1s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1); }




.illu1a{transition-delay: 0s; left:-240px; bottom:-350px;transform:scale3D(1.5,1.5,1.5) translateZ(-240px);opacity:0;}
.illu1b{transition-delay: 3s;left:-240px; bottom:-350px;transform:scale3D(1.5,1.5,1.5) translateZ(-240px);opacity:0;}
.illu1c{transition-delay: 6s;left:-240px; bottom:-350px;transform:scale3D(1.5,1.5,1.5) translateZ(-240px);opacity:0;}



.illu2{left:1300px; bottom:350px;transform: translateZ(-640px);}
.illu3{left:-100px; bottom:-220px; transform: scale3D(1.8,1.8,1.8)  translateZ(-450px);}

.illu3-0{top:0; transform: scale3D(1.8,1.8,1.8) translateZ(-450px)!important ; opacity:0; transition: all 2s; transition-delay:  6s !important;  position:absolute; left:0; transform:scale(1.1) !important;}

.step.active .illu .illu3-0{opacity:1;}
 .illu3-2 { left:250px; bottom:1840px; transition: all 2s; transition-delay:3s;}
.step.active .illu3-2 {left:325px; bottom:545px; }

.illu3-1 { left:-300px; bottom:1840px; transition: all 2s; transition-delay:3.1s; }
.step.active .illu3-1 {left:180px; bottom:535px; }

 .illu3-3 { left:-100px; bottom:1840px; transition: all 2s;transition-delay:2.8s; }
.step.active .illu3-3 {left:200px; bottom:525px; }

 


.illu3-7 { left:350px; bottom:1840px; transition: all 2s; transition-delay:2.4s;}
.step.active .illu3-7 {left:270px; bottom:480px; }

.illu3-6 { left:320px; bottom:1840px; transition: all 2s; transition-delay:2.3s;}
.step.active .illu3-6 {left:300px; bottom:450px; }

 .illu3-5 { left:300px; bottom:1840px; transition: all 2s; transition-delay:2.1s;}
.step.active .illu3-5 {left:230px; bottom:400px; }

.illu3-4 { left:0; bottom:1840px; transition: all 2s; transition-delay:2.5s;}
.step.active .illu3-4 {left:295px; bottom:330px; }


.illu4{left:-240px; bottom:-220px; transform: scale3D(1.8,1.8,1.8)  translateZ(-450px);}
.illu5{left:300px; bottom:-50px; transform:translateZ(-150px); width: 250px;}

.illu6a{transition-delay: 0s;left:-360px; bottom:-220px; transform: scale3D(1.5,1.5,1.5) translateZ(-450px);}
.illu6b{transition-delay: 3s;left:-360px; bottom:-220px; transform: scale3D(1.5,1.5,1.5) translateZ(-450px);}
.illu6c{transition-delay: 6s;left:-360px; bottom:-220px; transform: scale3D(1.5,1.5,1.5) translateZ(-450px);}

.illu7{left:-50px; bottom:20px; transform:translateZ(-50px);}
.illu8{left:-100px; bottom:-100px; transform:translateZ(-450px);}
.illu9{left:-300px; bottom:-50px; transform: scale3D(1.5,1.5,1.5) translateZ(-450px);}
.illu10{left:-900px; bottom:-200px; transform:translateZ(-450px); width:2550px;}
.illu11{left:-190px; bottom:-100px; transform:translateZ(-450px);}
.illu12{left:-20px; bottom:-120px; transform:scale3D(1.5,1.5,1.5) translateZ(-450px);}
.illu13{left:-200px; bottom:0px; transform: translateZ(-450px);}
.illu14{left:160px; bottom:50px; transform:   translateZ(-150px);width: 400px;}
.illu15{left:-180px; bottom:-60px; transform: translateZ(-450px) scale3D(1.1,1.1,1.1);}

.illu16{left:-240px; bottom:-200px;transform: scale3D(1.5,1.5,1.5) translateZ(-240px);width: 1500px;}