@charset "utf-8";
/* created front-end developer by Roman, Skype: ItJustAlance */

@font-face {
    font-family: 'Intro';
    src: url('Intro-Bold.woff2') format('woff2'),
    url('Intro-Bold.woff') format('woff'),
    url('Intro-Bold.svg#Intro-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto';
    src: url('Roboto-Medium.woff2') format('woff2'),
    url('Roboto-Medium.woff') format('woff'),
    url('Roboto-Medium.svg#Roboto-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto';
    src: url('Roboto-Bold.woff2') format('woff2'),
    url('Roboto-Bold.woff') format('woff'),
    url('Roboto-Bold.svg#Roboto-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto';
    src: url('Roboto-Regular.woff2') format('woff2'),
    url('Roboto-Regular.woff') format('woff'),
    url('Roboto-Regular.svg#Roboto-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Intro';
    src: url('Intro-Regular.woff2') format('woff2'),
    url('Intro-Regular.woff') format('woff'),
    url('Intro-Regular.svg#Intro-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}





* {margin:0; padding:0; max-height: 9001em; box-sizing: border-box;}
img {border:none; max-width:100%; vertical-align:top;}
html {-webkit-text-size-adjust: none;
      -ms-text-size-adjust: none;
}
html, body { height:100%;}
a[href^="tel"]{
    color:inherit;
    text-decoration:none;
}
h1 {}
p { padding:0 0 10px;}
a {color:#000;
  transition: all 0.3s ease;
}
a:hover { text-decoration:none;}
.over { width:100%; overflow: hidden; position: relative}
.f-clear {clear:both;width:100%; height:260px;}

/*
.vc-block {height:100px;}
.vc-block:before {content:""; display:inline-block;width:0;height:100%; vertical-align:middle;}
.vc-block .vc-cont {display:inline-block; vertical-align:middle;}


*/

input::-webkit-input-placeholder {
	opacity:1 !important;
	color:inherit;
}

input:-moz-placeholder { /* Firefox 18- */
  opacity:1 !important; color:inherit;
}

input::-moz-placeholder {  /* Firefox 19+ */
   opacity:1 !important; color:inherit;
}

input:-ms-input-placeholder {
   opacity:1 !important;  color:inherit;
}
textarea::-webkit-input-placeholder {
	opacity:1 !important;color:inherit;
}

textarea:-moz-placeholder { /* Firefox 18- */
  opacity:1 !important;  color:inherit;
}

textarea::-moz-placeholder {  /* Firefox 19+ */
   opacity:1 !important; color:inherit;
}

textarea:-ms-input-placeholder {
   opacity:1 !important;  color:inherit;
}

.clearfix {
  *zoom: 1; }
  .clearfix:before {
    content: " ";
    display: table; }
  .clearfix:after {
    content: " ";
    display: table;
    clear: both; }

input[type='submit']::-moz-focus-inner, button::-moz-focus-inner {
	padding:0;
	border:0;
	}

input, textarea {font-family: 'Roboto';}



strong, b { font-weight:bold;}
i, em {font-style:italic;}
table p {padding:0 !important;}
body { line-height: 1.2; font-size: 24px; font-family: 'Roboto'; font-weight: 500;}

.all { margin:0 auto; max-width: 1300px; padding: 0 20px; width: 100%}


/* Slider */
.slick-slider
{
    position: relative;

    display: block;
    box-sizing: border-box;

    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
    margin-left: auto;
    margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}


/* Шапка */
header { position: absolute; left: 0;width: 100%;top: 0; z-index: 55; padding-bottom: 44px; padding-top: 44px;}
header .all {max-width: 1700px; position: relative}
header .hamburg {display: none}
header.fixed {position: fixed; top: 0; left: 0; width: 100%; z-index: 100;}
header.fixed nav {display: none}
.hamburg {position: absolute; top: 0;right: 0; cursor: pointer;}
.hamburg .close {position: absolute;top: 0;left: 0; width: 50px;height: 50px; display: none}

.menu-open .hamburg .close  {display: block}
.menu-open .hamburg .ham {opacity: 0;}
.menu-open header {background: rgba(38, 71, 150, 0.6);backdrop-filter: blur(8px);-webkit-backdrop-filter: blur(8px);}
.menu-open nav{
    width: 100%;
;}
header.fixed .hamburg { display: block}
.menu-open header.fixed nav {display: block}
/* Навигация */
nav {}
nav ul {margin: 0;padding: 0; list-style: none;}
nav li{ display: inline-block; vertical-align: top; font-size: 20px; font-family: 'Intro'; text-transform: uppercase; font-weight: bold; margin-right: 40px;}
nav li a {color: #fff; text-decoration: none;}
nav li a:hover { opacity: .7;}

/* Контент */
div.content {}
.link-next { position: absolute;bottom: 15%; font-size: 22px; font-weight: bold; left: calc(50% - 130px); text-align: center; width: 260px;  z-index: 4; display: block; font-family: 'Intro'; text-transform: uppercase; }
.link-next a {display: block;  color: #fff; text-decoration: none; white-space: nowrap}
.lvl { width: 100%; position: relative;   height: 100vh; margin: 0 auto; max-width: 1920px}
.lvl1 { height: auto; margin-bottom: -153px;  min-height: 950px; position: relative; z-index: 5;}
.lvl1-slider { position: relative; }

.lvl1-slider .slider { position: absolute;top: 0;left: 0; width: 100%; height: 100%; z-index: 2;}
.lvl1-slider .uni {position: absolute;bottom: -29px;right: 0; max-width: 30%}
.lvl1-slider .img-mob { display: none}
.lvl1-slider .slick-list { height: 100%}
.lvl1-slider .slick-track { height: 100%}
.lvl1 .slick-arrow { display: none !important}
.slide-bg {}
.link-next .arr {animation:1s infinite alternate arrowBounce; display: block; position: relative; text-align: center;margin-top: 35px; }

@keyframes arrowBounce {
    0% {
        transform:translateY(0)
    }
    100% {
        transform:translateY(-16px)
    }
}


.lvl2 {min-height: 1100px; position: relative; z-index: 3; height: auto; background:none; background-size: 100% auto;}
.lvl2 .link-next {bottom: 150px;}
.lvl2 .title {color: #FFED00; font-size: 52px; text-align: center; text-transform: uppercase; font-weight: bold; font-family: 'Intro'; padding-bottom: 60px;}
.lvl2 .all { position: relative; padding-bottom: 220px;}

.lvl2 .lvl2-content {display: flex;  position: absolute;top: 0;left: 0;width: 100%; height: 100%;}
.lvl2 .lvl2-wrap { display: flex; width: 100%; min-height: 600px; justify-content: space-between; color: #264796; font-size: 18px; font-weight: 500;}
.lvl2 .col-left {
    width: 420px;
    z-index: 1;
}
.lvl2 .col-right {
    width: 420px;
    z-index: 1;
}
.lvl2 .b-banka { padding: 0 20px; position: absolute; left: 0; right: 0; text-align: center; bottom: 250px;}
.lvl2 .b-banka img {width: 200px;}
.lvl2 .lvl-bg { height: 1100px;}
.lvl2 .lvl-bg img {width: 1920px; max-width: 1920px; position: absolute;top:0; left: calc(50% - 960px); z-index: -1;}
.lvl2 .all {padding-top: 180px; min-height: 1000px;}
.lvl2 .stage { position: absolute;bottom: -5%; left: calc(50% - 125px);}
.lvl2 .title-img {margin-bottom: 12px;}
.lvl2 .title-img-tablet {display: none}
.lvl2 .b-com { border-radius: 16px; background: rgba(255,255,255, .8); padding: 20px; margin-bottom: 12px;}
.lvl2 .b-com p {margin: 0;padding: 0;}
.lvl2 .b-com {}
.lvl2 .non {position: absolute;left: 40px;bottom: 120px;}
.no-wrap {
    white-space: nowrap;
}
.ball-wrapper {
    display: inline-block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    left: -450%;
    position: relative;

}
.stage.animated .ball-wrapper {animation: dvig 1.3s ease-in-out; left: -68%;}
.stage.animated .ball {animation: rot 1.3s ease-in-out;}
.ball {
    display: inline-block;
    width: 100%;
    height: 100%;
    margin: 0;
    border-radius: 50%;
    position: relative;
    background: url(../img/ball.png) no-repeat;
    background-size: 100%;
    transform: rotate(680deg);
    z-index: 2;

}
@keyframes rot {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(680deg)
    }
}
@keyframes dvig {
    0% {
        left: -450%;
    }

    100% {
        left: -68%;
    }
}
.ball:before {
    content: "";
    position: absolute;
    top: 1%;
    left: 5%;
    width: 90%;
    height: 90%;
    border-radius: 50%;
    background: radial-gradient(circle at 50% 0px, #ffffff, rgba(255, 255, 255, 0) 58%);
    z-index: 2;
}
.ball:after {
    content: "";
    position: absolute;
    border-radius: 100%;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    //background: radial-gradient(circle at 50% 30%, rgba(245, 237, 48, 0), rgba(200, 190, 20, 0.2) 50%, #575300 100%);
}
.ball-shadow {
    position: absolute;
    left: 0;
    bottom: 0%;
    z-index: 1;
    margin-left: 20%;
    width: 20%;
    height: 10%;
    background: rgba(20, 20, 20, .2);
    box-shadow: 0px 0 40px 75px rgba(20,20,20,.3);
    border-radius: 30px / 40px;
    transform: scaleY(.3);

}
.stage {
    width: 170px;
    height: 170px;
    display: inline-block;
    perspective: 1200px;
    perspective-origin: 50% 50%;
}

.lvl3 { position: relative; height: auto; background: url(../img/bg33.png) 50% 0 no-repeat; z-index: 4; padding-top: 125px; margin-top: -140px; min-height: 1000px; background-size: cover; }
.lvl3 .all { position: relative; padding-bottom: 220px;}
.lvl3 .non { position: absolute;bottom: 0px;left: 0;}
.lvl3 .non.fixed {
    position: fixed;
    left: 40px;
    bottom: 40px;
}
.lvl3 .title {color: #FFED00; font-size: 52px; text-align: center; text-transform: uppercase; font-weight: bold; font-family: 'Intro'; padding-bottom: 12px;}
.lvl3 .text {color: #fff; font-size: 22px; text-align: center; text-transform: uppercase; font-weight: bold; font-family: 'Intro'; padding-bottom: 60px;}
.lvl3 .bg3 { display: none}
.lvl3 .slick-arrow {display: none !important}
.lvl3  .slider3 {position: relative; padding-right: 80px;}
.lvl3 .slick-dots {display: flex; flex-direction: column; justify-content: center; position: absolute;top: 0;bottom: 0;right: -60px; margin: 0; padding: 0; list-style: none;}
.lvl3 .slick-dots li { max-width: 18px; min-width: 18px; max-height: 18px;min-height: 18px; display: flex; align-items: center; justify-content: center; border-radius: 50%; margin: 10px 0; padding: 0;border: 2px solid #FFED00;}
.lvl3 .slick-dots li button { cursor: pointer; overflow: hidden; position: relative; text-align: left; text-indent: -999em; border-radius: 18px; width: 10px; height: 10px; background: none; border: none;   }
.lvl3 .slick-dots li.slick-active button {background: #FFED00; }
.b-rasp {
    border-radius: 20px;
    background: #FFF;
    box-shadow: -4px 4px 24px 0px rgba(0, 0, 0, 0.15);
    padding: 20px 40px;
    display: flex;
    margin-top: 12px;
    margin-bottom: 12px;
    min-height: 165px;
}
.b-rasp .col-1 {
    border-right: 1px solid #D9D9D9;
    padding-right: 40px;
    justify-content: center;
    display: flex;
    align-items: center;
    flex-direction: column;
    flex-shrink: 0;
}
.b-rasp .tyr {color: #9A9A9A; font-size: 16px; width: 100%; text-align: left}
.b-rasp .tyr strong {color: #000; font-size: 22px;}

.b-rasp .date {
    color: #264796;
    text-align: center;
    font-size: 40px;
    font-weight: bold;
    font-family: 'Intro';
    flex-shrink: 0;
}
.b-rasp .time { display: flex; align-items: center}
.b-rasp .time .ic {margin-right: 10px; display: flex; align-items: center}
.b-rasp .time .ic svg {width: 25px;height: 25px;}
.b-rasp .time .tt {
    font-size: 22px;
    font-family: 'Roboto';
    font-weight: 700;
    margin-right: 10px;
}
.b-rasp .time .day {
    color: #9A9A9A;
    font-size: 16px;
    font-family: 'Roboto';
}
.b-rasp .col-2 {flex: 1 1 auto; padding: 0 40px; display: flex; align-items: center; justify-content: center}
.b-rasp  .com { display: flex; align-items: center;}
.b-rasp  .com .name {color: #9A9A9A; display: flex; align-items: center; min-height: 40px; font-size: 16px;}
.b-rasp  .com .ico {margin: 0 12px;}
.b-rasp  .com-vs {margin: 0 40px;}
.b-rasp  .com1 {}
.b-rasp  .com1 {}
.b-rasp  .col-3 { display: flex; align-items: center}
/* Подвал */
footer {
    background: #FFED00;
    display: flex;
    align-items: center;
    padding: 40px 0;
    color: #264796;
    font-size: 14px;
    overflow: hidden;
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 10000;
}
footer .all { display: flex;}
footer .foot-left {flex: 1 1 auto}
footer .foot-right {min-width: 220px; max-width: 220px;margin-left: 40px; display: flex; align-items: center}
footer .btn-sog {}
footer .btn-sog:hover { opacity: .8;}
footer .text {padding-bottom: 10px;}
footer .copy {}
footer .copy a {text-decoration: underline; color: #264796;}
footer .copy a:hover {text-decoration: none;}
.lvl3 .non {left: 20px;bottom: 40px;}

@media(max-width: 1760px){
    .lvl1 {margin-bottom: -12%;}
}

@media(max-width: 1740px){
    header .all {margin-right: 20px;margin-left: 20px; width: auto}

}
@media(max-width: 1700px){
    .link-next {bottom: 21%}
    .lvl1 {margin-bottom: -18%; min-height: 880px;}
}
@media(max-width: 1400px){
    .link-next {bottom: 21%}
    .lvl1 {margin-bottom: -18%; min-height: 800px;}
}

@media(max-width: 1320px){
    .link-next {bottom: 21%}
    .lvl2 .col-left {width: 30%}
    .lvl2 .col-right {width: 30%;}
    .lvl3 .all {padding-bottom: 270px;}
}
@media(max-width: 1282px){
    header {position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 100;}
    header .hamburg {display: block;}
    header nav {display: none}
    nav li {display: block; padding: 20px 0;font-size: 2em;}
    .menu-open header {right:0;bottom:0;}
    .menu-open header nav {display: block;}
    .link-next {bottom: 25%}
    .lvl1 {margin-bottom: -21%; min-height: 770px;}
    .lvl1 { position: relative;z-index: 5;}
    .lvl2 .stage {}

    .lvl2 .col-left .title-img-tablet  {background: #0A8430; padding: 15px 0; display: flex; align-items: center; justify-content: center; box-shadow: 0 5px 7px #264796; border-radius: 20px;margin-bottom: 12px;}
    .lvl2 .col-right .title-img-tablet  {background: #264796; padding: 15px 0; display: flex; align-items: center; justify-content: center; box-shadow: 0 5px 7px #264796; border-radius: 20px;margin-bottom: 12px;}
    .lvl2 .b-com {padding: 20px;}
    .lvl3 .non {left: 20px;bottom: 40px;}
    .lvl2 .non {left: 20px;}

}
@media(max-width: 1170px){
    .link-next {bottom: 25%}
    .lvl1 {margin-bottom: -18%; min-height: 700px;}
}
@media(max-width: 1100px){
    .link-next {bottom: 25%}
    .lvl1 {margin-bottom: -18%; min-height: 650px;}
    .lvl2 {background: url(../img/bg2.jpg) calc(50% + 30px) -300px no-repeat; background-size: cover;}
    .lvl2 .lvl2-content { position: relative; height: auto}
    .lvl2 .lvl-bg {display: none}
    .lvl2 .all {padding-bottom: 270px;}
    .lvl2 .title-img-tablet {display: block}
    .lvl2 .title-img-tablet img { height: 50px}
    .lvl2 .title-img {display: none}
    .lvl2 .b-banka {position: relative; bottom: 0;}
    .lvl2 {background-size: 1900px auto;}
    .lvl2 .lvl2-wrap {flex-direction: column; padding: 0 60px; margin: 0 auto; max-width: 740px;}
    .lvl2 .b-banka { height: 510px; text-align: center; margin: 60px 0 50px;}
    .lvl2 .b-banka img { max-height: 100%;}
    .lvl2 .col-left {width: 100%}
    .lvl2 .col-right {width: 100%;}
}
@media(max-width: 1040px){
    .link-next {bottom: 25%}
    .lvl1 {margin-bottom: -18%; min-height: 600px;}
}
@media(max-width: 1000px){
    .b-rasp {flex-direction: column; padding: 20px; border-radius: 0;}
    .b-rasp .col-1 {border: none; padding: 0; margin-bottom: 70px; flex-direction: row; justify-content: space-between}
    .b-rasp .time .ic {display: none;}
    .b-rasp .time {flex-direction: column}
    .b-rasp .col-2 {padding: 0; margin-bottom: 80px;}
    .b-rasp .com {flex-direction: column}
    .b-rasp .com .ico {order: 0;}
    .b-rasp .com .name {order: 1;font-size: 16px;}
    .b-rasp .col-3 { justify-content: center}
    .lvl3 .slider3 {padding-right: 0; margin: 0 -10px;}
    .lvl3 .slick-slide {padding: 0 10px;}
    .lvl3 .slick-dots { flex-direction: row; flex-wrap: wrap; position: relative; right: 0; margin-top: 15px;}
    .lvl3 .slick-dots li {margin-left: 8px; margin-right: 8px;}
    .lvl3 .non {bottom: 30px; width: 100px;}
}
@media(max-width: 950px){
    .link-next {bottom: 25%}
    .lvl1 {margin-bottom: -18%; min-height: 400px;}
}
@media(max-width: 830px){
    .lvl2 .non, .lvl3 .non {width: 100px;}
    footer {flex-direction: column}
    footer .text {width: 100%}
    footer .all { flex-direction: column}
    footer .foot-left {padding-bottom: 24px;}
    .lvl1-slider .img { display: none;}
    .lvl1-slider .img-mob { display: block;}
    .link-next {font-size: 13px; bottom: 5%;}
    .lvl1 .arr {margin-top: 25px;}
    .lvl1 .arr svg {width: 40px; height: 20px}
    .lvl1 .slide-bg {display: none}
    .lvl1-slider .slider {position: relative; height: auto}
    .lvl2 .link-next {bottom: 150px}
    .link-next svg {width: 40px;height: 25px;}
    .link-next .arr {margin-top: 28px;}
}

@media(max-width: 740px) {
    .lvl3 .title {font-size: 36px;}
    .lvl2 .title {font-size: 36px;}
    .lvl2 .b-com {font-size: 18px;}
    .lvl2 .lvl2-wrap{padding-left: 0;padding-right: 0;}
    .lvl2 .b-banka {height: 450px;}
    .lvl2 .stage {width: 160px;height: 160px;}
    .lvl2 .col-right .title-img-tablet img, .lvl2 .col-left .title-img-tablet img { height: 50px}
    .lvl2 {
        background-size: 1800px auto;
    }
    .lvl2 .link-next {bottom: 140px}
    .bg-non {bottom: 50px; width: 100px;}
}
@media(max-width: 640px) {
    .lvl2 .b-banka {height: 420px;}
}
@media(max-width: 585px) {
    .lvl2 .b-banka {height: 390px;}
}
@media(max-width: 560px) {
    header .all {
        margin: 0;
    }
    nav li {
        font-size: 1em;
    }
}
@media(max-width: 545px) {
    nav li {display: block; padding: 20px 0;}
    .lvl2 {
        background-size: 1900px auto;
    }
}
@media(max-width: 425px) {
    .lvl2 .all {padding-top: 120px; padding-bottom: 150px;}
    .lvl3 .title {font-size: 36px;}
    .lvl2 .title {font-size: 36px;padding-bottom: 20px;}
    .lvl3 .text {font-size: 20px;}
    .lvl2 .b-com {font-size: 16px;}
    .lvl2 .b-banka {height: 460px; margin: 90px 0 40px;}
    .lvl2 .stage {width: 120px;height: 120px; left: calc(50% - 85px)}
    .lvl2 .stage {}
    .lvl2 .col-right .title-img-tablet img, .lvl2 .col-left .title-img-tablet img { height: 40px}
    .lvl2 .col-right .title-img-tablet img, .lvl2 .col-left .title-img-tablet img { height: 40px}
    .lvl2 .link-next {display: none}

}
@media(max-width: 360px) {
    .lvl3 .title {font-size: 28px;}
    .lvl2 .title {font-size: 28px;padding-bottom: 20px;}
    .lvl2 .b-com {padding: 10px;}
}