/* onepage scroll CSS */

/*html,*/
body {
margin: 0;
overflow: hidden;
-webkit-transition: opacity 400ms;
-moz-transition: opacity 400ms;
transition: opacity 400ms;
}

/*html,*/
body,
.onepage-wrapper {
display: block;
position: static;
padding: 0;
width: 100%;
height: 100%;
}

.onepage-wrapper {
width: 100%;
height: 100%;
display: block;
position: relative;
padding: 0;
-webkit-transform-style: preserve-3d;
}

.onepage-wrapper .section {
width: 100%;
height: 100%;
}

.onepage-pagination {
position: absolute;
right: 10px;
top: 50%;
z-index: 5;
list-style: none;
margin: 0;
padding: 0;
}
.onepage-pagination li {
padding: 0;
text-align: center;
}
.onepage-pagination li a{
padding: 10px;
width: 4px;
height: 4px;
display: block;
}
.onepage-pagination li a:before{
content: '';
position: absolute;
width: 4px;
height: 4px;
background: rgba(0,0,0,0.85);
border-radius: 10px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
}

.onepage-pagination li a.active:before{
width: 10px;
height: 10px;
background: none;
border: 1px solid black;
margin-top: -4px;
left: 8px;
}

.disabled-onepage-scroll,
.disabled-onepage-scroll .wrapper {
overflow: auto;
}

.disabled-onepage-scroll .onepage-wrapper .section {
position: relative !important;
top: auto !important;
left: auto !important;
}
.disabled-onepage-scroll .onepage-wrapper {
-webkit-transform: none !important;
-moz-transform: none !important;
transform: none !important;
-ms-transform: none !important;
min-height: 100%;
}


.disabled-onepage-scroll .onepage-pagination {
display: none;
}

body.disabled-onepage-scroll,
.disabled-onepage-scroll .onepage-wrapper,
html {
position: inherit;
}

/* onepage scroll CSS END */

@font-face {
font-family: 'Montserrat';
src: url('../fonts/montserrat-regular-webfont.woff2') format('woff2'),
	 url('../fonts/montserrat-regular-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'Montserrat';
src: url('../fonts/montserrat-bold-webfont.woff2') format('woff2'),
	 url('../fonts/montserrat-bold-webfont.woff') format('woff');
font-weight: 700;
font-style: normal;
}

@font-face {
font-family: 'Montserrat';
src: url('../fonts/montserrat-medium-webfont.woff2') format('woff2'),
	 url('../fonts/montserrat-medium-webfont.woff') format('woff');
font-weight: 500;
font-style: normal;
}

body, html {
height: 100%;
min-height: 100%;
min-width: 320px;
}

body {
padding: 0px;
margin: 0px;
color: #000;
line-height: 1.62;
font-size: 16px;
font-family: 'Montserrat', Arial, Helvetica, sans-serif;
background: #fff;
}

img {
border-style: none;
max-width: 100%;
display: block;
}

a {
text-decoration: underline;
color: inherit;
}

a:hover {
text-decoration: none;
}

b {
font-weight: 700;
}

p {
margin: 0 0 1.62em;
}

p:last-child {
margin-bottom: 0;
}

.spp_main_frame {
position: relative;
max-width: 1920px;
margin: 0 auto;
overflow: hidden;
height: 100%;
}

.spp_header {
position: fixed;
top: 35px;
left: 0;
right: 0;
padding: 0 50px;
z-index: 100;
min-width: 320px;
}

.spp_logo {
display: block;
width: 163px;
height: 44px;
background: url(../img/logo.svg) no-repeat 0 0 transparent;
background-size: 100% auto;
float: left;
}

.spp_btn {
display: inline-block;
vertical-align: top;
background: #fff;
font-size: 16px;
color: #fff;
text-decoration: none;
padding: 18px 20px;
line-height: 20px;
border-radius: 12px;
transition: color 0.25s;
text-align: center;
white-space: nowrap;
border: 0 none;
margin: 0;
font-family: 'Montserrat', Arial, Helvetica, sans-serif;
font-weight: 500;
position: relative;
}

.spp_btn:before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
border-radius: 12px;
background: rgb(161,98,247); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(161,98,247,1) 0%, rgba(69,227,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(161,98,247,1) 0%,rgba(69,227,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(161,98,247,1) 0%,rgba(69,227,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
opacity: 1;
transition: opacity 0.25s;
}

.spp_btn:hover:before {
opacity: 0.9;
}

.spp_btn > span {
display: inline-block;
position: relative;
}

.spp_header .spp_btn_hld {
float: right;
}

.spp_header .spp_btn_hld.hidden {
display: none;
}

.spp_header .spp_btn {
display: block;
border: 1px solid #fff;
padding: 17px 19px;
width: 200px;
background: transparent;
transition: color 1s linear, border-color 1s linear;
}

.viewing-page-3 .spp_header .spp_btn {
border-color: #000;
color: #000;
}

.spp_header .spp_btn:before {
opacity: 0;
}

.spp_nav {
position: fixed;
left: 50px;
top: 50%;
margin-top: -125px;
color: #fff;
font-size: 42px;
line-height: 1;
font-weight: 700;
z-index: 80;
transition: color 1s linear;
display: none;
}

.spp_nav.active {
display: block;
}

.viewing-page-3 .spp_nav,
.viewing-page-5 .spp_nav {
color: #000;
}

.spp_nav > div {
height: 50px;
position: relative;
padding: 4px 0 4px 40px;
}

.spp_nav > div.active {
color: #fff;
}

.spp_nav > div:before {
content: "";
display: block;
width: 20px;
height: 3px;
background: #fff;
position: absolute;
top: 50%;
left: 0;
margin-top: -2px;
transition: background 1s linear;
}

.viewing-page-3 .spp_nav > div:before,
.viewing-page-5 .spp_nav > div:before {
background: #000;
}


.spp_nav > div:nth-child(even):before {
width: 15px;
}

.spp_nav .spn1 {
opacity: 0;
display: inline-block;
vertical-align: top;
}

.spp_nav .spn2 {
display: inline-block;
vertical-align: top;
transition: margin-top 0.5s linear, height 0.5s linear;
height: 0px;
margin-top: 42px;
overflow: hidden;
}

.spp_nav .moving_zero {
position: absolute;
top: 0;
left: 38px;
margin-top: 4px;
transition: top 1s linear;
}

.viewing-page-2 .spp_nav .moving_zero { top: 50px; }
.viewing-page-3 .spp_nav .moving_zero { top: 100px; }
.viewing-page-4 .spp_nav .moving_zero { top: 150px; }
.viewing-page-5 .spp_nav .moving_zero { top: 200px; }

.ready .spp_nav1 .spn2,
.viewing-page-1 .spp_nav1 .spn2 { height: 42px; margin-top: 0px; transition-delay: 0.5s; }
.viewing-page-2 .spp_nav2 .spn2 { height: 42px; margin-top: 0px; transition-delay: 0.5s; }
.viewing-page-3 .spp_nav3 .spn2 { height: 42px; margin-top: 0px; transition-delay: 0.5s; }
.viewing-page-4 .spp_nav4 .spn2 { height: 42px; margin-top: 0px; transition-delay: 0.5s; }
.viewing-page-5 .spp_nav5 .spn2 { height: 42px; margin-top: 0px; transition-delay: 0.5s; }

.spp_main_container,
.spp_screen {
position: relative;
width: 100%;
height: 100%;
}

.spp_screen {
/*height: 100vh;*/
/*overflow: hidden;*/
text-align: center;
position: relative;
}

.spp_screen1 {
background: rgb(69,227,255); /* Old browsers */
background: -moz-linear-gradient(-45deg,  rgba(69,227,255,1) 0%, rgba(161,98,247,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  rgba(69,227,255,1) 0%,rgba(161,98,247,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  rgba(69,227,255,1) 0%,rgba(161,98,247,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
color: #000;
}

.spp_fix_content {
width: 100%;
height: 100%;
transition: transform 1s linear;
position: fixed;
top: 0;
left: 0;
}

.spp_screen_container {
height: 100%;
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: center;
position: relative;
z-index: 20;
}

.spp_screen_inner {
flex: 1 1 auto;
}

.spp_sc1_1 {
font-weight: bold;
font-size: 48px;
line-height: 1.18;
margin: 0 0 20px;
text-transform: uppercase;
white-space: nowrap;
position: relative;
top: 90px;
opacity: 0;
transition: opacity 0.4s ease-out 0.6s, top 0.4s ease-out 0.6s;
}

.spp_screen1.animate .spp_sc1_1 {
top: 0;
opacity: 1;
}

.spp_sc1_2 {
font-weight: bold;
font-size: 110px;
line-height: 1.22;
margin: 0 0 20px;
text-transform: uppercase;
white-space: nowrap;
}

.spp_sc1_2 span {
display: inline-block;
vertical-align: top;
position: relative;
opacity: 0;
top: 1em;
transition: opacity 0.2s ease-out, top 0.2s ease-out;
}

.spp_screen1.animate .spp_sc1_2 span {
top: 0;
opacity: 1;
}

.spp_screen1.animate .spp_sc1_2 span:nth-child(2) { transition-delay: 0.05s;}
.spp_screen1.animate .spp_sc1_2 span:nth-child(3) { transition-delay: 0.1s;}
.spp_screen1.animate .spp_sc1_2 span:nth-child(4) { transition-delay: 0.15s;}
.spp_screen1.animate .spp_sc1_2 span:nth-child(5) { transition-delay: 0.2s;}
.spp_screen1.animate .spp_sc1_2 span:nth-child(6) { transition-delay: 0.25s;}
.spp_screen1.animate .spp_sc1_2 span:nth-child(7) { transition-delay: 0.3s;}
.spp_screen1.animate .spp_sc1_2 span:nth-child(8) { transition-delay: 0.35s;}
.spp_screen1.animate .spp_sc1_2 span:nth-child(9) { transition-delay: 0.4s;}
.spp_screen1.animate .spp_sc1_2 span:nth-child(10) { transition-delay: 0.45s;}
.spp_screen1.animate .spp_sc1_2 span:nth-child(11) { transition-delay: 0.5s;}
.spp_screen1.animate .spp_sc1_2 span:nth-child(12) { transition-delay: 0.55s;}
.spp_screen1.animate .spp_sc1_2 span:nth-child(13) { transition-delay: 0.6s;}
.spp_screen1.animate .spp_sc1_2 span:nth-child(14) { transition-delay: 0.65s;}
.spp_screen1.animate .spp_sc1_2 span:nth-child(15) { transition-delay: 0.7s;}
.spp_screen1.animate .spp_sc1_2 span:nth-child(16) { transition-delay: 0.75s;}
.spp_screen1.animate .spp_sc1_2 span:nth-child(17) { transition-delay: 0.8s;}

.spp_sc1_2.mob_title {
display: none;
opacity: 0;
transition: opacity ease-out 0.6s;
}

.spp_screen1.animate .spp_sc1_2.mob_title {
opacity: 1;
}

.spp_sc1_3 {
font-size: 36px;
line-height: 1.5;
margin: 0 auto;
max-width: 1100px;
position: relative;
top: -60px;
opacity: 0;
transition: opacity 0.4s ease-out 0.2s, top 0.4s ease-out 0.2s;
}

.spp_screen1.animate .spp_sc1_3 {
top: 0;
opacity: 1;
}

.spp_screen1:before {
content: "";
display: block;
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 438px;
background: url(../img/bg1.png) no-repeat bottom center transparent;
opacity: 1;
transition: opacity 0.5s linear 0.5s;
}

.spp_screen1:after,
.spp_screen5:after {
content: "";
display: block;
position: absolute;
width: 1px;
background: #fff;
top: 100%;
margin-top: 378px;
left: 50%;
bottom: 0;
transition: top 1s ease-out 1.3s, opacity 0.5s linear 0.5s;
opacity: 0;
}

.spp_screen1.animate:after,
.spp_screen5.animate:after {
top: 50%;
opacity: 1;
}

.viewing-page-2 .spp_screen1:before,
.viewing-page-2 .spp_screen1:after {
opacity: 0;
}

.spp_screen5:after {
background: #000;
}

.spp_cloud1 {
position: absolute;
bottom: -1200px;
left: 0;
right: 0;
height: 1512px;
background: url(../img/cloud1.png) no-repeat top center transparent;
z-index: 10;
margin-bottom: -400px;
}

.spp_screen1.animate .spp_cloud1 {
margin-bottom: 0px;
transition: margin-bottom 1s ease-out 1s, bottom 2s ease-in-out 0s;
}

.viewing-page-2 .spp_screen1 .spp_cloud1,
.viewing-page-3 .spp_screen1 .spp_cloud1,
.viewing-page-4 .spp_screen1 .spp_cloud1,
.viewing-page-5 .spp_screen1 .spp_cloud1 {
bottom: 0;
}

.spp_pager {
font-size: 14px;
line-height: 18px;
color: #fff;
text-align: center;
white-space: nowrap;
position: absolute;
top: 100%;
left: 50%;
width: 140px;
margin-left: -70px;
margin-top: 270px;
transition: top 1s ease-out 1.3s;
}

.spp_pager span {
opacity: 0;
transition: opacity 0.2s ease-out 2.1s;
}

.spp_screen1.animate .spp_pager,
.spp_screen5.animate .spp_pager {
top: 50%;
}

.spp_screen1.animate .spp_pager span,
.spp_screen5.animate .spp_pager span {
opacity: 1;
}

.spp_screen5 .spp_pager {
color: #000;
}

.spp_pager:after {
content: "";
display: block;
width: 75px;
height: 75px;
box-sizing: border-box;
border-radius: 50%;
position: absolute;
top: 100%;
left: 50%;
margin-left: -38px;
border: 1px solid #fff;
margin-top: 15px;
background: url(../img/scroll.svg) no-repeat center center transparent;
}

.spp_screen5 .spp_pager:after {
border-color: #000;
background-image: url(../img/scroll2.svg);
}

.spp_screen2 {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#45e3ff+0,a162f7+100 */
background: rgb(69,227,255); /* Old browsers */
background: -moz-linear-gradient(45deg,  rgba(69,227,255,1) 0%, rgba(161,98,247,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg,  rgba(69,227,255,1) 0%,rgba(161,98,247,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg,  rgba(69,227,255,1) 0%,rgba(161,98,247,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.spp_screen2 .spp_fix_content {
transform: translate3d(0px, 100%, 0px);
}

.viewing-page-3 .spp_screen2 .spp_fix_content {
transform: translate3d(0px, 200%, 0px);
}

.spp_screen3 .spp_fix_content {
transform: translate3d(0px, 200%, 0px);
}

.viewing-page-4 .spp_screen3 .spp_fix_content {
transform: translate3d(0px, 300%, 0px);
}

.spp_screen4 .spp_fix_content {
transform: translate3d(0px, 300%, 0px);
}

.viewing-page-5 .spp_screen4 .spp_fix_content {
transform: translate3d(0px, 400%, 0px);
}

.spp_screen2 .spp_screen_container,
.spp_screen3 .spp_screen_container,
.spp_screen4 .spp_screen_container {
align-items: flex-start;
padding-top: 130px;
}

.spp_screen2 .spp_screen_inner {
margin-top: 20vh;
opacity: 0;
transition: margin-top 1s ease-out 0.5s, opacity 1s ease-out 0.5s;
}

.spp_screen2.animate .spp_screen_inner {
margin-top: 0;
opacity: 1;
}

.spp_h2 {
font-size: 85px;
line-height: 1.21;
font-weight: 700;
text-transform: uppercase;
}

.spp_h3 {
font-size: 48px;
line-height: 1.21;
font-weight: 700;
text-transform: uppercase;
}

.spp_map {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
overflow: hidden;
}

.spp_map_map {
position: absolute;
top: -430px;
left: 50%;
margin-left: -900px;
transform-style: preserve-3d;
perspective: 5000px;
width: 1800px;
}

.spp_map_map img {
display: block;
width: 1800px;
transform-origin: center center;
perspective-origin: center center;
transform: rotateX(0deg);
transition: transform 1s ease-out 0.5s;
}

.spp_screen2.animate .spp_map_map img {
transform: rotateX(70deg);
}

.spp_markers {
position: absolute;
top: 320px;
left: 0;
right: 0;
}

.spp_marker {
top: 200px;
position: absolute;
transition: opacity 0.5s ease-out 0s;
opacity: 0;
left: 50%;
margin-left: -25px;
}

.spp_marker.mm1 {
top: 570px;
margin-left: -440px;
}

.spp_marker.mm2 {
top: 410px;
margin-left: -440px;
}

.spp_marker.mm3 {
top: 350px;
margin-left: -210px;
}

.spp_marker.mm4 {
top: 460px;
margin-left: -90px;
}

.spp_marker.mm5 {
top: 345px;
margin-left: -30px;
}

.spp_marker.mm6 {
top: 180px;
margin-left: -150px;
}

.spp_marker.mm7 {
top: 120px;
margin-left: 80px;
}

.spp_marker.mm8 {
top: 245px;
margin-left: 155px;
}

.spp_marker.mm9 {
top: 435px;
margin-left: 110px;
}

.spp_marker.mm10 {
top: 325px;
margin-left: 300px;
}

.spp_marker.mm11 {
top: 165px;
margin-left: 340px;
}

.spp_marker.mm12 {
top: 190px;
margin-left: 490px;
}

.spp_marker.mm13 {
top: 310px;
margin-left: 530px;
}

.set_markers .spp_marker {
opacity: 1;
}

.spp_marker:before {
content: "";
display: block;
width: 50px;
height: 16px;
background: #A76FF3;
border-radius: 50%;
opacity: 0.3;
}

@keyframes marker {
	0% {margin-bottom: 160px; transform: scale(0.9, 1.1);}
	50% {margin-bottom: -25px; transform: scale(1.1, 0.7);}
	100% {margin-bottom: 0; transform: scale(1, 0.9);}
}

.spp_marker:after {
content: "";
display: block;
width: 70px;
height: 100px;
background: url(../img/marker.svg) no-repeat top center transparent;
background-size: 100% auto;
position: absolute;
bottom: 30px;
left: 50%;
margin-left: -35px;
margin-bottom: 160px;
transform-origin: bottom center;
}

.set_markers .spp_marker:after {
animation: marker 1s ease-out 0s forwards;
}

.spp_marker.mm1 { transition-delay: 0.6s; }
.spp_marker.mm1:after { animation-delay: 0.6s; }

.spp_marker.mm2 { transition-delay: 0.3s; }
.spp_marker.mm2:after { animation-delay: 0.3s; }

.spp_marker.mm3 { transition-delay: 0.1s; }
.spp_marker.mm3:after { animation-delay: 0.1s; }

.spp_marker.mm4 { transition-delay: 1.1s; }
.spp_marker.mm4:after { animation-delay: 1.1s; }

.spp_marker.mm5 { transition-delay: 0s; }
.spp_marker.mm5:after { animation-delay: 0s; }

.spp_marker.mm6 { transition-delay: 0.5s; }
.spp_marker.mm6:after { animation-delay: 0.5s; }

.spp_marker.mm7 { transition-delay: 0.7s; }
.spp_marker.mm7:after { animation-delay: 0.7s; }

.spp_marker.mm8 { transition-delay: 0.9s; }
.spp_marker.mm8:after { animation-delay: 0.9s; }

.spp_marker.mm9 { transition-delay: 0.2s; }
.spp_marker.mm9:after { animation-delay: 0.2s; }

.spp_marker.mm10 { transition-delay: 1s; }
.spp_marker.mm10:after { animation-delay: 1s; }

.spp_marker.mm11 { transition-delay: 0.4s; }
.spp_marker.mm11:after { animation-delay: 0.4s; }

.spp_marker.mm12 { transition-delay: 0.8s; }
.spp_marker.mm12:after { animation-delay: 0.8s; }

.spp_marker.mm13 { transition-delay: 1.2s; }
.spp_marker.mm13:after { animation-delay: 1.2s; }

.spp_sep {
display: block;
position: absolute;
bottom: -300px;
height: 300px;
background: #A162F7;
left: 50%;
margin-left: -960px;
width: 1920px;
z-index: 50;
transition: bottom 1s linear;
}

.spp_dark_sep {
background: #344fb5;
}

.spp_blue_sep {
background: #45E3FF;
}

@keyframes sep_top {
	0% {height: 0px;}
	25% {height: 300px;}
	100% {height: 0px;}
}

.spp_sep:before {
content: "";
display: block;
position: absolute;
bottom: 100%;
margin-bottom: -1px;
left: 0;
right: 0;
height: 0;
background: url(../img/sep_violet_top.svg) no-repeat bottom center transparent;
background-size: 100% 100%;
}

.spp_dark_sep:before {
background-image: url(../img/sep_dark_top.svg);
}

.spp_blue_sep:before {
background-image: url(../img/sep_blue_top.svg);
}

@keyframes sep_bottom {
	0% {height: 0px;}
	50% {height: 100px;}
	100% {height: 0px;}
}

.spp_sep:after {
content: "";
display: block;
position: absolute;
top: 100%;
margin-top: -1px;
left: 0;
right: 0;
height: 0px;
background: url(../img/sep_violet_bottom.svg) no-repeat bottom center transparent;
background-size: 100% 100%;
}

.spp_dark_sep:after {
background-image: url(../img/sep_dark_bottom.svg);
}

.spp_blue_sep:after {
background-image: url(../img/sep_blue_bottom.svg);
}

.viewing-page-3 .spp_screen2 .spp_sep,
.viewing-page-4 .spp_screen3 .spp_sep,
.viewing-page-5 .spp_screen4 .spp_sep {
bottom: 0;
}

.spp_sep.animate:before, 
.viewing-page-3 .spp_screen2 .spp_sep:before,
.viewing-page-4 .spp_screen3 .spp_sep:before,
.viewing-page-5 .spp_screen4 .spp_sep:before { 
animation: sep_top 1s linear 0s forwards;
}

.spp_sep.animate:after,
.viewing-page-3 .spp_screen2 .spp_sep:after,
.viewing-page-4 .spp_screen3 .spp_sep:after,
.viewing-page-5 .spp_screen4 .spp_sep:after { 
animation: sep_bottom 1s linear 0s forwards;
}

.spp_screen3 {
background: #EEF9FB;
}

.spp_screen3 .spp_h2,
.spp_screen4 .spp_h2 {
/*margin-bottom: 70px;*/
margin-bottom: 20px;
}

.spp_screen3 .spp_h2,
.spp_screen4 .spp_h2 {
position: relative;
/*top: 20vh;*/
transition: top 1s ease-out 0.5s;
}

.spp_screen3.animate .spp_h2,
.spp_screen4.animate .spp_h2 {
top: 0;
}

.spp_cols {
display: flex;
flex-flow: row nowrap;
align-items: flex-start;
justify-content: space-between;
max-width: 920px;
margin: 0 auto;
}

.spp_col {
flex: 1 1 auto;
max-width: 410px;
text-align: left;
padding: 0 15px;
}

.spp_item {
font-size: 14px;
line-height: 1.5;
}

@keyframes image_bubble {
	0% {transform: scale(0);}
	75% {transform: scale(1.06); animation-timing-function: ease-in;}
	100% {transform: scale(1); animation-timing-function: ease-out;}
}

.spp_item img {
display: block;
margin: 0 0 15px;
transform-origin: 50% 50%;
transform: scale(0);
}

.spp_screen3.animate .spp_item img,
.spp_screen4.animate .spp_item img {
animation: image_bubble 0.5s linear 1s forwards;
}

.spp_screen4 .spp_col:nth-child(1) .spp_item img {
margin-left: -20px;
}

.spp_screen3.animate .spp_col:nth-child(2) .spp_item img,
.spp_screen4.animate .spp_col:nth-child(2) .spp_item img {
animation-delay: 1.25s;
}

.spp_screen4.animate .spp_col:nth-child(3) .spp_item img {
animation-delay: 1.5s;
}

.spp_item b {
display: block;
font-size: 18px;
line-height: 1.3;
max-width: 240px;
margin: 0 0 10px;
opacity: 0;
transition: opacity 0.5s linear 1.5s;
}

.spp_item > div {
opacity: 0;
transition: opacity 0.5s linear 1.65s;
}

.spp_screen3.animate .spp_item b,
.spp_screen4.animate .spp_item b,
.spp_screen3.animate .spp_item > div,
.spp_screen4.animate .spp_item > div {
opacity: 1;
}

.spp_screen3.animate .spp_col:nth-child(2) .spp_item b { transition-delay: 1.8s; }
.spp_screen3.animate .spp_col:nth-child(2) .spp_item > div { transition-delay: 1.95s; }

.spp_screen4.animate .spp_item b { transition-delay: 1.75s; }
.spp_screen4.animate .spp_item > div { transition-delay: 2s; }
.spp_screen4.animate .spp_col:nth-child(2) .spp_item b { transition-delay: 2.05s; }
.spp_screen4.animate .spp_col:nth-child(2) .spp_item > div { transition-delay: 2.2s; }
.spp_screen4.animate .spp_col:nth-child(3) .spp_item b { transition-delay: 2.3s; }
.spp_screen4.animate .spp_col:nth-child(3) .spp_item > div { transition-delay: 2.45s; }

.spp_screen4,
.spp_screen4 .spp_fix_content {
background: rgb(69,227,255); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(69,227,255,1) 0%, rgba(161,98,247,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(69,227,255,1) 0%,rgba(161,98,247,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(69,227,255,1) 0%,rgba(161,98,247,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.spp_screen4 .spp_cols {
max-width: 1230px;
}

.spp_screen4 .spp_item {
max-width: 370px;
}

.spp_screen4 .spp_h3 {
text-transform: none;
margin: 40px auto 0;
max-width: 920px;
opacity: 0;
transition: opacity 0.5s linear 2.6s;
}

.spp_screen4.animate .spp_h3 {
opacity: 1;
}

.spp_screen5 {
background: #EEF9FB;
font-size: 30px;
line-height: 1.5;
}

.spp_screen5 .spp_h2 {
margin-bottom: 32px;
transition: opacity 0.4s ease-out 0.6s;
opacity: 0;
}

.spp_screen5 .spp_text {
margin: 0 0 75px;
opacity: 0;
transition: opacity 0.4s ease-out 1s;
}

.spp_screen5 .spp_btn {
width: 300px;
font-size: 18px;
padding: 25px 20px;
opacity: 0;
transition: opacity 0.4s ease-out 1.2s;
}

.spp_screen5.animate .spp_h2,
.spp_screen5.animate .spp_text,
.spp_screen5.animate .spp_btn {
opacity: 1;
}

.spp_loader {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 80;
display: flex;
flex-flow: row nowrap;
align-items: center;
justify-content: center;
}

.spp_loader_inner {
flex: 1 1 auto;
max-width: 1260px;
padding: 0 30px;
margin: 0 auto;
text-align: center;
}

.spp_loader_title {
font-size: 20px;
line-height: 1;
font-weight: 700;
letter-spacing: 0.1em;
margin: 0 0 50px;
text-transform: uppercase;
}

.spp_loader_bar {
height: 4px;
background: rgba(0,0,0,0.3);
margin: 0 0 20px;
}

.spp_loader_bar i {
display: block;
height: 4px;
background: #000;
width: 0%;
}

.spp_loader_percent {
font-size: 36px;
line-height: 1;
}

#mobile_detect {
display: none;
width: 1px;
height: 1px;
position: fixed;
top: -1px;
left: -1px;
z-index: -1;
}

.spp_cols .slick-dots {
margin: 30px 0 0;
font-size: 0px;
white-space: nowrap;
}

.spp_cols .slick-dots li {
display: inline-block;
vertical-align: top;
margin: 0 8px;
}

.spp_cols .slick-dots button {
display: inline-block;
vertical-align: top;
width: 15px;
height: 15px;
border-radius: 50%;
background: #EEF9FB;
border: 1px solid rgba(0,0,0,0.6);
margin: 0;
padding: 0;
color: transparent;
overflow: hidden;
}

.spp_cols .slick-dots .slick-active button {
background: #A162F7;
}
.spp_screen6{
	background: url(../img/screen.jpg) no-repeat top center;
	height: 100vh;
}