@font-face {
    font-family: 'futurafuturiscbold';
    src: url('../font/webfontkit-20131129-095239/pt_futurafuturis_extrabold_cyrillic-futuris.eot');
    src: url('../font/webfontkit-20131129-095239/pt_futurafuturis_extrabold_cyrillic-futuris.eot?#iefix') format('embedded-opentype'),
         url('../font/webfontkit-20131129-095239/pt_futurafuturis_extrabold_cyrillic-futuris.woff') format('woff'),
         url('../font/webfontkit-20131129-095239/pt_futurafuturis_extrabold_cyrillic-futuris.ttf') format('truetype'),
         url('../font/webfontkit-20131129-095239/pt_futurafuturis_extrabold_cyrillic-futuris.svg#futurafuturiscbold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'futurafuturiscregular';
    src: url('../font/webfontkit-20131129-095239/pt_futurafuturis_medium_cyrillic-futuris.eot');
    src: url('../font/webfontkit-20131129-095239/pt_futurafuturis_medium_cyrillic-futuris.eot?#iefix') format('embedded-opentype'),
         url('../font/webfontkit-20131129-095239/pt_futurafuturis_medium_cyrillic-futuris.woff') format('woff'),
         url('../font/webfontkit-20131129-095239/pt_futurafuturis_medium_cyrillic-futuris.ttf') format('truetype'),
         url('../font/webfontkit-20131129-095239/pt_futurafuturis_medium_cyrillic-futuris.svg#futurafuturiscregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'futurafuturislightclightc';
    src: url('../font/webfontkit-20131129-095239/pt_futurafuturis_light_cyrillic-futuris.eot');
    src: url('../font/webfontkit-20131129-095239/pt_futurafuturis_light_cyrillic-futuris.eot?#iefix') format('embedded-opentype'),
         url('../font/webfontkit-20131129-095239/pt_futurafuturis_light_cyrillic-futuris.woff') format('woff'),
         url('../font/webfontkit-20131129-095239/pt_futurafuturis_light_cyrillic-futuris.ttf') format('truetype'),
         url('../font/webfontkit-20131129-095239/pt_futurafuturis_light_cyrillic-futuris.svg#futurafuturislightclightc') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* common classes */
.debug{
	-webkit-box-shadow: 0 0 0 1px red;
	box-shadow: 0 0 0 1px ;
}
.debugG{border:dashed 1px Green;}
.debugY{border:dashed 1px Yellow;}
.debugB{border:dashed 1px Blue;}
.debugW{
	-webkit-box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.15);
	box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.15);
}
html {
	width: 100%; height: 100%;

	font-size: 16px;
}
body {
	position: relative;
	width: 100%; height: 100%;
	margin: 0;

	font-family: 'futurafuturislightclightc', Helvetica, sans-serif;
	font-size: 1em;

	-webkit-font-smoothing: antialiased;
	-moz-font-smoothing: antialiased;
	-ms-font-smoothing: antialiased;
	-o-font-smoothing: antialiased;
	font-smoothing: antialiased;

	background-color: #000;

	-webkit-transition: all 2s ease-out;
	-ms-transition: all 2s ease-out;
	transition: all 2s ease-out;
}
body.internal {
	background-color: #F7F7F7;
}

/* COMMON */
a {
	-webkit-transition: all 0.05s ease-out;
	-ms-transition: all 0.05s ease-out;
	transition: all 0.05s ease-out;
}
.clear {
	width: 0; height: 0;
	clear: both;
}
.for-phone-only {
	display: none;
}
/* COMMON */

/* NAVIGATION */
nav {
	display: block;
	position: fixed; top: 0px; right: 0; left: 0;
	width: 100%; height: auto;

	color: #FFF;
	font-size: 15px;
	line-height: 22px;

	background-color: rgba(0, 0, 0, 0.8);

	-webkit-transform: perspective(400) translate3d(0, 0, 100px);
	transform: perspective(400) translate3d(0, 0, 100px);

	z-index: 110;

	opacity: 0;

	-webkit-transition: all 0.35s ease-out;
	-ms-transition: all 0.35s ease-out;
	transition: all 0.35s ease-out;

	overflow: hidden;
}
nav.show {
	display: block;

	-webkit-transform: perspective(400) translate3d(0, 0, 0);
	transform: perspective(400) translate3d(0, 0, 0);

	opacity: 1;
	z-index: 1001;
}
nav.hide {
	display: none;
}
nav .close {
	position: absolute; top: 66px; left: 66px;
	width: 22px; height: 22px;

	background-image: url(../img/menu-close.png);
	background-position: center center;
	background-repeat: no-repeat;

	opacity: 0.6;

	-webkit-transition: all 0.1s ease-out;
	-ms-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;

	cursor: pointer;

	z-index: 3;
}
nav .close:hover {
	opacity: 1;
}
nav > ul {
	position: relative; /* top: 66px; left: 66px; */
	width: 100%;
	max-width: 960px; height: auto;
	margin: 0 auto;
	padding: 66px 0 66px 60px;
	box-sizing: border-box;

	list-style: none;

	opacity: 0;

	-webkit-transition: all 0.1s ease-out;
	-ms-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;

	z-index: 2;
}
nav.show > ul {
	opacity: 1;
}
nav > ul > li {
	display: inline-block;
	width: 100%;
	max-width: 160px;
	margin: 0 10px;
	display: inline-block; *display: inline; zoom: 1;
	float: left;

	font-size: 16px;
	font-family: 'futurafuturiscbold', Helvetica, sans-serif;
	font-weight: normal;
	text-transform: uppercase;
}
nav > ul > li > ul {
	position: relative;
	margin: 0;
	padding: 11px 0 0 0;

	list-style: none;
}
nav > ul > li > ul > li {
	margin-top: 20px;
/* 	padding-left: 20px; */
	clear: both;

	font-size: 14px;
	font-family: 'futurafuturislightclightc', Helvetica, sans-serif;
	text-transform: uppercase;
}
nav a,
nav ul li a {
	color: #FFF;
	text-decoration: none;

	border-bottom: solid 1px transparent;

	-webkit-transition: all 0.1s ease-out;
	-ms-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;

	cursor: pointer;
}
nav ul li ul li a {
	color: rgba(255, 255, 255, 0.6);
}
nav a:hover,
nav ul li a:hover,
nav ul li ul li a:hover {
	color: #FFF;
	border-bottom-color: #FFF;
}
nav .glare {
	position: absolute;
	width: 100%; height: 100%;

	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);

	-webkit-transition: all 0.35s ease-out;
	-ms-transition: all 0.35s ease-out;
	transition: all 0.35s ease-out;

	opacity: 0.2;

	z-index: 1;
}
nav.show .glare {
	-webkit-transform: translate3D(80%, 0 , 0);
	transform: translate3D(80%, 0 , 0);

	opacity: 0.5;
}
nav .glare > svg {
	-webkit-transform: scale(2.2);
	transform: scale(2.2);

	height: 100%;
}
nav .news {
	display: none;
	position: relative;
	height: auto;
	margin: 0 auto;
	padding: 40px 0;
	overflow: hidden;

	text-align: center;

	background-color: rgba(0, 0, 0, 0.2);

	opacity: 0;

	-webkit-transition: all 0.1s ease-out;
	-ms-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;

	z-index: 2;
}
nav.show .news {
	opacity: 1;
}
nav header {
	display: inline-block; *display: inline; zoom: 1;
	margin-bottom: 11px;

	color: #FFF;
	font-family: 'futurafuturiscbold', Helvetica, sans-serif;
	font-weight: normal;
	text-transform: uppercase;

	border-bottom: solid 1px transparent;

	-webkit-transition: all 0.1s ease-out;
	-ms-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;
}
nav .vacancy:hover header,
nav .last-news:hover header {
	/* border-bottom-color: #FFF; */
}

nav .last-news {
	display: inline-block; *display: inline; zoom: 1;
	width: 242px;
	margin-right: 22px;

	text-align: left;
	vertical-align: top;
}
nav .last-news .news-content {
	color: rgba(255, 255, 255, 0.6);
	font-size: 16px;

	-webkit-transition: all 0.1s ease-out;
	-ms-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;
}
/*
nav .last-news:hover .news-content {
	color: #FFF;
}
*/

nav .vacancy {
	display: inline-block; *display: inline; zoom: 1;
	width: 440px;
	margin-right: 88px;
	margin-left: 66px;

	text-align: left;
	vertical-align: top;

	cursor: pointer;
}
nav .vacancy .vacancy-content {
	color: rgba(255, 255, 255, 0.6);
	font-size: 16px;

	-webkit-transition: all 0.1s ease-out;
	-ms-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;
}
nav .vacancy:hover .vacancy-content {
	color: #FFF;
}
/* NAVIGATION */




/* CORNER CONTROLS */
.corners {
	position: fixed; top: 0; left: 0; right: 0;

	-webkit-perspective: 1600;
	perspective: 1600;

	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;

	z-index: 1000;
}
.corners-bottom {
	position: fixed; bottom: 0; left: 0; right: 0;

	-webkit-perspective: 1600;
	perspective: 1600;

	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;

	z-index: 1000;
}
.corner-control {
	display: block;
	position: absolute;
	padding: 30px;

	color: #FFF;
	font-family: 'futurafuturiscbold', Helvetica, sans-serif;
	font-weight: normal;
	text-transform: uppercase;
	text-decoration: none;

	background-position: center center;
	background-repeat: no-repeat;

	-webkit-transition: all .2s linear;
	-ms-transition: all .2s linear;
	transition: all .2s linear;

	z-index: 111;
	opacity: 0;
	cursor: pointer;
}
.corner-control.hide {
	display: none;
}
.corner-control.slow {
	-webkit-transition: all 0.4s linear;
	-ms-transition: all 0.4s linear;
	transition: all 0.4s linear;
}
.corner-control.front1 {
	-webkit-filter: blur(1px);
	-moz-filter: blur(1px);
	-ms-filter: blur(1px);
	-o-filter: blur(1px);
	filter: blur(1px);

	opacity: 0.5;
}
.corner-control.normal {
	opacity: 1;
}
.corner-control.back1 {
	-webkit-filter: blur(1.5px);
	-moz-filter: blur(1.5px);
	-ms-filter: blur(1.5px);
	-o-filter: blur(1.5px);
	filter: blur(1.5px);

	z-index: 9;
	opacity: 0.5;
}
.menu {
	top: 0; left: 0;
	width: 22px; height: 22px;

	background-image: url('../svg/nav-menu-gray.svg');
}
.corners.white .menu {
	background-image: url('../svg/nav-menu-white.svg');
}
.menu.front1 {
	-webkit-transform: translate3d(30px, 20px, 20px);
	transform: translate3d(30px, 20px, 20px);
}
.menu.normal {
	-webkit-transform: translate3d(36px, 36px, 0);
	transform: translate3d(36px, 36px, 0);
}
.menu.back1 {
	-webkit-transform: translate3d(45px, 55px, -20px);
	transform: translate3d(45px, 55px, -20px);
}

.region-selector {
	top: 0px; right: 0px;
	width: 22px; height: 22px;

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.region-selector.front1 {
	-webkit-transform: translate3d(-30px, 20px, 20px);
	transform: translate3d(-30px, 20px, 20px);
}
.region-selector.normal {
	-webkit-transform: translate3d(-36px, 36px, 0);
	transform: translate3d(-36px, 36px, 0);
}
.region-selector.back1 {
	-webkit-transform: translate3d(-45px, 55px, -20px);
	transform: translate3d(-45px, 55px, -20px);
}
.region-selector:hover {
	width: 66px; height: 66px;
}
.region-selector .region {
	position: absolute; top: 30px; right: 30px;
	width: 22px; height: 22px;

	-webkit-transform: translate(-11px, 0);
	transform: translate(-11px, 0);

	color: #FFF;
	text-align: center;
	line-height: 25px;

	-webkit-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;

	z-index: 1;
}
.corners.white .region-selector .region {
	color: #666;
}

.region-selector .region:nth-child(1) { z-index: 4; }
.region-selector .region:nth-child(2) { z-index: 3; }
.region-selector .region:nth-child(3) { z-index: 2; }
.region-selector .region:nth-child(4) { z-index: 1; }
.region-selector .region.active { z-index: 5; }
.region-selector:hover .region:nth-child(2) {
	-webkit-transform: translate(-11px, 22px);
	transform: translate(-11px, 22px);
}
.region-selector:hover .region:nth-child(3) {
	-webkit-transform: translate(-11px, 44px);
	transform: translate(-11px, 44px);
}
.region-selector:hover .region:nth-child(4) {
	-webkit-transform: translate(-11px, 66px);
	transform: translate(-11px, 66px);
}

.region-selector .region .letter {
	position: absolute;
	display: inline-block; *display: inline; zoom: 1;
	width: 22px; height: 22px;

	text-align: center;
	line-height: 24px;
	background-color: #AAA;

	-webkit-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;

	overflow: hidden;
}
.corners.white .region-selector .region .letter {
	background-color: #FFF;
}
.region-selector:hover .region .letter {
	opacity: 0.4;
}
.region-selector:hover .region.active .letter {
	opacity: 0.8;
}
.region-selector:hover .region:hover .letter {
	opacity: 1;
}
.region-selector .region .letter:nth-child(1) {
	z-index: 3;
}
.region-selector .region.active .letter:nth-child(1) {
	z-index: 4;
}
.region-selector:hover .region .letter:nth-child(1) {
	-webkit-transform: translateX(-44px);
	transform: translateX(-44px);
}
.region-selector .region .letter:nth-child(2) {
	z-index: 2;
}
.region-selector:hover .region .letter:nth-child(2) {
	-webkit-transform: translateX(-22px);
	transform: translateX(-22px);
}
.region-selector .region .letter:nth-child(3) {
	z-index: 1;
}


.scroll-top {
	bottom: 0px; left: 0px;
	width: 22px; height: 22px;

	background-image: url('../svg/nav-arrow-up-gray.svg');
}
.corners.white .scroll-top {
	background-image: url('../svg/nav-arrow-up-white.svg');
}
.scroll-top.front1 {
	-webkit-transform: translate3d(30px, -20px, 20px);
	transform: translate3d(30px, -20px, 20px);
}
.scroll-top.normal {
	-webkit-transform: translate3d(36px, -36px, 0);
	transform: translate3d(36px, -36px, 0);
}
.scroll-top.back1 {
	-webkit-transform: translate3d(45px, -55px, -20px);
	transform: translate3d(45px, -55px, -20px);
}

.jp {
	bottom: 0; right: 0;
	width: 22px; height: 22px;

	background-image: url(../svg/nav-jp-logo-gray.svg);
	background-position: center center;
	background-repeat: no-repeat;

	cursor: default;
}
.corners-bottom.white .jp {
	background-image: url(../svg/nav-jp-logo-white.svg);
}
.jp.front1 {
	-webkit-transform: translate3d(-30px, -20px, 20px);
	transform: translate3d(-30px, -20px, 20px);
}
.jp.normal {
	-webkit-transform: translate3d(-36px, -36px, 0);
	transform: translate3d(-36px, -36px, 0);
}
.jp.back1 {
	-webkit-transform: translate3d(-45px, -55px, -20px);
	transform: translate3d(-45px, -55px, -20px);
}
.jp.active {
	background-image: none;
}
.jp .contact-card-holder {
	position: absolute; bottom: 0px; right: 0px;
	width: 0; height: 0;

	overflow: hidden;
}
.jp.active .contact-card-holder {
	width: 362px; height: 296px;
}
.jp .contact-card {
	position: absolute; bottom: 10px; right: 10px;
	width: 352px; height: 286px;
	opacity: 0;

	color: #3c3c3c;

	background-image: url(../svg/nav-jp-logo-black.svg);
	background-repeat: no-repeat;
	background-position: 36px 36px;

	-webkit-transform: translate3d(352px, 286px, 0);
	transform: translate3d(352px, 286px, 0);

	-webkit-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;

	overflow: hidden;

	z-index: 1000;
}
.jp.active .contact-card {
	background-color: rgba(255, 255, 255, 0.85);

	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);

	opacity: 1;
}
.jp .contact-card header {
	position: relative;
	margin: 42px 100px 30px 100px;

	color: #000;
	font-size: 21px;
	font-family: 'futurafuturiscbold', Helvetica, sans-serif;
	font-weight: normal;
	text-transform: uppercase;

	z-index: 2;
}
.jp .contact-card p {
	position: relative;
	margin: 10px 100px;

	font-size: 16px;
	font-family: 'futurafuturislightclightc', Helvetica, sans-serif;
	text-transform: none;

	z-index: 2;
}
.jp .contact-card .btn {
	position: absolute; bottom: 0; left: 0;
	display: inline-block; *display: inline; zoom: 1;
	margin: 15px 80px 44px 100px;
	padding: 10px 12px;

	color: #FFF;
	font-size: 15px;
	font-family: 'futurafuturislightclightc', Helvetica, sans-serif;
	text-transform: none;
	text-decoration: none;
	-webkit-font-smoothing: antialiased;

	background-color: #00c3ff;

	-webkit-transition: all 0.1s ease-out;
	-ms-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;

	cursor: pointer;

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;

	z-index: 3;
}
.jp .contact-card .btn:hover {
	-webkit-transform: scale(1.04);
	transform: scale(1.04);
}
.jp .contact-card .btn.pressed {
	-webkit-transform: scale(0.96);
	transform: scale(0.96);
}
.jp .contact-card .close {
	position: absolute; bottom: 25px; right: 25px;
	width: 22px; height: 22px;

	background-image: url(../svg/nav-close.svg);
	background-position: center center;
	background-repeat: no-repeat;

	opacity: 0.5;

	-webkit-transition: all 0.1s ease-out;
	-ms-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;

	cursor: pointer;

	z-index: 2;
}
.jp .contact-card .close:hover {
	opacity: 1;
}
.jp .contact-card .glare {
	position: absolute; top: 0; right: 0;
	width: 270px; height: 276px;

	background-image: url(../svg/interface-ipad-glare.svg);
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transform: translate(-200px, 0px);
	transform: translate(-200px, 0px);

	-webkit-transition: all 0.35s ease-out;
	-ms-transition: all 0.35s ease-out;
	transition: all 0.35s ease-out;

	z-index: 1;

	opacity: 0;
}
.jp.active .contact-card .glare {
	-webkit-transform: translate(0px, 0px);
	transform: translate(0px, 0px);

	opacity: 1;
}
/* CORNER CONTROLS */


/* SIDE CONTROLS */
.side-control {
	display: block;
	position: fixed; top: 50%;
	width: 22px; height: 22px;
	margin-top: -41px;
	padding: 30px;

	color: #BBB;
	font-size: 24px;
	line-height: 22px;
	font-weight: normal;
	text-transform: uppercase;
	text-decoration: none;
	text-align: center;

	background-position: center center;
	background-repeat: no-repeat;

	-webkit-perspective: 1600;
	perspective: 1600;

	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;

	-webkit-transition: all .2s linear;
	-ms-transition: all .2s linear;
	transition: all .2s linear;

	z-index: 1000;

	opacity: 0;

	cursor: pointer;
}
.side-control.hide {
	display: none;
}
.side-control.previous {
	left: 0px;
}
.side-control.next {
	right: 0px;
}
.side-control.front1 {
	-webkit-filter: blur(1px);
	-moz-filter: blur(1px);
	-ms-filter: blur(1px);
	-o-filter: blur(1px);
	filter: blur(1px);

	opacity: 0.5;
}
.side-control.normal {
	opacity: 1;
}
.side-control.back1 {
	-webkit-filter: blur(1.5px);
	-moz-filter: blur(1.5px);
	-ms-filter: blur(1.5px);
	-o-filter: blur(1.5px);
	filter: blur(1.5px);

	z-index: 9;
	opacity: 0.5;
}
.side-control.previous.front1 {
	-webkit-transform: translate3d(22px, 0px, 20px);
	transform: translate3d(22px, 0px, 20px);
}
.side-control.previous.normal {
	-webkit-transform: translate3d(37px, 0px, 0);
	transform: translate3d(37px, 0px, 0);
}
.side-control.previous.back1 {
	-webkit-transform: translate3d(50px, 0px, -20px);
	transform: translate3d(50px, 0px, -20px);
}
.side-control.next.front1 {
	-webkit-transform: translate3d(-22px, 0px, 20px);
	transform: translate3d(-22px, 0px, 20px);
}
.side-control.next.normal {
	-webkit-transform: translate3d(-37px, 0px, 0);
	transform: translate3d(-37px, 0px, 0);
}
.side-control.next.back1 {
	-webkit-transform: translate3d(-50px, 0px, -20px);
	transform: translate3d(-50px, 0px, -20px);
}
.side-control .title-holder {
	display: table; top: 50%;
	position: absolute;
	width: 200px; height: 200px;
	margin-top: -100px;

	-webkit-transition: all 0.2s 0.4s cubic-bezier(0.25, 1, 1, 1);
	-ms-transition: all 0.2s 0.4s cubic-bezier(0.25, 1, 1, 1);
	transition: all 0.2s 0.4s cubic-bezier(0.25, 1, 1, 1);

	opacity: 0;
}
.side-control.previous .title-holder {
	left: 0;

	-webkit-transform: translate3d(0px, 0px, 0px);
	transform: translate3d(0px, 0px, 0px);
}
.side-control.previous:hover .title-holder {
	opacity: 1;

	-webkit-transform: translate3d(50px, 0px, 0px);
	transform: translate3d(50px, 0px, 0px);
}
.side-control.next .title-holder {
	right: 0;

	-webkit-transform: translate3d(0px, 0px, 0px);
	transform: translate3d(0px, 0px, 0px);
}
.side-control.next:hover .title-holder {
	opacity: 1;

	-webkit-transform: translate3d(-50px, 0px, 0px);
	transform: translate3d(-50px, 0px, 0px);
}
.side-control .icon {
	display: block;
	padding: 0;
	margin: 10px auto;

	width: 100px; height: 100px;

	background-size: contain;
	background-repeat: no-repeat;
}
.side-control .title {
	display: table-cell;
	padding: 20px;

	color: #444;
	font-size: 0.625em;
	line-height: 1.375em;
	font-family: 'futurafuturiscregular', Helvetica, sans-serif;
	font-family: 'futurafuturiscbold', Helvetica, sans-serif;
	-webkit-font-smoothing: antialiased;
	font-smoothing: antialiased;
	vertical-align: middle;
}
/* PREVIOUS / NEXT */


.outer {
	display: table;
	width: 100%; height: 100%;

	overflow: hidden;
}

.page {
	position: absolute; right: 0; top: 0; left: 0; bottom: 0;
	display: table-cell;
	width: 100%; height: 100%;

	vertical-align: middle;
	text-align: center;

	overflow: hidden;
}
.safe{
	position: absolute; top: 88px; right: 88px; bottom: 88px; left: 88px;

	text-align: left;
}
.content {
	position: absolute; top: 50%; left: 50%;
	width: 1032px; height: 768px;
	margin-top: -384px;
	margin-left: -516px;

	-webkit-font-smoothing: antialiased;
	font-smoothing: antialiased;

	-webkit-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear;
	transition: all 0.2s linear;

	z-index:101;
}
.content .slow {
	-webkit-transition: all 0.4s linear;
	-ms-transition: all 0.4s linear;
	transition: all 0.4s linear;
}
.content.back1 {
	-webkit-filter: blur(4px);
	-moz-filter: blur(4px);
	-ms-filter: blur(4px);
	-o-filter: blur(4px);
	filter: blur(4px);

	-webkit-transform: perspective(400) translateZ(-40px);
	transform: perspective(400) translateZ(-40px);
}
.content.back2 {
	-webkit-filter: blur(8px);
	-moz-filter: blur(8px);
	-ms-filter: blur(8px);
	-o-filter: blur(8px);
	filter: blur(8px);

	-webkit-transform: perspective(400) translateZ(-80px);
	transform: perspective(400) translateZ(-80px);
}


/* BACK */
.back {
	position: absolute; top: 50%; left: 50%;
	width: 1032px; height: 768px;
	margin-top: -384px;
	margin-left: -516px;

	vertical-align: middle;

	background-color: #000;

	-webkit-transition: all 0.5s ease-in;
	-ms-transition: all 0.5s ease-in;

	transition: all 0.5s ease-in;

	z-index: 7;
}
.back.green {
	background-color: #2ecc4c;
	background-color: #3DC73D;
}
.back.light-blue {
	background-color: #42acf7;
	background-color: #1ABBF2;
}
.back.blue {
	background-color: #3c68d7;
	background-color: #3D66D7;
	background-color: #157bca;
}
.back.red {
	background-color: #f87744;
	background-color: #ED714D;
}
.back.yellow {
	background-color: #2d2d2d;
	background-color: #F0B42F;
}
.back.light-gray {
	background-color: #f7f7f7;
}
.back.dark-gray {
	background-color: #3D3D3D;
}
.back.expand {
	-webkit-transform: scale(25);
	transform: scale(25);
}
/* BACK */



/* LOGO */
.logo {
	position: absolute; top: 50%; left: 50%;
	width: 1034px; height: 770px;
	margin-top: -385px;
	margin-left: -517px;

	-webkit-transition: all 0.5s ease-in;
	-ms-transition: all 0.5s ease-in;
	transition: all 0.5s ease-in;

	z-index: 9;

	overflow: hidden;

	opacity: 1;
}
.logo.collapse {
	-webkit-transform: scale(0);
	transform: scale(0);

	opacity: 1;
}
/* LOGO */


/* GLARES */
.page .glare{
	position: absolute; top: 50%; left: 50%;
	width: 1034px; height: 770px;
	margin-top: -385px;

	-webkit-transition: all 1.25s ease-out;
	-ms-transition: all 1.25s ease-out;
	transition: all 1.25s ease-out;

	-webkit-transform: translate3d(-500px, 0, 0);
	transform: translate3d(-500px, 0, 0);

	z-index: 10;

	opacity: 0.1;
}
.page .glare.move {
	-webkit-transform: translate3d(-60px, 0, 0);
	transform: translate3d(-60px, 0, 0);

	opacity: 0.5;
}
.page .glare.hide {
	display: none;

	-webkit-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear;
	transition: all 0.2s linear;

	opacity: 0;
}
/* GLARES */



/* MASK */
.mask {
	position: absolute; top: 50%; left: 50%;
	width: 1034px; height: 770px;
	margin-top: -385px;
	margin-left: -517px;

	-webkit-transition: all 0.5s ease-in;
	-ms-transition: all 0.5s ease-in;
	transition: all 0.5s ease-in;

	z-index: 100;

	-webkit-transform: scale(1);
	transform: scale(1);
}
.mask.expand {
	-webkit-transform: scale(25);
	transform: scale(25);
}
.mask.hide {
	display: none;
}
/* MASK */


.jazzpixels {
	position: absolute; top: 50%; left: 50%;
	width: 500px; height: 200px;
	margin-top: -125px;
	margin-left: -250px;

	-webkit-font-smoothing: antialiased;

	font-family: 'futurafuturiscbold', Helvetica, sans-serif;
	font-weight: normal;
	font-size: 24px;
	line-height: 650px;
	text-transform: uppercase;
	color: #777;
	text-align: center;

	z-index: 101;
	opacity: 0;

	-webkit-transition: all 1.25s ease-out;
	-ms-transition: all 1.25s ease-out;
	transition: all 1.25s ease-out;

/*
	-webkit-filter: blur(12.5px);
	-moz-filter: blur(12.5px);
	-ms-filter: blur(12.5px);
	-o-filter: blur(12.5px);
	filter: blur(12.5px);

*/
/*
	-webkit-transform: perspective(400) translate3d(0, 0, 800px);
	transform: perspective(400) translate3d(0, 0, 800px);
*/

	-webkit-transform: scale(0.5);
	transform: scale(0.5);
}
.jazzpixels.active {
	-webkit-filter: none;
	-moz-filter: none;
	-ms-filter: none;
	-o-filter: none;
	filter: none;

	-webkit-transform: scale(1);
	transform: scale(1);

/*
	-webkit-transform: perspective(400) translate3d(0, 0, 0);
	transform: perspective(400) translate3d(0, 0, 0);
*/

	opacity: 1;
}
.jazzpixels.move {
	-webkit-transition: all 0.7s ease-out;
	-ms-transition: all .4s ease-out;
	transition: all 0.7s ease-out;

	opacity: 0;
}
.jazzpixels.hide {
	display: none;
	opacity: 0;
}

.services {
	position: absolute; top: 50%; left: 50%;
	width: 1034px; height: 770px;
	margin-top: -385px;
	margin-left: -517px;

	-webkit-transform: translateY(0);
	transform: translateY(0);

	-webkit-transition: all 1s ease-in-out;
	-ms-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;

	z-index: 101;
}
.services.move-up {
	-webkit-transform: translateY(-2000px);
	transform: translateY(-2000px);
}
.services ul.navigator {
	position: absolute; top: 550px; left: 4000px;
	display: table;
	width: 352px;
	margin: 0;
	padding: 0;

	list-style: none;

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.services ul.navigator.show {
	left: 616px;
}
.services ul.navigator li {
	position: relative;
	display: table-cell;
	height: 22px; width: 22px;
	margin-right: 28px;
	margin-left: 5px;

	vertical-align: middle;
	text-align: center;

	float: left;

	cursor: pointer;
}
.services ul.navigator li div {
	display: inline-block; *display: inline; zoom: 1;
	width: 6px; height: 6px;
	padding: 0;

	vertical-align: middle;

	background-color: rgba(255, 255, 255, 0.5);

	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
	border-radius: 10px;

	-webkit-transition: all 0.1s linear;
	-ms-transition: all 0.1s linear;
	transition: all 0.1s linear;
}
.services ul.navigator li:hover div {
	width: 10px; height: 10px;
}
.services ul.navigator li.active div {
	width: 12px; height: 12px;

	background-color: #fff;
}

.service {
	position: absolute; top: 0; right: 0; bottom: 0; left: 0;
}
.service.hide {
	z-index: 0;
}
.service .overview {
	color: #FFF;
	font-size: 18px;
	line-height: 22px;
	text-align: left;

	z-index: 1;
}
.service .overview a {
	color: inherit;
}
.service .title {
	color: #FFF;
	font-family: 'futurafuturiscbold', Helvetica, sans-serif;
	font-weight: normal;
	font-size: 32px;
	line-height: 44px;
	text-align: left;
	text-transform: uppercase;

	z-index: 1;
}
.service .btn a {
	display: inline-block; *display: inline; zoom: 1;
	padding: 15px 30px;
	margin-top: 21px;
	margin-left: 1px;

	color: #FFF;
	font-family: 'futurafuturiscregular', Helvetica, sans-serif;
	font-size: 16px;
	line-height: 23px;
	text-transform: uppercase;
	text-decoration: none;

	border: solid 2px #FFF;
}
.service .btn a:hover {
	/* color: #FFF; */
	/* background-color: rgba(255, 255, 255, 0.25); */
	background-color: #FFF;
}

.website.hide {
	display: none;
}
.website .imac {
	position: absolute; top: 0; left: 0;
	display: inline-block; *display: inline; zoom: 1;
	width: 462px; height: 403px;

	/* background-image: url(../svg/website-imac.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transform: translate(4000px, 198px);
	transform: translate(4000px, 198px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;

	overflow: hidden;
	z-index: 2;

	opacity: 0;
}
.website .imac.show {
	-webkit-transform: translate(88px, 198px);
	transform: translate(88px, 198px);

	opacity: 1;
}
.website .imac.move-left {
	-webkit-transform: translate(-2000px, 198px);
	transform: translate(-2000px, 198px);
}
.website .imac .screen {
	position: absolute; top: 22px; left: 21px;
	width: 418px; height: 242px;

	overflow: hidden;

	z-index: 3;
}
.website .imac .imac-glare {
	position: absolute; top: 0; left: 0;
	width: 337px; height: 286px;

	/* background-image: url(../svg/website-imac-glare.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transform: translate(-1000px, 0);
	transform: translate(-1000px, 0);

	-webkit-transition: all 0.5s 0.2s ease-out;
	-ms-transition: all 0.5s 0.2s ease-out;
	transition: all 0.5s 0.2s ease-out;

	z-index: 10;
}
.website .imac.show .imac-glare {
	-webkit-transform: translate(126px, 0);
	transform: translate(126px, 0);
}
.website .imac .website-top-menu {
	position: absolute; top: 0; left: 0;
	width: 236px; height: 16px;

	/* background-image: url(../svg/website-top-menu.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transform: translate(88px, -2000px);
	transform: translate(88px, -2000px);

	-webkit-transition: all 0.5s 0.5s ease-out;
	-ms-transition: all 0.5s 0.5s ease-out;
	transition: all 0.5s 0.5s ease-out;

	z-index: 5;
}
.website .imac.show .website-top-menu {
	-webkit-transform: translate(88px, 22px);
	transform: translate(88px, 22px);
}
.website .imac .website-left-menu {
	position: absolute; top: 0; left: 0;
	width: 24px; height: 50px;

	/* background-image: url(../svg/website-left-menu.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transform: translate(-1000px, -22px);
	transform: translate(-1000px, -22px);

	-webkit-transition: all 0.5s 0.5s ease-out;
	-ms-transition: all 0.5s 0.5s ease-out;
	transition: all 0.5s 0.5s ease-out;

	z-index: 5;
}
.website .imac.show .website-left-menu {
	-webkit-transform: translate(22px, 66px);
	transform: translate(22px, 66px);
}
.website .imac .website-content {
	position: absolute; top: 0; left: 0;
	width: 77px; height: 80px;

	/* background-image: url(../svg/website-content.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transform: translate(1000px, 66px);
	transform: translate(1000px, 66px);

	-webkit-transition: all 0.5s 0.7s ease-out;
	-ms-transition: all 0.5s 0.7s ease-out;
	transition: all 0.5s 0.7s ease-out;

	z-index: 5;
}
.website .imac.show .website-content {
	-webkit-transform: translate(242px, 66px);
	transform: translate(242px, 66px);
}
.website .imac .website-map {
	position: absolute; top: 0; left: 0;
	width: 373px; height: 219px;

	/* background-image: url(../svg/website-map.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transform: translate(22px, 44px);
	transform: translate(22px, 44px);

	-webkit-transition: all 0.5s 0.4s ease-out;
	-ms-transition: all 0.5s 0.4s ease-out;
	transition: all 0.5s 0.4s ease-out;

	opacity: 0.5;

	z-index: 4;
}
.website .imac.show .website-map {
	-webkit-transform: translate(22px, 22px);
	transform: translate(22px, 22px);

	opacity: 1;
}
.website .imac.show .website-baloon {
	position: absolute; top: 121px; left: 88px;
	width: 133px; height: 84px;

	/* background-image: url(../svg/website-baloon.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-animation: popin 0.4s ease 1.2s 1 normal;
	-moz-animation: popin 0.4s ease 1.2s 1 normal;
	-ms-animation: popin 0.4s ease 1.2s 1 normal;
	-o-animation: popin 0.4s ease 1.2s 1 normal;
	animation: popin 0.4s ease 1.2s 1 normal;

	-webkit-animation-play-state: paused;
	-moz-animation-play-state: paused;
	-ms-animation-play-state: paused;
	-o-animation-play-state: paused;
	animation-play-state: paused;

	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	-ms-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;

	-webkit-transform: scale(0);
	transform: scale(0);

	z-index: 6;
}
.website .imac.show .website-baloon {
	-webkit-animation-play-state: running;
	-moz-animation-play-state: running;
	-ms-animation-play-state: running;
	-o-animation-play-state: running;
	animation-play-state: running;
}
@-webkit-keyframes popin {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
	}
	80% {
		-webkit-transform: scale(1.2);
		transform: scale(1.2);
	}
	100% {
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}
@keyframes popin {
	0% {
		-webkit-transform: scale(0);
		transform: scale(0);
	}
	80% {
		-webkit-transform: scale(1.2);
		transform: scale(1.2);
	}
	100% {
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}

.website .title {
	position: absolute; top: 220px;
	width: 374px;

	-webkit-transform: translateX(4000px);
	transform: translateX(4000px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;
}
.website .title.show {
	-webkit-transform: translateX(616px);
	transform: translateX(616px);
}
.website .title.move-left {
	-webkit-transform: translateX(-2000px);
	transform: translateX(-2000px);
}
.website .overview {
	position: absolute; top: 363px;
	width: 352px;

	-webkit-transform: translateX(4000px);
	transform: translateX(4000px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;
}
.website .overview.show {
	-webkit-transform: translateX(616px);
	transform: translateX(616px);
}
.website .overview.move-left {
	-webkit-transform: translateX(-2000px);
	transform: translateX(-2000px);
}
.website .btn a:hover {
	color: #3DC73D;
}

.web {
	display: block;
	position: absolute; top: -100px; right: -100px; left: -100px; bottom: -100px;

	background-image: url(../svg/interface-web-pattern.svg);
	background-position: center center;
	background-repeat: repeat;

	-webkit-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear;
	transition: all 0.2s linear;

	-webkit-transform: translateX(4000px);
	transform: translateX(4000px);

	z-index: 8;
	overflow: hidden;
	opacity: 0;
}
.web.move-up {
	-webkit-transform: translateY(-2000px);
	transform: translateY(-2000px);
}
.web.show {
	display: block;

	-webkit-transform: translateX(0px);
	transform: translateX(0px);

	opacity: 1;
}

.web.back1 {
	-webkit-filter: blur(4px);
	-moz-filter: blur(4px);
	-ms-filter: blur(4px);
	-o-filter: blur(4px);
	filter: blur(4px);

	-webkit-transform: perspective(400) translateZ(-40px);
	transform: perspective(400) translateZ(-40px);
}
.web.back2 {
	-webkit-filter: blur(8px);
	-moz-filter: blur(8px);
	-ms-filter: blur(8px);
	-o-filter: blur(8px);
	filter: blur(8px);

	-webkit-transform: perspective(400) translateZ(-80px);
	transform: perspective(400) translateZ(-80px);
}
.interface.hide {
	display: none;
}
.interface .prototype {
	position: absolute; top: 87px; left: 109px;
	width: 244px; height: 321px;

/* 	background-image: url(../svg/interface-prototype.svg); */

	-webkit-transform: translate(110px, 132px);
	transform: translate(110px, 132px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;

	opacity: 0;
	z-index: 3;
}
.interface .prototype.show {
	-webkit-transform: translate(110px, 132px);
	transform: translate(110px, 132px);

	opacity: 1;
}
.interface .prototype.move-left {
	-webkit-transform: translate(-2000px, 132px);
	transform: translate(-2000px, 132px);

	opacity: 0;
}
.interface .prototype .left-comments {
	position: absolute; top: 33px; right: 264px;/* /* left: -107px; */
	width: 0; height: 189px;

/* 	background-image: url(../svg/interface-prototype-left-comments.svg); */
	background-position: right top;
	background-repeat: no-repeat;

	-webkit-transition: all 0.2s 0.6s linear;
	-ms-transition: all 0.2s 0.6s linear;
	transition: all 0.2s 0.6s linear;

	overflow: hidden;
}
.interface .prototype.show .left-comments {
	width: 88px;
}
.interface .prototype .left-comments > svg {
	position: absolute; right: 0;
}
.interface .prototype .top-comments {
	position: absolute; bottom: 341px; left: 0;
	width: 244px; height: 0;

/* 	background-image: url(../svg/interface-prototype-top-comments.svg); */
	background-position: left bottom;
	background-repeat: no-repeat;

	-webkit-transition: all 0.2s 0.6s linear;
	-ms-transition: all 0.2s 0.6s linear;
	transition: all 0.2s 0.6s linear;

	overflow: hidden;
}
.interface .prototype.show .top-comments {
	height: 58px;
}
.interface .prototype .top-comments > svg {
	position: absolute; bottom: 0; left: 0;
}
.interface .prototype .right-comments {
	position: absolute; top: 33px; left: 264px;
	width: 0; height: 288px;

/* 	background-image: url(../svg/interface-prototype-right-comments.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transition: all 0.2s 0.6s linear;
	-ms-transition: all 0.2s 0.6s linear;
	transition: all 0.2s 0.6s linear;

	overflow: hidden;
}
.interface .prototype.show .right-comments {
	width: 99px;
}
.interface .prototype .bottom-comments {
	position: absolute; top: 341px; left: 0;
	width: 244px; height: 0;

/* 	background-image: url(../svg/interface-prototype-bottom-comments.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transition: all 0.2s 0.6s linear;
	-ms-transition: all 0.2s 0.6s linear;
	transition: all 0.2s 0.6s linear;

	overflow: hidden;
}
.interface .prototype.show .bottom-comments {
	height: 55px;
}

.interface .ipad {
	position: absolute; top: 46px; left: 93px;
	width: 276px; height: 1808px;

	/* background-image: url(../svg/interface-ipad.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-animation: slidin 1.4s cubic-bezier(0,0,0.2,1) 1s 1 normal;
	-moz-animation: slidin 1.4s cubic-bezier(0,0,0.2,1) 1s 1 normal;
	animation: slidin 1.4s cubic-bezier(0,0,0.2,1) 1s 1 normal;

	-webkit-animation-play-state: paused;
	animation-play-state: paused;

	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;

	-webkit-transform: translate(110px, 132px) rotate(0deg);
	transform: translate(110px, 132px) rotate(0deg);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;

	z-index: 6;

	overflow: hidden;

	opacity: 0;
}
@-webkit-keyframes slidin {
	0% {
		-webkit-transform: translate(110px, 132px) rotate(-90deg);
		transform: translate(110px, 132px) rotate(-90deg);

		opacity: 0;
	}
	10% {
		opacity: 1;
	}
	100% {
		-webkit-transform: translate(110px, 132px) rotate(0);
		transform: translate(110px, 132px) rotate(0);

		opacity: 1;
	}
}
@keyframes slidin {
	0% {
		-webkit-transform: translate(110px, 132px) rotate(-90deg);
		transform: translate(110px, 132px) rotate(-90deg);

		opacity: 0;
	}
	10% {
		opacity: 1;
	}
	100% {
		-webkit-transform: translate(110px, 132px) rotate(0);
		transform: translate(110px, 132px) rotate(0);

		opacity: 1;
	}
}
.interface .ipad.show {
	-webkit-animation-play-state: running;
	-moz-animation-play-state: running;
	-ms-animation-play-state: running;
	-o-animation-play-state: running;
	animation-play-state: running;
}
.interface .ipad.move-left {
	-webkit-transform: translate(-2000px, 132px) rotate(0);
	transform: translate(-2000px, 132px) rotate(0);
}
.interface .ipad .ipad-glare {
	position: absolute; top: 0; left: 0;
	width: 270px; height: 276px;

/* 	background-image: url(../svg/interface-ipad-glare.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transform: translate(100px, 2px);
	transform: translate(100px, 2px);

	-webkit-transition: all 0.5s 2.1s ease-out;
	-ms-transition: all 0.5s 2.1s ease-out;
	transition: all 0.5s 2.1s ease-out;

	z-index: 7;

	opacity: 0;
}
.interface .ipad.show .ipad-glare {
	-webkit-transform: translate(4px, 2px);
	transform: translate(4px, 2px);

	opacity: 1;
}
.interface .ipad .screen {
	position: absolute; top: 44px; left: 19px;
	width: 238px; height: 315px;

	background-color: rgba(255, 255, 255, 0.95);

	overflow: hidden;
}
.interface .ipad .ipad-header {
	position: absolute; top: 0px; left: 0;
	width: 239px; height: 30px;

	/* background-image: url(../svg/interface-ipad-header.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transform: translate(0, -100px);
	transform: translate(0, -100px);

	-webkit-transition: all 0.5s 2.4s ease-out;
	-ms-transition: all 0.5s 2.4s ease-out;
	transition: all 0.5s 2.4s ease-out;

	z-index: 3;
}
.interface .ipad.show .ipad-header {
	-webkit-transform: translate(0, 0);
	transform: translate(0, 0);
}
.interface .ipad .ipad-left-menu {
	position: absolute; top: 0; left: 0;
	width: 65px; height: 287px;

	/* background-image: url(../svg/interface-ipad-left-menu.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transform: translate(-100px, 29px);
	transform: translate(-100px, 29px);

	-webkit-transition: all 0.5s 2.6s ease-out;
	-ms-transition: all 0.5s 2.6s ease-out;
	transition: all 0.5s 2.6s ease-out;

	z-index: 2;
}
.interface .ipad.show .ipad-left-menu {
	-webkit-transform: translate(0, 29px);
	transform: translate(0, 29px);
}
.interface .ipad .ipad-content {
	position: absolute; top: 0; left: 0;
	width: 174px; height: 287px;

	/* background-image: url(../svg/interface-ipad-content.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transform: translate(-300px, 29px);
	transform: translate(-300px, 29px);

	-webkit-transition: all 0.5s 2.8s ease-out;
	-ms-transition: all 0.5s 2.8s ease-out;
	transition: all 0.5s 2.8s ease-out;

	z-index: 1;
}
.interface .ipad.show .ipad-content {
	-webkit-transform: translate(65px, 29px);
	transform: translate(65px, 29px);
}



.interface .design {
	position: absolute; top: 88px;
	width: 506px; height: 506px;

	background-image: url(../img/design.png);

	-webkit-transform: translateX(88px);
	transform: translateX(88px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;

	opacity: 0;
	z-index: 2;
}
.interface .design.show {
	-webkit-transform: translateX(88px);
	transform: translateX(88px);

	opacity: 1;
}
.interface .design.move-left {
	-webkit-transform: translateX(-2000px);
	transform: translateX(-2000px);

	opacity: 0;
}

.interface .title {
	position: absolute; top: 231px;
	width: 374px;

	-webkit-transform: translateX(4000px);
	transform: translateX(4000px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;
}
.interface .title.show {
	-webkit-transform: translateX(616px);
	transform: translateX(616px);
}
.interface .title.move-left {
	-webkit-transform: translateX(-2000px);
	transform: translateX(-2000px);
}
.interface .overview {
	position: absolute; top: 374px;
	width: 352px;

	-webkit-transform: translateX(4000px);
	transform: translateX(4000px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	-o-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;
}
.interface .overview.show {
	-webkit-transform: translateX(616px);
	transform: translateX(616px);
}
.interface .overview.move-left {
	-webkit-transform: translateX(-2000px);
	transform: translateX(-2000px);
}
.interface .btn a:hover {
	color: #157bca;
}


.webapp.hide {
	display: none;
}
.webapp .iphone {
	position: absolute; top: 0; left: 0;
	width: 144px; height: 300px;

	/* background-image: url(../svg/apps-iphone.svg); */

	-webkit-transform: translate(4000px, 272px);
	transform: translate(4000px, 272px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;

	z-index: 2;
	opacity: 0;

	overflow: hidden;
}
.webapp .iphone.show {
	-webkit-transform: translate(110px, 272px);
	transform: translate(110px, 272px);

	opacity: 1;
}
.webapp .iphone.move-left {
	-webkit-transform: translate(-2000px, 272px);
	transform: translate(-2000px, 272px);
}
.webapp .iphone .iphone-glare {
	position: absolute; top: 0; left: 0;
	width: 139px; height: 206px;

/* 	background-image: url(../svg/apps-iphone-glare.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transform: translate(-100px, 4px);
	transform: translate(-100px, 4px);

	-webkit-transition: all 0.5s .2s ease-out;
	-ms-transition: all 0.5s .2s ease-out;
	transition: all 0.5s .2s ease-out;

	z-index: 3;

	opacity: 0;
}
.webapp .iphone.show .iphone-glare {
	-webkit-transform: translate(4px, 4px);
	transform: translate(4px, 4px);

	opacity: 1;
}
.webapp .iphone .iphone-splash {
	position: absolute; top: 44px; left: 12px;
	width: 121px; height: 215px;

/* 	background-image: url(../svg/apps-iphone-splash.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transition: all 0.2s 2.8s linear;
	-ms-transition: all 0.2s 2.8s linear;
	transition: all 0.2s 2.8s linear;

	z-index: 1;

	opacity: 0;
}
.webapp .iphone.show .iphone-splash {
	opacity: 1;
}
.webapp .iphone .iphone-rays {
	position: absolute; top: 103px; left: 22px;
	width: 103px; height: 103px;

/* 	background-image: url(../svg/apps-splash-rays.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transform: rotateZ(0deg);
	transform: rotateZ(0deg);

	-webkit-transition: all 4s 2.8s linear;
	-ms-transition: all 4s 2.8s linear;
	transition: all 4s 2.8s linear;

	z-index: 2;

	opacity: 0;
}
.webapp .iphone.show .iphone-rays {
	-webkit-transform: rotateZ(270deg);
	transform: rotateZ(270deg);

	opacity: 1;
}

.webapp .samsung {
	position: absolute; top: 0; left: 0;
	width: 174px; height: 331px;

	/* background-image: url(../svg/apps-samsung.svg); */

	-webkit-transform: translate(4000px, 241px);
	transform: translate(4000px, 241px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;

	z-index: 3;
	opacity: 0;

	overflow: hidden;
}
.webapp .samsung.show {
	-webkit-transform: translate(220px, 241px);
	transform: translate(220px, 241px);

	opacity: 1;
}
.webapp .samsung.move-left {
	-webkit-transform: translate(-2000px, 241px);
	transform: translate(-2000px, 241px);
}
.webapp .samsung .samsung-glare {
	position: absolute; top: 0; left: 0;
	width: 168px; height: 244px;

	/* background-image: url(../svg/apps-samsung-glare.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transform: translate(-100px, 3px);
	transform: translate(-100px, 3px);

	-webkit-transition: all 0.5s .2s ease-out;
	-ms-transition: all 0.5s .2s ease-out;
	transition: all 0.5s .2s ease-out;

	z-index: 3;

	opacity: 0;
}
.webapp .samsung.show .samsung-glare {
	-webkit-transform: translate(3px, 3px);
	transform: translate(3px, 3px);

	opacity: 1;
}
.webapp .samsung .samsung-splash {
	position: absolute; top: 33px; left: 13px;
	width: 150px; height: 258px;

	/* background-image: url(../svg/apps-samsung-splash.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transition: all 0.2s 1.9s linear;
	-ms-transition: all 0.2s 1.9s linear;
	transition: all 0.2s 1.9s linear;

	z-index: 1;

	opacity: 0;
}
.webapp .samsung.show .samsung-splash {
	opacity: 1;
}
.webapp .samsung .samsung-rays {
	position: absolute; top: 113px; left: 37px;
	width: 103px; height: 103px;

	/* background-image: url(../svg/apps-splash-rays.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transform: rotateZ(0deg);
	transform: rotateZ(0deg);

	-webkit-transition: all 4s 1.9s linear;
	-ms-transition: all 4s 1.9s linear;
	transition: all 4s 1.9s linear;

	z-index: 2;

	opacity: 0;
}
.webapp .samsung.show .samsung-rays {
	-webkit-transform: rotateZ(270deg);
	transform: rotateZ(270deg);

	opacity: 1;
}

.webapp .nokia {
	position: absolute; top: 0; left: 0;
	width: 174px; height: 315px;

	/* background-image: url(../svg/apps-nokia.svg); */

	-webkit-transform: translate(4000px, 257px);
	transform: translate(4000px, 257px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;

	z-index: 2;
	opacity: 0;
	overflow: hidden;
}
.webapp .nokia.show {
	-webkit-transform: translate(330px, 257px);
	transform: translate(330px, 257px);

	opacity: 1;
}
.webapp .nokia.move-left {
	-webkit-transform: translate(-2000px, 257px);
	transform: translate(-2000px, 257px);
}
.webapp .nokia .nokia-glare {
	position: absolute; top: 0; left: 0;
	width: 168px; height: 219px;

	/* background-image: url(../svg/apps-nokia-glare.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transform: translate(-100px, 2px);
	transform: translate(-100px, 2px);

	-webkit-transition: all 0.5s .2s ease-out;
	-ms-transition: all 0.5s .2s ease-out;
	transition: all 0.5s .2s ease-out;

	z-index: 3;

	opacity: 0;
}
.webapp .nokia.show .nokia-glare {
	-webkit-transform: translate(2px, 2px);
	transform: translate(2px, 2px);

	opacity: 1;
}
.webapp .nokia .nokia-splash {
	position: absolute; top: 30px; left: 19px;
	width: 133px; height: 235px;

	/* background-image: url(../svg/apps-nokia-splash.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transition: all 0.2s 1.7s linear;
	-ms-transition: all 0.2s 1.7s linear;
	transition: all 0.2s 1.7s linear;

	z-index: 1;

	opacity: 0;
}
.webapp .nokia.show .nokia-splash {
	opacity: 1;
}
.webapp .nokia .nokia-rays {
	position: absolute; top: 93px; left: 36px;
	width: 103px; height: 103px;

	/* background-image: url(../svg/apps-splash-rays.svg); */
	background-position: left top;
	background-repeat: no-repeat;

	-webkit-transform: rotateZ(0deg);
	transform: rotateZ(0deg);

	-webkit-transition: all 4s 1.7s linear;
	-ms-transition: all 4s 1.7s linear;
	transition: all 4s 1.7s linear;

	z-index: 2;

	opacity: 0;
}
.webapp .nokia.show .nokia-rays {
	-webkit-transform: rotateZ(270deg);
	transform: rotateZ(270deg);

	opacity: 1;
}

.webapp .cloud {
	position: absolute; top: 0;
	width: 155px; height: 86px;

	/* background-image: url(../svg/apps-cloud.svg); */
	background-repeat: no-repeat;

	-webkit-transform: translate(-200px, 66px);
	transform: translate(-200px, 66px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;

	-webkit-animation: apps-cloud-move 3s linear .1s 1 normal;
	-moz-animation: apps-cloud-move 3s linear .1s 1 normal;
	-ms-animation: apps-cloud-move 3s linear .1s 1 normal;
	-o-animation: apps-cloud-move 3s linear .1s 1 normal;
	animation: apps-cloud-move 3s linear .1s 1 normal;

	-webkit-animation-play-state: paused;
	-moz-animation-play-state: paused;
	-ms-animation-play-state: paused;
	-o-animation-play-state: paused;
	animation-play-state: paused;

	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	-ms-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;

	z-index: 6;

	overflow: hidden;

	opacity: 0;
}
@-webkit-keyframes apps-cloud-move {
	0% {
		-webkit-transform: translate(600px, 66px);
		transform: translate(600px, 66px);

		opacity: 0;
	}
	20% {
		-webkit-transform: translate(440px, 66px);
		transform: translate(440px, 66px);

		opacity: 1;
	}
	80% {
		-webkit-transform: translate(-40px, 66px);
		transform: translate(-40px, 66px);

		opacity: 1;
	}
	100% {
		-webkit-transform: translate(-200px, 66px);
		transform: translate(-200px, 66px);

		opacity: 0;
	}
}
@keyframes apps-cloud-move {
	0% {
		-webkit-transform: translate(600px, 66px);
		transform: translate(600px, 66px);

		opacity: 0;
	}
	20% {
		-webkit-transform: translate(440px, 66px);
		transform: translate(440px, 66px);

		opacity: 1;
	}
	80% {
		-webkit-transform: translate(-40px, 66px);
		transform: translate(-40px, 66px);

		opacity: 1;
	}
	100% {
		-webkit-transform: translate(-200px, 66px);
		transform: translate(-200px, 66px);

		opacity: 0;
	}
}
.webapp .cloud.show {
	-webkit-animation-play-state: running;
	-moz-animation-play-state: running;
	-ms-animation-play-state: running;
	-o-animation-play-state: running;
	animation-play-state: running;
}
.webapp .cloud.move-left {
	-webkit-transform: translate(-2000px, 66px);
	transform: translate(-2000px, 66px);
}
.webapp .icon-1 {
	position: absolute; top: 0;
	width: 33px; height: 33px;

/* 	background-image: url(../svg/apps-jp-icon.svg); */

	-webkit-transform: translate(402px, 300px);
	transform: translate(402px, 300px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;

	-webkit-animation: icon-1-move 1s linear .1s 1 normal;
	-moz-animation: icon-1-move 1s linear .1s 1 normal;
	-ms-animation: icon-1-move 1s linear .1s 1 normal;
	-o-animation: icon-1-move 1s linear .1s 1 normal;
	animation: icon-1-move 1s linear .1s 1 normal;

	-webkit-animation-play-state: paused;
	-moz-animation-play-state: paused;
	-ms-animation-play-state: paused;
	-o-animation-play-state: paused;
	animation-play-state: paused;

	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	-ms-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;

	z-index: 1;

	overflow: hidden;

	opacity: 0;
}
@-webkit-keyframes icon-1-move {
	0% {
		-webkit-transform: translate(402px, 110px);
		transform: translate(402px, 110px);

		opacity: 0;
	}
	1% {
		-webkit-transform: translate(402px, 110px);
		transform: translate(402px, 110px);

		opacity: 1;
	}
	99% {
		-webkit-transform: translate(402px, 300px);
		transform: translate(402px, 300px);

		opacity: 1;
	}
	100% {
		-webkit-transform: translate(402px, 300px);
		transform: translate(402px, 300px);

		opacity: 0;
	}
}
@keyframes icon-1-move {
	0% {
		-webkit-transform: translate(402px, 110px);
		transform: translate(402px, 110px);

		opacity: 0;
	}
	1% {
		-webkit-transform: translate(402px, 110px);
		transform: translate(402px, 110px);

		opacity: 1;
	}
	99% {
		-webkit-transform: translate(402px, 300px);
		transform: translate(402px, 300px);

		opacity: 1;
	}
	100% {
		-webkit-transform: translate(402px, 300px);
		transform: translate(402px, 300px);

		opacity: 0;
	}
}
.webapp .icon-1.show {
	-webkit-animation-play-state: running;
	-moz-animation-play-state: running;
	-ms-animation-play-state: running;
	-o-animation-play-state: running;
	animation-play-state: running;
}
.webapp .icon-1.move-left {
	-webkit-transform: translate(-2000px, 300px);
	transform: translate(-2000px, 300px);
}
.webapp .icon-2 {
	position: absolute; top: 0;
	width: 33px; height: 33px;

	/* background-image: url(../svg/apps-jp-icon.svg); */

	-webkit-transform: translate(292px, 300px);
	transform: translate(292px, 300px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;

	-webkit-animation: icon-2-move 1s linear .1s 1 normal;
	-moz-animation: icon-2-move 1s linear .1s 1 normal;
	-ms-webkit-animation: icon-2-move 1s linear .1s 1 normal;
	-o-webkit-animation: icon-2-move 1s linear .1s 1 normal;
	animation: icon-2-move 1s linear .1s 1 normal;

	-webkit-animation-play-state: paused;
	-moz-animation-play-state: paused;
	-ms-animation-play-state: paused;
	-o-animation-play-state: paused;
	animation-play-state: paused;

	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	-ms-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;

	z-index: 1;

	overflow: hidden;

	opacity: 0;
}
@-webkit-keyframes icon-2-move {
	0% {
		-webkit-transform: translate(292px, 110px);
		transform: translate(292px, 110px);

		opacity: 0;
	}
	1% {
		-webkit-transform: translate(292px, 110px);
		transform: translate(292px, 110px);

		opacity: 1;
	}
	99% {
		-webkit-transform: translate(292px, 300px);
		transform: translate(292px, 300px);

		opacity: 1;
	}
	100% {
		-webkit-transform: translate(292px, 300px);
		transform: translate(292px, 300px);

		opacity: 0;
	}
}
@keyframes icon-2-move {
	0% {
		-webkit-transform: translate(292px, 110px);
		transform: translate(292px, 110px);

		opacity: 0;
	}
	1% {
		-webkit-transform: translate(292px, 110px);
		transform: translate(292px, 110px);

		opacity: 1;
	}
	99% {
		-webkit-transform: translate(292px, 300px);
		transform: translate(292px, 300px);

		opacity: 1;
	}
	100% {
		-webkit-transform: translate(292px, 300px);
		transform: translate(292px, 300px);

		opacity: 0;
	}
}
.webapp .icon-2.show {
	-webkit-animation-play-state: running;
	-moz-animation-play-state: running;
	-ms-animation-play-state: running;
	-o-animation-play-state: running;
	animation-play-state: running;
}
.webapp .icon-2.move-left {
	-webkit-transform: translate(-2000px, 300px);
	transform: translate(-2000px, 300px);
}
.webapp .icon-3 {
	position: absolute; top: 0;
	width: 33px; height: 33px;

	/* background-image: url(../svg/apps-jp-icon.svg); */

	-webkit-transform: translate(166px, 300px);
	transform: translate(166px, 300px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;

	-webkit-animation: icon-3-move 1s linear .1s 1 normal;
	-moz-animation: icon-3-move 1s linear .1s 1 normal;
	-ms-animation: icon-3-move 1s linear .1s 1 normal;
	-o-animation: icon-3-move 1s linear .1s 1 normal;
	animation: icon-3-move 1s linear .1s 1 normal;

	-webkit-animation-play-state: paused;
	-moz-animation-play-state: paused;
	-ms-animation-play-state: paused;
	-o-animation-play-state: paused;
	animation-play-state: paused;

	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	-ms-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;

	z-index: 1;

	overflow: hidden;

	opacity: 0;
}
@-webkit-keyframes icon-3-move {
	0% {
		-webkit-transform: translate(166px, 110px);
		transform: translate(166px, 110px);

		opacity: 0;
	}
	1% {
		-webkit-transform: translate(166px, 110px);
		transform: translate(166px, 110px);

		opacity: 1;
	}
	99% {
		-webkit-transform: translate(166px, 300px);
		transform: translate(166px, 300px);

		opacity: 1;
	}
	100% {
		-webkit-transform: translate(166px, 300px);
		transform: translate(166px, 300px);

		opacity: 0;
	}
}
@keyframes icon-3-move {
	0% {
		-webkit-transform: translate(166px, 110px);
		transform: translate(166px, 110px);

		opacity: 0;
	}
	1% {
		-webkit-transform: translate(166px, 110px);
		transform: translate(166px, 110px);

		opacity: 1;
	}
	99% {
		-webkit-transform: translate(166px, 300px);
		transform: translate(166px, 300px);

		opacity: 1;
	}
	100% {
		-webkit-transform: translate(166px, 300px);
		transform: translate(166px, 300px);

		opacity: 0;
	}
}
.webapp .icon-3.show {
	-webkit-animation-play-state: running;
	-moz-animation-play-state: running;
	-ms-animation-play-state: running;
	-o-animation-play-state: running;
	animation-play-state: running;
}
.webapp .icon-3.move-left {
	-webkit-transform: translate(-2000px, 300px);
	transform: translate(-2000px, 300px);
}


.webapp .title {
	position: absolute; top: 240px;
	width: 374px;

	-webkit-transform: translateX(4000px);
	transform: translateX(4000px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;
}
.webapp .title.show {
	-webkit-transform: translateX(616px);
	transform: translateX(616px);
}
.webapp .title.move-left {
	-webkit-transform: translateX(-2000px);
	transform: translateX(-2000px);
}
.webapp .overview {
	position: absolute; top: 396px;
	width: 352px;

	-webkit-transform: translateX(4000px);
	transform: translateX(4000px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;
}
.webapp .overview.show {
	-webkit-transform: translateX(616px);
	transform: translateX(616px);
}
.webapp .overview.move-left {
	-webkit-transform: translateX(-2000px);
	transform: translateX(-2000px);
}
.webapp .btn a:hover {
	color: #1ABBF2;
}



.seo.hide {
	display: none;
}
.seo .browser {
	position: absolute; top: 198px; left: 0;
	width: 440px; height: 375px;

	/* background-image: url(../svg/seo-google-main.svg); */
	background-repeat: no-repeat;

	-webkit-transform: translateX(2000px);
	transform: translateX(2000px);

	-webkit-perspective: 1600;
	perspective: 1600;

	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;

	opacity: 0;
}
.seo .browser.show {
	-webkit-transform: translateX(88px);
	transform: translateX(88px);

	-webkit-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear;
	transition: all 0.2s linear;

	opacity: 1;
}
.seo .browser.show.minimize {
	-webkit-transform: perspective(1600) translate3d(88px, 0, -100px);
	transform: perspective(1600) translate3d(88px, 0, -100px);

	opacity: 1;
}
.seo .browser.move-left {
	-webkit-transform: translateX(-2000px);
	transform: translateX(-2000px);
}
.seo .browser .search-query {
	position: absolute; top: 186px; left: 144px;
	width: 0px; height: 3px;

	background-image: url(../svg/seo-google-query.svg);
	background-repeat: no-repeat;

	-webkit-transition: all 0.2s 0.8s linear;
	-ms-transition: all 0.2s .8s linear;
	transition: all 0.2s .8s linear;

	opacity: 1;

	z-index: 1;

/* 	overflow: hidden; */
}
.seo .browser.show .search-query {
	width: 40px;
}
.seo .browser .google-results {
	position: absolute; top: 0px; left: 0;
	width: 440px; height: 353px;

	/* background-image: url(../svg/seo-google-result.svg); */
	background-repeat: no-repeat;

	-webkit-transition: all 0.1s 1.4s ease-out;
	-ms-transition: all 0.1s 1.4s ease-out;
	transition: all 0.1s 1.4s ease-out;

	opacity: 0;

	z-index: 2;
}
.seo .browser.show .google-results {
	opacity: 1;
}
.seo .browser .google-results-1 {
	position: absolute; top: 0;
	width: 161px; height: 40px;

	/* background-image: url(../svg/seo-google-result-01.svg); */
	background-repeat: no-repeat;

	-webkit-transform: translate(66px, 90px);
	transform: translate(66px, 90px);

	-webkit-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;

	-webkit-animation: seo-results-1-animation 2s linear 1.5s 1 normal;
	-moz-animation: seo-results-1-animation 2s linear 1.5s 1 normal;
	-ms-animation: seo-results-1-animation 2s linear 1.5s 1 normal;
	-o-animation: seo-results-1-animation 2s linear 1.5s 1 normal;
	animation: seo-results-1-animation 2s linear 1.5s 1 normal;

	-webkit-animation-play-state: paused;
	-moz-animation-play-state: paused;
	-ms-animation-play-state: paused;
	-o-animation-play-state: paused;
	animation-play-state: paused;

	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	-ms-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;

	z-index: 1;

	overflow: hidden;

	opacity: 0;
}
@-webkit-keyframes seo-results-1-animation {
	0% {
		-webkit-transform: translate(66px, 90px);
		transform: translate(66px, 90px);

		opacity: 0;
	}
	5% {
		-webkit-transform: translate(66px, 90px);
		transform: translate(66px, 90px);

		opacity: 1;
	}
	75% {
		-webkit-transform: translate(66px, 90px);
		transform: translate(66px, 90px);

		opacity: 1;
	}
	85% {
		-webkit-transform: translate(66px, 160px);
		transform: translate(66px, 160px);

		opacity: 1;
	}
	100% {
		-webkit-transform: translate(66px, 160px);
		transform: translate(66px, 160px);

		opacity: 1;
	}
}
@keyframes seo-results-1-animation {
	0% {
		-webkit-transform: translate(66px, 90px);
		transform: translate(66px, 90px);

		opacity: 0;
	}
	5% {
		-webkit-transform: translate(66px, 90px);
		transform: translate(66px, 90px);

		opacity: 1;
	}
	75% {
		-webkit-transform: translate(66px, 90px);
		transform: translate(66px, 90px);

		opacity: 1;
	}
	85% {
		-webkit-transform: translate(66px, 160px);
		transform: translate(66px, 160px);

		opacity: 1;
	}
	100% {
		-webkit-transform: translate(66px, 160px);
		transform: translate(66px, 160px);

		opacity: 1;
	}
}
.seo .browser.show .google-results-1 {
	-webkit-animation-play-state: running;
	-moz-animation-play-state: running;
	-ms-animation-play-state: running;
	-o-animation-play-state: running;
	animation-play-state: running;
}


.seo .google-results-2 {
	position: absolute; top: 0;
	width: 161px; height: 40px;

	/* background-image: url(../svg/seo-google-result-02.svg); */
	background-repeat: no-repeat;

	-webkit-transform: translate(66px, 150px);
	transform: translate(66px, 150px);

	-webkit-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;

	-webkit-animation: seo-results-2-animation 2s linear 1.5s 1 normal;
	-moz-animation: seo-results-2-animation 2s linear 1.5s 1 normal;
	-ms-animation: seo-results-2-animation 2s linear 1.5s 1 normal;
	-o-animation: seo-results-2-animation 2s linear 1.5s 1 normal;
	animation: seo-results-2-animation 2s linear 1.5s 1 normal;

	-webkit-animation-play-state: paused;
	-moz-animation-play-state: paused;
	-ms-animation-play-state: paused;
	-o-animation-play-state: paused;
	animation-play-state: paused;

	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	-ms-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;

	z-index: 1;

	overflow: hidden;

	opacity: 0;
}
@-webkit-keyframes seo-results-2-animation {
	0% {
		-webkit-transform: translate(66px, 150px);
		transform: translate(66px, 150px);

		opacity: 0;
	}
	5% {
		-webkit-transform: translate(66px, 150px);
		transform: translate(66px, 150px);

		opacity: 0;
	}
	10% {
		-webkit-transform: translate(66px, 150px);
		transform: translate(66px, 150px);

		opacity: 1;
	}
	70% {
		-webkit-transform: translate(66px, 150px);
		transform: translate(66px, 150px);

		opacity: 1;
	}
	80% {
		-webkit-transform: translate(66px, 220px);
		transform: translate(66px, 220px);

		opacity: 1;
	}
	100% {
		-webkit-transform: translate(66px, 220px);
		transform: translate(66px, 220px);

		opacity: 1;
	}
}
@keyframes seo-results-2-animation {
	0% {
		-webkit-transform: translate(66px, 150px);
		transform: translate(66px, 150px);

		opacity: 0;
	}
	5% {
		-webkit-transform: translate(66px, 150px);
		transform: translate(66px, 150px);

		opacity: 0;
	}
	10% {
		-webkit-transform: translate(66px, 150px);
		transform: translate(66px, 150px);

		opacity: 1;
	}
	70% {
		-webkit-transform: translate(66px, 150px);
		transform: translate(66px, 150px);

		opacity: 1;
	}
	80% {
		-webkit-transform: translate(66px, 220px);
		transform: translate(66px, 220px);

		opacity: 1;
	}
	100% {
		-webkit-transform: translate(66px, 220px);
		transform: translate(66px, 220px);

		opacity: 1;
	}
}
.seo .browser.show .google-results-2 {
	-webkit-animation-play-state: running;
	-moz-animation-play-state: running;
	-ms-animation-play-state: running;
	-o-animation-play-state: running;
	animation-play-state: running;
}

.seo .google-results-3 {
	position: absolute; top: 0;
	width: 161px; height: 40px;

	/* background-image: url(../svg/seo-google-result-03.svg); */
	background-repeat: no-repeat;

	-webkit-transform: translate(66px, 210px);
	transform: translate(66px, 210px);

	-webkit-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;

	-webkit-animation: seo-results-3-animation 2s linear 1.5s 1 normal;
	-moz-animation: seo-results-3-animation 2s linear 1.5s 1 normal;
	-ms-animation: seo-results-3-animation 2s linear 1.5s 1 normal;
	-o-animation: seo-results-3-animation 2s linear 1.5s 1 normal;
	animation: seo-results-3-animation 2s linear 1.5s 1 normal;

	-webkit-animation-play-state: paused;
	-moz-animation-play-state: paused;
	-ms-animation-play-state: paused;
	-o-animation-play-state: paused;
	animation-play-state: paused;

	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	-ms-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;

	z-index: 1;

	overflow: hidden;

	opacity: 0;
}
@-webkit-keyframes seo-results-3-animation {
	0% {
		-webkit-transform: translate(66px, 210px);
		transform: translate(66px, 210px);

		opacity: 0;
	}
	10% {
		-webkit-transform: translate(66px, 210px);
		transform: translate(66px, 210px);

		opacity: 0;
	}
	15% {
		-webkit-transform: translate(66px, 210px);
		transform: translate(66px, 210px);

		opacity: 1;
	}
	65% {
		-webkit-transform: translate(66px, 210px);
		transform: translate(66px, 210px);

		opacity: 1;
	}
	75% {
		-webkit-transform: translate(66px, 280px);
		transform: translate(66px, 280px);

		opacity: 1;
	}
	100% {
		-webkit-transform: translate(66px, 280px);
		transform: translate(66px, 280px);

		opacity: 1;
	}
}
@keyframes seo-results-3-animation {
	0% {
		-webkit-transform: translate(66px, 210px);
		transform: translate(66px, 210px);

		opacity: 0;
	}
	10% {
		-webkit-transform: translate(66px, 210px);
		transform: translate(66px, 210px);

		opacity: 0;
	}
	15% {
		-webkit-transform: translate(66px, 210px);
		transform: translate(66px, 210px);

		opacity: 1;
	}
	65% {
		-webkit-transform: translate(66px, 210px);
		transform: translate(66px, 210px);

		opacity: 1;
	}
	75% {
		-webkit-transform: translate(66px, 280px);
		transform: translate(66px, 280px);

		opacity: 1;
	}
	100% {
		-webkit-transform: translate(66px, 280px);
		transform: translate(66px, 280px);

		opacity: 1;
	}
}
.seo .browser.show .google-results-3 {
	-webkit-animation-play-state: running;
	-moz-animation-play-state: running;
	-ms-animation-play-state: running;
	-o-animation-play-state: running;
	animation-play-state: running;
}

.seo .google-results-4 {
	position: absolute; top: 0;
	width: 440px; height: 66px;

	/* background-image: url(../svg/seo-google-result-04.svg); */
	background-repeat: no-repeat;

	-webkit-transform: translate(0px, 260px);
	transform: translate(0px, 260px);

	-webkit-transition: all 0.4s ease-out;
	-ms-transition: all 0.4s ease-out;
	transition: all 0.4s ease-out;

	-webkit-animation: seo-results-4-animation 2s linear 1.5s 1 normal;
	-moz-animation: seo-results-4-animation 2s linear 1.5s 1 normal;
	-ms-animation: seo-results-4-animation 2s linear 1.5s 1 normal;
	-o-animation: seo-results-4-animation 2s linear 1.5s 1 normal;
	animation: seo-results-4-animation 2s linear 1.5s 1 normal;

	-webkit-animation-play-state: paused;
	-moz-animation-play-state: paused;
	-ms-animation-play-state: paused;
	-o-animation-play-state: paused;
	animation-play-state: paused;

	-webkit-animation-fill-mode: forwards;
	-moz-animation-fill-mode: forwards;
	-ms-animation-fill-mode: forwards;
	-o-animation-fill-mode: forwards;
	animation-fill-mode: forwards;

	z-index: 1;

	overflow: hidden;

	opacity: 0;
}
@-webkit-keyframes seo-results-4-animation {
	0% {
		-webkit-transform: translate(0px, 260px);
		transform: translate(0px, 260px);

		opacity: 0;
	}
	15% {
		-webkit-transform: translate(0px, 260px);
		transform: translate(0px, 260px);

		opacity: 0;
	}
	20% {
		-webkit-transform: translate(0px, 260px);
		transform: translate(0px, 260px);

		opacity: 1;
	}
	40% {
		-webkit-transform: translate(0px, 260px);
		transform: translate(0px, 260px);

		opacity: 1;
	}
	50% {
		-webkit-transform: perspective(1600) translate3d(0, 260px, 100px);
		transform: perspective(1600) translate3d(0, 260px, 100px);

		opacity: 1;
	}
	60% {
		-webkit-transform: perspective(1600) translate3d(0, 260px, 100px);
		transform: perspective(1600) translate3d(0, 260px, 100px);

		opacity: 1;
	}
	80% {
		-webkit-transform: perspective(1600) translate3d(0, 80px, 100px);
		transform: perspective(1600) translate3d(0, 80px, 100px);

		opacity: 1;
	}
	85% {
		-webkit-transform: perspective(1600) translate3d(0, 80px, 100px);
		transform: perspective(1600) translate3d(0, 80px, 100px);

		opacity: 1;
	}
	95% {
		-webkit-transform: translate(0px, 80px);
		transform: translate(0px, 80px);

		opacity: 1;
	}
	100% {
		-webkit-transform: translate(0px, 80px);
		transform: translate(0px, 80px);

		opacity: 1;
	}
}
@keyframes seo-results-4-animation {
	0% {
		-webkit-transform: translate(0px, 260px);
		transform: translate(0px, 260px);

		opacity: 0;
	}
	15% {
		-webkit-transform: translate(0px, 260px);
		transform: translate(0px, 260px);

		opacity: 0;
	}
	20% {
		-webkit-transform: translate(0px, 260px);
		transform: translate(0px, 260px);

		opacity: 1;
	}
	40% {
		-webkit-transform: translate(0px, 260px);
		transform: translate(0px, 260px);

		opacity: 1;
	}
	50% {
		-webkit-transform: perspective(1600) translate3d(0, 260px, 100px);
		transform: perspective(1600) translate3d(0, 260px, 100px);

		opacity: 1;
	}
	60% {
		-webkit-transform: perspective(1600) translate3d(0, 260px, 100px);
		transform: perspective(1600) translate3d(0, 260px, 100px);

		opacity: 1;
	}
	80% {
		-webkit-transform: perspective(1600) translate3d(0, 80px, 100px);
		transform: perspective(1600) translate3d(0, 80px, 100px);

		opacity: 1;
	}
	85% {
		-webkit-transform: perspective(1600) translate3d(0, 80px, 100px);
		transform: perspective(1600) translate3d(0, 80px, 100px);

		opacity: 1;
	}
	95% {
		-webkit-transform: translate(0px, 80px);
		transform: translate(0px, 80px);

		opacity: 1;
	}
	100% {
		-webkit-transform: translate(0px, 80px);
		transform: translate(0px, 80px);

		opacity: 1;
	}
}
.seo .browser.show .google-results-4 {
	-webkit-animation-play-state: running;
	-moz-animation-play-state: running;
	-ms-animation-play-state: running;
	-o-animation-play-state: running;
	animation-play-state: running;
}
.service.seo .title {
	position: absolute; top: 257px;
	width: 374px;

	-webkit-transform: translateX(4000px);
	transform: translateX(4000px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;
}
.seo .title.show {
	-webkit-transform: translateX(616px);
	transform: translateX(616px);
}
.seo .title.move-left {
	-webkit-transform: translateX(-2000px);
	transform: translateX(-2000px);
}
.seo .overview {
	position: absolute; top: 374px;
	width: 352px;

	-webkit-transform: translateX(4000px);
	transform: translateX(4000px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;
}
.seo .overview.show {
	-webkit-transform: translateX(616px);
	transform: translateX(616px);
}
.seo .overview.move-left {
	-webkit-transform: translateX(-2000px);
	transform: translateX(-2000px);
}
.seo .btn a:hover {
	color: #ED714D;
}


.cms.hide {
	display: none;
}
.cms .browser {
	position: absolute; top: 187px;
	width: 506px; height: 408px;

	background-image: url(../svg/cms-browser.svg);
	background-repeat: no-repeat;

	-webkit-transform: translateX(4000px);
	transform: translateX(4000px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;

	overflow: hidden;

	opacity: 0;
}
.cms .browser.show {
	-webkit-transform: translateX(44px);
	transform: translateX(44px);

	opacity: 1;
}
.cms .browser.move-left {
	-webkit-transform: translateX(-2000px);
	transform: translateX(-2000px);
}
.cms .browser .left-panel {
	position: absolute; top: 33px; left: 0;
	width: 506px; height: 375px;

	background-image: url(../svg/cms-left-panel.svg);
	background-repeat: no-repeat;

	-webkit-transform: translateX(-506px);
	transform: translateX(-506px);

	-webkit-transition: all 0.6s .8s ease-out;
	-ms-transition: all 0.6s .8s ease-out;
	transition: all 0.6s .8s ease-out;

	z-index: 3;
}
.cms .browser.show .left-panel {
	-webkit-transform: translateX(0);
	transform: translateX(0);
}
.cms .browser .center-panel {
	position: absolute; top: 33px; left: 0;
	width: 506px; height: 375px;

	background-image: url(../svg/cms-center-panel.svg);
	background-repeat: no-repeat;

	-webkit-transform: translateX(-506px);
	transform: translateX(-506px);

	-webkit-transition: all 0.6s 1.2s ease-out;
	-ms-transition: all 0.6s 1.2s ease-out;
	transition: all 0.6s 1.2s ease-out;

	z-index: 2;
}
.cms .browser.show .center-panel {
	-webkit-transform: translateX(0);
	transform: translateX(0);
}
.cms .browser .right-panel {
	position: absolute; top: 33px; left: 0;
	width: 506px; height: 375px;

	background-image: url(../svg/cms-right-panel.svg);
	background-repeat: no-repeat;

	-webkit-transform: translateX(-506px);
	transform: translateX(-506px);

	-webkit-transition: all 0.6s 1.6s ease-out;
	-ms-transition: all 0.6s 1.6s ease-out;
	transition: all 0.6s 1.6s ease-out;

	z-index: 1;
}
.cms .browser.show .right-panel {
	-webkit-transform: translateX(0);
	transform: translateX(0);
}
.cms .title {
	position: absolute; top: 224px;
	width: 374px;

	-webkit-transform: translateX(4000px);
	transform: translateX(4000px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;
}
.cms .title.show {
	-webkit-transform: translateX(616px);
	transform: translateX(616px);
}
.cms .title.move-left {
	-webkit-transform: translateX(-2000px);
	transform: translateX(-2000px);
}
.cms .overview {
	position: absolute; top: 370px;
	width: 352px;

	-webkit-transform: translateX(4000px);
	transform: translateX(4000px);

	-webkit-transition: all 0.6s ease-out;
	-ms-transition: all 0.6s ease-out;
	transition: all 0.6s ease-out;
}
.cms .overview.show {
	-webkit-transform: translateX(616px);
	transform: translateX(616px);
}
.cms .overview.move-left {
	-webkit-transform: translateX(-2000px);
	transform: translateX(-2000px);
}
.cms .btn a:hover {
	color: #F0B42F;
	color: #3D3D3D;
}


.internal-page {
	position: relative;
	width: 100%; min-height: 100%;
	background-color: #F7F7F7;
}
.internal-page article {
	position: relative;
	padding: 60px 0 0 0;

	color: #727272;
	font-size: 18px;
	font-family: 'futurafuturiscregular', Helvetica, sans-serif;
	line-height: 1.4em;
	-webkit-font-smoothing: antialiased;

	-webkit-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear;
	transition: all 0.2s linear;

	z-index: 1;
}
.internal-page.back1 article {
	-webkit-filter: blur(2px);
	-moz-filter: blur(2px);
	-ms-filter: blur(2px);
	-o-filter: blur(2px);
	filter: blur(2px);

	-webkit-transform: perspective(800) translateZ(-15px);
	transform: perspective(800) translateZ(-15px);

	opacity: 0.9;
}
.internal-page.back2 article {
	-webkit-filter: blur(4px);
	-moz-filter: blur(4px);
	-ms-filter: blur(4px);
	-o-filter: blur(4px);
	filter: blur(4px);

	-webkit-transform: perspective(800) translateZ(-30px);
	transform: perspective(800) translateZ(-30px);

	opacity: 0.8;
}
.internal-page.back3 article {
	-webkit-filter: blur(8px);
	-moz-filter: blur(8px);
	-ms-filter: blur(8px);
	-o-filter: blur(8px);
	filter: blur(8px);

	-webkit-transform: perspective(800) translateZ(-40px);
	transform: perspective(800) translateZ(-40px);

	opacity: 0.7;
}
.internal-page article a {
	text-decoration: none;
}
.internal-page article .article-content a {
	color: inherit;
	text-decoration: none;

	border-bottom: solid 1px #727272;
}
.internal-page article .article-content a:hover {
	color: #111;
	border-bottom: solid 1px #111;
}
.internal-page.light-blue article .article-content a:hover {
	color: #1cbdf3;
	border-bottom: solid 1px #1cbdf3;
}
.internal-page.green article .article-content a:hover {
	color: #3dc73c;
	border-bottom: solid 1px #3dc73c;
}
.internal-page article strong {
	font-size: 18px;
	font-family: 'futurafuturiscregular', Helvetica, sans-serif;
	font-weight: normal;
}
.internal-page article b {
	font-family: 'futurafuturiscbold', Helvetica, sans-serif;
	font-weight: normal;
}
.internal-page article .btn {
	display: inline-block;
	width: auto; height: auto;
	margin: 40px auto;
	padding: 22px 40px 20px 40px;

	color: #999;
	font-size: 20px;
	font-family: 'futurafuturiscregular', Helvetica, sans-serif;
	line-height: 26px;
	text-transform: uppercase;
	text-align: center;
	-webkit-font-smoothing: antialiased;

	background-color: transparent;

	border: solid 2px #AAA;
	box-sizing:

	-webkit-transition: all 0.1s ease-out;
	-ms-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;

	cursor: pointer;
}
.internal-page article .btn:hover {
	color: #FFF;
	background-color: #AAA;
}
.internal-page article .btn.pressed {
	-webkit-transform: scale(0.98);
	transform: scale(0.98);
}
.internal-page article .btn.expand {
	height: 100px;
}
.internal-page.light-blue article .btn {
	color: #00c3ff;
	border: solid 2px #00c3ff;
}
.internal-page.light-blue article .btn:hover {
	color: #FFF;
	background-color: #00c3ff;
}
.internal-page.green article .btn {
	color: #3dc73c;
	border: solid 2px #3dc73c;
}
.internal-page.green article .btn:hover {
	color: #FFF;
	background-color: #3dc73c;
}
.internal-page article h1 {
	position: relative;
	width: 100%;
	max-width: 682px;
	margin: 40px auto;
	box-sizing: border-box;

	color: #2e2e2e;
	font-size: 40px;
	line-height: 60px;
	font-family: 'futurafuturiscbold', Helvetica, sans-serif;
	font-weight: normal;
	text-align: center;
	text-transform: uppercase;
}
.internal-page article h2 {
	position: relative;
	width: 100%;
	max-width: 682px;
	margin: 20px auto;
	box-sizing: border-box;

	color: #2e2e2e;
	font-size: 30px;
	line-height: 45px;
	font-family: 'futurafuturiscbold', Helvetica, sans-serif;
	font-weight: normal;
	text-align: center;
	text-transform: uppercase;
}
.internal-page article h3 {
	position: relative;
	width: 100%;
	max-width: 682px;
	margin: 20px auto;
	box-sizing: border-box;

	color: #2e2e2e;
	font-size: 20px;
	line-height: 30px;
	font-family: 'futurafuturiscbold', Helvetica, sans-serif;
	font-weight: normal;
	text-align: left;
	text-transform: uppercase;
}
.internal-page article h4 {
	position: relative;
	width: 100%;
	max-width: 682px;
	margin: 0 auto;
	box-sizing: border-box;

	color: #2e2e2e;
	font-weight: normal;
}
.internal-page article .article-content {
/* 	width: 682px; */
	margin: 0 auto;
	padding: 30px 0;

	display: -webkit-flex;
	display: flex;

	-webkit-flex-direction: column;
	flex-direction: column;

	-webkit-justify-content: center;
	justify-content: center;

	-webkit-align-items: center;
	align-items: center;
}
.internal-page article .article-content .paragraph,
.internal-page article .article-content > p {
	position: relative;
	width: 100%;
	max-width: 682px;
	margin: 10px auto;
	padding: 0;
	box-sizing: border-box;

/* 	color: #727272; */
}
.internal-page article p {
	opacity: 1;

/*
	-webkit-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
*/
}
.internal-page article p.active {
	opacity: 1;
}
.internal-page article blockquote {
	position: relative; /* left: -10%; */
	width: 100%;
	padding: 80px 0;
	margin: 40px auto;
	box-sizing: border-box;

	color: #333;
	font-family: 'futurafuturiscregular', Helvetica, sans-serif;
	font-size: 30px;
	line-height: 50px;
	text-transform: uppercase;
	text-align: center;

	background-color: #ececec;

	-webkit-box-shadow:
		600px 0 0 0 #ececec,
		-600px 0 0 0 #ececec;
	box-shadow:
		600px 0 0 0 #ececec,
		-600px 0 0 0 #ececec;

	overflow: hidden;
}
.internal-page article blockquote.deepblue {
	color: #FFF;

	background-color: #3d66d7;

	-webkit-box-shadow: 50px 0 0 0 #3d66d7, -50px 0 0 0 #3d66d7;
	box-shadow: 50px 0 0 0 #3d66d7, -50px 0 0 0 #3d66d7;
}
.internal-page.light-blue article blockquote,
.internal-page article blockquote.light-blue {
	color: #FFF;

	background-color: #1ABBF2;

	-webkit-box-shadow: 50px 0 0 0 #1ABBF2, -50px 0 0 0 #1ABBF2;
	box-shadow: 50px 0 0 0 #1ABBF2, -50px 0 0 0 #1ABBF2;
}
.internal-page.darkgray article blockquote,
.internal-page article blockquote.darkgray {
	color: #FFF;

	background-color: #2e2e2e;

	-webkit-box-shadow: 50px 0 0 0 #2e2e2e, -50px 0 0 0 #2e2e2e;
	box-shadow: 50px 0 0 0 #2e2e2e, -50px 0 0 0 #2e2e2e;
}
.internal-page.red article blockquote,
.internal-page article blockquote.red {
	color: #FFF;

	background-color: #ED714D;

	-webkit-box-shadow: 50px 0 0 0 #ED714D, -50px 0 0 0 #ED714D;
	box-shadow: 50px 0 0 0 #ED714D, -50px 0 0 0 #ED714D;
}
.internal-page.green article blockquote,
.internal-page article blockquote.green {
	color: #FFF;

	background-color: #3dc73c;

	-webkit-box-shadow: 50px 0 0 0 #3dc73c, -50px 0 0 0 #3dc73c;
	box-shadow: 50px 0 0 0 #3dc73c, -50px 0 0 0 #3dc73c;
}
.internal-page.yellow article blockquote,
.internal-page article blockquote.yellow {
	color: #FFF;

	background-color: #F0B42F;

	-webkit-box-shadow: 50px 0 0 0 #F0B42F, -50px 0 0 0 #F0B42F;
	box-shadow: 50px 0 0 0 #F0B42F, -50px 0 0 0 #F0B42F;
}
.internal-page article blockquote > div {
	position: relative;
	width: 100%;
	max-width: 682px;
	margin: 0 auto;

	z-index: 2;
}
.internal-page article blockquote .glare {
	display: block;
	position: absolute; top: 0; left: 0;
	width: 100%; height: 100%;

	background-image: url(../svg/intro-glare.svg);
	background-position: left center;
	background-repeat: no-repeat;
	background-size: auto;

	-webkit-transform: scale(1.5) translate3d(-20%, 0, 0);
	transform: scale(1.5) translate3d(-20%, 0, 0);

	-webkit-transition: all 0.5s ease-out;
	-ms-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;

	opacity: 0;

	z-index: 1;
}
.internal-page article blockquote.show .glare {
	-webkit-transform: scale(1.5) translate3d(55%, 0, 0);
	transform: scale(1.5) translate3d(55%, 0, 0);

	opacity: 0.4;
}
.internal-page article .article-content .padding-left {
	padding-left: 88px;
	width: 100%; max-width: 594px;

	box-sizing: border-box;
}
.internal-page article .article-content .figure {
	display: -webkit-flex;
	display: flex;
	width: 100%; height: auto;
	margin: 40px auto;
	padding: 0;

	-webkit-justify-content: space-around;
	justify-content: space-around;

	text-align: center;
}
.internal-page article .article-content .figure img {
	display: block;
	width: auto; height: auto;
}
.internal-page article .article-content .main-list-item {
	margin-top: 40px;
}
.internal-page article .article-content .main-list-item .counter {
	position: absolute; top: -25px; left: 0px;
	width: 66px; height: 66px;

	color: #FFF;
	font-size: 36px;
	text-align: center;
	line-height: 70px;

	background-color: #AAA;
	border-radius: 100%;

	-webkit-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}
.internal-page article .article-content .main-list-item.active .counter {
	background-color: #666;
}
.internal-page.red article .article-content .main-list-item.active .counter {
	background-color: #ED714D;
}
.internal-page.light-blue article .article-content .main-list-item.active .counter {
	background-color: #1ABBF2;
}
.internal-page.green article .article-content .main-list-item.active .counter {
	background-color: #3dc73c;
}

.internal-page article .article-content img {
	display: block;
	/*width: auto;*/
	max-width: 682px; height: auto;
	margin: 0 auto;
}
.internal-page article .article-content .img-title {
	width: 100%;
	max-width: 682px;
	margin: 10px auto;
	padding: 0 22px;
	box-sizing: border-box;

	color: #999;
	font-size: .875em;
	line-height: 1.25em;
	text-align: center;
}
.internal-page article .article-content > ol,
.internal-page article .article-content > ul {
	width: 100%;
	max-width: 594px;
	margin: 20px auto;
	padding-left: 20px;
	box-sizing: border-box;
}
.internal-page article .article-content > ol > li {
	margin: 20px auto;
}
.internal-page article .article-content > ul > li {
	margin: 20px auto;
	list-style: round;
}
.internal-page article .article-content .timestamp {
	width: 100%;
	max-width: 682px;
	margin: 10px auto;

	text-align: right;
}
.internal-page article .short-column,
.internal-page article .article-content .short-column {
	width: 242px;
	margin-right: 22px;
	box-sizing: border-box;
	float: left;
}
.internal-page article .article-content .long-column,
.internal-page article .article-content .long-column {
	width: 396px;
	margin-right: 22px;
	box-sizing: border-box;
	float: left;
}
.internal-page article .article-content .long-column h2 {
	margin: 40px auto;

	text-align: left;
}
.internal-page article .article-content .long-column h3,
.internal-page article .article-content .long-column h4 {
	text-align: left;
}
.internal-page article .article-content .long-column ol,
.internal-page article .article-content .long-column ul {
	margin: 40px auto;
	padding-left: 20px;
}
.internal-page article .article-content .long-column ol li,
.internal-page article .article-content .long-column ul li {
	margin: 20px 0;
	list-style: round;
	padding-left: 5px;
}
.internal-page article .short-column img,
.internal-page article .article-content .short-column img {
	width: 200px; height: auto;
	float: left;
}

/* NEWS BLOCK */
.internal-page section.news-block {
	width: 682px;
	margin: 60px auto;
}
.internal-page section.news-block .title {
	display: inline-block;
	margin-top: 20px;

	color: #2e2e2e;
	font-size: 20px;
	line-height: 30px;
	font-family: 'futurafuturiscbold', Helvetica, sans-serif;
	font-weight: normal;
	text-align: left;
	text-transform: uppercase;

	border-bottom: solid 1px transparent;
}
.internal-page section.newx-block p {
	width: auto;

	color: #727272;
}
.internal-page section.news-block:hover .title {
	color: #1cbdf3;
	border-bottom: solid 1px #1cbdf3;
}
/* NEWS BLOCK */


/* VACANCY BLOCK */
.internal-page .vacancy-block {
	width: 100%;
	max-width: 682px;
	margin: 44px auto;
}
.internal-page .vacancy-block .title {
	display: inline-block;

	color: #2e2e2e;
	font-size: 20px;
	line-height: 30px;
	font-family: 'futurafuturiscbold', Helvetica, sans-serif;
	font-weight: normal;
	text-align: left;
	text-transform: uppercase;

	border-bottom: solid 1px transparent;
}
.internal-page .vacancy-block p {
	width: auto;

	color: #727272;
}
.internal-page a .vacancy-block:hover .title {
	color: #1cbdf3;
	border-bottom: solid 1px #1cbdf3;
}
/* VACANCY BLOCK */


/* PROJECT BLOCK */
.internal-page .project-list {
	margin: 20px 0;
}
.internal-page section.project-block {
	position: relative;
	width: 100%; height: auto;
	padding: 100px 0;
	margin: 0 auto;

	text-align: left;

	background-color: #ececec;

	-webkit-box-shadow:
		600px 0 0 0 #ececec,
		-600px 0 0 0 #ececec;
	box-shadow:
		600px 0 0 0 #ececec,
		-600px 0 0 0 #ececec;

	overflow: hidden;
}
.internal-page section.project-block.mini {
	padding: 60px 0;
	margin: 60px 0;
}
.internal-page section.project-block .cover {
	position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px;
	width: 100%; height: 540px;
	margin: 0;
	padding: 0;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;

	overflow: hidden;

	z-index: 1;

	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);

/*
	-webkit-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
*/


}
.internal-page section.project-block:hover .cover {
/*
	-webkit-transition: all 0.25s ease-out;
	-ms-transition: all 0.25s ease-out;
	transition: all 0.25s ease-out;
*/

/* 	opacity: 1; */
}
.internal-page section.project-block .tag-list {
	margin: 30px 0 0 0;
}
.internal-page section.project-block .tag-list .icon {
	display: inline-block; *display: inline; zoom: 1;
	width: 50px; height: 50px;
	margin-right: 15px;

	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;

	opacity: 0.25;
}
.internal-page section.project-block .tag-list .analytics {
	background-image: url(../svg/portfolio-icon-analytics.svg);
}
.internal-page section.project-block.analytics .tag-list .analytics {
	opacity: 1;
}
.internal-page section.project-block .tag-list .prototyping {
	background-image: url(../svg/portfolio-icon-prototyping.svg);
}
.internal-page section.project-block.prototyping .tag-list .prototyping {
	opacity: 1;
}
.internal-page section.project-block .tag-list .design {
	background-image: url(../svg/portfolio-icon-design.svg);
}
.internal-page section.project-block.design .tag-list .design {
	opacity: 1;
}
.internal-page section.project-block .tag-list .development {
	background-image: url(../svg/portfolio-icon-development.svg);
}
.internal-page section.project-block.development .tag-list .development {
	opacity: 1;
}
.internal-page section.project-block .tag-list .seo {
	background-image: url(../svg/portfolio-icon-seo.svg);
}
.internal-page section.project-block.seo .tag-list .seo {
	opacity: 1;
}
.internal-page section.project-block .project-content {
	position: relative;
	width: 100%;
	max-width: 682px;
	margin: 0 auto;

	text-align: left;

	z-index: 2;
}
.internal-page section.project-block.mini .project-content {
	text-align: center;
}
.internal-page section.project-block.mini .project-content img,
.internal-page section.project-block .project-content .short-column img {
	height: 140px; width: auto;
	margin: 0px auto;
}
.internal-page section.project-block.seo .title,
.internal-page section.project-block .title {
	position: relative; top: 0; left: 0;
	display: inline;
	margin-top: 20px;

	color: #333;
	font-size: 20px;
	line-height: 30px;
	font-family: 'futurafuturiscbold', Helvetica, sans-serif;
	font-weight: normal;
	text-align: left;
	text-transform: uppercase;

	border-bottom: solid 1px transparent;
}
.internal-page section.project-block.dark.seo .title,
.internal-page section.project-block.dark .title {
	color: #FFF;
}
.internal-page section.project-block p {
	width: auto;

	color: #727272;
}
.internal-page section.project-block:hover .title {
	border-bottom: solid 1px #333;
}
.internal-page section.project-block.dark:hover .title {
	border-bottom: solid 1px #FFF;
}
/* PROJECT BLOCK */




/* PARTNER */
.partners {
	width: 100%;
	max-width: 792px;
	margin: 0 auto;
	text-align: center;
}
.partners .partner {
	display: inline-block; *display: inline; zoom: 1;
	width: 198px; height: 200px;
	margin: 33px;
	float: left;

	text-decoration: none;
}
.partners .partner .img {
	margin: 0 auto;
	margin-bottom: 10px;
	width: 200px; height: 110px;

	background-position: center center;
	background-size: contain;
	background-repeat: no-repeat;

	opacity: 0.4;

	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);

	-webkit-transition: all 0.4s ease-out;
	-ms-transition: all 0.4s ease-out;
	transition: all 0.4s ease-out;
}
.partners .partner:hover .img {
	-webkit-filter: none;
	-moz-filter: none;
	-ms-filter: none;
	-o-filter: none;
	filter: none;

	opacity: 1;
}
.partners .partner .title {
	width: 100%; height: 80px;

	color: #999;
	overflow: hidden;

	-webkit-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}
.partners .partner:hover .title {
	color: #444;
}
/* PARTNER */



/* REFERENCE SERVICES */
.reference {
	width: 100%;
	margin: 0 auto;
	margin-top: 20px;
	margin-bottom: -30px;
	padding: 30px 0 40px 0;

	text-align: center;

	background-color: #FFF;
}
.reference .reference-list {
	display: -webkit-flex;
	display: flex;
	width: 100%;
	max-width: 810px;
	margin: 0 auto;
}
.reference .reference-item {
	width: 100%; height: auto;
	padding: 25px;
	box-sizing: border-box;

	text-decoration: none;

	border: none !important;

	cursor: pointer;
}
.reference .reference-title {
	width: 100%;
	margin-bottom: 22px;

	color: #414141;
	font-family: 'futurafuturiscbold', Helvetica, sans-serif;
	font-weight: normal;
	text-transform: uppercase;
	text-align: left;
	overflow: hidden;

	-webkit-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}
.reference .reference-description {
	margin-bottom: 22px;

	color: #727272;

	font-family: 'futurafuturislightclightc', Helvetica, sans-serif;
	font-family: 'futurafuturiscregular', Helvetica, sans-serif;
	text-align: left;
}
.reference .reference-item .btn {
	width: 100%;
	height: auto;
	padding: 22px;
	margin: 0;
	box-sizing: border-box;

	color: #3dc73c !important;
	font-size: 18px;
	background-color: transparent !important;

	border: solid 2px #3dc73c !important;
}
.reference .reference-item:hover .btn {
	color: #FFF !important;

	background-color: #3dc73c !important;
}
/* REFERENCE SERVICES */



/* BREADCRUMBS */
.internal-page .breadcrumbs {
	position: absolute; top: 50px; left: 0;
	width: 100%;

	font-size: 20px;
	line-height: 30px;
	text-align: center;

	-webkit-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;

	-webkit-transform: scale(0.95);
	transform: scale(0.95);

	-webkit-filter: blur(1px);
	-moz-filter: blur(1px);
	-ms-filter: blur(1px);
	-o-filter: blur(1px);
	filter: blur(1px);

	z-index: 2;
}
.internal-page .breadcrumbs:hover {
	-webkit-transform: scale(1);
	transform: scale(1);

	-webkit-filter: none;
	-moz-filter: none;
	-ms-filter: none;
	-o-filter: none;
	filter: none;
}
.internal-page .breadcrumbs a {
	margin: 0 10px;
	color: #CCC;
	font-family: 'futurafuturiscbold', Helvetica, sans-serif;
	font-weight: normal;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;

	border-bottom: solid 1px transparent;

	-webkit-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}
.internal-page .breadcrumbs a:hover {
	text-decoration: none;

	color: #888;

	border-bottom: solid 1px #888;
}
.internal-page.light-blue .breadcrumbs a:hover {
	color: #1cbdf3;

	border-bottom: solid 1px #1cbdf3;
}
.internal-page.green .breadcrumbs a:hover {
	color: #3dc73c;

	border-bottom: solid 1px #3dc73c;
}
/* BREADCRUMBS */


/* FOOTER */
.internal-page footer {
	width: 100%;
	max-width: 900px; height: auto;
	margin: 0px auto;
	margin-bottom: 0;
	padding: 60px 0;
	box-sizing: border-box;

	background-color: #2e2e2e;

	-webkit-box-shadow:
		0px 1200px 0 1200px #2e2e2e;
	box-shadow:
		0px 1200px 0 1200px #2e2e2e;
}
.internal-page footer > ul {
	margin: 0;
	padding: 0;
}
.internal-page footer > ul > li {
	width: 160px;
	margin: 0 10px;
	display: inline-block; *display: inline; zoom: 1;
	float: left;

	font-family: 'futurafuturiscbold', Helvetica, sans-serif;
	font-weight: normal;
	text-transform: uppercase;
}
.internal-page footer > ul > li > ul {
	position: relative;
	margin: 0;
	padding: 0;

	list-style: none;
}
.internal-page footer > ul > li > ul > li {
	margin-top: 20px;
/* 	padding-left: 20px; */
	clear: both;

	font-size: 14px;
	font-family: 'futurafuturislightclightc', Helvetica, sans-serif;
	text-transform: uppercase;
}
.internal-page footer a,
.internal-page footer ul li a {
	color: #FFF;
	text-decoration: none;

	border-bottom: solid 1px transparent;

	-webkit-transition: all 0.1s ease-out;
	-ms-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;

	cursor: pointer;
}
.internal-page footer ul li ul li a {
	color: rgba(255, 255, 255, 0.6);
}
.internal-page footer a:hover,
.internal-page footer ul li a:hover,
.internal-page footer ul li ul li a:hover {
	color: #FFF;
	border-bottom-color: #FFF;
}
/* FOOTER */


/* POPUP */
.popup {
	display: block;
	position: fixed; left: 50%; top: 50%;
	width: 100%; height: 560px;
	max-width: 660px;
	margin-left: -330px; margin-top: -280px;

	color: #666;
	font-family: 'futurafuturislightclightc', Helvetica, sans-serif;
	font-size: 18px;
	line-height: 32px;

	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;

	-webkit-perspective: 1200;
	perspective: 1200;

	-webkit-transform: translateZ(250px);
	transform: translateZ(250px);

	-webkit-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;

	z-index: 2;

	opacity: 0;

	/* overflow: hidden; */
}
.popup#interface,
.popup#webapp {
	height: 600px;
	margin-top: -300px;
}
.popup.hide {
	display: none;
}
.popup.show {
	-webkit-transform: translateZ(1px);
	transform: translateZ(1px);

	opacity: 1;
}
.popup .card {
	position: absolute; top: 0; bottom: 0; left: 0; right: 0;

	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;

	-webkit-transition: all 0.25s ease-out;
	-ms-transition: all 0.25s ease-out;
	transition: all 0.25s ease-out;
}
.popup.flip .card {
	-webkit-transform: rotateY(180deg);
	transform: rotateY(180deg);
}
.popup .glare {
	position: absolute;
	width: 100%; height: 100%;

	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);

	-webkit-transition: all 0.35s ease-out;
	-ms-transition: all 0.35s ease-out;
	transition: all 0.35s ease-out;

	opacity: 0.2;

	z-index: -1;
}
.popup.show .glare {
	-webkit-transform: translate3D(85%, 0 , 0);
	transform: translate3D(85%, 0 , 0);

	opacity: 0.5;
}
.popup .glare > svg {
	-webkit-transform: scale(2.2);
	transform: scale(2.2);

	height: 100%;
}
.popup .frontside {
	position: absolute; top: 0; bottom: 0; left: 0; right: 0;

	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;

	background-color: rgba(251, 251, 251, 0.9);

	overflow: hidden;

	z-index: 2;
}
.popup .backside {
	position: absolute; top: 0; bottom: 0; left: 0; right: 0;

	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;

	background-color: rgba(251, 251, 251, 0.9);

	-webkit-transform: rotateY(180deg);
	transform: rotateY(180deg);
}
/*
.popup.flip .frontside {
	-webkit-transform: perspective(800) rotateY(180deg);
	transform: perspective(800) rotateY(180deg);
}
.popup.flip .backside {
	-webkit-transform: perspective(800) rotateY(0deg);
	transform: perspective(800) rotateY(0deg);
}
*/

.popup .popup-title {
	margin: 0;
	padding: 0px;
	color: #2e2e2e;
	font-size: 30px;
	line-height: 45px;
	font-family: 'futurafuturiscbold', Helvetica, sans-serif;
	font-weight: normal;
/* 	text-align: center; */
	text-transform: uppercase;
}
.popup .btn {
	display: inline-block; *display: inline; zoom: 1;
	padding: 12px 15px 10px 15px;
	margin-right: 10px;

	color: #999;
	font-size: 18px;
	line-height: 26px;
	text-transform: uppercase;
	text-align: center;
	-webkit-font-smoothing: antialiased;

	background-color: transparent;

	border: solid 1px #AAA;

	-webkit-transition: all 0.1s ease-out;
	-ms-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;

	cursor: pointer;
}
.popup .btn:hover {
	color: #FFF;
	background-color: #AAA;
}
.popup .btn.pressed {
	-webkit-transform: scale(0.97);
	transform: scale(0.97);
}
.popup.green .btn.submit {
	color: #FFF;
	background-color: #3dc73c;
	border-color: #3dc73c;
}
.popup.light-blue .btn.submit {
	color: #FFF;
	background-color: #1cbdf3;
	border-color: #1cbdf3;
}
.popup .row {
	margin: 20px 80px;
}
.popup label {
	display: block;

	color: #666;
	font-family: 'futurafuturislightclightc', Helvetica, sans-serif;
	font-size: 18px;
	line-height: 32px;
}
.popup input {
	width: 340px;
	padding: 11px;

	color: #3dc73c;
	font-size: 18px;
	line-height: 21px;
	font-family: 'futurafuturislightclightc', Helvetica, sans-serif;

	border: solid 1px #999;

	-webkit-border-radius: 0;
	border-radius: 0;

	-webkit-box-shadow: none;
	box-shadow: none;

	background-color: transparent;

	-webkit-transition: all 0.1s ease-out;
	-ms-transition: all 0.1s ease-out;
	transition: all 0.1s ease-out;
}
.popup input:focus {
	border-color: #3dc73c;
	outline: none;

	-webkit-box-shadow: 0 0px 0 1px #3dc73c;
	box-shadow: 0 0px 0 1px #3dc73c;
}
.popup input:hover {
	border-color: #3dc73c;
}
.popup input.complete {
	color: #FFF;
	font-family: 'futurafuturiscbold', Helvetica, sans-serif;

	border-color: #3dc73c;

	background-color: #3dc73c;

	-webkit-box-shadow: none;
	box-shadow: none;
}
.popup.light-blue input {
	color: #1cbdf3;
}
.popup.light-blue input:focus {
	border-color: #1cbdf3;

	-webkit-box-shadow: 0 0px 0 1px #1cbdf3;
	box-shadow: 0 0px 0 1px #1cbdf3;
}
.popup.light-blue input:hover {
	border-color: #1cbdf3;
}
.popup.light-blue input.complete {
	color: #FFF;

	border-color: #1cbdf3;

	background-color: #1cbdf3;

}
.popup header {
	padding: 60px 80px 10px 80px;

	z-index: 2;
}
.popup footer {
	padding: 20px 80px 60px 80px;

	z-index: 2;
}
/* POPUP */