/* ANIMATION ELEMENTS */

.animation {
	overflow: hidden;
}

.animation span.textp {
	font-size: 130%;
	line-height: 1.6em;
        font-family: Memphis, Arial, Verdana, SimSun, 宋体, STXihei, 华文细黑, sans-serif;
	cursor: default;
	text-shadow: 
	0px 0px 5px rgba(255,255,255,0.1), 
	0px 0px 7px rgba(255,255,255,0.1), 
	0px 0px 12px rgba(255,255,255,0.1), 
	0px 0px 15px rgba(255,255,255,0.1), 
	0px 0px 17px rgba(255,255,255,0.2), 
	0px 0px 20px rgba(255,255,255,0.3),
	0px 0px 25px rgba(255,255,255,0.4),
	0px 0px 30px rgba(255,255,255,0.5),
	0px 0px 40px rgba(255,255,255,0.6);
}

html[lang="fi"] .animation span.textp {
	-webkit-hyphens: auto;
   	-moz-hyphens: auto;
   	-ms-hyphens: auto;
        hyphens: auto;
}

.animation span.textp .white {
	color: white;
	text-shadow: 
	rgba(0, 0, 0, 0.1) 0px 0px 5px, 
	rgba(0, 0, 0, 0.1) 0px 0px 7px, 
	rgba(0, 0, 0, 0.1) 0px 0px 12px, 
	rgba(0, 0, 0, 0.1) 0px 0px 15px, 
	rgba(0, 0, 0, 0.2) 0px 0px 17px, 
	rgba(0, 0, 0, 0.3) 0px 0px 20px, 
	rgba(0, 0, 0, 0.4) 0px 0px 25px, 
	rgba(0, 0, 0, 0.5) 0px 0px 30px, 
	rgba(0, 0, 0, 0.6) 0px 0px 40px;
}

.ios .animation span.textp {
        font-family: Arial, Verdana, SimSun, 宋体, STXihei, 华文细黑, sans-serif;
}

.animation .button.done, .animation .button.done .shadow {
	display: inline-block;
 	-o-transition: all .1s ease-in-out;
        -ms-transition: all .1s ease-in-out;
        -moz-transition: all .1s ease-in-out;
        -webkit-transition: all .1s ease-in-out;
        transition: all .1s ease-in-out;
}

.animation .button.done:active, .animation .button.done:active .shadow {
 	-o-transition: all .05s ease-in-out;
        -ms-transition: all .05s ease-in-out;
        -moz-transition: all .05s ease-in-out;
        -webkit-transition: all .05s ease-in-out;
        transition: all .05s ease-in-out;
}

.animation .button.done:active {
	margin-top: 0.8em;
	margin-bottom: 0.4em;
}

.animation .button.done:active .shadow {
	bottom: -2em;
}

.animation .button .shadow {
	position: absolute;
	left: 0;
	bottom: -2em;
	width: 100%;
	white-space: normal;
}

.animation .button .shadow img {
	width: 100%;
	height: 35px;
}

.animation img {
	width: 100%;
	position: relative;
}

.animation h1.title {
        display: inline-block;
	position: relative;
        z-index: 0;
	float: left;
	line-height: 1.1;
	vertical-align: baseline;
	cursor: default;
}

.animation h1.title small {
	display: block;
	font-size: 50%;
	line-height: 1.4;
}

.animation h1.title .text {
        display: inline-block;
        font-family: MemphisBold, Arial,  Verdana, SimSun, 宋体, STXihei, 华文细黑, sans-serif;
	font-weight: normal;
        color: #FFF;
        padding: 0.5em 0.7em;
        text-transform: uppercase;
        border-radius: 2px;
	white-space: nowrap;
}

.animation h1.title .text .trademark {
        font-family: Arial,  Verdana, SimSun, 宋体, STXihei, 华文细黑, sans-serif;
	font-weight: normal;
	font-size: 55%;
	vertical-align: top;
	line-height: 1.7em;
}

.mac .animation h1.title .text {
 	padding: 0.8em 0.7em 0.5em 0.7em;
}

.AR .bigbg h1.title {
	font-size: 350%;
}

.lang-zh .animation h1.title .text, .ZH .animation h1.title .text {
	font-weight: bold;
}

.animation h1.title .tip {
        display: block;
        border-style:solid;
        border-width: 1em 0 1em 1em;
        width:0;
        height:0;
        position: absolute;
        right: 0.55em;
	bottom: -1.6em;
        z-index: 1;
	float: right;
}

.animation h1.title .shadow {
	width: 100%;
        position: absolute;
	left: 0px;
	top: 110%;
        z-index: 0;
}

.animation h1.title .shadow img {
        width: 100%;
	height: 69px;
}

.animation .video {
	width: 90%;
}

.animation .video #css-poster {
	position: relative;
	z-index: 1;
}

.animation .video .flowplayer {
	width: 81%;
	margin: 0 9.5%;
}

.animation .video .shadow {
	position: relative;
        z-index: 0;
}

.animation .video .shadow img {
	margin-top: -4%;
	width: 100%;
}

/* DIFFRENET ANIMATION SIZES */

.bigbg .button {
	position: relative;
	font-size: 140%;
        font-family: MemphisBold, Arial,  Verdana, SimSun, 宋体, STXihei, 华文细黑, sans-serif;
        line-height: 1em;
	text-transform: uppercase;
	white-space: nowrap;
	padding: 0.15em 0.85em 0.4em;
}

.lang-zh .bigbg .button, .ZH .bigbg .button {
	font-family: Arial,  Verdana, SimSun, 宋体, STXihei, 华文细黑, sans-serif;
	font-weight: bold;
}

.bigbg .button .arr {
        line-height: 1em;
	padding: 0;
	vertical-align: baseline;
}

.bigbg h1.title {
	font-size: 280%;
}

.bigbg h1.title .tip {
	font-size: 110%;
}

.mediumbg h1.title .text {
	font-size: 140%;
}

.mediumbg h1.title .shadow {
	top: 120%;
}

.mediumbg h1.title .shadow img {
	max-height: 40px;
}

.mediumbg span.textp {
	font-size: 110%;
}

.smalltitles h1.title .text {
	font-size: 100%;
}

.smallbg h1.title {
	font-size: 200%;
}

.smallbg h1.title .text {
	line-height: 1em;
	vertical-align: bottom;
}

.smallbg h1.title .tip {
	font-size: 80%;
}

.smallbg h1.title .shadow img {
	height: 35px;
}

/* ANIMATION BASICS */

.animation {
        position: relative;
	z-index: 0;
}

.animation .wrap {
	position: relative;
	height: 100%;
}

.background-cover {
        top: 0;
        z-index: 0;
	opacity: 0;
	-webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
	will-change: -webkit-transform, -moz-transform, -ms-transform, -o-transform, transform;
	-webkit-transform-style: preserve-3d; 
	-webkit-backface-visibility: hidden;
	-webkit-perspective: 1000;
        transition: opacity .5s ease-in-out;
}

.animation .slide {
	height: 100%;
	position: relative;
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
	will-change: -webkit-transform, -moz-transform, -ms-transform, -o-transform, transform, opacity; 
	z-index: 1;
	-webkit-transform-style: preserve-3d; 
	-webkit-backface-visibility: hidden;
}

.animation .elem img {
	display: inline-block;
	float: left;
}

.animation .slide .elem {
	opacity: 0;
 	-webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transform: translateZ(0);
        -moz-transform: translateZ(0);
        -ms-transform: translateZ(0);
        -o-transform: translateZ(0);
        transform: translateZ(0);
	will-change: -webkit-transform, -moz-transform, -ms-transform, -o-transform, transform, top, left, bottom, right, opacity; 
}

.ie7 .animation .slide .elem, .ie8 .animation .slide .elem {
	display: none;
}

.animation .prevslide, .animation .nextslide {
        position: absolute !important;
        font-size: 260% !important;
        font-family: Arial,  Verdana, SimSun, 宋体, STXihei, 华文细黑, sans-serif;
        line-height: 100%;
        vertical-align: middle;
        text-align: center;
        font-weight: 400;
	z-index: 20;
}

.animation .prevslide, .animation .nextslide, .animation .prevslide:active, .animation .nextslide:active { 
	position: absolute;
        top: 50%;
	bottom: none !important;
	margin: -0.6em 0 0 0;
}

.animation .prevslide {
        left: 0px;
        padding: 0 0.4em 0.17em 0.3em !important;
	margin: -0.6em 0 0 0;
	border-radius: 0 4px 4px 0;
	
}

.animation .nextslide {
        right: 0px;
        padding: 0 0.3em 0.17em 0.4em !important;
	margin: -0.6em 0 0 0;
	border-radius: 4px 0 0 4px;
}

.mobile .animation .prevslide, .tablet .animation .prevslide, mobile .animation .nextslide, .tablet .animation .nextslide {
	display: block;
}

.ie7 .prevslide, .ie7 .nextslide {
	margin-top: -1.7em;
	padding-bottom: 12px;
}

#contColor .prevslide, #contColor .nextslide {
	background: #111;
	border-top: 1px solid #333;
	border-left: 1px solid #111010;
	border-right: 1px solid #111010;
	border-bottom: 1px solid #000;
	filter: none;
}

#contColor .prevslide:hover, #contColor .nextslide:hover {
	background-color: #191919;
}

/* ADJUST HEIGHT */
.adjustheight {
	float: left; 
	width: 100%;
}