html { line-height: 1.15; }
body { margin: 0px; }
h1 { font-size: 2em; margin: 0.67em 0px; }
hr { box-sizing: content-box; overflow: visible; }
pre { font-family: monospace, monospace; font-size: 1em; }
abbr[title] { border-bottom: none; text-decoration: underline dotted; }
b, strong { font-weight: bolder; }
code, kbd, samp { font-family: monospace, monospace; font-size: 1em; }
small { font-size: 80%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sub { bottom: -0.25em; }
sup { top: -0.5em; }
img { border-style: none; }
button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0px; }
button, input { overflow: visible; }
button, select { text-transform: none; }
[type="button"], [type="reset"], [type="submit"], button { -webkit-appearance: button; }
fieldset { padding: 0.35em 0.75em 0.625em; }
legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0px; white-space: normal; }
progress { vertical-align: baseline; }
textarea { overflow: auto; }
[type="checkbox"], [type="radio"] { box-sizing: border-box; padding: 0px; }
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; }
[type="search"] { -webkit-appearance: textfield; outline-offset: -2px; }
[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; }
details { display: block; }
summary { display: list-item; }
[hidden], template { display: none; }
audio, canvas, iframe, img, svg, video { vertical-align: middle; }
iframe { border: 0px; }
fieldset { border: 0px; margin: 0px; padding: 0px; }
html { text-size-adjust: 100%; }
hr { display: block; height: 0px; line-height: 0; padding: 0px; margin: 1em 0px; border-width: 1px 0px 0px; border-right-style: initial; border-bottom-style: initial; border-left-style: initial; border-right-color: initial; border-bottom-color: initial; border-left-color: initial; border-image: initial; border-top-style: solid; border-top-color: rgb(204, 204, 204); }
dl, menu, ol, ul { margin: 0px; padding: 0px; }
ol, ul { list-style: none; }
table { width: 100%; font-size: inherit; }
embed, iframe, img, object, video { max-width: 100%; }
img { height: auto; }
figure { margin: 0px; }
abbr[title] { cursor: help; border-bottom: 1px dotted rgb(153, 153, 153); }
del { text-decoration: line-through; }
h1, h2, h3, h4, h5, h6, p { margin: 0px; }
input[type="checkbox"], input[type="radio"] { vertical-align: baseline; margin-right: 3px; }
button, input, select, textarea { margin: 0px; border-radius: 0px; box-sizing: border-box; }
textarea { resize: vertical; }
input[placeholder] { text-overflow: ellipsis; }
input::-webkit-input-placeholder { text-overflow: ellipsis; }
input[type="number"] { width: auto; }
[tabindex="-1"]:focus { outline: none !important; }
[role="button"] { cursor: pointer; }
[hidden] { display: none !important; }
a { background-color: transparent; }
* { background-repeat: no-repeat; }
button, html, input, select, textarea { font: 16px/1.428 "Roboto Condensed", sans-serif; color: rgb(34, 34, 34); }
a { color: inherit; text-decoration: none; -webkit-tap-highlight-color: transparent; }
hr { border-color: rgb(204, 204, 204); }
.icon { max-width: 100%; display: inline-block; width: 1em; height: 1em; font-size: 25px; fill: currentcolor; }
.clearfix::after, .clearfix::before { content: " "; display: table; }
.clearfix::after { clear: both; }
.visually-hidden { border: 0px; clip: rect(0px, 0px, 0px, 0px); height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; }
.visually-hidden.focusable:active, .visually-hidden.focusable:focus { clip: auto; height: auto; margin: 0px; overflow: visible; position: static; width: auto; }
html { background-color: rgb(12, 10, 15); }
.app, .wrapper { }
.app { }
.body { }
.inner { padding-left: 15px; padding-right: 15px; max-width: 1920px; margin-left: auto; margin-right: auto; box-sizing: border-box; }
.inner--doubled { padding-left: 30px; padding-right: 30px; }
.cta-button { border: none; display: inline-block; max-width: 330px; min-width: 260px; line-height: 60px; height: 60px; cursor: pointer; box-shadow: rgba(0, 0, 0, 0.56) 0px 1px 9px 0px; position: relative; z-index: 1; background-color: rgb(255, 153, 0); text-align: center; font-weight: 700; font-size: 26px; text-transform: uppercase; color: rgb(255, 255, 255); padding: 0px; box-sizing: border-box; outline: none !important; }
.cta-button::before { content: ""; width: 100%; height: 100%; position: absolute; left: 0px; bottom: 0px; z-index: -1; background-image: linear-gradient(0deg, rgb(255, 52, 0), rgb(255, 153, 0)); transition: all 0.25s ease 0s; }
.cta-button:hover::before { opacity: 0; }
.btn { display: inline-block; margin-bottom: 0px; background-image: none; white-space: nowrap; }
.btn--block { display: block; width: 100%; }
.input { border: 1px solid transparent; background-color: rgba(0, 0, 0, 0.3); height: 38px; padding-left: 14px; padding-right: 14px; font-size: 16px; color: rgb(255, 255, 255); transition: all 0.25s ease 0s; outline: none !important; }
.input::-webkit-input-placeholder { font-size: inherit; color: rgba(255, 255, 255, 0.7); }
.input::placeholder { font-size: inherit; color: rgba(255, 255, 255, 0.7); }
.input:focus, .input:hover { border-color: rgb(172, 166, 156); background-color: rgba(0, 0, 0, 0.5); }
.input--block { display: block; width: 100%; }
textarea { padding: 4px; }
.checkbox { position: relative; }
.checkbox__input { position: absolute; left: 0px; top: 0px; opacity: 0 !important; }
.checkbox__helper { border: 1px solid rgb(158, 156, 154); width: 22px; height: 22px; background-color: rgba(0, 0, 0, 0.3); display: inline-block; position: relative; vertical-align: sub; transition: all 0.25s ease 0s; }
.checkbox__helper, .checkbox__helper::before { box-sizing: border-box; }
.checkbox__helper::before { content: ""; position: absolute; left: 3px; top: 4px; width: 70%; height: 35%; border-left: 2px solid rgb(255, 255, 255); border-bottom: 2px solid rgb(255, 255, 255); transform: rotate(-45deg); transition: opacity 0.25s ease 0s; opacity: 0; }
.checkbox__input:checked ~ .checkbox__helper { border-color: rgb(158, 156, 154); }
.checkbox__input:checked ~ .checkbox__helper::before { opacity: 1; }
.header {
width: 100%;
position: relative;
z-index: 3;
margin-bottom: -110px;
transition: opacity 0.3s ease 0s,
visibility 0.3s ease 0s;
pointer-events: none;
}
.aside--opened .header { opacity: 0; visibility: hidden; }
.header__logo-link { display: block; max-width: 220px; margin-left: auto; margin-right: auto; pointer-events: auto; }
.header__logo-small { display: none; }
.header__menu { margin-top: -10px; }
.header__menu-item { line-height: 60px; cursor: pointer; position: relative; font-size: 20px; color: rgb(255, 255, 255); text-transform: uppercase; display: none; text-align: center; font-weight: 700; white-space: nowrap; -webkit-tap-highlight-color: transparent; }
.header__menu-item::before { content: ""; width: 100%; height: 2px; position: absolute; bottom: 7px; background-color: rgba(255, 255, 255, 0.5); transition: all 0.3s ease 0s; transform: scaleX(0); display: none; }
.header__menu-item--active { display: block; cursor: default; pointer-events: none; }
.header__menu-item--active::before { transform: scaleX(1); }
.header__menu-item:first-child { margin-left: 0px; }
.header__arrow { width: 40px; height: 60px; position: absolute; bottom: 0px; background-color: rgba(0, 0, 0, 0.24); cursor: pointer; -webkit-tap-highlight-color: transparent; transition: all 0.25s ease 0s; pointer-events: auto; }
.header__arrow:active { transform: scale(0.85); }
.header__arrow .icon { max-width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1) 0s, -webkit-transform 0.25s 0s; color: rgb(255, 255, 255); font-size: 45px; }
.header__arrow--left { left: 0px; }
.header__arrow--right { right: 0px; }
.footer { position: relative; z-index: 3; color: rgb(204, 204, 204); padding-bottom: 10px; padding-top: 10px; text-align: center; font-size: 16px; margin-top: -117px; transition: opacity 0.3s ease 0s, visibility 0.3s ease 0s; pointer-events: none; box-sizing: border-box; }
.aside--opened .footer { opacity: 0; visibility: hidden; }
.footer__menu { display: flex; justify-content: space-around; pointer-events: auto; }
.footer__menu-item { margin-right: 5px; transition: all 0.25s ease 0s; white-space: nowrap; font-size: 13px; }
.footer__menu-item:hover { color: rgb(255, 255, 255); }
.footer__menu-item:last-child { margin-right: 0px; }
.footer__copyright { color: rgb(153, 153, 153); font-size: 14px; pointer-events: auto; text-align: left; }
.footer__bottom { display: flex; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: center; align-items: center; margin-top: 5px; }
.footer__pegi { -webkit-box-align: start; align-items: flex-start; display: none; pointer-events: auto; }
.footer__pegi--visible { display: flex; }
.footer__pegi img { margin: 0px 2px; }
.scenes { height: 100vh; overflow: auto hidden; position: relative; will-change: transform; }
.scenes__transitionHelper { width: 100%; height: 100%; z-index: 2; position: absolute; left: 0px; visibility: hidden; display: none; }
.scenes__transitionHelper-inner { width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; background-position: 50% center; background-size: 100% 100%; pointer-events: none; }
.scenes__transitionHelper--next { animation: 2s cubic-bezier(0.77, 0, 0.175, 1) 0s 1 normal forwards running transitionHelperNext; }
.scenes__transitionHelper--prev { animation: 2s cubic-bezier(0.77, 0, 0.175, 1) 0s 1 normal forwards running transitionHelperPrev; }
.scenes__transitionHelper--flipped { transform: scaleX(-1); }
.scene { width: 100%; height: 100%; position: absolute; left: 0px; top: 0px; display: none; z-index: 1; will-change: transform, opacity; }
.aside--opened .scene { overflow: hidden; }
.scene--active, .scene--animating, .scene--next-out { display: block; }
.scene--next-in { z-index: 2; animation: 1s cubic-bezier(0.77, 0, 0.175, 1) 0s 1 normal forwards running sceneNextInSm; }
.scene--prev-out { display: block; }
.scene--prev-in { z-index: 2; animation: 1s cubic-bezier(0.77, 0, 0.175, 1) 0s 1 normal forwards running sceneNextInSm; }
.scene__inner { min-width: 100%; height: 100vh; position: relative; }
.scene__img-wrap { width: 100%; max-width: 100%; }
.scene__img { height: 100%; max-width: none; transform-origin: left top; will-change: filter, transform; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
.scene__img--animatable { transition: transform 0.35s ease 0s, -webkit-transform 0.35s ease 0s; }
.scene__bg { width: 100%; height: 100%; position: fixed; top: 0px; left: 0px; transition: all 0.3s ease 0s; display: none; animation: 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0s 1 normal forwards running asideOpen; z-index: 1; }
.aside--opened .scene__bg { display: block; }
.scene__image { width: 100%; height: 100%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.scene__dots { bottom: 0px; right: 0px; }
.scene__dot, .scene__dots { position: absolute; top: 0px; left: 0px; }
.scene__dot { -webkit-tap-highlight-color: transparent; width: 60px; height: 60px; border-radius: 50%; transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1) 0s, -webkit-transform 0.35s 0s; will-change: filter, transform; }
.scene__dot:hover { z-index: 1; }
.scene__dot::after, .scene__dot::before { content: ""; width: 100%; height: 100%; position: absolute; left: 0px; top: 0px; z-index: 1; background-color: rgba(255, 255, 255, 0.35); border-radius: 50%; transition: transform 0.3s ease 0ms, -webkit-transform 0.3s ease; pointer-events: none; }
.scene__dot::after { animation: 10s ease 0s infinite normal none running dot; }
.aside--opened .scene__dot::after { animation: 0s ease 0s 1 normal none running none; }
.scene__dot:first-child::after { animation-delay: 5s; }
.scene__dot:nth-child(2)::after { animation-delay: 2s; }
.scene__dot:nth-child(3)::after { animation-delay: 10s; }
.scene__dot:nth-child(4)::after { animation-delay: 8s; }
.scene__dot-inner { width: 100%; height: 100%; position: absolute; background-color: rgb(255, 227, 48); z-index: 2; left: 0px; top: 0px; border-radius: 50%; box-shadow: rgba(0, 0, 0, 0.56) 0px 1px 9px 0px, rgb(255, 255, 255) 0px 0px 0px 0px inset; transition: all 0.3s ease 0s; cursor: pointer; display: flex; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; }
.scene__dot-icon { opacity: 0.9; pointer-events: none; font-size: 52px; color: rgb(34, 34, 34); fill: rgb(34, 34, 34); }
.scene__dot-text { font-size: 40px; font-weight: 700; text-transform: uppercase; color: rgb(255, 255, 255); text-shadow: rgba(0, 0, 0, 0.56) 0px 1px 9px; position: absolute; z-index: 2; left: 100%; padding-left: 35px; white-space: nowrap; cursor: default; transition: all 0.3s ease 0s; opacity: 0; transform: translateX(-6%); pointer-events: none; display: none; }
.aside--opened .scene__dot-text { opacity: 0 !important; }
.scene__dot--active { pointer-events: none; z-index: 2; }
.scene__dot.scene__dot--active::before, .scene__dot:hover::before { transform: scale(1.85); }
.scene__dot.scene__dot--active .scene__dot-inner, .scene__dot:hover .scene__dot-inner { transform: scale(1.5); box-shadow: rgba(0, 0, 0, 0.56) 0px 1px 9px 0px, rgb(255, 255, 255) 0px 0px 0px 5px inset; }
.scene__dot:hover .scene__dot-text { opacity: 1; transform: translateX(0px); }
.scene__dot--first { left: 262px; top: 115px; }
.scene__dot--second { left: 326px; top: 375px; }
.scene__dot--third { left: 510px; top: 225px; }
.scene__dot--fourth { left: 776px; top: 255px; }
.buttons-wrap { text-align: center; width: 100%; position: fixed; z-index: 3; bottom: 114px; transition: all 0.3s ease 0s; pointer-events: none; }
.buttons-wrap * { pointer-events: auto; }
.aside--opened .buttons-wrap, .modal--opened .buttons-wrap { opacity: 0; visibility: hidden; }
@-webkit-keyframes dotHover {
0% { transform: scale(1); }
100% { transform: scale(1.35); }
}
@keyframes dotHover {
0% { transform: scale(1); }
100% { transform: scale(1.35); }
}
@-webkit-keyframes dot {
3% { transform: scale(1.35); }
6% { transform: scale(1); }
100% { transform: scale(1); }
}
@keyframes dot {
3% { transform: scale(1.35); }
6% { transform: scale(1); }
100% { transform: scale(1); }
}
@-webkit-keyframes sceneNextOut {
0%, 20% { transform: translateZ(0px); }
100% { transform: translate3d(-115%, 0px, 0px); }
}
@keyframes sceneNextOut {
0%, 20% { transform: translateZ(0px); }
100% { transform: translate3d(-115%, 0px, 0px); }
}
@-webkit-keyframes sceneNextIn {
0%, 20% { transform: translate3d(115%, 0px, 0px); }
100% { transform: translateZ(0px); }
}
@keyframes sceneNextIn {
0%, 20% { transform: translate3d(115%, 0px, 0px); }
100% { transform: translateZ(0px); }
}
@-webkit-keyframes sceneNextInSm {
0% { transform: scale(1.5); opacity: 0; }
100% { transform: scale(1); opacity: 1; }
}
@keyframes sceneNextInSm {
0% { transform: scale(1.5); opacity: 0; }
100% { transform: scale(1); opacity: 1; }
}
@-webkit-keyframes scenePrevOut {
0%, 20% { transform: translateZ(0px); }
100% { transform: translate3d(115%, 0px, 0px); }
}
@keyframes scenePrevOut {
0%, 20% { transform: translateZ(0px); }
100% { transform: translate3d(115%, 0px, 0px); }
}
@-webkit-keyframes scenePrevIn {
0%, 20% { transform: translate3d(-115%, 0px, 0px); }
100% { transform: translateZ(0px); }
}
@keyframes scenePrevIn {
0%, 20% { transform: translate3d(-115%, 0px, 0px); }
100% { transform: translateZ(0px); }
}
@-webkit-keyframes transitionHelperNext {
0% { visibility: visible; transform: translate3d(100%, 0px, 0px); }
100% { transform: translate3d(-100%, 0px, 0px); }
}
@keyframes transitionHelperNext {
0% { visibility: visible; transform: translate3d(100%, 0px, 0px); }
100% { transform: translate3d(-100%, 0px, 0px); }
}
@-webkit-keyframes transitionHelperPrev {
0% { visibility: visible; transform: translate3d(-100%, 0px, 0px); }
100% { transform: translate3d(100%, 0px, 0px); }
}
@keyframes transitionHelperPrev {
0% { visibility: visible; transform: translate3d(-100%, 0px, 0px); }
100% { transform: translate3d(100%, 0px, 0px); }
}
.aside-modal { width: 100%; position: fixed; left: 0px; top: 0px; bottom: 0px; visibility: hidden; overflow: hidden; transition: all 0.3s ease 0s; z-index: 3; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.aside--opened .aside-modal { visibility: visible; }
.aside-modal__inner { width: 100%; position: absolute; top: 0px; bottom: 0px; left: 0px; box-shadow: transparent 0px 3px 101px 0px; transition: all 0.3s ease 0s; transform: translateX(-100%); will-change: transform; cursor: auto; overflow-y: auto; }
.aside--opened .aside-modal__inner { box-shadow: rgba(0, 0, 0, 0.56) 0px 3px 101px 0px; animation: 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0s 1 normal forwards running asideOpenInner; }
.aside-modal__inner--close { animation: 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0s 1 normal forwards running asideOpenClose !important; }
.aside-modal__canvas { background-color: rgb(42, 55, 69); background-image: url("../img/modal-bg.jpg"); background-size: cover; z-index: 3; color: rgb(204, 204, 204); min-height: 0px; }
.aside-modal__canvas p { margin-bottom: 10px; }
.aside-modal__canvas img { margin-top: 10px; margin-bottom: 10px; }
.aside-modal__close { outline: none; border: none; background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyMi4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiDQoJIHZpZXdCb3g9IjAgMCAzMyAzMyIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMzMgMzM7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+DQoJLnN0MHtmaWxsOiNGRkZGRkY7fQ0KPC9zdHlsZT4NCjxnPg0KCTxyZWN0IHg9IjE0IiB5PSItNCIgdHJhbnNmb3JtPSJtYXRyaXgoMC43MDcxIC0wLjcwNzEgMC43MDcxIDAuNzA3MSAtNi44MzQ1IDE2LjUpIiBjbGFzcz0ic3QwIiB3aWR0aD0iNSIgaGVpZ2h0PSI0MSIvPg0KCTxyZWN0IHg9IjE0IiB5PSItNCIgdHJhbnNmb3JtPSJtYXRyaXgoLTAuNzA3MSAtMC43MDcxIDAuNzA3MSAtMC43MDcxIDE2LjUgMzkuODM0NSkiIGNsYXNzPSJzdDAiIHdpZHRoPSI1IiBoZWlnaHQ9IjQxIi8+DQo8L2c+DQo8L3N2Zz4NCg==") 0% 0% / contain; position: absolute; z-index: 4; width: 33px; height: 33px; right: 28px; top: 28px; cursor: pointer; padding: 0px; opacity: 0; visibility: hidden; transition: all 0.3s ease 0s; }
.aside--opened .aside-modal__close { opacity: 1; visibility: visible; }
.aside-modal__header { height: 300px; background-size: cover; background-position: 50% center; }
.aside-modal__content-wrap { display: flex; overflow: hidden; }
.aside-modal__content, .aside-modal__content-wrap { -webkit-box-flex: 1; flex: 1 1 0%; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; min-height: 0px; }
.aside-modal__content { height: 100%; display: none; }
.aside-modal__body, .aside-modal__content--active { display: flex; }
.aside-modal__body { -webkit-box-flex: 1; flex: 1 1 0%; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; padding: 15px 15px 0px; min-height: 100px; }
.aside-modal__body-inner { height: 100%; min-height: 0px; overflow-y: auto; padding-right: 10px; }
.aside-modal__title { font-size: 35px; font-weight: 700; color: rgb(255, 255, 255); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 5px; }
.aside-modal__title-paginator { display: none; }
.aside-modal__footer { height: auto; box-sizing: border-box; padding: 15px 15px 30px; }
.aside-modal__btns { text-align: center; }
.target-paginator { -webkit-box-pack: justify; justify-content: space-between; margin-bottom: 30px; }
.target-paginator, .target-paginator__btn { display: flex; -webkit-box-align: center; align-items: center; }
.target-paginator__btn { border: none; font-size: 20px; font-weight: 700; background: none; cursor: pointer; color: inherit; text-transform: uppercase; transition: color 0.25s ease 0s; -webkit-box-flex: 1; flex: 1 1 0%; min-width: 0px; outline: none !important; }
.target-paginator__btn:hover { color: rgb(255, 255, 255); }
.target-paginator__prev .icon { margin-right: 12px; transform: rotate(90deg); }
.target-paginator__prev-text { display: none; }
.target-paginator__next { -webkit-box-pack: end; justify-content: flex-end; }
.target-paginator__next .icon { margin-left: 12px; transform: rotate(-90deg); }
.target-paginator__next-text { display: none; }
.target-paginator__dots { display: flex; margin: 0px 15px; }
.target-paginator__dot { width: 36px; height: 36px; box-sizing: border-box; cursor: pointer; position: relative; }
.target-paginator__dot::before { content: ""; border: 2px solid rgb(116, 125, 134); position: absolute; left: 50%; top: 50%; margin-top: -5px; margin-left: -5px; width: 10px; height: 10px; border-radius: 50%; transition: all 0.25s ease 0s; box-sizing: border-box; }
.target-paginator__dot:hover::before { background-color: rgb(116, 125, 134); }
.target-paginator__dot--active { pointer-events: none; }
.target-paginator__dot--active::before { background-color: rgb(116, 125, 134); transform: scale(1.5); cursor: default; }
.target-paginator__dot:last-child { margin-right: 0px; }
.aside--opened { overflow: hidden; }
@-webkit-keyframes asideOpen {
0% { background-color: transparent; }
100% { background-color: rgba(0, 0, 0, 0.4); }
}
@keyframes asideOpen {
0% { background-color: transparent; }
100% { background-color: rgba(0, 0, 0, 0.4); }
}
@-webkit-keyframes asideOpenInner {
0% { transform: translateX(-100%); }
100% { transform: translateX(0px); }
}
@keyframes asideOpenInner {
0% { transform: translateX(-100%); }
100% { transform: translateX(0px); }
}
@-webkit-keyframes asideOpenClose {
0% { transform: translateX(0px); }
100% { transform: translateX(-100%); }
}
@keyframes asideOpenClose {
0% { transform: translateX(0px); }
100% { transform: translateX(-100%); }
}
@-webkit-keyframes asideCloseBtn {
0% { transform: translateX(-80px); }
100% { transform: translateX(0px); }
}
@keyframes asideCloseBtn {
0% { transform: translateX(-80px); }
100% { transform: translateX(0px); }
}
.aside-modal__body-inner::-webkit-scrollbar { width: 5px; }
.aside-modal__body-inner::-webkit-scrollbar-track { background: rgba(255, 255, 255, 0.2); }
.aside-modal__body-inner::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.5); transition: all 0.25s ease 0s; }
.aside-modal__body-inner::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, 0.8); }
.modal-wrap { width: 100%; height: 100%; position: fixed; left: 0px; top: 0px; bottom: 0px; z-index: 10; text-align: center; white-space: nowrap; overflow: hidden auto; display: none; cursor: pointer; }
.modal--opened .modal-wrap { display: block; animation: 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0s 1 normal forwards running asideOpen; }
.modal-wrap::before { content: ""; display: inline-block; height: 100%; vertical-align: middle; }
.modal-wrap::-webkit-scrollbar { width: 5px; }
.modal-wrap::-webkit-scrollbar-track { background: rgba(255, 255, 255, 0.2); }
.modal-wrap::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.5); transition: all 0.25s ease 0s; }
.modal-wrap::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, 0.8); }
.modal { max-width: 100%; display: inline-block; vertical-align: middle; padding-left: 30px; padding-right: 30px; padding-bottom: 30px; box-sizing: border-box; font-size: 16px; color: rgb(255, 255, 255); text-align: left; white-space: normal; cursor: auto; position: relative; }
.modal--opened .modal { animation: 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0s 1 normal forwards running modalOpen; }
.modal__close { width: 33px; height: 33px; border: none; background-color: tomato; position: absolute; top: 20px; right: 10px; cursor: pointer; box-sizing: border-box; padding: 0px; outline: none !important; }
.modal__inner { max-width: 600px; }
.modal a { color: rgb(102, 204, 204); }
.modal__header { text-align: center; }
.modal__header-text { font-size: 16px; font-weight: 700; margin-bottom: 16px; text-transform: uppercase; }
.modal__buttons { text-align: center; }
.modal__buttons .cta-button { width: 100%; }
.modal-errors { color: rgb(255, 52, 0); }
.modal-errors__item { margin-bottom: 20px; }
.modal-form__line { margin-bottom: 16px; }
.modal-form__line--icon { display: flex; }
.modal-form__line-icon { min-width: 32px; position: relative; }
@-webkit-keyframes modalOpen {
0% { transform: translateY(50px); opacity: 0; }
100% { transform: translateY(0px); opacity: 1; }
}
@keyframes modalOpen {
0% { transform: translateY(50px); opacity: 0; }
100% { transform: translateY(0px); opacity: 1; }
}
@media (min-width: 360px) {
.footer__menu-item { margin-right: 10px; font-size: 16px; }
}
@media (min-width: 768px) {
.header { height: 107px; margin-bottom: -107px; pointer-events: auto; }
.header .inner { display: flex; -webkit-box-pack: justify; justify-content: space-between; }
.header__logo-link { max-width: none; display: inline-block; margin-left: 0px; }
.header__logo { display: none; }
.header__logo-small { display: inline-block; }
.header__menu { height: 100%; padding-top: 29px; display: flex; margin-top: 0px; margin-right: 30px; }
.header__menu-item { line-height: 48px; text-align: left; font-weight: 400; margin-left: 50px; display: list-item !important; }
.header__menu-item::before { display: block; }
.header__arrow { background-color: transparent; }
.header__arrow .icon { font-size: 90px; }
.header__arrow { width: 100px; height: 200px; position: fixed; top: 50%; margin-top: -100px; }
@media (min-width: 992px) {
.inner--main { padding-left: 220px; padding-right: 220px; }
.header__arrow { width: 150px; }
}
.footer { margin-top: -95px; text-align: left; }
.footer .inner { display: flex; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: center; align-items: center; }
.footer__copyright { font-size: 16px; color: rgb(204, 204, 204); }
.footer__pegi { margin-left: 12px; }
.buttons-wrap { bottom: 76px; }
.aside-modal__body { padding: 25px; }
.target-paginator__next-text, .target-paginator__prev-text { display: inline-block; }
.modal__close { top: 36px; right: -25px; }
}
@media (min-width: 992px) {
@media (min-width: 768px) {
.header__arrow { width: 150px; }
}
}
@media (min-width: 1024px) {
.inner--main { padding-left: 220px; padding-right: 220px; }
.header__menu { margin-right: 85px; }
.footer .footerbr { display: none; }
.aside-modal__inner { width: 752px; overflow-y: visible; }
.aside-modal__canvas { position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; }
.aside-modal__close { z-index: 2; right: -63px; }
.modal-form__line { margin-bottom: 20px; }
}
@media (min-width: 1025px) {
.inner--main { padding-left: 220px; padding-right: 220px; }
.scenes__transitionHelper { display: block; }
.scene--next-out { animation: 2.2s cubic-bezier(0.77, 0, 0.175, 1) 0s 1 normal forwards running sceneNextOut; }
.scene--next-in { animation: 1.5s cubic-bezier(0.77, 0, 0.175, 1) 0s 1 normal forwards running sceneNextIn; }
.scene--prev-out { animation: 2.2s cubic-bezier(0.77, 0, 0.175, 1) 0s 1 normal forwards running scenePrevOut; }
.scene--prev-in { animation: 1.5s cubic-bezier(0.77, 0, 0.175, 1) 0s 1 normal forwards running scenePrevIn; }
}
@media (min-width: 1200px) {
.modal--opened .app { filter: blur(10px); }
.inner--main { padding-left: 220px; padding-right: 220px; }
.input { height: 62px; line-height: 62px; font-size: 20px; }
.header__logo-link { margin-left: -32px; }
.header__logo { display: inline-block; }
.header__logo-small { display: none; }
.header__menu { margin-right: 0px; }
.header__menu-item { margin-left: 92px; }
.header__arrow--left:hover .icon { transform: translate(-60%, -50%); }
.header__arrow--right:hover .icon { transform: translate(-40%, -50%); }
.scenes__transitionHelper-inner { background-size: cover; }
.modal__header-text { font-size: 22px; margin-bottom: 32px; }
}
@media (min-width: 1366px) {
.inner--main { padding-left: 220px; padding-right: 220px; }
.scenes { overflow-x: hidden; }
.scene__dot-text { display: block; }
}
@media (min-width: 1367px) {
.aside--opened .scene__img { }
.aside--opened .scene__dot:not(.scene__dot--active), .modal--opened .scene__img { }
}
@media (min-width: 1600px) {
.inner--main { padding-left: 220px; padding-right: 220px; }
}
@media (max-height: 700px) {
.aside-modal__header { height: 150px; }
}
@media (max-height: 1023px) {
.aside-modal__header { height: 250px; }
}
@media not all {
.aside-modal__footer { height: 136px; padding: 15px 30px; }
}
.platform-icons {
position: fixed;
top: 34px;
right: 2.6%;
margin: 0 0 0 22px;
width:auto;
height: auto;
z-index: 4;
}
.platform-icons_item {
display: inline-block;
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
}
.platform-icons__item-image_xbox {
max-width: 50px;
margin: 0 0 0 22px;
}
.platform-icons__item-image_ps4 {
position: relative;
max-width: 50px;
margin: 0 0 0 22px;
right: 0px;
top: 0px;
}
.platform-icons-link {
text-decoration: none;
display: block;
transition: all .15s;
}
.platform-icons-link:hover {
text-decoration: none;
-o-transform: scale(1.05, 1.05);
-ms-transform: scale(1.05, 1.05);
-moz-transform: scale(1.05, 1.05);
-webkit-transform: scale(1.05, 1.05);
transform: scale(1.05, 1.05);
}
@media screen and (max-width: 1024px) {
.platform-icons__item-image_xbox {
max-width: 40px;
}
.platform-icons__item-image_ps4 {
max-width: 40px;
}
.platform-icons {
position: fixed;
top: 110px;
right: 3.5%;
margin: 0 0 0 22px;
width:auto;
height: auto;
z-index: 2;
}
}
@media screen and (max-width: 767px) {
.platform-icons__item-image_xbox {
max-width: 22px;
margin: 0 0 0 0;
}
.platform-icons__item-image_ps4 {
max-width: 22px;
margin: 0 0 0 0;
}
.platform-icons {
position: fixed;
top: 18px;
right: 4px;
margin: 0 0 0 22px;
width:auto;
height: auto;
z-index: 2;
}
}