.home {width: 100%;}

.newsblock h2, .slider-company h2 {text-align: center;}
.newsblock h2:after, .slider-company h2:after {left: 50% !important; margin-left: -45px;}
.slider-company h2 {color: #fff !important;}

.newsblock {text-align: center; padding: 75px 0 40px 0; overflow: hidden; width: 80%; margin: 0 auto;}

a.newsmain {width: 600px; text-decoration: none; text-align: left; position: relative; float: left;}
a.newsmain img {width: 100%; height: 100%;}
a.newsmain span {display: block;}
a.newsmain .pict em {position: absolute; left: 0; top: 0; z-index: 2; width: 100%; height: 100%; box-shadow: inset 0px 0px 70px rgba(19,20,23,0.2);}
a.newsmain .anons {font-size: 1em; color: #293744; transition: all 0.3s linear;}
a.newsmain .name {color: #000; font-family: fonts-bold; font-size: 1.3em; margin: 15px 0 20px 0; transition: all 0.3s linear;}
a.newsmain .date {font-size: 1em; color: #999; margin-top: 1em; position: relative;}
a.newsmain .pict {display: block; width: 600px; height: 374px; position: relative;}
a.newsmain .pict:after,a.newsmain .pict:before {position: absolute; left: 0; z-index: 2; height: 1px; width: 100%; content:"";}
a.newsmain .pict:before {background-image: linear-gradient(to right, #2f7fe2, rgba(47,127,226,0)); top: -2px;}
a.newsmain .pict:after {background-image: linear-gradient(to left, #2f7fe2, rgba(47,127,226,0)); bottom: -2px;}
a.newsmain:hover .name {color: #2f7fe2;}
a.newsmain:hover .anons {color: #000;}

.news-list {width: calc(100% - 600px); text-align: left; padding-left: 4rem; float: left;}
.news-list .title span {background: #f5f5f5 !important;}
.news-list a.article {text-decoration: none; position: relative; clear: both; display: block;}
.news-list a.article span, .newsblock a.article em {display: block;}
.news-list a.article .pict {margin-bottom: 2rem; float: left; margin-right: 1em; position: relative; width: 270px; height: 168px;}
.news-list a.article .pict em {position: absolute; left: 0; top: 0; z-index: 2; width: 100%; height: 100%; box-shadow: inset 0px 0px 70px rgba(19,20,23,0.2);}
.news-list a.article .pict:after, .news-list a.article .pict:before {transition: all 0.4s linear; position: absolute; left: 0; height: 1px; width: 100%; content:"";}
.news-list a.article .pict:before {background-image: linear-gradient(to right, #2f7fe2, rgba(47,127,226,0)); top: -2px;}
.news-list a.article .pict:after {background-image: linear-gradient(to left, #2f7fe2, rgba(47,127,226,0)); bottom: -2px;}
.news-list a.article .pict img {width: 100%; height: 100%;}
.news-list a.article .name {margin-bottom: 2rem; font-size: 1.2em; font-family: fonts-bold; color: #000; margin: 15px 0 20px 0; transition: all 0.3s linear;}
.news-list a.article .date {font-size: 0.9em; color: #999; position: relative;}
.news-list a.article:hover .name {color: #2f7fe2;}
.newsblock .link-more {display: block; margin: 1em 0 2rem 0; font-size: 0.9rem;}
 
.newsblock .link {text-align: center; margin: 3rem 0 4rem 0;}
.newsblock .link a {border-radius: 25px; text-decoration: none; display: inline-block; line-height: 40px; padding: 0 20px; color: #2f7fe2; border: 2px solid #2f7fe2; transition: all 0.2s linear; margin: 0 10px;}
.newsblock .link a:hover {color: #fff; background: #2f7fe2;}
.newsblock .link:before { 
    content: "";
    display: inline-block;
    vertical-align: top;
    width: 100%;
    height: 1px;
    background-color: #2f7fe2;
    position: relative;
    margin-left: -100%;    
    margin-top: 1.3em;
}
.newsblock .link:after {
    content: "";
    display: inline-block;
    vertical-align: top;
    width: 100%;
    height: 1px;
    background-color: #2f7fe2;
    position: relative;
    margin-right: -100%;
    margin-top: 1.3em;
}

.store {width: 80%; margin: 0 auto 5rem auto; position: relative;}
.store img {width: 100%; height: auto;}
.store img.name { transition: all 0.5s linear; position: absolute; top: 0; left: 0; z-index:1; transform: scale(1);}
.store a {display: block; width: 100%; height: 100%; position: relative;}
.store a:hover img.name { transform: scale(1.15);}
.store a:before {width: 100%; height: 2px; top: -3px; left: 0; background: linear-gradient(to right, #0a0f2b, #e44493, #1c924c, #e3ca24, #ffa444, #ff6115, #424054, #005495); display: block; position: absolute; content: "";}
.store a:after {width: 100%; height: 2px; bottom: 0; right: 0; background: linear-gradient(to left, #0a0f2b, #e44493, #1c924c, #e3ca24, #ffa444, #ff6115, #424054, #005495); display: block; position: absolute; content: "";}

.portal {height: 300px; background: url(/im/portal_bg.jpg) no-repeat #0256a7; background-position: 50% 80%; background-size_: cover; position: relative; transition: all 0.7s linear;}
.portal a.link { text-align: center; display: block; width: 100%; height: 100%; padding_: 6rem 3rem; color: #fff; text-decoration: none; transition_: all 0.3s linear; position: relative;}
.portal .em1 {display: inline-block; width: 2rem; height: calc(100% - 2rem); margin: 1rem; border-top: 1px solid #fff; border-bottom: 1px solid #fff; opacity: 0; transition: all 0.9s linear;}
.portal .em2 {display: inline-block; width: calc(100% - 2rem); height: 2rem; margin: 1rem; border-left: 1px solid #fff; border-right: 1px solid #fff; opacity: 0; transition: all 0.7s linear; position: absolute; top: 0; left: 0;}
.portal a .text1 {font-family: fonts-light; position: absolute; top: 90px; left: 0; display: block; width: 100%; font-size: 2.8rem; font-weight: 300; transform: translateY(3rem); opacity: 0; transition: all 0.4s linear;}
.portal a .text2 {overflow: hidden; text-align: left; font-family: fonts-bold; display: block; font-size: 2.3rem; position: absolute; top: 150px; left: 50%; margin-left: -365px; transition: all 0.4s linear;}
.portal a:hover {background:rgba(1,45,92,0.3);}
.portal.active .em1 {opacity: 0.7; width: calc(100% - 2rem);}
.portal.active .em2 {opacity: 0.7; height: calc(100% - 2rem);}
.portal.active a .text1 {transform: translateY(0rem); opacity: 1;}
.portal.active a .text2 {animation: titletext 3s steps(50, end) forwards 1; animation-delay: 0.4s; width: 0px; white-space:nowrap;}
@keyframes titletext {
    0% {width: 0;}
    100% {width: 740px;}
}
.portal.active {background-position: 50% 50% !important;}
.portal.active a:hover .text1, .portal.active a:hover .text2 {margin-top: -30px;}
.portal.active a:hover .link-go {opacity: 1; top: 200px;}

.portal .link-go {display: inline-block; opacity: 0; transition: all 0.6s ease-out;
    border-radius: 25px;
    text-decoration: none;
    display: inline-block;
    padding: 0.8rem 0; text-align: center;
    color: #fff;
    border: 1px dashed #fff;
    transition: all 0.2s linear;
    position: absolute; width: 130px; left: 50%; margin-left: -50px; top: 260px;
    z-index: 9;
    font-size: 0.9rem;
}
/*.portal a:hover .link {color: #fff; background: #2f7fe2;}*/


.video-s {
  min-width: 1024px;
  position: relative;
  margin-top: -152px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.play-video {display: none;
    z-index: 1000;
    position: absolute;
    left: 46%;
    opacity: 0.45;
    top: 50%;
    width: 128px;
    height: 128px;
    z-index: 1000;
    background: url('/im/playvideo.png')no-repeat center center;
    cursor: pointer;
}
.top-gradient {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 265px;
  z-index: 2;
  background-image: linear-gradient(to bottom, rgba(19, 20, 23, 1) 10%, rgba(19, 20, 23, 0) 100%);
/*
	background-image: -ms-linear-gradient(top, #000000 40%, transparent 100%);
	background-image: -moz-linear-gradient(top, #000000 40%, transparent 100%);
	background-image: -o-linear-gradient(top, #000000 40%, transparent 100%);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(40, #000000), color-stop(100, transparent));
	background-image: -webkit-linear-gradient(top, #000000 40%, transparent 100%);
	background-image: linear-gradient(to bottom, #000000 40%, transparent 100%);
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEwMCAxMDAiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iaGF0MCIgZ3JhZGllbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giIHgxPSI1MC4zMjU4MjUwNTg0MTEyJSIgeTE9IjEwMi43MDQ4MDc2NDU5NzMlIiB4Mj0iNTAuMzI1ODI1MDU4NDExMiUiIHkyPSIyLjcwNDgwNzY0NTk3MjkzJSI+CjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiMxMzEzMTciIHN0b3Atb3BhY2l0eT0iMCIvPgo8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMxMzEzMTciIHN0b3Atb3BhY2l0eT0iMSIvPgogICA8L2xpbmVhckdyYWRpZW50PgoKPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEwMCIgaGVpZ2h0PSIxMDAiIGZpbGw9InVybCgjaGF0MCkiIC8+Cjwvc3ZnPg==);
  background-image: -moz-linear-gradient(bottom, rgba(19, 20, 23, 0) -5.41%, #131317 94.59%);
  background-image: -o-linear-gradient(bottom, rgba(19, 20, 23, 0) -5.41%, #131317 94.59%);
  background-image: -webkit-linear-gradient(bottom, rgba(19, 20, 23, 0) -5.41%, #131317 94.59%);
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(-5.41%, rgba(19, 20, 23, 0)), color-stop(94.59%, #131317));
  background-image: linear-gradient(bottom, rgba(19, 20, 23, 0) -5.41%, #131317 94.59%);
*/
}

.bottom-gradient {
  position: absolute;
  bottom: -30px;
  left: 0;
  right: 0;
  height: 311px;
  z-index: 2;
  background-image: linear-gradient(to top, rgba(19, 20, 23, 1) 10%, rgba(19, 20, 23, 0) 100%);

/*
	background-image: -ms-linear-gradient(bottom, #000000 40%, transparent 100%);
	background-image: -moz-linear-gradient(bottom, #000000 40%, transparent 100%);
	background-image: -o-linear-gradient(bottom, #000000 40%, transparent 100%);
	background-image: -webkit-gradient(linear, left bottom, left top, color-stop(40, #000000), color-stop(100, transparent));
	background-image: -webkit-linear-gradient(bottom, #000000 40%, transparent 100%);
	background-image: linear-gradient(to top, #000000 40%, transparent 100%);

  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEwMCAxMDAiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iaGF0MCIgZ3JhZGllbnRVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giIHgxPSI1MC4zMjU4MjUwNTg0MTEyJSIgeTE9IjEwMi43MDQ4MDc2NDU5NzMlIiB4Mj0iNTAuMzI1ODI1MDU4NDExMiUiIHkyPSIyLjcwNDgwNzY0NTk3MjkzJSI+CjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiMxMzEzMTciIHN0b3Atb3BhY2l0eT0iMSIvPgo8c3RvcCBvZmZzZXQ9IjYlIiBzdG9wLWNvbG9yPSIjMTMxMzE3IiBzdG9wLW9wYWNpdHk9IjEiLz4KPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjMTMxMzE3IiBzdG9wLW9wYWNpdHk9IjAiLz4KICAgPC9saW5lYXJHcmFkaWVudD4KCjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAiIGhlaWdodD0iMTAwIiBmaWxsPSJ1cmwoI2hhdDApIiAvPgo8L3N2Zz4=);
  background-image: -moz-linear-gradient(bottom, #131317 -5.41%, #131317 0.91%, rgba(19, 20, 23, 0) 94.59%);
  background-image: -o-linear-gradient(bottom, #131317 -5.41%, #131317 0.91%, rgba(19, 20, 23, 0) 94.59%);
  background-image: -webkit-linear-gradient(bottom, #131317 -5.41%, #131317 0.91%, rgba(19, 20, 23, 0) 94.59%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(bottom), color-stop(-5.41%, #131317), color-stop(0.91%, #131317), color-stop(94.59%, rgba(19, 20, 23, 0)));
  background-image: linear-gradient(bottom, #131317 -5.41%, #131317 0.91%, rgba(19, 20, 23, 0) 94.59%);
*/
}

.grid {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  background: url(/im/grid.png) no-repeat;
  opacity: 0.12;
}
.trailer {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
  background: url(/im/video-bg.png) no-repeat center center;
  background-size: cover;
}
.trailer > video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  bottom: 0;
}
@media (min-aspect-ratio: 16/9) {
  .trailer > video {
    height: 300%;
    top: -100%;
  }
}
@media (max-aspect-ratio: 16/9) {
  .trailer > video {
    width: 300%;
    left: -100%;
  }
}
@supports ((-o-object-fit: cover) or (object-fit: cover)) {
  .trailer > video {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
  }
}
.mouse-down {
  display: block;
  position: absolute;
  left: 50%;
  margin-left: -60px;
  bottom: 20px;
  z-index: 3;
  width: 120px;
  text-align: center;
}
.down-text {
  color: #fff;
  font-size: 14px;
  text-shadow: 0 2px 8px rgba(19, 20, 23, 0.4);
  font-weight: 300;
  padding-bottom: 10px;
}
.mouse-ico {
  width: 32px;
  height: 50px;
  display: block;
  margin: 0 auto;
  background: url(/im/mouse.png) no-repeat;
}

.sound-ico {
  position: absolute; right: 50px; 
  left_: 50%;
  margin-left_: 150px;
  bottom: 30px;
  z-index: 4;
  display: block;
  width: 30px;
  height: 30px;
  cursor: pointer; 
}
.sound-ico:before {width: 50px; display: inline-block;
    position: absolute;
    content: "AUDIO";
    font-size: 90%;
    color: #ffffff;
    left: -50px;
    top: 6px;
}
.speaker {
  background: url(/im/sound_speaker.png) no-repeat;
}
.sound-ico.muted {
    background: url(/im/sound_muted.png) no-repeat;
    opacity: 0.5;
    position_: relative;
}
.sound-ico.muted:after {
    position: absolute;
    content: "\2716";
    font-size: 15px;
    color: #ffffff;
    right: -5px;
    top: 5px;
}

.videolink {color: #fff; text-decoration: none; text-transform: uppercase;
    position: absolute;
    right_: 50px;
    left: 80px;
    margin-left_: 150px;
    bottom: 30px;
    z-index: 4;
    height: 30px; line-height: 30px;
    cursor: pointer;
display: inline-block;
}

.videolink:before {
    width: 40px; height: 30px;
    display: block; float: left;
    content: "";
    font-size: 90%;
    left: -30px;
    top: 0;
    background: url(/im/video_icon.svg) 0 0 no-repeat; background-size: contain;
}


.top-wrapper {
  display: table;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  opacity: 0;
}
.top-descr {
  display: table-row;
}
.top-centered {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}
.top-text {
  display: inline-block;
}
.top-text h1 {
  display: inline-block;
  color: #fff;
  font-family: 'Conv_Raleway-Bold';
  text-transform: uppercase;
  font-weight: 700;
  font-size: 70px;
}
.top-text p {
  color: #fff;
  text-transform: uppercase;
  font-size: 32px;
  margin: 0;
  font-family: 'Conv_Raleway-Regular';
}



/*--slider-COMPANY---*/

.slider-company {
   padding-top: 4rem;
   position: relative; 
   background: #131417;  
}
.slider-company .slide {margin: 2rem 5rem 5rem 5rem;
   position: relative; 
}

.slider-company .title {position: absolute; bottom: 0; left: 0; background: url("/im/lines_bg.png") repeat 0 0 rgba(41, 55, 69, 0.25); padding: 60px 0; display: block; text-align: center; width: 100%;}
.slider-company .title a {width: 1100px; position: relative; color: #fff; font-size: 26px; font-weight: bold; display: block; text-decoration: none; text-transform: uppercase; margin: 0 auto; text-align: left;}
.slider-company .title a img {position: absolute; top: -30px; left: -40px;}
.slider-company .title span {color: #28a5ff;}
.slider-company .title .rotate {position: absolute; top: -30px; left: 50%; margin-left: -590px;}


.slider-company .slider-coll {
    width: 49%; display: inline-block; vertical-align: top;
    float_: left;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    color: #ffffff;
}
.slider-company .slider-coll:nth-child(1) {padding-right: 3rem; padding-left: 5rem;}
.slider-company .slider-coll:nth-child(2) {padding-left: 5rem;}
.slider-company .title-slider {
    font-size: 1.8em;
    font-family: fonts-bold;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 40px;
}
.slider-company .title-slider span {color: #2f7fe2;}
.slider-company .description-slider {
    color: #b0b0b0;
    text-transform: uppercase;
    line-height: 30px;
}
.slider-company .slider-coll .before-digits {
    text-transform: uppercase;
    font-size: 16px;
    color: #2f7fe2;
    display: inline-block;
    vertical-align: 50px;
}
.slider-company .slider-coll .digits {
    text-transform: uppercase;
    font-size: 145px;
    color: #2f7fe2;
    display: inline-block;
    font-weight: bold;
    font-family: Arial Black;
    letter-spacing: -5px;
}
.slider-company .slider-coll .after-digits {
    text-transform: uppercase;
    font-size: 12px;
    display: inline-block;
    text-align: left;
    vertical-align: 40px;
    margin-left: -20px;
}

.slider-company .slick-dots {height: 25px;
   display: block;
   position: relative;
   z-index: 2;
   padding: 0;
   margin: 0 auto; width: 50%; border-top: 1px solid rgba(47,127,226,0.3);
   list-style: none;
   text-align: center;
}
.slider-company .slick-dots li {border-radius: 15px;
   position: absolute;
   display: block;
   width: 20px;
   height: 20px;
   margin: 0 10px;
   padding: 0;
   cursor: pointer;
   border: 1px dashed #2f7fe2;
   background: transparent;
}
.slider-company .slick-dots li:after {transition: all 0.3s linear; border-radius: 50%; content:""; width: 8px; height: 8px; position: absolute; top: 50%; left: 50%; margin-top: -4px; margin-left: -4px; background: #2f7fe2;}


.slider-company .slick-dots li:nth-child(1) {top: 0; margin-top: -11px; left: 0; margin-left: -10px;}
.slider-company .slick-dots li:nth-child(2) {top: 0; margin-top: -11px; left: 50%; margin-left: -10px;}
.slider-company .slick-dots li:nth-child(3) {top: 0; margin-top: -11px; right: 0; margin-right: -10px;}




/*------clouds--------*/
.clouds a {border-radius: 25px; text-decoration: none; display: inline-block; padding: 0.8rem 1.5rem; color: #2f7fe2; border: 1px dashed #2f7fe2; transition: all 0.2s linear; position: relative; top: 4rem; z-index: 9; font-size: 0.9rem;}
.clouds a:hover {color: #fff; background: #2f7fe2;}

.clouds {text-align: center;
    min-width: 1024px;
    width: 100%;
    height: 365px;
    background: #131417 url(/im/cloud-first-bg.png) no-repeat center bottom;
    position: relative;
    background-size: cover;
    z-index: 2;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin-top: -3px;
    display: block;
}
.clouds:before {box-sizing: border-box;
    content: "";
    position: absolute;
    height: 368px;
    left: 0;
    right: 0;
    bottom: 0;
    background: #131417 url(/im/cloud-second-bg.png) no-repeat center bottom;
    background-size: contain;
    z-index: 1;
    -webkit-animation: move-clouds 40s infinite linear;
    animation: move-clouds 40s infinite linear;
}
@-webkit-keyframes move-clouds {
  0% {
    background: url(/im/cloud-second-bg.png) no-repeat center bottom;
  }
  20% {
    background: url(/im/cloud-second-bg.png) no-repeat left bottom;
  }
  50% {
    background: url(/im/cloud-second-bg.png) no-repeat center bottom;
  }
  75% {
    background: url(/im/cloud-second-bg.png) no-repeat right bottom;
  }
  100% {
    background: url(/im/cloud-second-bg.png) no-repeat center bottom;
  }
}
@keyframes move-clouds {
  0% {
    background: url(/im/cloud-second-bg.png) no-repeat center bottom;
  }
  20% {
    background: url(/im/cloud-second-bg.png) no-repeat left bottom;
  }
  50% {
    background: url(/im/cloud-second-bg.png) no-repeat center bottom;
  }
  75% {
    background: url(/im/cloud-second-bg.png) no-repeat right bottom;
  }
  100% {
    background: url(/im/cloud-second-bg.png) no-repeat center bottom;
  }
}