@charset "UTF-8"; .welcome { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 100; background: #000 url(../img/welcome.jpg) no-repeat 50% 50%; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .lang { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: #242424; z-index: 200; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; padding: 2em; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } .lang__body { text-align: center; } .lang__logo img { width: 5.3em; height: 5em; } .lang__title { margin-top: 1em; font-size: 2.9em; } .lang__subtitle { font-size: 1.4em; margin-top: 1em; } .lang__selector { width: 19em; margin: 0 auto; margin-top: 2em; } .lang__selector-item { font-size: 1.4em; padding: 1em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; } .lang__selector-item.last-focus { background-color: #444; } .lang__selector-item.focus { background-color: #fff; color: #242424; } .lang__selector > .scroll { max-height: 18em !important; } @font-face { font-family: "SegoeUI"; font-display: swap; src: url("../fonts/SegoeUI/SegoeUI-Light.eot") format("embedded-opentype"), url("../fonts/SegoeUI/SegoeUI-Light.woff") format("woff"), url("../fonts/SegoeUI/SegoeUI-Light.ttf") format("truetype"); font-weight: 300; font-style: normal; } @font-face { font-family: "SegoeUI"; font-display: swap; src: url("../fonts/SegoeUI/SegoeUI.eot") format("embedded-opentype"), url("../fonts/SegoeUI/SegoeUI.woff") format("woff"), url("../fonts/SegoeUI/SegoeUI.ttf") format("truetype"); font-weight: 400; font-style: normal; } @font-face { font-family: "SegoeUI"; font-display: swap; src: url("../fonts/SegoeUI/SegoeUI-SemiBold.eot") format("embedded-opentype"), url("../fonts/SegoeUI/SegoeUI-SemiBold.woff") format("woff"), url("../fonts/SegoeUI/SegoeUI-SemiBold.ttf") format("truetype"); font-weight: 600; font-style: normal; } @font-face { font-family: "SegoeUI"; font-display: swap; src: url("../fonts/SegoeUI/SegoeUI-Bold.eot") format("embedded-opentype"), url("../fonts/SegoeUI/SegoeUI-Bold.woff") format("woff"), url("../fonts/SegoeUI/SegoeUI-Bold.ttf") format("truetype"); font-weight: 700; font-style: normal; } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; outline: none; -webkit-user-drag: none; } * { -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; /* чтобы не показывало меню при долгом тапе */ } html { font-size: 16px; } *:after, *:before { display: inline-block; vertical-align: middle; } *:focus { outline: none !important; } input::-webkit-input-placeholder { color: #6a6a6a; opacity: 1; } input:-moz-placeholder { color: #6a6a6a; opacity: 1; } input::-moz-placeholder { color: #6a6a6a; opacity: 1; } input:-ms-input-placeholder { color: #6a6a6a; opacity: 1; } input::-ms-input-placeholder { color: #6a6a6a; opacity: 1; } input::placeholder { color: #6a6a6a; opacity: 1; } ::-webkit-scrollbar { display: none; } input.hover::-webkit-input-placeholder, input.enter::-webkit-input-placeholder { color: #fff; opacity: 1; } input.hover:-moz-placeholder, input.enter:-moz-placeholder { color: #fff; opacity: 1; } input.hover::-moz-placeholder, input.enter::-moz-placeholder { color: #fff; opacity: 1; } input.hover:-ms-input-placeholder, input.enter:-ms-input-placeholder { color: #fff; opacity: 1; } input.hover::-ms-input-placeholder, input.enter::-ms-input-placeholder { color: #fff; opacity: 1; } input.hover::placeholder, input.enter::placeholder { color: #fff; opacity: 1; } *:not(input) { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } body { line-height: 1; font-size: 16px; color: #ffffff; position: relative; font-family: "SegoeUI", sans-serif; background: #1d1f20; padding: 0; margin: 0; overflow: hidden; position: fixed; width: 100%; height: 100%; left: 0; top: 0; -webkit-user-select: none !important; -moz-user-select: none !important; -ms-user-select: none !important; user-select: none !important; -webkit-touch-callout: none !important; } body.black--style { background: #000 !important; } @media screen and (max-width: 480px) { body.black--style .selectbox__content, body.black--style .modal__content, body.black--style .settings__content { background-color: #000 !important; } } img { vertical-align: middle; max-width: 100%; -o-object-fit: cover; object-fit: cover; } svg { width: 100%; height: 100%; } ul { list-style: none; padding: 0; } .mouse-layer { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 300; } .hide { display: none !important; } .selector { cursor: pointer; } body.no--mask .scroll--mask { -webkit-mask-image: unset !important; mask-image: unset !important; } body.no--animation * { -webkit-transition: none !important; -o-transition: none !important; -moz-transition: none !important; transition: none !important; } body.no--cursor { cursor: none; } /** Фиг знает, баг **/ body.no--animation .background canvas { -webkit-transition: opacity 0.1s !important; -o-transition: opacity 0.1s !important; -moz-transition: opacity 0.1s !important; transition: opacity 0.1s !important; } .endless-up { -webkit-animation: endless-up 0.2s ease; -moz-animation: endless-up 0.2s ease; -o-animation: endless-up 0.2s ease; animation: endless-up 0.2s ease; } .endless-down { -webkit-animation: endless-down 0.2s ease; -moz-animation: endless-down 0.2s ease; -o-animation: endless-down 0.2s ease; animation: endless-down 0.2s ease; } .normalization { position: absolute; top: 50%; right: 1.5em; padding: 0.4em; height: auto; background-color: rgba(0, 0, 0, 0.3); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; z-index: 60; opacity: 0; -webkit-transform: translateY(-50%) translateX(100%); -moz-transform: translateY(-50%) translateX(100%); -ms-transform: translateY(-50%) translateX(100%); -o-transform: translateY(-50%) translateX(100%); transform: translateY(-50%) translateX(100%); -webkit-transition: all 0.1s; -o-transition: all 0.1s; -moz-transition: all 0.1s; transition: all 0.1s; } .normalization--visible { opacity: 1; -webkit-transform: translateY(-50%) translateX(0); -moz-transform: translateY(-50%) translateX(0); -ms-transform: translateY(-50%) translateX(0); -o-transform: translateY(-50%) translateX(0); transform: translateY(-50%) translateX(0); } .text-markdow { line-height: 1.6; font-weight: 100; font-size: 1.15em; } .text-markdow > *:first-child { margin-top: 0; } .text-markdow h2, .text-markdow h3, .text-markdow h4, .text-markdow h5 { font-size: 1.4em; font-weight: 400; } .text-markdow--compressed-sides { padding-left: 1.5em; padding-right: 1.5em; } .content-loading { position: relative; padding: 5em 0; } .content-loading::after { content: ""; display: block; height: 3em; width: 3em; background: url(../img/loader.svg) no-repeat 50% 50%; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; position: absolute; top: 50%; left: 50%; margin-left: -1.5em; margin-top: -1.5em; } body.platform--browser .normalization { -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); } body.platform--apple .normalization, body.selectbox--open .normalization, body.keyboard-input--visible .normalization { display: none; } body.ambience--enable .wrap, body.ambience--enable .head, body:not(.glass--style).keyboard-input--visible .wrap, body:not(.glass--style).keyboard-input--visible .head { display: none; } .icon--blink:not(.focus).animate { background: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 40%, white 50%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 0) 100%); background: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 40%, white 50%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 0) 100%); background: -o-linear-gradient(45deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 40%, white 50%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 0) 100%); background: linear-gradient(45deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 40%, white 50%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 0) 100%); -webkit-background-size: 400% 400%; -moz-background-size: 400% 400%; -o-background-size: 400% 400%; background-size: 400% 400%; -webkit-animation: head-icon-blick 1s ease forwards; -moz-animation: head-icon-blick 1s ease forwards; -o-animation: head-icon-blick 1s ease forwards; animation: head-icon-blick 1s ease forwards; } .notice--icon.animate svg { -webkit-transform-origin: 50% 0; -moz-transform-origin: 50% 0; -ms-transform-origin: 50% 0; -o-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-animation: head-icon-notice 1s ease forwards; -moz-animation: head-icon-notice 1s ease forwards; -o-animation: head-icon-notice 1s ease forwards; animation: head-icon-notice 1s ease forwards; } .overhide { overflow: hidden; } .no-shrink { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } /* Фикс для orsay */ .online-prestige-watched__icon { width: 1.5em; height: 1.5em; } @-webkit-keyframes head-icon-blick { 0% { background-position: 0% 50%; } 100% { background-position: 100% 50%; } } @-moz-keyframes head-icon-blick { 0% { background-position: 0% 50%; } 100% { background-position: 100% 50%; } } @-o-keyframes head-icon-blick { 0% { background-position: 0% 50%; } 100% { background-position: 100% 50%; } } @keyframes head-icon-blick { 0% { background-position: 0% 50%; } 100% { background-position: 100% 50%; } } @-webkit-keyframes head-icon-notice { 0% { -webkit-transform: rotateZ(0); transform: rotateZ(0); } 10% { -webkit-transform: rotateZ(30deg); transform: rotateZ(30deg); } 20% { -webkit-transform: rotateZ(-30deg); transform: rotateZ(-30deg); } 30% { -webkit-transform: rotateZ(20deg); transform: rotateZ(20deg); } 40% { -webkit-transform: rotateZ(-20deg); transform: rotateZ(-20deg); } 50% { -webkit-transform: rotateZ(10deg); transform: rotateZ(10deg); } 60% { -webkit-transform: rotateZ(-10deg); transform: rotateZ(-10deg); } 70% { -webkit-transform: rotateZ(5deg); transform: rotateZ(5deg); } 80% { -webkit-transform: rotateZ(-5deg); transform: rotateZ(-5deg); } 90% { -webkit-transform: rotateZ(0); transform: rotateZ(0); } } @-moz-keyframes head-icon-notice { 0% { -moz-transform: rotateZ(0); transform: rotateZ(0); } 10% { -moz-transform: rotateZ(30deg); transform: rotateZ(30deg); } 20% { -moz-transform: rotateZ(-30deg); transform: rotateZ(-30deg); } 30% { -moz-transform: rotateZ(20deg); transform: rotateZ(20deg); } 40% { -moz-transform: rotateZ(-20deg); transform: rotateZ(-20deg); } 50% { -moz-transform: rotateZ(10deg); transform: rotateZ(10deg); } 60% { -moz-transform: rotateZ(-10deg); transform: rotateZ(-10deg); } 70% { -moz-transform: rotateZ(5deg); transform: rotateZ(5deg); } 80% { -moz-transform: rotateZ(-5deg); transform: rotateZ(-5deg); } 90% { -moz-transform: rotateZ(0); transform: rotateZ(0); } } @-o-keyframes head-icon-notice { 0% { -o-transform: rotateZ(0); transform: rotateZ(0); } 10% { -o-transform: rotateZ(30deg); transform: rotateZ(30deg); } 20% { -o-transform: rotateZ(-30deg); transform: rotateZ(-30deg); } 30% { -o-transform: rotateZ(20deg); transform: rotateZ(20deg); } 40% { -o-transform: rotateZ(-20deg); transform: rotateZ(-20deg); } 50% { -o-transform: rotateZ(10deg); transform: rotateZ(10deg); } 60% { -o-transform: rotateZ(-10deg); transform: rotateZ(-10deg); } 70% { -o-transform: rotateZ(5deg); transform: rotateZ(5deg); } 80% { -o-transform: rotateZ(-5deg); transform: rotateZ(-5deg); } 90% { -o-transform: rotateZ(0); transform: rotateZ(0); } } @keyframes head-icon-notice { 0% { -webkit-transform: rotateZ(0); -moz-transform: rotateZ(0); -o-transform: rotateZ(0); transform: rotateZ(0); } 10% { -webkit-transform: rotateZ(30deg); -moz-transform: rotateZ(30deg); -o-transform: rotateZ(30deg); transform: rotateZ(30deg); } 20% { -webkit-transform: rotateZ(-30deg); -moz-transform: rotateZ(-30deg); -o-transform: rotateZ(-30deg); transform: rotateZ(-30deg); } 30% { -webkit-transform: rotateZ(20deg); -moz-transform: rotateZ(20deg); -o-transform: rotateZ(20deg); transform: rotateZ(20deg); } 40% { -webkit-transform: rotateZ(-20deg); -moz-transform: rotateZ(-20deg); -o-transform: rotateZ(-20deg); transform: rotateZ(-20deg); } 50% { -webkit-transform: rotateZ(10deg); -moz-transform: rotateZ(10deg); -o-transform: rotateZ(10deg); transform: rotateZ(10deg); } 60% { -webkit-transform: rotateZ(-10deg); -moz-transform: rotateZ(-10deg); -o-transform: rotateZ(-10deg); transform: rotateZ(-10deg); } 70% { -webkit-transform: rotateZ(5deg); -moz-transform: rotateZ(5deg); -o-transform: rotateZ(5deg); transform: rotateZ(5deg); } 80% { -webkit-transform: rotateZ(-5deg); -moz-transform: rotateZ(-5deg); -o-transform: rotateZ(-5deg); transform: rotateZ(-5deg); } 90% { -webkit-transform: rotateZ(0); -moz-transform: rotateZ(0); -o-transform: rotateZ(0); transform: rotateZ(0); } } @-webkit-keyframes endless-up { 0% { -webkit-transform: translate3d(0, -5em, 0); transform: translate3d(0, -5em, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-moz-keyframes endless-up { 0% { -moz-transform: translate3d(0, -5em, 0); transform: translate3d(0, -5em, 0); } 100% { -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-o-keyframes endless-up { 0% { transform: translate3d(0, -5em, 0); } 100% { transform: translate3d(0, 0, 0); } } @keyframes endless-up { 0% { -webkit-transform: translate3d(0, -5em, 0); -moz-transform: translate3d(0, -5em, 0); transform: translate3d(0, -5em, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-webkit-keyframes endless-down { 0% { -webkit-transform: translate3d(0, 5em, 0); transform: translate3d(0, 5em, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-moz-keyframes endless-down { 0% { -moz-transform: translate3d(0, 5em, 0); transform: translate3d(0, 5em, 0); } 100% { -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-o-keyframes endless-down { 0% { transform: translate3d(0, 5em, 0); } 100% { transform: translate3d(0, 0, 0); } } @keyframes endless-down { 0% { -webkit-transform: translate3d(0, 5em, 0); -moz-transform: translate3d(0, 5em, 0); transform: translate3d(0, 5em, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-webkit-keyframes endless-left { 0% { -webkit-transform: translate3d(5em, 0, 0); transform: translate3d(5em, 0, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-moz-keyframes endless-left { 0% { -moz-transform: translate3d(5em, 0, 0); transform: translate3d(5em, 0, 0); } 100% { -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-o-keyframes endless-left { 0% { transform: translate3d(5em, 0, 0); } 100% { transform: translate3d(0, 0, 0); } } @keyframes endless-left { 0% { -webkit-transform: translate3d(5em, 0, 0); -moz-transform: translate3d(5em, 0, 0); transform: translate3d(5em, 0, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-webkit-keyframes endless-right { 0% { -webkit-transform: translate3d(-5em, 0, 0); transform: translate3d(-5em, 0, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-moz-keyframes endless-right { 0% { -moz-transform: translate3d(-5em, 0, 0); transform: translate3d(-5em, 0, 0); } 100% { -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-o-keyframes endless-right { 0% { transform: translate3d(-5em, 0, 0); } 100% { transform: translate3d(0, 0, 0); } } @keyframes endless-right { 0% { -webkit-transform: translate3d(-5em, 0, 0); -moz-transform: translate3d(-5em, 0, 0); transform: translate3d(-5em, 0, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-webkit-keyframes pulse { 0% { -webkit-transform: scale(1); transform: scale(1); } 20% { -webkit-transform: scale(1.3); transform: scale(1.3); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @-moz-keyframes pulse { 0% { -moz-transform: scale(1); transform: scale(1); } 20% { -moz-transform: scale(1.3); transform: scale(1.3); } 100% { -moz-transform: scale(1); transform: scale(1); } } @-o-keyframes pulse { 0% { -o-transform: scale(1); transform: scale(1); } 20% { -o-transform: scale(1.3); transform: scale(1.3); } 100% { -o-transform: scale(1); transform: scale(1); } } @keyframes pulse { 0% { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); transform: scale(1); } 20% { -webkit-transform: scale(1.3); -moz-transform: scale(1.3); -o-transform: scale(1.3); transform: scale(1.3); } 100% { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); transform: scale(1); } } .navigation-bar { position: fixed; left: 0; bottom: 0; right: 0; padding: 0 1.5em 2em 1.5em; z-index: 11; display: none; } .navigation-bar__body { -webkit-border-radius: 1.4em; -moz-border-radius: 1.4em; border-radius: 1.4em; background: #262829; padding: 1.2em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: space-around; -ms-flex-pack: distribute; justify-content: space-around; } .navigation-bar__item { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .navigation-bar__icon { width: 1.8em; height: 1.8em; margin: 0 auto; } .navigation-bar__label { font-size: 0.9em; margin-top: 0.9em; } body.true--mobile .navigation-bar { display: block; } body.true--mobile.orientation--landscape .navigation-bar { top: 0; left: auto; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; padding: 1.5em; padding-left: 0; } body.true--mobile.orientation--landscape .navigation-bar .navigation-bar__body { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } body.platform--apple .navigation-bar__body { -webkit-border-radius: 5em; -moz-border-radius: 5em; border-radius: 5em; } body.ambience--enable .navigation-bar { visibility: hidden; } .head-backward { padding: 1.5em; position: relative; margin-bottom: 1.8em; margin-top: -1.5em; display: none; } .head-backward__button { position: absolute; top: 0.4em; left: 0; padding: 1.5em; } .head-backward__button > svg { width: 1.7em !important; height: 1.7em !important; } .head-backward__title { font-size: 2em; line-height: 1.4; text-align: center; min-height: 1.4em; padding: 0 2em; } body.true--mobile .head-backward, body.mouse--controll .head-backward { display: block; } .wrap { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; position: relative; z-index: 10; } .wrap__left { width: 15em; padding-top: 4em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; margin-left: -15em; z-index: 2; position: relative; -webkit-transition: -webkit-transform 0.2s; transition: -webkit-transform 0.2s; -o-transition: -o-transform 0.2s; -moz-transition: transform 0.2s, -moz-transform 0.2s; transition: transform 0.2s; transition: transform 0.2s, -webkit-transform 0.2s, -moz-transform 0.2s, -o-transform 0.2s; will-change: transform; } .wrap__left .scroll--mask .scroll__content { padding: 1.9em 0; } .wrap__left--hidden { visibility: hidden; } .wrap__content { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; padding-top: 4em; -webkit-transition: -webkit-transform 0.2s; transition: -webkit-transform 0.2s; -o-transition: -o-transform 0.2s; -moz-transition: transform 0.2s, -moz-transform 0.2s; transition: transform 0.2s; transition: transform 0.2s, -webkit-transform 0.2s, -moz-transform 0.2s, -o-transform 0.2s; will-change: transform; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .wrap__content > * { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } body.menu--open:not(.light--version) .wrap__left { -webkit-transform: translate3d(15em, 0, 0); -moz-transform: translate3d(15em, 0, 0); transform: translate3d(15em, 0, 0); } body.menu--open:not(.light--version) .wrap__content { -webkit-transform: translate3d(15em, 0, 0); -moz-transform: translate3d(15em, 0, 0); transform: translate3d(15em, 0, 0); } body.menu--open:not(.light--version) .background { opacity: 0.5; } body.menu--always:not(.light--version) .wrap__left { width: 5em; margin-left: 0; visibility: visible; } body.menu--always:not(.light--version) .wrap__left .menu__text { display: none; } body.menu--always.menu--open:not(.light--version) .wrap__left { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } body.menu--always.menu--open:not(.light--version) .wrap__left > .scroll { width: 15em; } body.menu--always.menu--open:not(.light--version) .wrap__left .menu__text { display: block; } body.menu--always.menu--open:not(.light--version) .wrap__content { -webkit-transform: translate3d(10em, 0, 0); -moz-transform: translate3d(10em, 0, 0); transform: translate3d(10em, 0, 0); } body.light--version .wrap__left { visibility: visible; } @media screen and (max-width: 767px) { body.menu--open .wrap__left { -webkit-transform: translate3d(15em, 0, 0); -moz-transform: translate3d(15em, 0, 0); transform: translate3d(15em, 0, 0); } } @-webkit-keyframes marker-status-live { 0% { -webkit-box-shadow: 0 0 0 0 rgba(118, 230, 122, 0.7); box-shadow: 0 0 0 0 rgba(118, 230, 122, 0.7); background-color: #76e67a; } 70% { -webkit-box-shadow: 0 0 0 0.4em rgba(234, 78, 78, 0); box-shadow: 0 0 0 0.4em rgba(234, 78, 78, 0); background-color: rgba(255, 255, 255, 0.5); } 100% { -webkit-box-shadow: 0 0 0 0 rgba(234, 78, 78, 0); box-shadow: 0 0 0 0 rgba(234, 78, 78, 0); background-color: rgba(255, 255, 255, 0.4); } } @-moz-keyframes marker-status-live { 0% { -moz-box-shadow: 0 0 0 0 rgba(118, 230, 122, 0.7); box-shadow: 0 0 0 0 rgba(118, 230, 122, 0.7); background-color: #76e67a; } 70% { -moz-box-shadow: 0 0 0 0.4em rgba(234, 78, 78, 0); box-shadow: 0 0 0 0.4em rgba(234, 78, 78, 0); background-color: rgba(255, 255, 255, 0.5); } 100% { -moz-box-shadow: 0 0 0 0 rgba(234, 78, 78, 0); box-shadow: 0 0 0 0 rgba(234, 78, 78, 0); background-color: rgba(255, 255, 255, 0.4); } } @-o-keyframes marker-status-live { 0% { box-shadow: 0 0 0 0 rgba(118, 230, 122, 0.7); background-color: #76e67a; } 70% { box-shadow: 0 0 0 0.4em rgba(234, 78, 78, 0); background-color: rgba(255, 255, 255, 0.5); } 100% { box-shadow: 0 0 0 0 rgba(234, 78, 78, 0); background-color: rgba(255, 255, 255, 0.4); } } @keyframes marker-status-live { 0% { -webkit-box-shadow: 0 0 0 0 rgba(118, 230, 122, 0.7); -moz-box-shadow: 0 0 0 0 rgba(118, 230, 122, 0.7); box-shadow: 0 0 0 0 rgba(118, 230, 122, 0.7); background-color: #76e67a; } 70% { -webkit-box-shadow: 0 0 0 0.4em rgba(234, 78, 78, 0); -moz-box-shadow: 0 0 0 0.4em rgba(234, 78, 78, 0); box-shadow: 0 0 0 0.4em rgba(234, 78, 78, 0); background-color: rgba(255, 255, 255, 0.5); } 100% { -webkit-box-shadow: 0 0 0 0 rgba(234, 78, 78, 0); -moz-box-shadow: 0 0 0 0 rgba(234, 78, 78, 0); box-shadow: 0 0 0 0 rgba(234, 78, 78, 0); background-color: rgba(255, 255, 255, 0.4); } } @-webkit-keyframes marker-status-pass { 0% { background-color: #76e67a; } 65% { background-color: rgba(255, 255, 255, 0.4); } 100% { background-color: rgba(255, 255, 255, 0.4); } } @-moz-keyframes marker-status-pass { 0% { background-color: #76e67a; } 65% { background-color: rgba(255, 255, 255, 0.4); } 100% { background-color: rgba(255, 255, 255, 0.4); } } @-o-keyframes marker-status-pass { 0% { background-color: #76e67a; } 65% { background-color: rgba(255, 255, 255, 0.4); } 100% { background-color: rgba(255, 255, 255, 0.4); } } @keyframes marker-status-pass { 0% { background-color: #76e67a; } 65% { background-color: rgba(255, 255, 255, 0.4); } 100% { background-color: rgba(255, 255, 255, 0.4); } } .head { position: fixed; top: 0; left: 0; width: 100%; z-index: 15; } .head__body { padding: 0.5em 1.5em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .head__logo-icon { width: 2.7em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; margin-right: 1em; position: relative; } .head__logo-local { position: absolute; bottom: 0; right: 0; background-color: #EA4E4E; color: #fff; font-size: 0.7em; padding: 0.1em 0.3em; -webkit-border-radius: 0.2em; -moz-border-radius: 0.2em; border-radius: 0.2em; } .head__menu-icon, .head__backward { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; margin-right: 1em; display: none; cursor: pointer; } .head__menu-icon svg, .head__backward svg { width: 2.1em !important; height: 2.1em !important; } .head__backward { cursor: pointer; } .head__backward svg { height: 1.7em !important; } .head__split { background: url(../img/icons/split.svg) no-repeat 50% 50%; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; width: 1em; height: 1.3em; margin: 0 1em; opacity: 0.5; } .head__actions { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } @media screen and (max-width: 767px) { .head__actions + .head__split { display: none; } } .head__title { font-size: 1.7em; font-weight: 300; margin-right: auto; white-space: nowrap; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.4; } .head__action { width: 2.8em; height: 2.8em; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 0.6em; margin-left: 1.5em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .head__action.focus, .head__action.hover { background-color: #fff; color: #000; } .head__action.active { position: relative; } .head__action.active::after { content: ""; display: block; width: 0.5em; height: 0.5em; position: absolute; top: 0; right: 0; background-color: #EA4E4E; border: 0.15em solid #fff; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; } .head__action.open--profile { padding: 0.2em; } .head__action.open--profile img, .head__action.open--profile svg { -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; width: 2.4em !important; height: 2.4em !important; } @media screen and (max-width: 480px) { .head__action { margin-left: 0.5em; } } .head__time { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; white-space: nowrap; margin-top: -0.2em; } .head__time-now { font-weight: 600; font-size: 2em; line-height: 0.9; margin-right: 0.5em; } .head__time-date { font-size: 0.9em; line-height: 1; } .head__time-week { font-size: 0.9em; line-height: 1; } @media screen and (max-width: 767px) { .head__time { display: none; } } .head__markers { margin: 0 1em; } .head__markers-item { width: 0.32em; height: 0.32em; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; background: rgba(255, 255, 255, 0.4); position: relative; } .head__markers-item + .head__markers-item { margin-top: 0.25em; } .head__markers-item.status--live { background: #76e67a; } .head__markers-item.status--error { background: #ff6868; } .head__markers-item.status--pass { -webkit-animation: marker-status-pass 0.1s ease infinite; -moz-animation: marker-status-pass 0.1s ease infinite; -o-animation: marker-status-pass 0.1s ease infinite; animation: marker-status-pass 0.1s ease infinite; } .head__fps { position: relative; width: 11em; height: 2.8em; } .head__fps-graph { position: absolute; left: 0; top: 0; width: 11em; height: 2.8em; border: 1px solid #fff; } .head__fps-counter { position: absolute; right: 0.2em; bottom: 0.1em; font-size: 0.9em; font-weight: 300; color: #fff; } .head__navigator { -webkit-align-self: center; -ms-flex-item-align: center; align-self: center; } body.true--mobile .head__logo-icon, body.true--mobile .head__action.open--search, body.true--mobile .head__action.open--settings { display: none; } body.true--mobile .head__menu-icon { display: block; margin-left: 0.3em; margin-right: 1.2em; } body.true--mobile .head__action { margin-left: 1em; height: 3em; width: 3em; } body.true--mobile.orientation--landscape .head .head__body { padding-right: 10em; } body.mouse--controll:not(.true--mobile) .head__logo-icon { display: none; } body.mouse--controll:not(.true--mobile) .head__menu-icon { display: block; margin-right: 1.2em; } body.mouse--controll:not(.true--mobile) .head__backward { display: block; } .processing { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .processing > div { background-color: rgba(255, 255, 255, 0.3); -webkit-border-radius: 5em; -moz-border-radius: 5em; border-radius: 5em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; padding: 0.3em; } .processing__loader { background-image: url(../img/loader.svg); background-position: 50% 50%; background-repeat: no-repeat; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; width: 1.6em; height: 1.6em; } .processing__text { padding-left: 0.5em; padding-right: 0.3em; } .navigation-tabs { padding: 0.4em; background-color: rgba(0, 0, 0, 0.3); -webkit-border-radius: 0.5em; -moz-border-radius: 0.5em; border-radius: 0.5em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; margin-bottom: 2em; } .navigation-tabs__split { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; padding: 0.6em; opacity: 0.4; } .navigation-tabs__badge { background: #e75454; font-size: 0.8em; padding: 0.1em 0.3em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; margin-left: 0.6em; margin-top: -0.5em; font-weight: 600; color: #fff; } .navigation-tabs__button { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 0.6em; -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; position: relative; } .navigation-tabs__button.active { background-color: rgba(255, 255, 255, 0.35); } .navigation-tabs__button.focus { background-color: #fff; color: #000; } .activitys { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .activitys__slides { position: relative; width: 100%; } .activity { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; -webkit-transition: opacity 0.3s; -o-transition: opacity 0.3s; -moz-transition: opacity 0.3s; transition: opacity 0.3s; } .activity__body { position: relative; opacity: 1; -webkit-transition: opacity 0.3s; -o-transition: opacity 0.3s; -moz-transition: opacity 0.3s; transition: opacity 0.3s; } .activity__loader { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: none; background: url(../img/loader.svg) no-repeat 50% 50%; } .activity--load .activity__body, .activity--load .activity__refresh { opacity: 0; } .activity--load .activity__loader { display: block; } .activity--active { opacity: 1; z-index: 1; } .activity-wait-refresh { padding: 1.5em; line-height: 1.4; } .activity-wait-refresh__title { font-size: 1.8em; margin-bottom: 0.3em; } .activity-wait-refresh__text { font-size: 1.2em; margin-bottom: 1.7em; font-weight: 300; } .activity-wait-refresh__items { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; margin: 0 -0.5em; } .activity-wait-refresh__items > div { padding: 0.5em; width: 16.66%; } .activity-wait-refresh__items > div > div { -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; background-color: rgba(255, 255, 255, 0.5); } .activity-wait-refresh__items > div > div:nth-child(1) { padding-bottom: 150%; margin-bottom: 1em; } .activity-wait-refresh__items > div > div:nth-child(2) { height: 1.4em; width: 80%; margin-bottom: 1em; } .activity-wait-refresh__items > div > div:nth-child(3) { height: 1em; width: 20%; } .menu { width: 100%; } .menu__split { margin: 1em 1em; width: 2.3em; border-top: 2px solid rgba(255, 255, 255, 0.1); margin-left: 1.7em; } .menu__list { margin: 0; padding-left: 0.6em; } .menu__item { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; color: #fff; position: relative; padding: 0.9em 1.5em; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; } .menu__item + li { margin-top: 0.1em; } .menu__item.focus, .menu__item.traverse, .menu__item.hover { background-color: #fff; color: #000; } .menu__item.focus .menu__ico > img, .menu__item.traverse .menu__ico > img, .menu__item.hover .menu__ico > img { -webkit-filter: invert(1); filter: invert(1); } .menu__item.focus .menu__ico [stroke], .menu__item.traverse .menu__ico [stroke], .menu__item.hover .menu__ico [stroke] { stroke: #000; } .menu__item.focus .menu__ico path[fill], .menu__item.focus .menu__ico rect[fill], .menu__item.focus .menu__ico circle[fill], .menu__item.traverse .menu__ico path[fill], .menu__item.traverse .menu__ico rect[fill], .menu__item.traverse .menu__ico circle[fill], .menu__item.hover .menu__ico path[fill], .menu__item.hover .menu__ico rect[fill], .menu__item.hover .menu__ico circle[fill] { fill: #000; } .menu__item.traverse::before, .menu__item.traverse::after { position: absolute; left: 27%; margin-left: -0.5em; color: #fff; } .menu__item.traverse::before { content: "▲"; top: -1.1em; } .menu__item.traverse::after { content: "▼"; bottom: -1.1em; } .menu__ico { margin-right: 1.5em; width: 1.5em; height: 1.5em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .menu__ico > img { width: 1.5em; height: 1.5em; } .menu__text { font-size: 1.4em; font-weight: 300; line-height: 0.8; margin-top: -0.1em; } .menu:not(.editable) .menu__item.hidden { display: none; } .menu.editable .menu__item.hidden { opacity: 0.5; } .menu.editable .menu__item.focus:not(.traverse)::after { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 492.49284 492'%3E%3Cpath d='m304.140625 82.472656-270.976563 270.996094c-1.363281 1.367188-2.347656 3.09375-2.816406 4.949219l-30.035156 120.554687c-.898438 3.628906.167969 7.488282 2.816406 10.136719 2.003906 2.003906 4.734375 3.113281 7.527344 3.113281.855469 0 1.730469-.105468 2.582031-.320312l120.554688-30.039063c1.878906-.46875 3.585937-1.449219 4.949219-2.8125l271-270.976562zm0 0' fill='%23000000'%3E%3C/path%3E%3Cpath d='m476.875 45.523438-30.164062-30.164063c-20.160157-20.160156-55.296876-20.140625-75.433594 0l-36.949219 36.949219 105.597656 105.597656 36.949219-36.949219c10.070312-10.066406 15.617188-23.464843 15.617188-37.714843s-5.546876-27.648438-15.617188-37.71875zm0 0' fill='%23000000'%3E%3C/path%3E%3C/svg%3E"); position: absolute; right: 0.7em; top: 50%; color: #000; width: 1em; height: 1em; margin-top: -0.5em; } .menu-edit-list__item { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; padding: 0.3em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .menu-edit-list__item:nth-child(even) { background: rgba(255, 255, 255, 0.1); } .menu-edit-list__icon { width: 2.4em; height: 2.4em; margin-right: 1em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } .menu-edit-list__icon > svg, .menu-edit-list__icon > img { width: 1.4em !important; height: 1.4em !important; } .menu-edit-list__title { font-size: 1.3em; font-weight: 300; line-height: 1.2; -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } .menu-edit-list__move, .menu-edit-list__toggle { width: 2.4em; height: 2.4em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } .menu-edit-list__move svg, .menu-edit-list__toggle svg { width: 1em !important; height: 1em !important; } .menu-edit-list__move.focus, .menu-edit-list__toggle.focus { background: white; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; color: #000; } .menu-edit-list__toggle svg { width: 1.2em !important; height: 1.2em !important; } body.light--version .menu__item { -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; } .warning-box { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; background: rgba(0, 0, 0, 0.5); -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; padding: 1.5em; } .warning-box__icon { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; color: #FF6A56; } .warning-box__icon > * { width: 6em; height: 6em; } .warning-box__content { -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; line-height: 1.4; padding: 0 2em; } .warning-box__title { font-size: 1.4em; } .warning-box__descr { font-size: 1.2em; font-weight: 100; margin-top: 0.3em; } .warning-box__right { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .warning-box .simple-button { margin-right: 0; } .warning-box.selector.focus .simple-button { background-color: white; color: #000; } @media screen and (max-width: 480px) { .warning-box { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; text-align: center; } .warning-box__content { padding: 2em; } } .warning-box--full-adult { width: 70%; margin-top: 2em; } @media screen and (max-width: 767px) { .warning-box--full-adult { width: 100%; } } .ai-search-animation { position: relative; width: 12em; max-width: 100%; } .ai-search-animation__loupe { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 4.5em; height: 4.5em; -webkit-animation: ai-animation-loupe linear 1.5s infinite; -moz-animation: ai-animation-loupe linear 1.5s infinite; -o-animation: ai-animation-loupe linear 1.5s infinite; animation: ai-animation-loupe linear 1.5s infinite; } .ai-search-animation__loupe > svg { margin-top: 2em; margin-left: 2em; -webkit-animation: ai-animation-loupe-icon linear 1.5s infinite; -moz-animation: ai-animation-loupe-icon linear 1.5s infinite; -o-animation: ai-animation-loupe-icon linear 1.5s infinite; animation: ai-animation-loupe-icon linear 1.5s infinite; } .ai-search-animation__data { -webkit-animation: ai-animation-data ease 1.5s infinite; -moz-animation: ai-animation-data ease 1.5s infinite; -o-animation: ai-animation-data ease 1.5s infinite; animation: ai-animation-data ease 1.5s infinite; } .ai-box-scroll { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } @-webkit-keyframes ai-animation-data { 0% { opacity: 0; -webkit-transform: translate3d(70%, 0, 0); transform: translate3d(70%, 0, 0); } 40% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 100% { opacity: 0; -webkit-transform: translate3d(-70%, 0, 0); transform: translate3d(-70%, 0, 0); } } @-moz-keyframes ai-animation-data { 0% { opacity: 0; -moz-transform: translate3d(70%, 0, 0); transform: translate3d(70%, 0, 0); } 40% { opacity: 1; -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 60% { opacity: 1; -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 100% { opacity: 0; -moz-transform: translate3d(-70%, 0, 0); transform: translate3d(-70%, 0, 0); } } @-o-keyframes ai-animation-data { 0% { opacity: 0; transform: translate3d(70%, 0, 0); } 40% { opacity: 1; transform: translate3d(0, 0, 0); } 60% { opacity: 1; transform: translate3d(0, 0, 0); } 100% { opacity: 0; transform: translate3d(-70%, 0, 0); } } @keyframes ai-animation-data { 0% { opacity: 0; -webkit-transform: translate3d(70%, 0, 0); -moz-transform: translate3d(70%, 0, 0); transform: translate3d(70%, 0, 0); } 40% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 100% { opacity: 0; -webkit-transform: translate3d(-70%, 0, 0); -moz-transform: translate3d(-70%, 0, 0); transform: translate3d(-70%, 0, 0); } } @-webkit-keyframes ai-animation-loupe { 0% { -webkit-transform: translate(-30%, -50%) rotate(0deg); transform: translate(-30%, -50%) rotate(0deg); } 100% { -webkit-transform: translate(-30%, -50%) rotate(360deg); transform: translate(-30%, -50%) rotate(360deg); } } @-moz-keyframes ai-animation-loupe { 0% { -moz-transform: translate(-30%, -50%) rotate(0deg); transform: translate(-30%, -50%) rotate(0deg); } 100% { -moz-transform: translate(-30%, -50%) rotate(360deg); transform: translate(-30%, -50%) rotate(360deg); } } @-o-keyframes ai-animation-loupe { 0% { -o-transform: translate(-30%, -50%) rotate(0deg); transform: translate(-30%, -50%) rotate(0deg); } 100% { -o-transform: translate(-30%, -50%) rotate(360deg); transform: translate(-30%, -50%) rotate(360deg); } } @keyframes ai-animation-loupe { 0% { -webkit-transform: translate(-30%, -50%) rotate(0deg); -moz-transform: translate(-30%, -50%) rotate(0deg); -o-transform: translate(-30%, -50%) rotate(0deg); transform: translate(-30%, -50%) rotate(0deg); } 100% { -webkit-transform: translate(-30%, -50%) rotate(360deg); -moz-transform: translate(-30%, -50%) rotate(360deg); -o-transform: translate(-30%, -50%) rotate(360deg); transform: translate(-30%, -50%) rotate(360deg); } } @-webkit-keyframes ai-animation-loupe-icon { 0% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } 100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @-moz-keyframes ai-animation-loupe-icon { 0% { -moz-transform: rotate(360deg); transform: rotate(360deg); } 100% { -moz-transform: rotate(0deg); transform: rotate(0deg); } } @-o-keyframes ai-animation-loupe-icon { 0% { -o-transform: rotate(360deg); transform: rotate(360deg); } 100% { -o-transform: rotate(0deg); transform: rotate(0deg); } } @keyframes ai-animation-loupe-icon { 0% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } 100% { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } } .background { position: fixed; top: 0; left: 0; right: 0; bottom: 0; -webkit-transition: opacity 0.2s; -o-transition: opacity 0.2s; -moz-transition: opacity 0.2s; transition: opacity 0.2s; will-change: opacity; } .background__one, .background__two, .background__fade { position: fixed; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; -webkit-transition: opacity 0.5s; -o-transition: opacity 0.5s; -moz-transition: opacity 0.5s; transition: opacity 0.5s; will-change: opacity; } .background__one.visible, .background__two.visible, .background__fade.visible { opacity: 1; } .background__fade { opacity: 1; } .settings { position: fixed; top: 0; right: 0; z-index: 20; } .settings__layer { position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: none; } @media screen and (max-width: 480px) { .settings__layer { -webkit-backdrop-filter: blur(1em); backdrop-filter: blur(1em); } } .settings__content { position: fixed; top: 0; left: 100%; -webkit-transition: -webkit-transform 0.2s; transition: -webkit-transform 0.2s; -o-transition: -o-transform 0.2s; -moz-transition: transform 0.2s, -moz-transform 0.2s; transition: transform 0.2s; transition: transform 0.2s, -webkit-transform 0.2s, -moz-transform 0.2s, -o-transform 0.2s; background: #262829; width: 35%; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; will-change: transform; } @media screen and (max-width: 767px) { .settings__content { width: 50%; } } @media screen and (max-width: 580px) { .settings__content { width: 70%; } } @media screen and (max-width: 480px) { .settings__content { width: 100%; left: 0; top: unset; bottom: 0; height: auto !important; -webkit-transition: none; -o-transition: none; -moz-transition: none; transition: none; -webkit-transform: translate3d(0, 100%, 0); -moz-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); -webkit-border-top-left-radius: 2em; -moz-border-radius-topleft: 2em; border-top-left-radius: 2em; -webkit-border-top-right-radius: 2em; -moz-border-radius-topright: 2em; border-top-right-radius: 2em; } } .settings__head { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; padding: 2em; padding-bottom: 0; } .settings__body { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } @media screen and (max-width: 480px) { .settings__body { height: auto !important; font-size: 1.15em; } } .settings__body > * { width: 100%; } .settings__title { font-size: 2.2em; font-weight: 300; } .settings-folder { padding: 1.5em 2em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; will-change: transform; } .settings-folder__icon { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; margin-right: 1.5em; width: 2em; height: 2em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .settings-folder__icon > * { width: 2em; height: 2em; } .settings-folder__name { font-size: 1.4em; line-height: 1.3; } .settings-folder.focus { background-color: #353535; } .settings-param { padding: 1.5em 2em; position: relative; will-change: transform; } .settings-param__name { font-size: 1.3em; margin-bottom: 0.4em; } .settings-param__value { font-size: 1.1em; } .settings-param__descr { opacity: 0.5; margin-top: 1.2em; line-height: 1.2; } .settings-param__label { background-color: #fff !important; color: #232425 !important; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; padding: 0.2em 0.5em; display: inline-block; } .settings-param__status { position: absolute; left: 0.8em; top: 2em; width: 0.6em; height: 0.6em; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; } .settings-param__status.wait { background-color: #d6d6d6; } .settings-param__status.error { background-color: #f53f32; } .settings-param__status.active { background-color: #93d46d; } .settings-param.focus { background-color: #353535; } .settings-param--button .settings-param__name { margin-bottom: 0; } .settings-param-title { padding: 1.5em 2em; } .settings-param-title > span { font-size: 1.2em; font-weight: 600; color: #6f6f6f; } .settings-param-text { padding: 1.5em 2em; line-height: 1.4; } .settings-input { position: fixed; top: 0; left: 0; right: 0; bottom: 0; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; z-index: 21; } .settings-input__content { background-color: #232425; width: 65%; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; padding: 1.5em; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } @media screen and (max-width: 767px) { .settings-input__content { width: 100%; } } .settings-input__input { font-size: 2.1em; margin-bottom: 1em; min-height: 2.3em; border-bottom: 2px solid rgba(221, 221, 221, 0.06); padding: 0.6em 0; } .settings-input__input.filled::after { content: ""; display: inline-block; border-right: 0.15em solid #fff; height: 1em; margin: -1em 0; margin-left: 0.1em; -webkit-animation: animation-search-input-line 0.8s infinite; -moz-animation: animation-search-input-line 0.8s infinite; -o-animation: animation-search-input-line 0.8s infinite; animation: animation-search-input-line 0.8s infinite; } .settings-input__links { margin-top: 1em; background: rgba(221, 221, 221, 0.06); -webkit-border-radius: 10em; -moz-border-radius: 10em; border-radius: 10em; padding: 0.7em 1em; font-size: 1.2em; text-align: center; } @media screen and (max-width: 767px) { .settings-input__links { display: none; } } .settings-input__title { font-size: 2.2em; margin-bottom: 0.7em; } .settings-input--free { background-color: #232425; } .settings-input--free .settings-input__content { margin: 0 auto; } .settings-input--focus .settings-input__content { -webkit-box-pack: start; -webkit-justify-content: start; -moz-box-pack: start; -ms-flex-pack: start; justify-content: start; } .settings-input--align-top .settings-input__content { -webkit-box-pack: start; -webkit-justify-content: flex-start; -moz-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .settings-input--align-center .settings-input__content { -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } .settings-input--align-bottom .settings-input__content { -webkit-box-pack: end; -webkit-justify-content: flex-end; -moz-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } body.settings--open .settings__layer { display: block; } @media screen and (min-width: 480px) { body.settings--open .settings__content { -webkit-transform: translate3d(-100%, 0, 0); -moz-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } .discuss-rules { position: fixed; top: 0; right: 0; z-index: 22; background: #262829; width: 35%; height: 100%; } @media screen and (max-width: 767px) { .discuss-rules { display: none; } } .discuss-rules__body { padding: 1.5em; line-height: 1.6; } .discuss-rules__title { font-size: 1.8em; font-weight: 300; margin-bottom: 1.8em; } .discuss-rules__items > div { position: relative; font-size: 1.1em; margin-top: 1em; padding-left: 1em; } .discuss-rules__items > div::after { position: absolute; content: "●"; display: block; left: 0; top: 0.1em; font-size: 0.9em; } .discuss-rules-helper { font-size: 1.2em; color: #fff; line-height: 1.2; background: rgba(255, 255, 255, 0.1); padding: 0.7em; -webkit-border-radius: 0.6em; -moz-border-radius: 0.6em; border-radius: 0.6em; margin-top: 1.2em; padding-left: 2.4em; position: relative; } .discuss-rules-helper::before { content: "🚫"; color: #ff5757; margin-right: 0.5em; vertical-align: text-bottom; display: inline-block; position: absolute; left: 0.6em; } .scroll { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .scroll__content { padding: 1.5em 0; width: 100%; } @media screen and (max-width: 400px) { .scroll__content { padding: 1em 0; } } .scroll__body { -webkit-transition: -webkit-transform 0.3s; transition: -webkit-transform 0.3s; -o-transition: -o-transform 0.3s; -moz-transition: transform 0.3s, -moz-transform 0.3s; transition: transform 0.3s; transition: transform 0.3s, -webkit-transform 0.3s, -moz-transform 0.3s, -o-transform 0.3s; will-change: transform; } .scroll__body.notransition, .scroll__body.transition-reset { -webkit-transition: unset; -o-transition: unset; -moz-transition: unset; transition: unset; } .scroll--over { overflow: hidden; } .scroll--mask { -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(8%, white), color-stop(92%, white), to(rgba(255, 255, 255, 0))); -webkit-mask-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, white 8%, white 92%, rgba(255, 255, 255, 0) 100%); mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(8%, white), color-stop(92%, white), to(rgba(255, 255, 255, 0))); mask-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, white 8%, white 92%, rgba(255, 255, 255, 0) 100%); } .scroll--mask .scroll__content { padding: 2.5em 0; } @media screen and (max-width: 400px) { .scroll--mask .scroll__content { padding: 1.5em 0; } } .scroll--horizontal .scroll__content { padding: 0 1.5em; } .scroll--horizontal.scroll--mask { -webkit-mask-image: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), color-stop(8%, white), color-stop(92%, white), to(rgba(255, 255, 255, 0))); -webkit-mask-image: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, white 8%, white 92%, rgba(255, 255, 255, 0) 100%); mask-image: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), color-stop(8%, white), color-stop(92%, white), to(rgba(255, 255, 255, 0))); mask-image: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, white 8%, white 92%, rgba(255, 255, 255, 0) 100%); } .scroll--horizontal.scroll--mask .scroll__content { padding: 0 2.5em; } @media screen and (max-width: 400px) { .scroll--horizontal.scroll--mask .scroll__content { padding: 0 1.5em; } } .scroll--nopadding .scroll__content { padding: 0; } .scroll--horizontal-scroll { cursor: ew-resize; } .items-line { padding-bottom: 3em; } .items-line__head { padding: 0 1.5em; margin-bottom: 1.4em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .items-line__title { font-size: 1.6em; font-weight: 400; } .items-line__title .full-person__name { font-size: 1em; } .items-line__title .full-person__photo { width: 2em; height: 2em; } .items-line__title .full-person__photo svg { width: 1em !important; height: 1em !important; } .items-line__title .full-person--svg .full-person__photo { padding: 0.5em; } .items-line__more { margin-left: 2em; padding: 0.4em 1em; background: rgba(0, 0, 0, 0.3); -webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em; } .items-line__more.focus { background-color: #fff; color: #000; } .items-line--type-cards { min-height: 24em; } .items-line--type-collection { min-height: 15em; } .items-line--type-player-cards .items-line__head { padding-left: 0.8em; } .items-line--type-player-cards .items-line__body .scroll__content { padding: 0 1em; } .items-line--type-top .items-cards .card:nth-child(1), .items-line--type-top .items-cards .card:nth-child(2), .items-line--type-top .items-cards .card:nth-child(3) { margin-left: 6em; } .items-line--type-top .items-cards .card:nth-child(1)::before, .items-line--type-top .items-cards .card:nth-child(2)::before, .items-line--type-top .items-cards .card:nth-child(3)::before { content: "1"; position: absolute; top: 0.2em; right: 84%; font-size: 16em; color: #000000; font-weight: 900; -webkit-text-stroke: 0.01em #ffffff; z-index: -1; } .items-line--type-top .items-cards .card:nth-child(2) { margin-left: 4.5em; } .items-line--type-top .items-cards .card:nth-child(2)::before { content: "2"; right: 74%; } .items-line--type-top .items-cards .card:nth-child(3) { margin-left: 3.7em; } .items-line--type-top .items-cards .card:nth-child(3)::before { content: "3"; right: 82%; } .items-cards { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: self-start; -webkit-align-items: self-start; -moz-box-align: self-start; -ms-flex-align: self-start; align-items: self-start; } @media screen and (max-width: 767px) { .items-cards .card--collection { width: 19.7em; } } @media screen and (max-width: 767px) { .items-line .mapping--line .card--collection { width: 19.7em; } } .tag-count { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; background-color: rgba(0, 0, 0, 0.3); -webkit-border-radius: 0.6em; -moz-border-radius: 0.6em; border-radius: 0.6em; padding: 0.3em; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .tag-count__name { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; font-size: 1.2em; padding: 0.2em 0.7em; } .tag-count__count { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; background-color: #fff; color: #000; font-size: 1.3em; padding: 0.4em 0.6em; font-weight: 600; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; } .tag-count.focus { background-color: #fff; color: #000; } .reaction { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; padding: 0.5em; background-color: rgba(0, 0, 0, 0.3); -webkit-border-radius: 5em; -moz-border-radius: 5em; border-radius: 5em; } .reaction__icon { width: 1.6em; height: 1.6em; } .reaction__count { padding: 0 0.5em; font-weight: 600; font-size: 1.1em; } .reaction--voted { background-color: rgba(255, 255, 255, 0.3); } .register { background-color: rgba(0, 0, 0, 0.3); -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; padding: 1em; line-height: 1.4; position: relative; min-width: 9em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .register__name { font-size: 1.1em; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; max-width: 7em; white-space: nowrap; } .register__counter { font-size: 2em; font-weight: 600; } .register__limit { font-size: 0.6em; margin-left: 0.5em; opacity: 0.7; font-weight: 300; } .register.focus::after { content: ""; position: absolute; top: -0.5em; left: -0.5em; right: -0.5em; bottom: -0.5em; border: 0.3em solid #fff; -webkit-border-radius: 1.4em; -moz-border-radius: 1.4em; border-radius: 1.4em; z-index: -1; pointer-events: none; } .card { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 12.75em; position: relative; will-change: transform; } .card__img { -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; position: absolute; top: 0; left: 0; height: 100%; width: 100%; background-color: #3E3E3E; } .card__img-broken { position: absolute; top: 25%; left: 1em; right: 1em; word-break: break-all; line-height: 1.4; background: #3E3E3E; bottom: 20%; color: #ffffff82; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .card__view { margin-bottom: 1em; position: relative; padding-bottom: 150%; } .card__filter { position: absolute; left: 0; top: 0; width: 100%; height: 100%; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; mix-blend-mode: overlay; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; } .card__title { font-size: 1.3em; max-height: 3.6em; overflow: hidden; line-height: 1.2; -o-text-overflow: "."; text-overflow: "."; display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); transform: translateZ(0); } .card__age { font-size: 0.9em; margin-top: 0.6em; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); transform: translateZ(0); } .card__icons { position: absolute; top: 0.9em; left: 0; right: 0; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; z-index: 1; } .card__icons-inner { background: rgba(0, 0, 0, 0.5); -webkit-border-radius: 5em; -moz-border-radius: 5em; border-radius: 5em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } .card__marker { position: absolute; left: 0.4em; bottom: 0.4em; background: rgba(0, 0, 0, 0.5); -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; padding: 0.2em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; padding-right: 0.6em; z-index: 1; } .card__marker::before { content: ""; display: block; width: 1em; height: 1em; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; background-color: #fff; margin-right: 0.4em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .card__marker > span { font-size: 0.8em; overflow: hidden; max-width: 5em; -o-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; } .card__marker--look::before { background-color: #5DBFF5; } .card__marker--viewed::before { background-color: #FFD028; } .card__marker--scheduled::before { background-color: #fff; } .card__marker--thrown::before { background-color: #E54747; } .card__marker--continued::before { background-color: #be95ff; } .card__icon { width: 1.8em; height: 1.8em; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; -webkit-background-size: 60% 60%; -moz-background-size: 60%; -o-background-size: 60%; background-size: 60%; background-position: 50% 50%; background-repeat: no-repeat; } .card__icon.icon--book { background-image: url(../img/icons/menu/bookmark.svg); } .card__icon.icon--wath { background-image: url(../img/icons/menu/time.svg); } .card__icon.icon--like { background-image: url(../img/icons/menu/like.svg); } .card__icon.icon--history { background-image: url(../img/icons/settings/player.svg); } .card__promo { position: absolute; left: 0; bottom: 0; right: 0; padding: 3em 1.5em 1.5em 1.5em; background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.85))); background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.85) 100%); background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.85) 100%); background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.85) 100%); background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.85) 100%); -webkit-border-bottom-left-radius: 1em; -moz-border-radius-bottomleft: 1em; border-bottom-left-radius: 1em; -webkit-border-bottom-right-radius: 1em; -moz-border-radius-bottomright: 1em; border-bottom-right-radius: 1em; color: #fff; } .card__promo-title { font-size: 2em; line-height: 1.2; overflow: hidden; -o-text-overflow: "."; text-overflow: "."; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; } .card__promo-text { font-size: 1.3em; line-height: 1.2; margin-top: 1em; font-weight: 300; } .card__type { position: absolute; left: -0.8em; top: 1.4em; padding: 0.4em 0.4em; background: #fff; color: #000; font-size: 0.8em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; z-index: 1; } .card__new-episode { position: absolute; right: 0; left: 0; text-align: center; bottom: 0.8em; } .card__new-episode > div { background-color: #57F570; -webkit-border-radius: 5em; -moz-border-radius: 5em; border-radius: 5em; padding: 0.5em 1em; color: #17491C; display: inline-block; } .card__quality { position: absolute; left: -0.8em; bottom: 3em; padding: 0.4em 0.4em; background: #ffe216; color: #000; font-size: 0.8em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; text-transform: uppercase; z-index: 1; } .card__vote { position: absolute; right: 0.3em; bottom: 0.3em; background: rgba(0, 0, 0, 0.5); color: #fff; font-size: 1.3em; font-weight: 700; font-weight: 700; padding: 0.2em 0.5em; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; z-index: 1; } .card__textbox { position: absolute; top: 0; left: 0; right: 0; bottom: 0; padding: 1em; background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), color-stop(52%, rgba(0, 0, 0, 0.85)), to(rgba(0, 0, 0, 0.85))); background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.85) 52%, rgba(0, 0, 0, 0.85) 100%); background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.85) 52%, rgba(0, 0, 0, 0.85) 100%); background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.85) 52%, rgba(0, 0, 0, 0.85) 100%); background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.85) 52%, rgba(0, 0, 0, 0.85) 100%); -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; line-height: 1.5; -webkit-box-align: end; -webkit-align-items: flex-end; -moz-box-align: end; -ms-flex-align: end; align-items: flex-end; } .card__subscribe { background: rgba(0, 0, 0, 0.3); padding: 0.4em 0.7em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; margin-bottom: 0.6em; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; line-height: 1.4; } .card__subscribe-status { width: 0.6em; height: 0.6em; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; background-color: #ddd; margin-right: 0.6em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .card__subscribe-status.on { background-color: #9bce54; } .card__subscribe-status.off { background-color: #f05757; } .card__subscribe-position { font-weight: 700; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .card__subscribe-voice { margin-left: auto; padding-left: 1em; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .card.focus .card__view::after, .card.hover .card__view::after { content: ""; position: absolute; top: -0.5em; left: -0.5em; right: -0.5em; bottom: -0.5em; border: 0.3em solid #fff; -webkit-border-radius: 1.4em; -moz-border-radius: 1.4em; border-radius: 1.4em; z-index: -1; pointer-events: none; } .card.hover .card__view::after { border-color: rgba(255, 255, 255, 0.5); } .card--prefab { min-height: 19em; } .card--tv .card__type { background: #ff4242; color: #fff; } .card--disabled { opacity: 0.5; } .card--wide { width: 34.3em; } .card--wide .card__view { padding-bottom: 56%; } .card--wide .card-watched { top: 1em; left: 1.4em; right: 62%; bottom: auto; } .card--wide .card-watched__title { display: none; } .card--wide .card-watched__body { padding-top: 1em; } .card--wide .card-watched__item { margin: 0; } .card--wide .card-watched__item:not(:first-child) { display: none; } .card--collection { padding-bottom: 1em; width: 25%; } .card--collection .card__view { padding-bottom: 60%; } @media screen and (min-width: 767px) { body.size--bigger .card { font-size: 1.14em; } body.size--bigger .card--category { width: 20%; } body.size--bigger .card--explorer { width: 25%; } body.size--bigger .card--collection { width: 33.33%; } } body.platform--orsay .card__title, body.platform--netcast .card__title { -webkit-line-clamp: 1; line-clamp: 1; height: 1.4em; } .card-parser { padding: 0.75em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 14.6em; background-color: rgba(255, 255, 255, 0.2); -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; position: relative; } .card-parser__footer { margin-top: auto; padding-top: 1.5em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .card-parser__title { font-size: 1.4em; line-height: 1.3; } .card-parser__size { background-color: #fff; color: #000; -webkit-border-radius: 0.2em; -moz-border-radius: 0.2em; border-radius: 0.2em; font-size: 1.3em; padding: 0.3em 0.4em 0.4em; margin-left: auto; font-weight: 600; } .card-parser__details { color: rgba(255, 255, 255, 0.6); line-height: 1.4; } .card-parser__details span { color: #fff; font-weight: 700; } .card-parser.focus::after { content: ""; position: absolute; top: -0.5em; left: -0.5em; right: -0.5em; bottom: -0.5em; border: 0.3em solid #fff; -webkit-border-radius: 1.4em; -moz-border-radius: 1.4em; border-radius: 1.4em; z-index: -1; pointer-events: none; } .card-watched { position: absolute; top: auto; left: 1em; right: 1em; bottom: 3em; z-index: 1; background-color: rgba(0, 0, 0, 0.9); display: none; pointer-events: none; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; } .card-watched__inner { padding: 0 1em 1em 1em; } .card-watched__body { font-size: 0.8em; } .card-watched__item { margin-top: 1em; } .card-watched__item > span { display: block; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; } .card-watched__item:nth-child(1) { color: #fff; } .card-watched__item:nth-child(2) { color: #9f9f9f; } .card-watched__item:nth-child(3) { color: #6c6c6c; } .card-watched__item:nth-child(4) { color: #5e5e5e; } .card-watched__item:nth-child(5) { color: #4c4c4c; } .card-watched__item .time-line { margin-top: 0.5em; } .card.focus .card-watched { display: block; } .full-start { padding: 0 1.5em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding-bottom: 4em; position: relative; } .full-start__tags { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; padding-bottom: 2.5em; } .full-start__deta { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 1em; } .full-start__pg, .full-start__status { font-size: 1.2em; border: 1px solid #fff; -webkit-border-radius: 0.2em; -moz-border-radius: 0.2em; border-radius: 0.2em; padding: 0.3em; } .full-start__body { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; height: 30em; } @media screen and (max-width: 767px) { .full-start__body { height: auto; padding-bottom: 3em; } } @media screen and (max-width: 400px) { .full-start__body { display: block; } } @media screen and (max-width: 580px) { .full-start__body { padding-bottom: 0em; } } .full-start__right { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } @media screen and (max-width: 580px) { .full-start__right { -webkit-box-ordinal-group: 2; -webkit-order: 1; -moz-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } } .full-start__left { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; padding-left: 3em; overflow: hidden; } @media screen and (max-width: 580px) { .full-start__left { padding-left: 0em; overflow: inherit; } } @media screen and (max-width: 400px) { .full-start__left { margin-top: -17em; z-index: 1; position: relative; } } .full-start__background { position: absolute; left: 8em; width: 100%; z-index: -1; -webkit-mask-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADMAAAAjCAYAAAA5dzKxAAAD+UlEQVRYhcWZ61IaQRCFz7KAgBgvyfu/XSqVquSXGrlKfjDH/Wh7FowYp6prVthl+5u+TE/b7HY7nWE07/y8Sa53Pc/7vh1leETJtygyKNcDXFPiPf68Te7N4AigMm+LbCSt+2CyVWkwU5lW0lDSqMyUAe5pw/1+xn+3AZjv8rAltpJWRZ4k3ddgaivEVbcyF5LGZZ5AxkVGgBwHuSjie1rMmbUM8qy9NZYF5EnSzwyGKxLdgStupaeSZpLmki7L9ax8Z2Wp/ATfTcs1gWkh6uLxXMSWWRT5HmEy3yaElZsA4ErSlzJfFSBDEYhCMFrQbkmhhzheItBG0m1mGVpigFXzSl4GiJsiBJoDhm41SpT33OrQIoRg4GdQjaQtYTIf9cvGALmSdC3ptshdALK7TYPSYyhNd4pBT4C4yBGMbjjvczO6mF3CMDcF4qukbwXKMAaxO9F1mN36UngcNTBaqx3iS4tfwDQ6Vhfsc3XudQeo6wI6U5ehsnQbE0vfFnBsHGTbWszQMnYzxwxh6GbX6qzi9Eqlszj4V4h09MUMYZwAZupc7UsQBz1dK1P87BCEiS8iTM06huLewoDnHpGNsygfR4wZXxOEpQo3vSmEwd6q35U+bBwrNOPGaZeLe4djhGXIfx81V8iyW7QWhWn200aEeUtK7CvTP2VEmOykxgMQa6It/n7W4TnjU0bNzaLyLrk3ktZFfJZYl88N6Gfjb304JBMAVzZawRAr7c8QC+3PEC6/J+rSfG1nj8Xi2d3RMD5v74J4tQ1iiMciD+rOIwP8Fnd/gmTl/NmghgHEL6F70a0M8iDpXl2J75RsSxouljRxPyPkWWA4ai5mq/xRZw0Xk2151uArHRaa8bCVVcseZ6vNTnGxsfYWoaIEWWpf3hiW55ZagyOz2LthIpAzWFtghtpbhhulQWi5ubqzPSuE2iHt2AnTevWNRuibxQTwchTVfsVZATCwDeys9qjX538XqKNw7VqPTRJaK2tmZMMJZ5PVZhmQ44YrFTskTzqsoGvNDAPacuze0GpZRvTMfcu6rGLMNPjSD24rwLaKYR7VHQ9i78xCwKkO+2zs1mRNjgzGC7qT9DuLmbj6NRC74FpdvFghWoBVNq1AkClmPkv3i3uUF9M6vOqbUWEFmCxtO4NFV7EibCcxGRCMCxDdk41Bbsp8/6Lo8KMWM9xEXUTGTOcfG5Yfi31jukmtH51ZjgtTg4n730LSr6bnXxpxM4vNiTbMgyN/sxfHA59BY1MwdncyGHvGUtJ9H0wGFEuRmKqznT37LD4bU3/ce+J2QCDL8hhMDa5vjgXlKeVKtlBZPZdV9i9x/NZ/NkXyU1cigzilaq59l+rxF+5FNzBsTB9XAAAAAElFTkSuQmCC"); mask-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADMAAAAjCAYAAAA5dzKxAAAD+UlEQVRYhcWZ61IaQRCFz7KAgBgvyfu/XSqVquSXGrlKfjDH/Wh7FowYp6prVthl+5u+TE/b7HY7nWE07/y8Sa53Pc/7vh1leETJtygyKNcDXFPiPf68Te7N4AigMm+LbCSt+2CyVWkwU5lW0lDSqMyUAe5pw/1+xn+3AZjv8rAltpJWRZ4k3ddgaivEVbcyF5LGZZ5AxkVGgBwHuSjie1rMmbUM8qy9NZYF5EnSzwyGKxLdgStupaeSZpLmki7L9ax8Z2Wp/ATfTcs1gWkh6uLxXMSWWRT5HmEy3yaElZsA4ErSlzJfFSBDEYhCMFrQbkmhhzheItBG0m1mGVpigFXzSl4GiJsiBJoDhm41SpT33OrQIoRg4GdQjaQtYTIf9cvGALmSdC3ptshdALK7TYPSYyhNd4pBT4C4yBGMbjjvczO6mF3CMDcF4qukbwXKMAaxO9F1mN36UngcNTBaqx3iS4tfwDQ6Vhfsc3XudQeo6wI6U5ehsnQbE0vfFnBsHGTbWszQMnYzxwxh6GbX6qzi9Eqlszj4V4h09MUMYZwAZupc7UsQBz1dK1P87BCEiS8iTM06huLewoDnHpGNsygfR4wZXxOEpQo3vSmEwd6q35U+bBwrNOPGaZeLe4djhGXIfx81V8iyW7QWhWn200aEeUtK7CvTP2VEmOykxgMQa6It/n7W4TnjU0bNzaLyLrk3ktZFfJZYl88N6Gfjb304JBMAVzZawRAr7c8QC+3PEC6/J+rSfG1nj8Xi2d3RMD5v74J4tQ1iiMciD+rOIwP8Fnd/gmTl/NmghgHEL6F70a0M8iDpXl2J75RsSxouljRxPyPkWWA4ai5mq/xRZw0Xk2151uArHRaa8bCVVcseZ6vNTnGxsfYWoaIEWWpf3hiW55ZagyOz2LthIpAzWFtghtpbhhulQWi5ubqzPSuE2iHt2AnTevWNRuibxQTwchTVfsVZATCwDeys9qjX538XqKNw7VqPTRJaK2tmZMMJZ5PVZhmQ44YrFTskTzqsoGvNDAPacuze0GpZRvTMfcu6rGLMNPjSD24rwLaKYR7VHQ9i78xCwKkO+2zs1mRNjgzGC7qT9DuLmbj6NRC74FpdvFghWoBVNq1AkClmPkv3i3uUF9M6vOqbUWEFmCxtO4NFV7EibCcxGRCMCxDdk41Bbsp8/6Lo8KMWM9xEXUTGTOcfG5Yfi31jukmtH51ZjgtTg4n730LSr6bnXxpxM4vNiTbMgyN/sxfHA59BY1MwdncyGHvGUtJ9H0wGFEuRmKqznT37LD4bU3/ce+J2QCDL8hhMDa5vjgXlKeVKtlBZPZdV9i9x/NZ/NkXyU1cigzilaq59l+rxF+5FNzBsTB9XAAAAAElFTkSuQmCC"); -webkit-mask-size: 100% 100%; mask-size: 100% 100%; -webkit-mask-position: 100% 50%; mask-position: 100% 50%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; opacity: 0; -webkit-transition: opacity 0.5s ease-in-out; -o-transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; transition: opacity 0.5s ease-in-out; height: 108%; top: -6em; } .full-start__background.loaded { opacity: 0.5; } .full-start__background.dim { opacity: 0.2; } .full-start__poster { position: relative; } .full-start__poster.focus img { -webkit-box-shadow: 0 0 0 0.4em #fff; -moz-box-shadow: 0 0 0 0.4em #fff; box-shadow: 0 0 0 0.4em #fff; } .full-start__poster:before { display: none; } @media screen and (max-width: 480px) { .full-start__poster { font-size: 0.9em; } } @media screen and (max-width: 400px) { .full-start__poster { padding-bottom: 150%; margin: 0 -1.8em; margin-top: -2em; -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, color-stop(40%, white), to(rgba(255, 255, 255, 0))); -webkit-mask-image: -webkit-linear-gradient(top, white 40%, rgba(255, 255, 255, 0) 100%); mask-image: -webkit-gradient(linear, left top, left bottom, color-stop(40%, white), to(rgba(255, 255, 255, 0))); mask-image: linear-gradient(to bottom, white 40%, rgba(255, 255, 255, 0) 100%); } .full-start__poster.background--poster { padding-bottom: 100%; } } .full-start__img { position: relative; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; width: 17em; height: 25.5em; } @media screen and (max-width: 767px) { .full-start__img { font-size: 1.3em; } } @media screen and (max-width: 580px) { .full-start__img { font-size: 0.8em; } } @media screen and (max-width: 400px) { .full-start__img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } } .full-start__tag { -webkit-border-radius: 0.6em; -moz-border-radius: 0.6em; border-radius: 0.6em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; margin-right: 1em; font-size: 1.15em; white-space: nowrap; margin-bottom: 0.4em; background: rgba(0, 0, 0, 0.3); padding: 0.3em 0.5em 0.3em 0.3em; } .full-start__tag > img { width: 1em; height: 1em; margin-right: 0.8em; } .full-start__tag > div { overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; } .full-start__tag.tag--quality { -webkit-border-radius: 0.6em; -moz-border-radius: 0.6em; border-radius: 0.6em; background: #ffe216; color: #000; padding: 0.3em 0.4em; text-transform: uppercase; } .full-start__title { font-size: 3.2em; font-weight: 400; margin-bottom: 0.1em; max-width: 90%; max-height: 2.6em; overflow: hidden; line-height: 1.3; } @media screen and (max-width: 767px) { .full-start__title { font-size: 3em; } } .full-start__title-original { font-size: 2.2em; font-weight: 300; max-width: 80%; margin-bottom: 0.9em; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical; line-height: 1.3; } .full-start__descr { max-width: 80%; font-size: 1.3em; line-height: 1.4; font-weight: 300; height: 8em; margin-bottom: 1em; overflow: hidden; -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(white), color-stop(68%, white), to(rgba(255, 255, 255, 0))); -webkit-mask-image: -webkit-linear-gradient(top, white 0%, white 68%, rgba(255, 255, 255, 0) 100%); mask-image: -webkit-gradient(linear, left top, left bottom, from(white), color-stop(68%, white), to(rgba(255, 255, 255, 0))); mask-image: linear-gradient(to bottom, white 0%, white 68%, rgba(255, 255, 255, 0) 100%); } @media screen and (max-width: 767px) { .full-start__descr { display: none; } } .full-start__buttons { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .full-start__buttons-line { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } @media screen and (max-width: 480px) { .full-start__buttons-line { margin: -1.5em; } .full-start__buttons-line .full-start__buttons { padding: 0 1.5em; } } .full-start__buttons-scroll { margin-left: -1.5em; margin-right: -1.5em; } .full-start__button { margin-right: 0.75em; font-size: 1.3em; background-color: rgba(0, 0, 0, 0.3); padding: 0.3em 1em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; height: 2.8em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .full-start__button > svg { width: 1.5em; height: 1.5em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .full-start__button > svg + span { margin-left: 0.75em; margin-top: -0.2em; } .full-start__button.focus { background-color: #fff; color: #000; } .full-start__button.loading { position: relative; } .full-start__button.loading > svg { opacity: 0; } .full-start__button.loading:before { content: ""; position: absolute; top: 0.6em; left: 1em; width: 1.5em; height: 1.5em; background: url(../img/loader.svg) center center no-repeat; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; } .full-start__button.loading.focus:before { -webkit-filter: invert(1); filter: invert(1); } .full-start__ratings { margin-left: 2em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .full-start__rating { text-align: right; } .full-start__rating-name { text-transform: uppercase; font-size: 0.7em; } .full-start__rating-value { font-size: 3em; font-weight: 600; } .full-start__rating + div { margin-left: 2em; } .full-start__rate { background: rgba(0, 0, 0, 0.15); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; font-size: 1.45em; margin-right: 1em; } .full-start__rate > div:first-child { width: 1.8em; height: 1.5em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; background: rgba(0, 0, 0, 0.15); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } .full-start__rate > div:last-child { font-size: 0.7em; padding: 0 0.5em; } .full-start__icons { margin-left: auto; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .full-start .info__rate { margin: 0; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; font-size: 0.75em; margin-right: 1.5em; position: relative; } .full-start .info__rate > div { position: absolute; bottom: -0.6em; right: 0; background-color: #fff; color: #000; padding: 0.3em; -webkit-border-radius: 0.2em; -moz-border-radius: 0.2em; border-radius: 0.2em; } .full-start .info__icon { margin-left: 0; margin-right: 1em; } body.touch-device .full-start__background { left: 0; } body.card--no-cover .full-start__background { display: none; } body.touch-device.orientation--landscape .full-start__background { width: 113%; max-width: 113%; } @media screen and (min-width: 767px) { body.no--poster .full-start__right { display: none; } body.no--poster .full-start__left { padding-left: 0; overflow: inherit; } } .full-start-new { padding: 0 1.5em; padding-bottom: 4em; } .full-start-new__body { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -webkit-align-items: flex-end; -moz-box-align: end; -ms-flex-align: end; align-items: flex-end; } @media screen and (max-width: 580px) { .full-start-new__body { -webkit-box-align: start; -webkit-align-items: flex-start; -moz-box-align: start; -ms-flex-align: start; align-items: flex-start; } } @media screen and (max-width: 480px) { .full-start-new__body { display: block; } } .full-start-new__left { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 17em; margin-right: 3em; } @media screen and (max-width: 580px) { .full-start-new__left { width: 30%; } } @media screen and (max-width: 480px) { .full-start-new__left { width: auto; margin: -1.5em; } } .full-start-new__right { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } @media screen and (max-width: 580px) { .full-start-new__right { overflow: hidden; } } @media screen and (max-width: 480px) { .full-start-new__right { margin-left: -1.5em; margin-right: -1.5em; padding: 1.5em; margin-top: -14em; margin-top: -20vh; position: relative; z-index: 1; -webkit-border-top-left-radius: 2em; -moz-border-radius-topleft: 2em; border-top-left-radius: 2em; -webkit-border-top-right-radius: 2em; -moz-border-radius-topright: 2em; border-top-right-radius: 2em; background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.8)), to(rgba(0, 0, 0, 0))); background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%); background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%); background: -o-linear-gradient(top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%); background: linear-gradient(to bottom, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%); } } .full-start-new__poster { position: relative; padding-bottom: 150%; background-color: #3E3E3E; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; } .full-start-new__poster.loaded { background-color: transparent; } .full-start-new__poster.loaded img { opacity: 1; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .full-start-new__poster.with-out img { -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, color-stop(40%, white), to(rgba(255, 255, 255, 0))); -webkit-mask-image: -webkit-linear-gradient(top, white 40%, rgba(255, 255, 255, 0) 100%); mask-image: -webkit-gradient(linear, left top, left bottom, color-stop(40%, white), to(rgba(255, 255, 255, 0))); mask-image: linear-gradient(to bottom, white 40%, rgba(255, 255, 255, 0) 100%); } @media screen and (max-width: 480px) { .full-start-new__poster { padding-bottom: 100%; background: transparent; } .full-start-new__poster .card__type { left: 1.4em; top: 3.2em; font-size: 1em; } } .full-start-new__img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; opacity: 0; } @media screen and (max-width: 480px) { .full-start-new__img { -webkit-transform: translate3d(0, 2em, 0); -moz-transform: translate3d(0, 2em, 0); transform: translate3d(0, 2em, 0); -webkit-transition: opacity 0.2s, -webkit-transform 0.4s; transition: opacity 0.2s, -webkit-transform 0.4s; -o-transition: opacity 0.2s, -o-transform 0.4s; -moz-transition: opacity 0.2s, transform 0.4s, -moz-transform 0.4s; transition: opacity 0.2s, transform 0.4s; transition: opacity 0.2s, transform 0.4s, -webkit-transform 0.4s, -moz-transform 0.4s, -o-transform 0.4s; -webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em; } } .full-start-new__head { color: rgba(255, 255, 255, 0.6); font-size: 1.2em; } .full-start-new__head span { color: #fff; } @media screen and (max-width: 580px) { .full-start-new__head { margin-bottom: 0.5em; } } .full-start-new__title { font-size: 4em; font-weight: 600; margin-bottom: 0.2em; overflow: hidden; -o-text-overflow: "."; text-overflow: "."; display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical; margin-left: -0.03em; line-height: 1.3; } .full-start-new__title.twolines { -webkit-line-clamp: 2; line-clamp: 2; font-size: 3.5em; } @media screen and (max-width: 580px) { .full-start-new__title { font-size: 2.8em; } } @media screen and (max-width: 480px) { .full-start-new__title { -webkit-line-clamp: 3; line-clamp: 3; font-size: 2.6em; } } .full-start-new__tagline { font-size: 1.8em; line-height: 1.2; margin-bottom: 1em; margin-top: -0.3em; } @media screen and (max-width: 580px) { .full-start-new__tagline { font-size: 1.5em; } } .full-start-new__details { color: #fff; margin: -0.45em; margin-bottom: 1em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; min-height: 1.9em; font-size: 1.1em; } .full-start-new__details > * { margin: 0.45em; } @media screen and (max-width: 767px) { .full-start-new__details { width: auto; } } .full-start-new__reactions { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -0.5em; margin-bottom: 1em; min-height: 3.6em; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .full-start-new__reactions > div { padding: 0.5em; } .full-start-new__rate-line { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; margin-bottom: 2.2em; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .full-start-new__rate-line .full-start__rate { margin: 0; } .full-start-new__rate-line > * { margin-left: 0 !important; margin-right: 1em !important; } .full-start-new__rate-line .full-start__pg { font-size: 1.12em; } @media screen and (max-width: 580px) { .full-start-new__rate-line { font-size: 0.9em; } } @media screen and (max-width: 480px) { .full-start-new__rate-line { padding-top: 1.3em; } } .full-start-new__split { font-size: 0.7em; } .full-start-new__description { font-size: 1.2em; font-weight: 300; line-height: 1.5; overflow: hidden; -o-text-overflow: "."; text-overflow: "."; display: -webkit-box; -webkit-line-clamp: 4; line-clamp: 4; -webkit-box-orient: vertical; width: 70%; } .full-start-new__creator .full-person { font-size: 0.9em; } .full-start-new__creator .full-person__photo { width: 5em; height: 5em; } .full-start-new__buttons { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } @media screen and (max-width: 580px) { .full-start-new__buttons { overflow: auto; } } .full-start-new__buttons .full-start__button:not(.focus) span { display: none; } @media screen and (min-width: 767px) { body.no--poster .full-start-new__left { display: none; } } .full-descr { padding: 0 1.5em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } @media screen and (max-width: 580px) { .full-descr { display: block; } } .full-descr__text { font-size: 1.3em; line-height: 1.4; font-weight: 300; max-height: 70vh; overflow: hidden; max-height: 41vh; -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(white), color-stop(80%, white), to(rgba(255, 255, 255, 0))); -webkit-mask-image: -webkit-linear-gradient(top, white 0%, white 80%, rgba(255, 255, 255, 0) 100%); mask-image: -webkit-gradient(linear, left top, left bottom, from(white), color-stop(80%, white), to(rgba(255, 255, 255, 0))); mask-image: linear-gradient(to bottom, white 0%, white 80%, rgba(255, 255, 255, 0) 100%); width: 70%; } @media screen and (max-width: 991px) { .full-descr__text { width: 100%; } } .full-descr__left { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } .full-descr__right { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 30%; padding-left: 2.3em; } @media screen and (max-width: 580px) { .full-descr__right { width: 100%; padding-left: 0; padding-top: 2em; } } .full-descr__details { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -1em; } .full-descr__details > * { margin: 1em; } .full-descr__line { margin-top: 2em; } .full-descr__line-name { font-size: 1.2em; margin-bottom: 1em; } .full-descr__line-body { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -0.2em; } .full-descr__info-name { font-size: 1.2em; margin-bottom: 0.7em; } .full-descr__info-body { font-size: 1.3em; font-weight: 300; } .full-descr__tag { -webkit-border-radius: 0.6em; -moz-border-radius: 0.6em; border-radius: 0.6em; background-color: rgba(0, 0, 0, 0.3); padding: 0.4em 0.8em 0.5em 0.8em; font-size: 1.2em; margin: 0.2em; } .full-descr__tag.focus { background-color: #fff; color: #000; } .full-descr__tags { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -0.5em; margin-top: 1.5em; } @media screen and (max-width: 480px) { .full-descr__tags { font-size: 0.9em; } } .full-descr__tags > * { margin: 0.5em; } .full-person { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; padding-right: 1.7em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; font-size: 1.1em; } .full-person__photo { width: 7em; height: 7em; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; background-color: #fff; margin-right: 1em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-position: 50% 50%; overflow: hidden; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .full-person__photo > img { width: 100%; opacity: 0; } .full-person__name { font-size: 1.5em; } .full-person__role { font-size: 1.1em; margin-top: 0.7em; } .full-person.hover { background-color: rgba(255, 255, 255, 0.3); } .full-person.focus { background-color: #fff; color: #000; } .full-person--loaded .full-person__photo > img { opacity: 1; } .full-review { padding: 1.5em; background-color: rgba(0, 0, 0, 0.4); -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .full-review__text { font-size: 1.2em; line-height: 1.3; margin-bottom: 1.5em; overflow: hidden; -o-text-overflow: "."; text-overflow: "."; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; } .full-review__footer { font-size: 1.2em; margin-top: auto; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .full-review__user { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; margin-right: 2em; } .full-review__user-icon { width: 2em; height: 2em; margin-right: 1em; } .full-review__user-img { -webkit-transition: opacity 0.2s; -o-transition: opacity 0.2s; -moz-transition: opacity 0.2s; transition: opacity 0.2s; } .full-review__user-email { overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; max-width: 7em; line-height: 1.4; white-space: nowrap; } .full-review__user:not(.loaded) .full-review__user-icon { background: #494949; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; } .full-review__user:not(.loaded) .full-review__user-img { opacity: 0; } .full-review__like { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; margin-left: auto; } .full-review__like-icon { margin-right: 0.7em; } .full-review__like-icon svg { width: 1.1em !important; height: 1.2em !important; } .full-review.type--vertical { margin-bottom: 1.5em; min-width: unset; max-width: unset; } .full-review.type--vertical + .full-review { margin-left: 0; } .full-review.focus { background-color: #fff; color: #000; } .full-review.bad--comment { opacity: 0.5; } .full-review.bad--comment .full-review__like-icon { -webkit-transform: scaleY(-1) translateY(-0.2em); -moz-transform: scaleY(-1) translateY(-0.2em); -ms-transform: scaleY(-1) translateY(-0.2em); -o-transform: scaleY(-1) translateY(-0.2em); transform: scaleY(-1) translateY(-0.2em); } .full-review--full-text .full-review__text { -webkit-line-clamp: 12; line-clamp: 12; } .full-review-add { padding: 1.5em; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; border: dashed 2px #ddd; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; position: relative; min-height: 10em; } .full-review-add::before { content: ""; display: block; position: absolute; left: 50%; top: 50%; width: 2em; height: 2em; background: url(../img/icons/add.svg) no-repeat 50% 50%; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; margin-left: -1em; margin-top: -1em; } .full-review-add.focus::after { content: ""; position: absolute; left: -0.5em; top: -0.5em; right: -0.5em; bottom: -0.5em; border: 0.3em solid #fff; -webkit-border-radius: 1.4em; -moz-border-radius: 1.4em; border-radius: 1.4em; pointer-events: none; } .full-review-all { -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; min-width: 12em; } .full-review-all__text { font-size: 1.2em; } .full-review-all__count { font-size: 2em; margin-top: 0.5em; } .mapping--line > .full-review { min-width: 20em; max-width: 30em; } .mapping--line > .full-review-add { width: 12em; } .full-episode { position: relative; } .full-episode__img { padding-bottom: 57%; position: relative; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; background-color: rgba(0, 0, 0, 0.3); -webkit-transition: background-color 0.2s; -o-transition: background-color 0.2s; -moz-transition: background-color 0.2s; transition: background-color 0.2s; } .full-episode__img img { position: absolute; left: 0; right: 0; width: 100%; height: 100%; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; opacity: 0; -webkit-transition: opacity 0.2s; -o-transition: opacity 0.2s; -moz-transition: opacity 0.2s; transition: opacity 0.2s; } .full-episode__body { padding: 1em; position: absolute; top: 0; left: 0; bottom: 0; right: 0; display: none; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; background-color: rgba(0, 0, 0, 0.5); -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; -webkit-box-pack: end; -webkit-justify-content: flex-end; -moz-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .full-episode__name { white-space: nowrap; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; font-size: 1.3em; } .full-episode__date { font-size: 1em; margin-top: 0.6em; } .full-episode__num { font-size: 2em; margin-bottom: 0.7em; } .full-episode__viewed { position: absolute; top: 0.5em; right: 0.5em; display: none; } .full-episode__viewed > svg { width: 1.4em !important; height: 1.4em !important; } .full-episode.focus .full-episode__body { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .full-episode.focus::after { content: ""; position: absolute; left: -0.5em; top: -0.5em; right: -0.5em; bottom: -0.5em; border: 0.3em solid #fff; -webkit-border-radius: 1.4em; -moz-border-radius: 1.4em; border-radius: 1.4em; pointer-events: none; } .full-episode--loaded .full-episode__img { background: transparent; } .full-episode--loaded .full-episode__img img { opacity: 1; } .full-episode--viewed .full-episode__viewed { display: block; } .full-episode--small { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 15em; } .full-episode--next .full-episode__body { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; background-color: transparent; } .full-episode--next .full-episode__img { background-color: transparent; } .full-episode--next .full-episode__img img { opacity: 0; } .full-episode--next .full-episode__img:after { content: ""; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; border: 0.2em dashed rgba(255, 255, 255, 0.2); -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; } .full-episode--wath-all .full-episode__body { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } .full-episode--wath-all .full-episode__date, .full-episode--wath-all .full-episode__num { display: none; } .full-episode--wath-all .full-episode__name { text-align: center; } .full-episode--wath-all .full-episode__img { opacity: 0; } body.true--mobile .full-episode .full-episode__body { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } @media screen and (min-width: 767px) { body.size--bigger .full-episode--small { font-size: 1.14em; } } .card-episode { width: 19.65em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .card-episode__body { margin-bottom: 1em; } .card-episode__footer { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .card-episode__footer .card__imgbox { width: 33.3%; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; max-width: 4em; } .card-episode__footer .card__view { margin: 0; } .card-episode__footer .card__left { padding-left: 1em; padding-top: 0.6em; } .card-episode .full-episode__img--loaded { background-color: transparent; } .card-episode .full-episode__img--loaded img { opacity: 1; } .card-episode .full-episode__body { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .card-episode.focus .full-episode::after { content: ""; position: absolute; left: -0.5em; top: -0.5em; right: -0.5em; bottom: -0.5em; border: 0.3em solid #fff; -webkit-border-radius: 1.4em; -moz-border-radius: 1.4em; border-radius: 1.4em; pointer-events: none; } .player { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; z-index: 50; } .player.tv .player-panel__timeline, .player.tv .player-panel__center, .player.tv .player-panel__timeline + .player-panel__line, .player.tv .player-panel__timeline + .player-panel__iptv + .player-panel__line { display: none; } .player.tv .player-panel__line + .player-panel__line { margin-top: 0; } .player.tv .player-panel__right { margin-left: auto; } .player--ios .player-panel, .player--ios .player-info__line, .player--ios .player-info__values, .player--ios .player-info__error { display: none !important; } .player--loading > div:not(.player-info) { pointer-events: none; } body.selectbox--open .player .player-panel, body.selectbox--open .player .player-info { display: none; } body.keyboard-input--visible .player { display: none; } body.player--viewing #app { visibility: hidden; } .player:not(.player--panel-visible) .player-panel, .player:not(.player--panel-visible) .player-info, .player:not(.player--panel-visible) .player-footer { visibility: hidden; } video::-webkit-media-controls-panel-container { display: none !important; } .player-video__video { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; } .player-video__paused, .player-video__loader { position: fixed; left: 50%; top: 50%; width: 8em; height: 8em; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; padding: 2em; background-color: rgba(0, 0, 0, 0.5); margin-left: -4em; margin-top: -4em; } .player-video__loader { background-image: url(../img/loader.svg); background-repeat: no-repeat; background-position: 50% 50%; -webkit-background-size: 80% 80%; -moz-background-size: 80% 80%; -o-background-size: 80% 80%; background-size: 80% 80%; display: none; } .player-video__youtube { position: fixed; left: 0; right: 0; top: 0; bottom: 0; } .player-video__youtube iframe { pointer-events: none; position: fixed; left: 0; right: 0; width: 100%; height: 100%; border: 0; } .player-video__youtube-line-top, .player-video__youtube-line-bottom { position: fixed; left: 0; right: 0; height: 7em; background-color: #000; display: none; } .player-video__youtube-line-top { top: 0; } .player-video__youtube-line-bottom { bottom: 0; } .player-video__youtube-icon { width: 9em !important; height: 7em !important; margin-bottom: 1em; } .player-video__youtube-noplayed { position: fixed; left: 0; right: 0; top: 50%; text-align: center; font-size: 1.2em; padding: 0 2em; line-height: 1.5; -webkit-transform: translateY(-60%); -moz-transform: translateY(-60%); -ms-transform: translateY(-60%); -o-transform: translateY(-60%); transform: translateY(-60%); } .player-video__youtube-noplayed div { max-width: 30em; margin: 0 auto; } .player-video__youtube-needclick { position: fixed; left: 0; right: 0; top: 0; bottom: 0; background-color: #000; } .player-video__youtube-needclick > img { position: fixed; top: 0%; left: 0%; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; opacity: 0.3; } .player-video__youtube-needclick > div { position: fixed; left: 0; top: 0; right: 0; top: 50%; text-align: center; font-size: 1.2em; padding: 0 2em; line-height: 1.5; } .player-video__youtube.ended iframe { opacity: 0; } .player-video__subtitles { position: fixed; bottom: 0; left: 0; right: 0; margin: 1.5em; text-align: center; font-size: 2.5em; font-weight: 600; line-height: 1.25; -webkit-transition: -webkit-transform 0.2s; transition: -webkit-transform 0.2s; -o-transition: -o-transform 0.2s; -moz-transition: transform 0.2s, -moz-transform 0.2s; transition: transform 0.2s; transition: transform 0.2s, -webkit-transform 0.2s, -moz-transform 0.2s, -o-transform 0.2s; z-index: 2; pointer-events: none; } .player-video__subtitles.size--large { font-size: 3em; } .player-video__subtitles.size--small { font-size: 2em; } .player-video__subtitles.has--backdrop .player-video__subtitles-text { background: rgba(0, 0, 0, 0.55); } .player-video__subtitles.has--stroke { text-shadow: 0 2px 1px #000000, 0 -2px 1px #000000, -2px 1px 0 #000000, 2px 0px 1px #000000; } .player-video__subtitles.on-top { top: 0; } .player-video__backwork-icon, .player-video__forward-icon { position: fixed; top: 50%; font-size: 1.3em; display: none; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; margin-top: -0.5em; opacity: 0; text-shadow: 0 0 0.4em black; } .player-video__backwork-icon > i, .player-video__forward-icon > i { margin: 0 1em; } .player-video__backwork-icon.rewind, .player-video__forward-icon.rewind { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; opacity: 1; } .player-video__backwork-icon { left: 10%; } .player-video__backwork-icon.rewind > i { -webkit-animation: videoRewindBackwork 0.7s; -moz-animation: videoRewindBackwork 0.7s; -o-animation: videoRewindBackwork 0.7s; animation: videoRewindBackwork 0.7s; } .player-video__forward-icon { right: 10%; } .player-video__forward-icon.rewind > i { -webkit-animation: videoRewindForward 0.7s; -moz-animation: videoRewindForward 0.7s; -o-animation: videoRewindForward 0.7s; animation: videoRewindForward 0.7s; } .player-video__subtitles-text { display: inline-block; padding: 0.25em 0.5em; -webkit-border-radius: 0.25em; -moz-border-radius: 0.25em; border-radius: 0.25em; } .player-video__subtitles-text.bold { font-weight: 700; } .player-video__subtitles-text.italic { font-style: italic; } .player-video__subtitles-text.underline { text-decoration: underline; } .player-video__subtitles-text:empty { display: none; } .player-video__subs-advanced { position: fixed; pointer-events: none; z-index: 2; overflow: hidden; } .player-video__subs-advanced.hide { display: none; } .player-video__subs-advanced-canvas { display: block; width: 100%; height: 100%; } .player-video.video--load .player-video__loader { display: block; } .player-video__paused { background-color: rgba(0, 0, 0, 0.6); } .player.player--panel-visible .player-video__subtitles { -webkit-transform: translate3d(0, -3.6em, 0); -moz-transform: translate3d(0, -3.6em, 0); transform: translate3d(0, -3.6em, 0); } body.platform--browser .player-video__paused, body.platform--browser .player-video__loader, body.platform--nw .player-video__paused, body.platform--nw .player-video__loader, body.glass--style.platform--apple .player-video__paused, body.glass--style.platform--apple .player-video__loader, body.glass--style.platform--apple_tv .player-video__paused, body.glass--style.platform--apple_tv .player-video__loader, body.glass--style.platform--android .player-video__paused, body.glass--style.platform--android .player-video__loader { background-color: rgba(0, 0, 0, 0.3); -webkit-backdrop-filter: blur(1em); backdrop-filter: blur(1em); } @-webkit-keyframes videoRewindBackwork { 0% { opacity: 0; -webkit-transform: translateX(0px); transform: translateX(0px); } 100% { opacity: 1; -webkit-transform: translateX(-20px); transform: translateX(-20px); } } @-moz-keyframes videoRewindBackwork { 0% { opacity: 0; -moz-transform: translateX(0px); transform: translateX(0px); } 100% { opacity: 1; -moz-transform: translateX(-20px); transform: translateX(-20px); } } @-o-keyframes videoRewindBackwork { 0% { opacity: 0; -o-transform: translateX(0px); transform: translateX(0px); } 100% { opacity: 1; -o-transform: translateX(-20px); transform: translateX(-20px); } } @keyframes videoRewindBackwork { 0% { opacity: 0; -webkit-transform: translateX(0px); -moz-transform: translateX(0px); -o-transform: translateX(0px); transform: translateX(0px); } 100% { opacity: 1; -webkit-transform: translateX(-20px); -moz-transform: translateX(-20px); -o-transform: translateX(-20px); transform: translateX(-20px); } } @-webkit-keyframes videoRewindForward { 0% { opacity: 0; -webkit-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @-moz-keyframes videoRewindForward { 0% { opacity: 0; -moz-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 1; -moz-transform: translateX(0); transform: translateX(0); } } @-o-keyframes videoRewindForward { 0% { opacity: 0; -o-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 1; -o-transform: translateX(0); transform: translateX(0); } } @keyframes videoRewindForward { 0% { opacity: 0; -webkit-transform: translateX(-20px); -moz-transform: translateX(-20px); -o-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); -moz-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); } } body.true--mobile.orientation--portrait .player-video__paused { display: none; } .player-panel { position: fixed; left: 1.5em; bottom: 1.5em; right: 1.5em; width: 100%; background-color: rgba(0, 0, 0, 0.3); -webkit-transform: translateY(150%); -moz-transform: translateY(150%); -ms-transform: translateY(150%); -o-transform: translateY(150%); transform: translateY(150%); -webkit-transition: opacity 0.3s, -webkit-transform 0.3s; transition: opacity 0.3s, -webkit-transform 0.3s; -o-transition: opacity 0.3s, -o-transform 0.3s; -moz-transition: transform 0.3s, opacity 0.3s, -moz-transform 0.3s; transition: transform 0.3s, opacity 0.3s; transition: transform 0.3s, opacity 0.3s, -webkit-transform 0.3s, -moz-transform 0.3s, -o-transform 0.3s; width: auto; -webkit-border-radius: 0.5em; -moz-border-radius: 0.5em; border-radius: 0.5em; z-index: 10; } @media screen and (max-width: 480px) { .player-panel { right: 0; left: 0; bottom: 0; } } .player-panel.panel--visible { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); } .player-panel.panel--footer-open { -webkit-transform: translateY(-150%); -moz-transform: translateY(-150%); -ms-transform: translateY(-150%); -o-transform: translateY(-150%); transform: translateY(-150%); opacity: 0; } .player-panel__body { padding: 1.5em; position: relative; } .player-panel__timeline { position: relative; height: 0.4em; background-color: rgba(255, 255, 255, 0.1); -webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em; margin-bottom: 0.6em; } .player-panel__timeline.focus { -webkit-box-shadow: 0 0 0 0.1em #fff; -moz-box-shadow: 0 0 0 0.1em #fff; box-shadow: 0 0 0 0.1em #fff; } .player-panel__timeline.focus .player-panel__position > div:after { -webkit-transform: translateY(-50%) translateX(50%) scale(1.5) !important; -moz-transform: translateY(-50%) translateX(50%) scale(1.5) !important; -ms-transform: translateY(-50%) translateX(50%) scale(1.5) !important; -o-transform: translateY(-50%) translateX(50%) scale(1.5) !important; transform: translateY(-50%) translateX(50%) scale(1.5) !important; } .player-panel__timeline-segment { position: absolute; height: 100%; top: 0; -webkit-border-radius: 5em; -moz-border-radius: 5em; border-radius: 5em; } .player-panel__timeline-segment--ad { background-color: rgba(252, 198, 60, 0.5); } .player-panel__timeline-segment--skip { background-color: rgba(110, 219, 255, 0.5); } .player-panel__peding, .player-panel__position { position: absolute; top: 0; left: 0; height: 100%; -webkit-border-radius: 5em; -moz-border-radius: 5em; border-radius: 5em; } .player-panel__peding { background-color: rgba(255, 255, 255, 0.3); } .player-panel__position { background-color: #fff; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -webkit-justify-content: flex-end; -moz-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .player-panel__position > div { position: relative; } .player-panel__position > div:after { position: absolute; content: ""; display: block; width: 1em; height: 1em; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; background-color: #fff; top: 50%; right: 0; -webkit-transform: translateY(-50%) translateX(50%); -moz-transform: translateY(-50%) translateX(50%); -ms-transform: translateY(-50%) translateX(50%); -o-transform: translateY(-50%) translateX(50%); transform: translateY(-50%) translateX(50%); font-size: 0.8em; z-index: 1; } .player-panel__time { position: absolute; bottom: 100%; background: rgba(0, 0, 0, 0.3); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); margin-bottom: 0.5em; padding: 0.4em; } .player-panel__time-touch-zone { position: absolute; left: 0; bottom: -1.3em; right: 0; top: -1.8em; } .player-panel__line { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .player-panel__line + .player-panel__line { margin-top: 1em; } .player-panel__timeend { margin-left: auto; } .player-panel__left, .player-panel__right { width: 35%; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .player-panel__right { -webkit-box-pack: end; -webkit-justify-content: flex-end; -moz-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } @media screen and (max-width: 580px) { .player-panel__left { display: none; } } .player-panel__center { width: 30%; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } @media screen and (max-width: 580px) { .player-panel__center { margin-right: auto; width: 60%; -webkit-box-pack: start; -webkit-justify-content: start; -moz-box-pack: start; -ms-flex-pack: start; justify-content: start; } } .player-panel .button { width: 2em; height: 2em; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; -webkit-background-size: 45% 45%; -moz-background-size: 45%; -o-background-size: 45%; background-size: 45%; background-repeat: no-repeat; background-position: 50% 50%; padding: 0.4em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .player-panel .button.focus { background-color: #fff; color: #000; } .player-panel__right .button + .button, .player-panel__left .button + .button { margin-left: 1em; } .player-panel__playpause { font-size: 1.4em; margin: 0 1em; } .player-panel__playpause > div:first-child { display: none; } @media screen and (max-width: 580px) { .player-panel__playpause { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; margin-left: 0; } } .player-panel__filename { font-size: 1.7em; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; margin-bottom: 2em; } .player-panel__quality { width: auto !important; padding: 0.1em 0.5em !important; -webkit-border-radius: 0.2em !important; -moz-border-radius: 0.2em !important; border-radius: 0.2em !important; text-transform: uppercase; } .player-panel__tstart { margin-right: 1em; } .player-panel__tend { margin-left: 1em; } .player-panel__next, .player-panel__prev { padding: 0.55em !important; } @media screen and (max-width: 767px) { .player-panel__rprev, .player-panel__rnext { display: none !important; } } .player-panel__playlist { padding: 0.5em !important; } .player-panel__subs { padding: 0.45em !important; } .player-panel__settings { padding: 0.35em !important; } .player-panel__next-episode-name { -webkit-align-self: center; -ms-flex-item-align: center; align-self: center; white-space: nowrap; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; padding-left: 1em; } .player-panel__iptv { display: none; } .player-panel__volume { position: relative; } .player-panel__volume-drop { display: none; position: absolute; left: 50%; bottom: 100%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); padding: 0.3em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; -webkit-backdrop-filter: blur(1em); backdrop-filter: blur(1em); } .player-panel__volume-range { -webkit-appearance: slider-vertical; -moz-appearance: slider-vertical; appearance: slider-vertical; width: 0.5em; height: 8em; } .player-panel__volume:hover > div { display: block; } .player-panel.panel--paused .player-panel__playpause > div:first-child { display: block; } .player-panel.panel--paused .player-panel__playpause > div:last-child { display: none; } .player-panel.panel--norewind .player-panel__timeline, .player-panel.panel--norewind .player-panel__line-one { display: none; } .player-panel.panel--norewind .player-panel__line-two { margin-top: 0; } .player-panel-iptv { position: relative; height: 8em; } .player-panel-iptv__arrow-up, .player-panel-iptv__arrow-down, .player-panel-iptv__position { position: absolute; left: 18%; } @media screen and (max-width: 767px) { .player-panel-iptv__arrow-up, .player-panel-iptv__arrow-down, .player-panel-iptv__position { left: 25%; } } @media screen and (max-width: 480px) { .player-panel-iptv__arrow-up, .player-panel-iptv__arrow-down, .player-panel-iptv__position { display: none; } } .player-panel-iptv__arrow-up > svg, .player-panel-iptv__arrow-down > svg { width: 1.8em !important; height: 1.8em !important; } .player-panel-iptv__arrow-up { top: 0; } .player-panel-iptv__arrow-down { bottom: 0; } .player-panel-iptv__position { top: 50%; font-size: 2.5em; font-weight: 600; margin-left: -0.5em; margin-top: -0.5em; } .player-panel-iptv__channel > div { position: absolute; top: 0; left: 0; right: 0; height: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; opacity: 0; -webkit-transition: opacity 0.2s, -webkit-transform 0.2s; transition: opacity 0.2s, -webkit-transform 0.2s; -o-transition: opacity 0.2s, -o-transform 0.2s; -moz-transition: transform 0.2s, opacity 0.2s, -moz-transform 0.2s; transition: transform 0.2s, opacity 0.2s; transition: transform 0.2s, opacity 0.2s, -webkit-transform 0.2s, -moz-transform 0.2s, -o-transform 0.2s; will-change: transform, opacity; } .player-panel-iptv-item { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .player-panel-iptv-item__left { width: 27%; } .player-panel-iptv-item__left svg, .player-panel-iptv-item__left img { width: 45% !important; opacity: 0; -webkit-transition: opacity 0.2s; -o-transition: opacity 0.2s; -moz-transition: opacity 0.2s; transition: opacity 0.2s; } .player-panel-iptv-item__left svg.loaded, .player-panel-iptv-item__left img.loaded { opacity: 1; } @media screen and (max-width: 480px) { .player-panel-iptv-item__left svg, .player-panel-iptv-item__left img { width: 75% !important; } } .player-panel-iptv-item__left svg { height: 100% !important; } @media screen and (max-width: 767px) { .player-panel-iptv-item__left { width: 36%; } } .player-panel-iptv-item__body { width: 73%; line-height: 1.4; } @media screen and (max-width: 767px) { .player-panel-iptv-item__body { width: 64%; } } .player-panel-iptv-item__group { font-size: 1.2em; opacity: 0.5; margin-bottom: 0.3em; } .player-panel-iptv-item__name { font-size: 2.6em; font-weight: 900; } @media screen and (max-width: 580px) { .player-panel-iptv-item__name { font-size: 2em; } } @media screen and (max-width: 480px) { .player-panel-iptv-item__name { font-size: 1.6em; } } .player-panel-iptv-item__icons-item { display: inline-block; background-color: rgba(255, 255, 255, 0.2); -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; padding: 0.2em; margin-left: 0.5em; margin-top: -0.2em; vertical-align: middle; } .player-panel-iptv-item__icons-item svg, .player-panel-iptv-item__icons-item img { width: 0.5em !important; height: 0.5em !important; } .player-panel-iptv-item__prog { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; margin-top: 0.4em; height: 1.5em; font-size: 1.1em; } .player-panel-iptv-item__prog-load { font-size: 1.1em; opacity: 0.3; padding-top: 0.1em; } .player-panel-iptv-item__prog-item { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; position: relative; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .player-panel-iptv-item__prog-item span { opacity: 0.5; font-size: 1.2em; max-width: 17em; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; } .player-panel-iptv-item__prog-item + .player-panel-iptv-item__prog-item::before { content: "|"; display: inline-block; margin: 0 1em; opacity: 0.5; } @media screen and (max-width: 767px) { .player-panel-iptv-item__prog-item + .player-panel-iptv-item__prog-item { display: none; } } .player-panel-iptv-item__prog-item.watch span { opacity: 1; } .player-panel-iptv-item__prog-timeline { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; background-color: rgba(255, 255, 255, 0.2); margin-left: 1em; width: 9em; margin-top: 0.4em; } .player-panel-iptv-item__prog-timeline > div { height: 0.2em; background-color: #fff; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; min-height: 2px; } @media screen and (max-width: 580px) { .player-panel-iptv-item__prog-timeline { width: 4em; } } .player-panel { background-color: rgba(0, 0, 0, 0.6); } body.platform--browser .player-panel, body.platform--nw .player-panel, body.glass--style.platform--apple .player-panel, body.glass--style.platform--apple_tv .player-panel, body.glass--style.platform--android .player-panel { background-color: rgba(0, 0, 0, 0.3); -webkit-backdrop-filter: blur(1em); backdrop-filter: blur(1em); } body.true--mobile.orientation--portrait .player-panel__line:first-child { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; padding-bottom: 2.4em; margin: 0; } body.true--mobile.orientation--portrait .player-panel__line:last-child { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; padding-bottom: 2.4em; margin: 0; } body.true--mobile.orientation--portrait .player-panel__center { width: 100%; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; font-size: 1.8em; margin-bottom: 1em; } body.true--mobile.orientation--portrait .player-panel__tstart, body.true--mobile.orientation--portrait .player-panel__tend, body.true--mobile.orientation--portrait .player-panel__rnext, body.true--mobile.orientation--portrait .player-panel__rprev { display: none; } body.true--mobile.orientation--portrait .player-panel__playpause { margin: 0 1em; } body.true--mobile.orientation--portrait .player-panel__right { width: 100%; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; font-size: 1.2em; } body.true--mobile.orientation--portrait .player-panel__right > div + div { margin-left: 0; } body.true--mobile.orientation--portrait .player-panel__playlist { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } body.true--mobile.orientation--portrait .player-panel__timeline { font-size: 1.6em; } body.true--mobile.orientation--portrait .player-panel__center .player-panel__next, body.true--mobile.orientation--portrait .player-panel__center .player-panel__prev { display: -webkit-box !important; display: -webkit-flex !important; display: -moz-box !important; display: -ms-flexbox !important; display: flex !important; } body.true--mobile.orientation--portrait .player-panel__center .player-panel__prev { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } body.true--mobile.orientation--portrait .player-panel__left { display: none; } body.true--mobile.orientation--portrait .player-panel__quality { width: 2em !important; white-space: nowrap; } .player.youtube .player-video__loader, .player.youtube .player-panel__settings { display: none !important; } .player.iptv .player-panel__body > div { display: none; } .player.iptv .player-panel__body > .player-panel__iptv { display: block; } .player.player--loading .player-panel__peding, .player.player--loading .player-panel__position { display: none; } .player.player--loading .player-panel__timeline::after { content: ""; display: block; background-color: #fff; position: absolute; left: 0%; height: 100%; width: 20%; -webkit-border-radius: 5em; -moz-border-radius: 5em; border-radius: 5em; -webkit-animation-duration: 1s; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-name: scan; -moz-animation-name: scan; -o-animation-name: scan; animation-name: scan; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; -o-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-direction: alternate; -moz-animation-direction: alternate; -o-animation-direction: alternate; animation-direction: alternate; -webkit-animation-timing-function: linear; -moz-animation-timing-function: linear; -o-animation-timing-function: linear; animation-timing-function: linear; } .player-skip { position: absolute; right: 1.5em; bottom: 18%; z-index: 20; padding: 0.8em 1.6em; -webkit-border-radius: 0.4em; -moz-border-radius: 0.4em; border-radius: 0.4em; background-color: rgba(0, 0, 0, 0.6); color: #fff; font-size: 1.3em; font-weight: 600; -webkit-transition: bottom 0.3s, opacity 0.2s, -webkit-transform 0.2s; transition: bottom 0.3s, opacity 0.2s, -webkit-transform 0.2s; -o-transition: bottom 0.3s, opacity 0.2s, -o-transform 0.2s; -moz-transition: bottom 0.3s, opacity 0.2s, transform 0.2s, -moz-transform 0.2s; transition: bottom 0.3s, opacity 0.2s, transform 0.2s; transition: bottom 0.3s, opacity 0.2s, transform 0.2s, -webkit-transform 0.2s, -moz-transform 0.2s, -o-transform 0.2s; } .player-skip.hide { display: none; } .player-skip.focus { background-color: #fff; color: #000; -webkit-box-shadow: 0 0 0 0.1em #fff; -moz-box-shadow: 0 0 0 0.1em #fff; box-shadow: 0 0 0 0.1em #fff; } .player-skip--preview { opacity: 0.75; pointer-events: none; cursor: default; } .player--panel-visible .player-skip { bottom: 27%; } .player-info { position: fixed; top: 1.5em; left: 1.5em; right: 1.5em; background-color: rgba(0, 0, 0, 0.3); -webkit-transform: translateY(-150%); -moz-transform: translateY(-150%); -ms-transform: translateY(-150%); -o-transform: translateY(-150%); transform: translateY(-150%); -webkit-transition: opacity 0.3s, -webkit-transform 0.3s; transition: opacity 0.3s, -webkit-transform 0.3s; -o-transition: opacity 0.3s, -o-transform 0.3s; -moz-transition: transform 0.3s, opacity 0.3s, -moz-transform 0.3s; transition: transform 0.3s, opacity 0.3s; transition: transform 0.3s, opacity 0.3s, -webkit-transform 0.3s, -moz-transform 0.3s, -o-transform 0.3s; -webkit-border-radius: 0.5em; -moz-border-radius: 0.5em; border-radius: 0.5em; z-index: 10; } @media screen and (max-width: 480px) { .player-info { left: 0; right: 0; top: 0; } } .player-info__body { padding: 1.5em; } .player-info.info--visible { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); } .player-info__name { font-size: 1.5em; word-break: break-all; } .player-info__line { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .player-info__time { margin-left: auto; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; font-size: 1.5em; padding-left: 1em; } .player-info__error { margin-top: 1em; font-size: 1.2em; } .player-info__values { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; margin-top: 1.2em; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .player-info__values > div { margin-right: 1em; } .player-info__values > div span { font-size: 1.3em; font-weight: 300; } .player-info__values .value--size span { background: rgba(225, 255, 255, 0.18); padding: 0.1em 0.5em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; } .player-info__values .value--pieces { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; padding: 0.3em 0; } .player-info__values .value--pieces span { font-size: 1em; width: 0.8em; height: 0.8em; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; background-color: rgba(255, 255, 255, 0.1); display: block; } .player-info__values .value--pieces span.active { background-color: #fff; } .player-info__values .value--pieces span + span { margin-left: 0.5em; } .player-info__values .value--pieces span.red { background-color: #e17171; } .player-info__values .value--pieces span.green { background-color: #a5d15f; } .player-info__values .value--pieces span.yellow { background-color: #dfc154; } @media screen and (max-width: 400px) { .player-info__values .value--pieces { width: 100%; margin-top: 0.4em; } } .player-info { background-color: rgba(0, 0, 0, 0.6); } body.platform--browser .player-info, body.platform--nw .player-info, body.glass--style.platform--apple .player-info, body.glass--style.platform--apple_tv .player-info, body.glass--style.platform--android .player-info { background-color: rgba(0, 0, 0, 0.3); -webkit-backdrop-filter: blur(1em); backdrop-filter: blur(1em); } body.true--mobile .player-info__values, body.true--mobile .player-info__line { display: none; } body.true--mobile .player-info .head-backward { margin: 0; padding: 0; } body.true--mobile .player-info .head-backward__title { text-align: left; white-space: nowrap; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; } body.true--mobile .player-info .head-backward__button { left: -1.5em; top: -0.9em; } .player.iptv .player-info__name { display: none; } .player.iptv .player-info__line { position: relative; } .player.iptv .player-info__time { position: absolute; top: -0.15em; right: 0; } .player.iptv .player-info__values { margin-top: 0; } .player.player--loading .player-info__values { display: none; } body:not(.true--mobile).mouse--controll .player-info__body { padding-left: 5em; } body:not(.true--mobile).mouse--controll .player-info .head-backward { position: absolute; left: 0; top: 1.1em; } body:not(.true--mobile).mouse--controll .player-info .head-backward__title { display: none; } .player-footer { position: fixed; left: 1.5em; bottom: 1.5em; right: 1.5em; width: 100%; background-color: rgba(0, 0, 0, 0.3); -webkit-transform: translateY(150%); -moz-transform: translateY(150%); -ms-transform: translateY(150%); -o-transform: translateY(150%); transform: translateY(150%); -webkit-transition: opacity 0.3s, -webkit-transform 0.3s; transition: opacity 0.3s, -webkit-transform 0.3s; -o-transition: opacity 0.3s, -o-transform 0.3s; -moz-transition: transform 0.3s, opacity 0.3s, -moz-transform 0.3s; transition: transform 0.3s, opacity 0.3s; transition: transform 0.3s, opacity 0.3s, -webkit-transform 0.3s, -moz-transform 0.3s, -o-transform 0.3s; width: auto; -webkit-border-radius: 0.5em; -moz-border-radius: 0.5em; border-radius: 0.5em; z-index: 10; } @media screen and (max-width: 480px) { .player-footer { right: 0; left: 0; bottom: 0; } } .player-footer.open { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); } .player-footer__body { position: relative; } .player-footer__row { padding: 1.5em; } .player-footer__row .items-line { padding-bottom: 0 !important; } .player-footer__row .items-line__head { padding: 0; } .player-footer .card-watched__body .card-watched__item { display: none; } .player-footer .card-watched__body .card-watched__item:nth-child(1), .player-footer .card-watched__body .card-watched__item:nth-child(2) { display: block; } .player-footer-card { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; line-height: 1.4; } .player-footer-card__left { width: 7em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .player-footer-card__tags { margin-bottom: 0.7em; margin-top: 0.5em; } .player-footer-card__title { font-size: 1.8em; overflow: hidden; -o-text-overflow: "."; text-overflow: "."; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; } .player-footer-card__body { padding-left: 2em; -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } .player-footer-card__poster { position: relative; padding-bottom: 150%; } .player-footer-card__poster img { -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; position: absolute; top: 0; left: 0; height: 100%; width: 100%; } .player-footer-card__text { overflow: hidden; -o-text-overflow: "."; text-overflow: "."; display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; width: 70%; font-size: 1.1em; font-weight: 300; } .player-footer-card.notext .player-footer-card__text > * { display: block; background-color: rgba(255, 255, 255, 0.2); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; height: 0.8em; margin-top: 0.6em; } .player-footer-card.notext .player-footer-card__text > *:nth-child(1) { width: 80%; } .player-footer-card.notext .player-footer-card__text > *:nth-child(2) { width: 100%; } .player-footer-card.notext .player-footer-card__text > *:nth-child(3) { width: 60%; } .player-footer { background-color: rgba(0, 0, 0, 0.6); } body.platform--browser .player-footer, body.platform--nw .player-footer, body.glass--style.platform--apple .player-footer, body.glass--style.platform--apple_tv .player-footer, body.glass--style.platform--android .player-footer { background-color: rgba(0, 0, 0, 0.3); -webkit-backdrop-filter: blur(1em); backdrop-filter: blur(1em); } @media screen and (min-width: 767px) { .player-footer .card { margin-bottom: 0 !important; } body.size--bigger .player-footer .card--collection { font-size: 1em; } body.size--bigger .player-footer .card--collection { width: 25%; } } .selectbox { position: fixed; top: 0; right: 0; z-index: 55; } .selectbox__layer { position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: none; } @media screen and (max-width: 480px) { .selectbox__layer { -webkit-backdrop-filter: blur(1em); backdrop-filter: blur(1em); } } .selectbox__content { position: fixed; top: 0; left: 100%; -webkit-transition: -webkit-transform 0.2s; transition: -webkit-transform 0.2s; -o-transition: -o-transform 0.2s; -moz-transition: transform 0.2s, -moz-transform 0.2s; transition: transform 0.2s; transition: transform 0.2s, -webkit-transform 0.2s, -moz-transform 0.2s, -o-transform 0.2s; background: #262829; width: 35%; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; will-change: transform; } @media screen and (max-width: 767px) { .selectbox__content { width: 50%; } } @media screen and (max-width: 580px) { .selectbox__content { width: 70%; } } @media screen and (max-width: 480px) { .selectbox__content { width: 100%; left: 0; top: unset; bottom: 0; height: auto !important; -webkit-transition: none; -o-transition: none; -moz-transition: none; transition: none; -webkit-transform: translate3d(0, 100%, 0); -moz-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); -webkit-border-top-left-radius: 2em; -moz-border-radius-topleft: 2em; border-top-left-radius: 2em; -webkit-border-top-right-radius: 2em; -moz-border-radius-topright: 2em; border-top-right-radius: 2em; } } .selectbox__head { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; padding: 2em; padding-bottom: 0; } .selectbox__body { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } @media screen and (max-width: 480px) { .selectbox__body { height: auto !important; } } .selectbox__body > * { width: 100%; } .selectbox__title { font-size: 2.2em; font-weight: 300; } .selectbox__text { line-height: 1.6; padding: 1.5em 2em; } .selectbox__text > div { font-size: 1.2em; } .selectbox--fullsize .selectbox__content { width: 100%; } body.selectbox--open .selectbox__layer { display: block; } @media screen and (min-width: 480px) { body.selectbox--open .selectbox__content { -webkit-transform: translate3d(-100%, 0, 0); -moz-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } .selectbox-item { padding: 1.5em 2em; position: relative; will-change: transform; } .selectbox-item__title { font-size: 1.3em; line-height: 1.3; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; } .selectbox-item__title sub { vertical-align: super; margin-left: 0.7em; opacity: 0.5; font-size: 0.8em; } .selectbox-item__subtitle { font-size: 1.1em; margin-top: 0.4em; opacity: 0.7; line-height: 1.4; } .selectbox-item__checkbox { width: 1.4em; height: 1.4em; border: 0.2em solid rgba(255, 255, 255, 0.2); position: absolute; top: 1.7em; right: 2em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; } .selectbox-item__icon { margin-right: 1em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .selectbox-item__icon > * { width: 2.7em; height: 2.7em; } .selectbox-item__icon > *.size-youtube { width: 6.9em; height: 3.9em; } .selectbox-item__lock { position: absolute; top: 50%; right: 1.7em; opacity: 0.5; margin-top: -1.1em; opacity: 0.5; } .selectbox-item__lock > svg { width: 2em !important; height: 2em !important; } .selectbox-item--checkbox { padding-right: 4em; } .selectbox-item--checked .selectbox-item__checkbox { border-color: #fff; } .selectbox-item--checked .selectbox-item__checkbox::after { content: ""; display: block; width: 0.3em; height: 0.6em; border-right: 0.2em solid #fff; border-bottom: 0.2em solid #fff; position: absolute; top: 0em; right: 0.25em; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .selectbox-item--icon { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .selectbox-item.selected:not(.nomark), .selectbox-item.picked { padding-right: 4em; } .selectbox-item.selected:not(.nomark)::after, .selectbox-item.picked::after { content: ""; display: block; width: 0.6em; height: 1.2em; border-right: 0.2em solid #fff; border-bottom: 0.2em solid #fff; position: absolute; top: 50%; right: 2em; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); margin-top: -0.9em; } .selectbox-item.focus { background-color: #353535; } .youtube-player { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; z-index: 50; } .youtube-player > iframe { pointer-events: none; position: absolute; top: -60px; left: 0; width: 100%; height: -webkit-calc(100% + 120px); height: -moz-calc(100% + 120px); height: calc(100% + 120px); } .youtube-player__progress { position: absolute; bottom: 0; left: 0; height: 0.5em; background-color: #fff; } .birthday__poster { position: relative; padding-bottom: 65%; background: url("../img/loader.svg") no-repeat 50% 50%; } .birthday__img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; opacity: 0; -webkit-transition: opacity 0.2s; -o-transition: opacity 0.2s; -moz-transition: opacity 0.2s; transition: opacity 0.2s; } .birthday__text { line-height: 1.4; font-size: 1.1em; margin-top: 2em; } .birthday__text a { text-decoration: none; color: #D8C39A; } .birthday.loaded .birthday__img { opacity: 1; } .birthday.noload .birthday__poster { -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; background: #585858 url("../img/logo.svg") no-repeat 50% 50%; } .info { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; height: 10em; padding: 2em 1.5em; -webkit-box-align: start; -webkit-align-items: flex-start; -moz-box-align: start; -ms-flex-align: start; align-items: flex-start; padding-top: 1em; } .info__title { font-size: 3em; font-weight: 400; line-height: 1.2; white-space: nowrap; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; } .info__title-original { font-size: 1.8em; line-height: 1.3; } @media screen and (max-width: 580px) { .info__title-original { font-size: 1.4em; } } @media screen and (max-width: 580px) { .info__title { font-size: 2.5em; } } .info__left { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; overflow: hidden; } .info__right { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; padding-top: 1em; } @media screen and (max-width: 580px) { .info__right { display: none; } } .info__create { font-size: 1.2em; margin-top: 1em; } .info__rate { background-color: rgba(0, 0, 0, 0.3); -webkit-border-radius: 0.6em; -moz-border-radius: 0.6em; border-radius: 0.6em; padding: 0.6em 1em 1em 1em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; margin-right: 2em; margin-top: 0.2em; } .info__rate > span { font-size: 3.2em; font-weight: 700; line-height: 1.2; } @media screen and (max-width: 580px) { .info__rate { font-size: 0.9em; } } .info__footer { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; margin-top: 0.2em; } .info__vote { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; margin-right: 2em; } .info__vote > svg { width: 1.8em !important; height: 1.8em !important; margin-right: 1em; } .info__vote > span { font-size: 1.8em; font-weight: 600; line-height: 1.3; } .info__icon { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; margin-left: 1em; background-color: rgba(0, 0, 0, 0.3); background-position: 50% 50%; background-repeat: no-repeat; -webkit-background-size: 37% 37%; -moz-background-size: 37%; -o-background-size: 37%; background-size: 37%; position: relative; width: 4em; height: 4em; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } .info__icon > svg { width: 1.6em; height: 1.6em; } .info__icon.active::after { content: ""; display: block; position: absolute; top: -0.5em; right: -0.5em; width: 2em; height: 2em; background: #fff url(../img/icons/check_dark.svg) no-repeat 50% 50%; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; -webkit-background-size: 50% 50%; -moz-background-size: 50%; -o-background-size: 50%; background-size: 50%; } .info__icon.icon--book { background-image: url(../img/icons/menu/bookmark.svg); } .info__icon.icon--like { background-image: url(../img/icons/menu/like.svg); } .info__icon.icon--wath { background-image: url(../img/icons/menu/time.svg); } .info__icon.focus { -webkit-box-shadow: 0 0 0 0.3em #fff; -moz-box-shadow: 0 0 0 0.3em #fff; box-shadow: 0 0 0 0.3em #fff; } @media screen and (max-width: 767px) { .info { font-size: 0.85em; } } @media screen and (max-width: 580px) { .info { height: 8.6em; } } .card-more { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 12.75em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .card-more__box { -webkit-transition: border-color 0.2s, -webkit-transform 0.3s; transition: border-color 0.2s, -webkit-transform 0.3s; -o-transition: border-color 0.2s, -o-transform 0.3s; -moz-transition: transform 0.3s, border-color 0.2s, -moz-transform 0.3s; transition: transform 0.3s, border-color 0.2s; transition: transform 0.3s, border-color 0.2s, -webkit-transform 0.3s, -moz-transform 0.3s, -o-transform 0.3s; background: rgba(0, 0, 0, 0.3); -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; position: relative; } .card-more__title { position: absolute; top: 50%; left: 0; right: 0; text-align: center; font-size: 1.8em; font-weight: 300; margin-top: -0.7em; } .card-more.focus .card-more__box::after { content: ""; position: absolute; top: -0.5em; left: -0.5em; right: -0.5em; bottom: -0.5em; border: 0.3em solid #fff; -webkit-border-radius: 1.4em; -moz-border-radius: 1.4em; border-radius: 1.4em; z-index: -1; } .card-more--small-radius .card-more__box { -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; } .card-more--small-radius.focus .card-more__box::after { -webkit-border-radius: 0.7em; -moz-border-radius: 0.7em; border-radius: 0.7em; } .card-more--fixed-size { display: block; } @media screen and (min-width: 767px) { body.size--bigger .card-more { font-size: 1.14em; } } .loading-layer { position: fixed; left: 0; right: 0; bottom: 0; top: 0; z-index: 100; padding-top: 0.5em; padding-bottom: 1.5em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -webkit-align-items: flex-end; -moz-box-align: end; -ms-flex-align: end; align-items: flex-end; background: rgba(0, 0, 0, 0.3); } .loading-layer__box { -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; padding: 0.3em 1em; min-width: 10em; background-color: rgba(0, 0, 0, 0.8); margin: 0 auto; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding-right: 0.5em; } .loading-layer__text { font-size: 1.1em; margin-top: -0.2em; padding-right: 1em; } .loading-layer__ico { width: 1.9em; height: 1.9em; background: url(../img/loader.svg) no-repeat center; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; } .category-full { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; padding: 0 1em; } .category-full .card { margin-left: 0; padding-left: 0.5em; padding-right: 0.5em; } @media screen and (max-width: 480px) { .category-full .card { padding-left: 0.5em; padding-right: 0.5em; } } .category-full__more { text-align: center; padding: 2em; margin-top: 1.5em; width: 100%; } .category-full__more > span { font-size: 1.2em; } .category-full__more.focus { border-color: #fff; color: #000; } body.platform--orsay .category-full, body.platform--netcast .category-full { display: block; } body.platform--orsay .category-full .card, body.platform--netcast .category-full .card { float: left; } body.platform--orsay .category-full .card__title, body.platform--netcast .category-full .card__title { min-height: 3.6em; } body.platform--orsay .category-full:after, body.platform--netcast .category-full:after { display: block; content: ""; clear: both; } @-webkit-keyframes animation-search-input-line { 0% { opacity: 1; } 50% { opacity: 0; } 100% { opacity: 1; } } @-moz-keyframes animation-search-input-line { 0% { opacity: 1; } 50% { opacity: 0; } 100% { opacity: 1; } } @-o-keyframes animation-search-input-line { 0% { opacity: 1; } 50% { opacity: 0; } 100% { opacity: 1; } } @keyframes animation-search-input-line { 0% { opacity: 1; } 50% { opacity: 0; } 100% { opacity: 1; } } .search { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: transparent; z-index: 50; width: 100%; } .search .scroll--horizontal { padding-top: 0 !important; padding-bottom: 0.6em !important; } .search .scroll > .scroll__content > .scroll__body:after { display: none !important; } .search__input { font-size: 2em; margin-bottom: 0.7em; padding-left: 0.7em; } .search__input.filled::after { content: ""; display: inline-block; border-right: 0.15em solid #fff; height: 1em; margin: -1em 0; margin-left: 0.1em; -webkit-animation: animation-search-input-line 0.8s infinite; -moz-animation: animation-search-input-line 0.8s infinite; -o-animation: animation-search-input-line 0.8s infinite; animation: animation-search-input-line 0.8s infinite; } .search__keypad { padding: 0 1.5em; } .search__keypad .simple-keyboard { margin-bottom: 5px; } @media screen and (min-width: 991px) { .search__keypad .simple-keyboard .hg-button-MIC, .search__keypad .simple-keyboard .hg-button-LANG, .search__keypad .simple-keyboard .hg-button-SIM, .search__keypad .simple-keyboard .hg-button-BKSP { -webkit-box-flex: 0; -webkit-flex-grow: 0; -moz-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; min-width: 2.1em; } .search__keypad .simple-keyboard .hg-button-SPACE { -webkit-box-flex: 0; -webkit-flex-grow: 0; -moz-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; min-width: 7em; } } .search__history, .search__sources { margin-bottom: 0.6em; } .search__history .scroll__body, .search__sources .scroll__body { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .search__results .broadcast__text { margin-top: 2.6em; } .search__results-offset { padding-top: 1.5em; } .search .simple-keyboard-buttons { display: none; } .search-history-key { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; background-color: rgba(221, 221, 221, 0.06); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; padding: 0 1em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .search-history-key:before { content: ""; display: block; width: 1.3em; height: 1.3em; margin-right: 0.7em; background-image: url(../img/icons/menu/time.svg); -webkit-background-size: 100% 100%; -moz-background-size: 100%; -o-background-size: 100%; background-size: 100%; background-position: center; background-repeat: no-repeat; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .search-history-key > div { font-size: 1.6em; padding: 0.5em; padding-top: 0.2em; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; line-height: 1.2; -webkit-transition: background-color 0.3s; -o-transition: background-color 0.3s; -moz-transition: background-color 0.3s; transition: background-color 0.3s; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .search-history-key.focus { background: rgba(221, 221, 221, 0.3); } .search-history-key + div { margin-left: 5px; } @media screen and (max-width: 580px) { .search-history-key { font-size: 0.8em; } } .search-history-empty { font-size: 1.3em; color: rgba(255, 255, 255, 0.6); line-height: 1.4; } .search-looking { padding-left: 1.5em; } .search-looking__text { margin-top: 3.3em; font-size: 1.3em; color: rgba(255, 255, 255, 0.6); line-height: 1.6; max-width: 50%; } @media screen and (max-width: 580px) { .search-looking__text { max-width: 100%; } } .search-source { font-size: 1.3em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; padding: 0.2em 0.8em; background: rgba(221, 221, 221, 0.06); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; opacity: 0.5; } .search-source__tab { padding: 0.4em 0 0.5em; white-space: nowrap; } .search-source__count { background-color: rgba(0, 0, 0, 0.6); margin-left: 0.5em; -webkit-border-radius: 5em; -moz-border-radius: 5em; border-radius: 5em; font-size: 0.8em; padding: 0.1em 0.2em 0.2em; min-width: 1.3em; text-align: center; font-weight: 700; color: #fff; } .search-source--loading .search-source__count { background-image: url(../img/loader.svg); background-repeat: no-repeat; background-position: center; -webkit-background-size: 1.2em 1.2em; -moz-background-size: 1.2em; -o-background-size: 1.2em; background-size: 1.2em; } .search-source.active { opacity: 1; background-color: #fff; color: #000; } .search-source.focus { background: rgba(221, 221, 221, 0.3); opacity: 1; color: #fff; } .search-source + .search-source { margin-left: 0.6em; } body.touch-device .search .hg-button { min-width: 1em; } body.touch-device .search .search__results .scroll__content { padding-top: 0.5em; } body.true--mobile .search .simple-keyboard input { background-color: rgba(221, 221, 221, 0.06); -webkit-border-radius: 0.5em; -moz-border-radius: 0.5em; border-radius: 0.5em; padding-left: 1.3em; height: 2.7em; } .simple-keyboard { background: transparent; padding: 0; font-family: inherit; color: #9e9e9e; } .simple-keyboard .hg-row { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .simple-keyboard .hg-row .hg-button-container { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .simple-keyboard .hg-layout-numeric .hg-button { -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } .simple-keyboard .hg-button { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; border: 0; font-size: 2em; height: auto; width: auto; line-height: 1.2; background: rgba(221, 221, 221, 0.06); color: #fff; } .simple-keyboard .hg-button.hg-activeButton, .simple-keyboard .hg-button.focus, .simple-keyboard .hg-button:hover { background: rgba(221, 221, 221, 0.3); color: #fff; } @media screen and (max-width: 580px) { .simple-keyboard .hg-button { font-size: 1.5em; padding: 5px 0; } } .simple-keyboard .hg-button[data-skbtn="{BKSP}"]:after, .simple-keyboard .hg-button[data-skbtn="{ENTER}"]:after, .simple-keyboard .hg-button[data-skbtn="{SHIFT}"]:after, .simple-keyboard .hg-button[data-skbtn="{LANG}"]:after, .simple-keyboard .hg-button[data-skbtn="{SPACE}"]:after { content: ""; display: block; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; background-repeat: no-repeat; background-position: 50% 50%; height: 1em; width: 1em; } .simple-keyboard .hg-button[data-skbtn="{BKSP}"]:after { background-image: url(../img/icons/keyboard/bksp.svg); } .simple-keyboard .hg-button[data-skbtn="{SIM}"]:after { background-image: url(../img/icons/keyboard/sym.svg); width: 1.2em; } .simple-keyboard .hg-button[data-skbtn="{ENTER}"]:after { background-image: url(../img/icons/keyboard/enter.svg); } .simple-keyboard .hg-button[data-skbtn="{SHIFT}"]:after { background-image: url(../img/icons/keyboard/up.svg); -webkit-background-size: 80% 80%; -moz-background-size: 80%; -o-background-size: 80%; background-size: 80%; } .simple-keyboard .hg-button[data-skbtn="{SPACE}"]:after { background-image: url(../img/icons/keyboard/space.svg); width: 1.4em; margin-top: 0.4em; height: 0.6em; } .simple-keyboard .hg-button[data-skbtn="{LANG}"]:after { background-image: url(../img/icons/keyboard/lang.svg); width: 0.9em; } .simple-keyboard .hg-button[data-skbtn="{BKSP}"] span, .simple-keyboard .hg-button[data-skbtn="{ENTER}"] span, .simple-keyboard .hg-button[data-skbtn="{SHIFT}"] span, .simple-keyboard .hg-button[data-skbtn="{LANG}"] span, .simple-keyboard .hg-button[data-skbtn="{SPACE}"] span { width: 0; height: 0; display: block; } .simple-keyboard[shifted=true] .hg-button[data-skbtn="{SHIFT}"] { -webkit-transform: scaleY(-1); -moz-transform: scaleY(-1); -ms-transform: scaleY(-1); -o-transform: scaleY(-1); transform: scaleY(-1); } .simple-keyboard .hg-button[data-skbtn="{MIC}"] { color: #fff; } .simple-keyboard .hg-button[data-skbtn="{MIC}"] svg { width: 0.9em; height: 1em; } .simple-keyboard .hg-button svg { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .simple-keyboard-input { background-color: transparent; font-size: 1.6em; height: 2.1em; width: 100%; border: 0; padding: 0; color: #fff; font-family: "SegoeUI", sans-serif; } .simple-keyboard-input::-webkit-input-placeholder { color: rgba(255, 255, 255, 0.5); } .simple-keyboard-input:-moz-placeholder { color: rgba(255, 255, 255, 0.5); } .simple-keyboard-input::-moz-placeholder { color: rgba(255, 255, 255, 0.5); } .simple-keyboard-input:-ms-input-placeholder { color: rgba(255, 255, 255, 0.5); } .simple-keyboard-input::-ms-input-placeholder { color: rgba(255, 255, 255, 0.5); } .simple-keyboard-input::placeholder { color: rgba(255, 255, 255, 0.5); } @media screen and (max-width: 480px) { .simple-keyboard-input { font-size: 1.5em; } } .simple-keyboard-buttons { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; padding-top: 1.5em; font-size: 1.1em; } .simple-keyboard-buttons > div + div { margin-left: 1em; } .simple-keyboard-buttons__enter { font-size: 1.2em; padding: 0.7em; background: rgba(255, 255, 255, 0.12); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; color: #fff; } .simple-keyboard-buttons__cancel { padding: 0.7em; font-size: 1.2em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; } .simple-keyboard-buttons__enter, .simple-keyboard-buttons__cancel { cursor: pointer; } .simple-keyboard-buttons__enter:hover, .simple-keyboard-buttons__cancel:hover { background-color: #fff; color: #000; } .simple-keyboard-mic { width: 2.8em; height: 2.8em; margin-right: 1em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .simple-keyboard-mic > svg { width: 1.7em; height: 1.7em; } .simple-keyboard-mic.focus { background: #ffffff; color: #0e0e0e; } .simple-keyboard-mic.record { background: #ffffff; color: red; } .simple-keyboard--with-mic { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; color: #fff; position: relative; } .simple-keyboard--with-mic .simple-keyboard-buttons { position: absolute; top: 100%; left: 3.4em; } .simple-keyboard--with-textarea { -webkit-box-align: start; -webkit-align-items: flex-start; -moz-box-align: start; -ms-flex-align: start; align-items: flex-start; } .simple-keyboard--with-textarea .simple-keyboard-input { -webkit-appearance: none; -moz-appearance: none; appearance: none; resize: none; overflow-y: hidden; line-height: 1.4; border: 1px solid rgba(221, 221, 221, 0.21); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; padding: 0.2em 0.4em; } body.platform--apple_tv #orsay-keyboard.focus { border: 4px solid #fff; -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; padding-left: 12px; } .modal { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.3); padding: 1.5em; z-index: 50; } @media screen and (max-width: 480px) { .modal { -webkit-backdrop-filter: blur(1em); backdrop-filter: blur(1em); } } .modal__content { background-color: #262829; padding: 1.5em; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; margin: 0 auto; max-width: 37%; position: relative; } @media screen and (max-width: 767px) { .modal__content { max-width: 50%; } } @media screen and (max-width: 580px) { .modal__content { max-width: 80%; } } @media screen and (max-width: 480px) { .modal__content { max-width: 100%; -webkit-border-top-left-radius: 2em; -moz-border-radius-topleft: 2em; border-top-left-radius: 2em; -webkit-border-top-right-radius: 2em; -moz-border-radius-topright: 2em; border-top-right-radius: 2em; -webkit-border-bottom-left-radius: 0; -moz-border-radius-bottomleft: 0; border-bottom-left-radius: 0; -webkit-border-bottom-right-radius: 0; -moz-border-radius-bottomright: 0; border-bottom-right-radius: 0; position: fixed; left: 0; bottom: 0; width: 100%; } } .modal .head-backward { margin: 0; } .modal__head { margin-bottom: 2em; } .modal__body .scroll__content { max-height: 37.2em; } .modal__title { font-size: 2.2em; font-weight: 300; } .modal__icon { width: 7em; height: 7em; margin: 0 auto; } .modal__icon > svg { width: 7em; height: 7em; } @media screen and (max-width: 480px) { .modal__icon { display: none; } } .modal__footer { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; padding-top: 2em; } @media screen and (max-width: 480px) { .modal__footer { display: block; } } .modal__button { padding: 0.9em 1.3em; -webkit-border-radius: 0.7em; -moz-border-radius: 0.7em; border-radius: 0.7em; background: rgba(255, 255, 255, 0.1); font-size: 1.2em; } .modal__button.focus { background: #fff; color: #000; } @media screen and (max-width: 480px) { .modal__button { text-align: center; } } .modal__button + .modal__button { margin-left: 1em; } @media screen and (max-width: 480px) { .modal__button + .modal__button { margin-left: 0; margin-top: 1em; } } .modal__close-button { position: absolute; top: -0.8em; right: -0.8em; background: #fff; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; padding: 0.4em; color: #000; cursor: pointer; } .modal__close-button > svg { width: 1.1em; height: 1.1em; } @media screen and (max-width: 480px) { .modal__close-button { display: none; } } .modal--align-center { text-align: center; } .modal--align-center .modal__footer { -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } .modal--cub-premium .modal__icon { margin-bottom: -2em; } @media screen and (min-width: 767px) { .modal--cub-premium .modal__content { max-width: 44%; } } .modal--medium .modal__content { max-width: 60%; } @media screen and (max-width: 767px) { .modal--medium .modal__content { max-width: 80%; } } @media screen and (max-width: 580px) { .modal--medium .modal__content { max-width: 100%; } } .modal--large .modal__content { max-width: 80%; } @media screen and (max-width: 767px) { .modal--large .modal__content { max-width: 100%; } } .modal--full { padding: 0; } .modal--full .modal__content { max-width: 100%; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; padding: 0; } .modal--full .modal__head { padding: 1em 1.5em; } .modal--full .modal__footer { padding: 1em 1.5em; } .modal--empty-title .modal__head { display: none; } .modal--overlay { z-index: 60; } .modal--buttons-column .modal__footer { display: block; } .modal--buttons-column .modal__button { width: 100%; text-align: center; } .modal--buttons-column .modal__button + .modal__button { margin-left: 0; margin-top: 1em; } .modal .scroll--mask .scroll__content { padding: 1.5em 0; } .modal-loading { height: 6em; background: url(../img/loader.svg) no-repeat 50% 50%; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; } .modal-pending { text-align: center; } .modal-pending__loading { background: url(../img/loader.svg) no-repeat 50% 50%; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; height: 6em; } .modal-pending__text { font-size: 1.2em; margin-top: 1em; } .speedtest { position: fixed; top: 0; left: 0; width: 100%; height: 100%; padding: 1em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; background-color: #262829; z-index: 50; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } .speedtest__body { width: 30em; } .speedtest__body svg { height: inherit !important; } .speedtest__body svg text { fill: rgba(255, 255, 255, 0.2); font-weight: 600; } .speedtest__frequency { stroke-dasharray: 1 69; stroke-dashoffset: 5; } .speedtest__progress { stroke-dashoffset: -624; -webkit-transition: 0.34s ease; -o-transition: 0.34s ease; -moz-transition: 0.34s ease; transition: 0.34s ease; stroke: #df3d3d; stroke-dasharray: 0, 1256.8; stroke-linecap: round; } .speedtest__fill { stroke: rgba(255, 255, 255, 0.1); stroke-linecap: round; stroke-dashoffset: -624; stroke-dasharray: 0, 1256.8; stroke-dasharray: 1256.8, 1256.8; } .speedtest #speedtest_graph { -webkit-transition: 0.1s ease; -o-transition: 0.1s ease; -moz-transition: 0.1s ease; transition: 0.1s ease; } .speedtest #speedtest_num { fill: #fff; } .speedtest #speedtest_status { font-weight: 400; } .speedtest .head-backward { position: absolute; top: 1.5em; left: 0; right: 0; } .company > div { font-size: 1.4em; line-height: 1.2; } .company > div + div { margin-top: 0.6em; } .company > div.company__name { font-size: 2.1em; } .company-start { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; line-height: 1.4; } .company-start__left { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 10em; } @media screen and (max-width: 580px) { .company-start__left { width: 8em; } } @media screen and (max-width: 400px) { .company-start__left { width: 6.5em; } } .company-start__right { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; padding-left: 3em; } .company-start__icon { position: relative; padding-bottom: 93%; background-color: #fff; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; } .company-start__img { position: absolute; top: 10%; left: 10%; width: 80%; height: 80%; -o-object-fit: contain; object-fit: contain; opacity: 0; -webkit-transition: opacity 0.3s; -o-transition: opacity 0.3s; -moz-transition: opacity 0.3s; transition: opacity 0.3s; } .company-start__img.loaded { opacity: 1; } .company-start__name { font-size: 4em; font-weight: 700; } @media screen and (max-width: 580px) { .company-start__name { font-size: 3em; } } @media screen and (max-width: 400px) { .company-start__name { font-size: 2em; } } .company-start__place { font-size: 2.3em; font-weight: 300; max-width: 80%; } @media screen and (max-width: 580px) { .company-start__place { font-size: 1.8em; max-width: 100%; } } @media screen and (max-width: 400px) { .company-start__place { font-size: 1.5em; } } .company-start.icon--broken .company-start__icon { background-color: #3e3e3e; } .person-start { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .person-start__tags { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; margin-bottom: 1.4em; } @media screen and (max-width: 480px) { .person-start__tags { font-size: 0.9em; margin-bottom: 1.3em; } } .person-start__body { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .person-start__right { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .person-start__left { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; padding-left: 3em; } @media screen and (max-width: 580px) { .person-start__left { padding-left: 2em; } } .person-start__poster { position: relative; } .person-start__poster:before { display: none; } .person-start__img { position: relative; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; width: 15em; height: 15em; opacity: 0; -webkit-transition: opacity 0.3s; -o-transition: opacity 0.3s; -moz-transition: opacity 0.3s; transition: opacity 0.3s; } .person-start__img.loaded { opacity: 1; } @media screen and (max-width: 580px) { .person-start__img { width: 11em; height: 14em; } } @media screen and (max-width: 480px) { .person-start__img { width: 9em; height: 12em; } } .person-start__tag { -webkit-border-radius: 5em; -moz-border-radius: 5em; border-radius: 5em; padding: 0.3em 0.5em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; margin-right: 1em; font-size: 1.05em; } .person-start__tag > img { width: 1em; height: 1em; margin-right: 0.8em; } .person-start__name { font-size: 3.5em; font-weight: 700; margin-bottom: 0.3em; max-width: 90%; } @media screen and (max-width: 580px) { .person-start__name { font-size: 3em; max-width: 100%; } } @media screen and (max-width: 480px) { .person-start__name { font-size: 2em; } } .person-start__place { font-size: 1.8em; font-weight: 300; max-width: 80%; margin-bottom: 1.1em; } @media screen and (max-width: 991px) { .person-start__place { font-size: 1.8em; } } @media screen and (max-width: 580px) { .person-start__place { font-size: 1.8em; max-width: 100%; margin-bottom: 0.9em; } } @media screen and (max-width: 480px) { .person-start__place { font-size: 1.5em; margin-bottom: 1.1em; } } .person-start__descr { max-width: 80%; font-size: 1.3em; line-height: 1.4; font-weight: 300; height: 6.7em; margin-bottom: 1em; overflow: hidden; -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(white), color-stop(68%, white), to(rgba(255, 255, 255, 0))); -webkit-mask-image: -webkit-linear-gradient(top, white 0%, white 68%, rgba(255, 255, 255, 0) 100%); mask-image: -webkit-gradient(linear, left top, left bottom, from(white), color-stop(68%, white), to(rgba(255, 255, 255, 0))); mask-image: linear-gradient(to bottom, white 0%, white 68%, rgba(255, 255, 255, 0) 100%); } @media screen and (max-width: 991px) { .person-start__descr { max-width: 100%; } } @media screen and (max-width: 580px) { .person-start__descr { display: none; } } .person-start__descr-mobile { font-size: 1.3em; line-height: 1.4; display: none; } @media screen and (max-width: 580px) { .person-start__descr-mobile { display: block; } } .person-start__icons { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .person-start__icons > div { margin-left: 0; } .person-start__bottom { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .empty { width: 100%; text-align: center; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; margin: 0 auto; } .empty__img { height: 17em; background: url(../img/empty.svg) no-repeat 50% 50%; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; margin-bottom: 3em; } .empty__icon svg, .empty__icon img { width: 22em !important; height: 14em !important; margin-bottom: 3em; } .empty__title { font-size: 2.4em; line-height: 1.4; } .empty__descr { font-size: 1.4em; margin-top: 0.8em; line-height: 1.6; } .empty__footer { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-top: 2em; } @media screen and (max-width: 580px) { .empty__footer { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1em; } .empty__footer .simple-button { margin-right: 0; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } } .empty--list { height: auto; text-align: left; padding: 2em 0; } .empty--list .empty__footer { -webkit-box-pack: start; -webkit-justify-content: flex-start; -moz-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .empty--noicon .empty__img { display: none; } .empty--noicon .empty__title { position: relative; } .empty--noicon .empty__title::after { content: ""; display: block; width: 30%; height: 0.1em; background: #fff; position: absolute; bottom: -0.7em; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); -webkit-border-radius: 0.5em; -moz-border-radius: 0.5em; border-radius: 0.5em; } .empty--noicon .empty__descr { margin-top: 2.5em; } .empty--custom-icon .empty__img { display: none; } .empty--width-large { max-width: 90%; } .empty--width-medium { max-width: 60%; } .empty--width-small { max-width: 35%; } @media screen and (max-width: 480px) { .empty--width-medium { max-width: 90%; } .empty--width-small { max-width: 70%; } } .empty-filter { line-height: 1.4; } .empty-filter__title { font-size: 1.8em; margin-bottom: 0.3em; } .empty-filter__subtitle { font-size: 1.2em; font-weight: 300; margin-bottom: 1.6em; } .empty-filter__buttons { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .empty-filter__buttons > * + * { margin-left: 1em; } .empty-filter__buttons .simple-button { font-size: 1.2em; -webkit-border-radius: 0.2em; -moz-border-radius: 0.2em; border-radius: 0.2em; margin-bottom: 2.4em; } .empty-filter__templates .empty-template:nth-child(2) { opacity: 0.5; } .empty-filter__templates .empty-template:nth-child(2) .empty-template__body { width: 40%; } .empty-filter__templates .empty-template:nth-child(3) { opacity: 0.2; } .empty-filter__templates .empty-template:nth-child(3) .empty-template__body { width: 55%; } .empty-template { background-color: rgba(255, 255, 255, 0.3); padding: 1em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; } .empty-template > * { background: rgba(0, 0, 0, 0.3); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; } .empty-template__ico { width: 4em; height: 4em; margin-right: 2.4em; } .empty-template__body { height: 1.7em; width: 70%; } .empty-template + .empty-template { margin-top: 1em; } .account-modal { text-align: center; } .account-modal__icon { width: 9em; height: 9em; margin: 0 auto; margin-bottom: 2em; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; background-color: rgba(255, 255, 255, 0.1); display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } .account-modal__icon > svg { width: 4em; height: 4em; } .account-modal__icon-svg { margin-bottom: 2em; } .account-modal__icon-svg > svg { width: 9.1em; height: 9.1em; } .account-modal__desc { font-size: 1.2em; line-height: 1.6; } .account-modal__site { background-color: rgba(255, 255, 255, 0.1); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; padding: 0.2em 0.5em; padding-top: 0em; } .account-add-device { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; } .account-add-device__site { background: rgba(0, 0, 0, 0.3); display: inline-block; padding: 0.1em 0.4em; -webkit-border-radius: 0.4em; -moz-border-radius: 0.4em; border-radius: 0.4em; color: #D8C39A; } .account-add-device .about { margin-bottom: 2em; } .account-add-device .simple-button { margin: 0; } .account-add-device .account-add-device__qr { width: 12em; height: 12em; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; padding: 0.6em; background: #fff; margin-bottom: 1.8em; opacity: 0; } .account-add-device.loaded .account-add-device__qr { opacity: 1; } .account-modal-split { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; line-height: 1.6; } .account-modal-split__qr { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; text-align: center; width: 45%; } .account-modal-split__qr-img { width: 16em; height: 16em; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; padding: 0.5em; background: #3c3e3f; margin-bottom: 1.8em; opacity: 0; -webkit-transform: translate3d(0, 20%, 0); -moz-transform: translate3d(0, 20%, 0); transform: translate3d(0, 20%, 0); -webkit-transition: opacity 0.2s, -webkit-transform 0.2s; transition: opacity 0.2s, -webkit-transform 0.2s; -o-transition: opacity 0.2s, -o-transform 0.2s; -moz-transition: opacity 0.2s, transform 0.2s, -moz-transform 0.2s; transition: opacity 0.2s, transform 0.2s; transition: opacity 0.2s, transform 0.2s, -webkit-transform 0.2s, -moz-transform 0.2s, -o-transform 0.2s; } .account-modal-split__qr-img.loaded { opacity: 1; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .account-modal-split__qr-code { width: 16em; height: 16em; padding: 0.5em; background: #3c3e3f; -webkit-border-radius: 1.1em; -moz-border-radius: 1.1em; border-radius: 1.1em; margin: 0 auto; margin-bottom: 1.8em; } .account-modal-split__qr-code svg { -webkit-border-radius: 0.7em; -moz-border-radius: 0.7em; border-radius: 0.7em; width: 15em !important; height: 15em !important; } .account-modal-split__qr-text { font-size: 1em; font-size: 1em; max-width: 16em; margin: 0 auto; } .account-modal-split__info { width: 55%; padding-right: 1.5em; } .account-modal-split__title { font-size: 2.2em; margin-bottom: 0.5em; font-weight: 300; } .account-modal-split__text { font-size: 1.2em; margin-bottom: 2em; } .account-modal-split__code { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; margin-bottom: 4em; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 80%; } .account-modal-split__code-num { -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; background: #ffffff0f; padding: 1.6em 1.4em; position: relative; } .account-modal-split__code-num > span { display: block; line-height: 1; font-size: 2em; width: 0.6em; text-align: center; font-weight: 700; } .account-modal-split__code-num:before { display: block; content: ""; position: absolute; bottom: -1em; left: 0; width: 100%; height: 0.2em; background-color: #ddd; } .account-modal-split__keyboard { width: 80%; } .account-modal-split__keyboard .hg-button { padding: 0.5em 0; } .account-modal-split .account-modal__site { color: #D8C39A; } .account-modal-split--mobile .account-modal-split__qr { display: none; } .account-modal-split--mobile .account-modal-split__info { width: 100%; padding: 0; } .account-modal-split--mobile .account-modal-split__keyboard, .account-modal-split--mobile .account-modal-split__code { width: 100%; } .cub-premium { text-align: center; } .cub-premium__title { color: #d8c39a; font-size: 2.1em; margin-bottom: 1em; } .cub-premium__descr { font-size: 1.2em; line-height: 1.6; margin-bottom: 1em; } .cub-premium__url { background-color: #D8C39A; -webkit-border-radius: 3em; -moz-border-radius: 3em; border-radius: 3em; padding: 0.8em 1.5em; display: inline-block; color: #000; font-size: 1.2em; } .cub-premium__icon { position: relative; width: 24em; margin: 0 auto; margin-bottom: 3em; } .cub-premium__icon > svg { width: 24em; height: 14em; } .cub-premium__icon > span { color: #D8C39A; font-size: 2.3em; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); font-weight: 600; white-space: nowrap; } .cub-premium__includes { max-width: 80%; margin: 0 auto; margin-bottom: 3em; } .cub-premium__includes > div { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -webkit-align-items: flex-start; -moz-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 1.4em 1.6em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; background-color: rgba(255, 255, 255, 0.01); font-size: 1.2em; line-height: 1.2; } .cub-premium__includes > div > div:first-child { text-align: left; padding-right: 2em; } .cub-premium__includes > div > div:first-child > span { display: block; padding-top: 1em; font-size: 0.9em; font-weight: 100; line-height: 1.4; } .cub-premium__includes > div > div:last-child { text-align: right; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; font-weight: 600; color: #d8c39a; } .cub-premium__includes > div.focus { background-color: rgba(255, 255, 255, 0.1); } .cub-premium__includes > div + div { margin-top: 1em; } @media screen and (max-width: 580px) { .cub-premium__includes { max-width: 100%; } } .cub-premium--detail { padding-left: 1.5em; padding-right: 1.5em; padding-bottom: 2em; } .cub-premium--detail .cub-premium__icon + .cub-premium__descr { max-width: 70%; margin: 0 auto; margin-bottom: 3em; } @media screen and (max-width: 580px) { .cub-premium--detail .cub-premium__icon + .cub-premium__descr { max-width: 100%; } } .notice { font-weight: 300; padding: 1.5em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; overflow: hidden; } .notice__head { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .notice__title { font-size: 1.5em; font-weight: 400; } .notice__descr { font-size: 1.2em; margin-top: 0.9em; line-height: 1.4; } .notice__descr span, .notice__descr b { font-weight: 300; color: #d8c39a; } .notice__time { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; margin-left: auto; padding-left: 2em; padding-top: 0.2em; } .notice + .notice { margin-top: 1em; } .notice__left { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; margin-right: 2em; width: 7em; } .notice__body { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } .notice__img { padding-bottom: 147%; position: relative; background: rgba(0, 0, 0, 0.3); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; -webkit-transition: background, -webkit-border-radius 0.2s; transition: background, -webkit-border-radius 0.2s; -o-transition: background, border-radius 0.2s; -moz-transition: background, border-radius 0.2s, -moz-border-radius 0.2s; transition: background, border-radius 0.2s; transition: background, border-radius 0.2s, -webkit-border-radius 0.2s, -moz-border-radius 0.2s; } .notice__img img, .notice__img svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; opacity: 0; -webkit-transition: opacity 0.2s; -o-transition: opacity 0.2s; -moz-transition: opacity 0.2s; transition: opacity 0.2s; } .notice__img svg { opacity: 1; } .notice__footer { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; padding-top: 1em; margin: -0.3em; } .notice__footer > div { padding: 0.5em; background-color: rgba(221, 221, 221, 0.15); margin: 0.3em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; } .notice__author { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; margin-top: 1.5em; -webkit-box-align: start; -webkit-align-items: flex-start; -moz-box-align: start; -ms-flex-align: start; align-items: flex-start; } .notice__author-img { -webkit-border-radius: 1.1em; -moz-border-radius: 1.1em; border-radius: 1.1em; overflow: hidden; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; background: rgba(0, 0, 0, 0.3); -webkit-transition: background 0.2s; -o-transition: background 0.2s; -moz-transition: background 0.2s; transition: background 0.2s; } .notice__author-img img { width: 4em; height: 4em; opacity: 0; -webkit-transition: opacity 0.2s; -o-transition: opacity 0.2s; -moz-transition: opacity 0.2s; transition: opacity 0.2s; } .notice__author-body { padding-left: 1.5em; line-height: 1.4; } .notice__author-name { font-size: 1.1em; font-weight: 500; } .notice__author-text { font-size: 1.2em; } .notice--card { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .notice.image--none .notice__left { display: none; } .notice.image--icon .notice__img { padding-bottom: 100%; } .notice.image--img .notice__img { padding-bottom: 0; } .notice.image--img .notice__img img { position: static; height: auto; } .notice.image--loaded .notice__img { background: transparent; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } .notice.image--loaded .notice__img img { opacity: 1; } .notice.image-author--loaded .notice__author-img { background: transparent; } .notice.image-author--loaded .notice__author-img img { opacity: 1; } .notice.focus { background-color: rgba(255, 255, 255, 0.1); } body.true--mobile .notice { padding-left: 0; padding-right: 0; } .bell { position: absolute; top: 0; left: 50%; width: 20em; z-index: 100; margin-left: -10em; -webkit-transition: opacity 0.2s, -webkit-transform 0.3s; transition: opacity 0.2s, -webkit-transform 0.3s; -o-transition: opacity 0.2s, -o-transform 0.3s; -moz-transition: transform 0.3s, opacity 0.2s, -moz-transform 0.3s; transition: transform 0.3s, opacity 0.2s; transition: transform 0.3s, opacity 0.2s, -webkit-transform 0.3s, -moz-transform 0.3s, -o-transform 0.3s; -webkit-transform: translate3d(0, -100%, 0); -moz-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); opacity: 0; pointer-events: none; padding-top: 1em; } @media screen and (max-width: 580px) { .bell { width: 80%; padding: 1.5em; font-size: 1.2em; margin-left: -40%; } } @media screen and (max-width: 480px) { .bell { width: 100%; margin-left: -50%; padding: 0.8em; } } .bell__item { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; padding: 1.3em; background: #1d1f20; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; margin-bottom: 1em; opacity: 0; -webkit-transform: translate3d(0, -1em, 0); -moz-transform: translate3d(0, -1em, 0); transform: translate3d(0, -1em, 0); -webkit-transition: opacity 0.2s, -webkit-transform 0.3s; transition: opacity 0.2s, -webkit-transform 0.3s; -o-transition: opacity 0.2s, -o-transform 0.3s; -moz-transition: transform 0.3s, opacity 0.2s, -moz-transform 0.3s; transition: transform 0.3s, opacity 0.2s; transition: transform 0.3s, opacity 0.2s, -webkit-transform 0.3s, -moz-transform 0.3s, -o-transform 0.3s; } @media screen and (max-width: 480px) { .bell__item { -webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em; } } .bell__item-icon { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 2em; height: 2em; margin-right: 1.3em; } .bell__item-text { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; font-size: 1.1em; line-height: 1.4; } .bell__item.show { opacity: 1; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .bell.show { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; } .torrent-list { padding: 0 1.5em; } .torrent-files .torrent-file + .torrent-serial, .torrent-files .torrent-serial + .torrent-file, .torrent-files .torrent-serial + .torrent-serial, .torrent-files .torrent-file + .torrent-file { margin-top: 1em; } .torrent-item { background-color: rgba(0, 0, 0, 0.3); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; padding: 1em; line-height: 1.2; position: relative; } .torrent-item__title { font-size: 1.3em; word-break: break-all; } .torrent-item__details { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; color: rgba(255, 255, 255, 0.5); margin-top: 0.6em; font-weight: 600; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; white-space: nowrap; } @media screen and (max-width: 767px) { .torrent-item__details > * { margin: 0.3em 0.3em 0 0 !important; } } @media screen and (max-width: 580px) { .torrent-item__details { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } } .torrent-item__date { margin-right: 1em; } .torrent-item__tracker { margin-right: 1em; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } @media screen and (max-width: 580px) { .torrent-item__tracker { width: 100%; } } .torrent-item__size { background-color: #fff; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; color: #000; padding: 0.3em 0.5em; } @media screen and (max-width: 580px) { .torrent-item__size { margin-left: auto !important; } } .torrent-item__bitrate, .torrent-item__grabs, .torrent-item__seeds { margin-right: 1em; } .torrent-item__bitrate > span, .torrent-item__grabs > span, .torrent-item__seeds > span { color: #fff; } @media screen and (min-width: 767px) { .torrent-item__bitrate > span, .torrent-item__grabs > span, .torrent-item__seeds > span { background: rgba(255, 255, 255, 0.2); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; padding: 0.1em 0.3em; padding-bottom: 0.15em; min-width: 1.8em; display: inline-block; text-align: center; } } @media screen and (max-width: 480px) { .torrent-item__bitrate { width: 100%; } } .torrent-item__size { font-weight: 600; } @media screen and (max-width: 767px) { .torrent-item__size { width: auto; } } .torrent-item__viewed { position: absolute; top: -0.75em; left: -0.75em; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; width: 1.5em; height: 1.5em; padding: 0.3em; color: #000; background-color: #fff; } .torrent-item__stat { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; background-color: rgba(0, 0, 0, 0.25); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; line-height: 1.4; margin-top: 0.7em; font-size: 0.9em; } .torrent-item__stat > div { padding: 0.2em 0.8em; } .torrent-item__ffprobe { padding-top: 0.3em; } .torrent-item__ffprobe > div { float: left; background: rgba(255, 255, 255, 0.19); padding: 0.4em; margin-right: 0.5em; margin-top: 0.5em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; white-space: nowrap; } .torrent-item__ffprobe > div::before { content: ""; width: 1em; height: 1em; margin-right: 0.5em; display: inline-block; background-repeat: no-repeat; background-position: 50% 50%; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; margin-top: -0.2em; } .torrent-item__ffprobe > div.m-video::before { background-image: url(../img/icons/film.svg); } .torrent-item__ffprobe > div.m-channels::before { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' viewBox='0 0 512 512' xml:space='preserve' class=''%3E%3Cpath d='M410.832 86.797c-13.048 0-23.663 10.639-23.663 23.717V401.64c1.194 31.473 46.23 31.36 47.416 0V110.514c0-13.077-10.655-23.717-23.753-23.717zM256 86.797c-13.098 0-23.753 10.639-23.753 23.717V401.64c1.197 31.429 46.321 31.404 47.507 0V110.514c0-13.077-10.656-23.717-23.754-23.717zM333.415 173.517c-13.047 0-23.661 10.639-23.661 23.717v117.687c1.194 31.475 46.229 31.358 47.415 0V197.234c0-13.078-10.656-23.717-23.754-23.717zM488.247 216.878c-13.047 0-23.662 10.639-23.662 23.717v30.966c1.194 31.474 46.229 31.359 47.415 0v-30.966c0-13.078-10.655-23.717-23.753-23.717zM23.754 216.878C10.656 216.878 0 227.517 0 240.594v30.966c1.198 31.382 46.233 31.451 47.415 0v-30.966c0-13.077-10.614-23.716-23.661-23.716zM101.169 130.157c-13.098 0-23.754 10.639-23.754 23.717V358.28c1.198 31.384 46.234 31.45 47.417 0V153.874c0-13.078-10.615-23.717-23.663-23.717zM178.585.077c-13.098 0-23.753 10.639-23.753 23.717V488.36c1.197 31.383 46.232 31.45 47.415 0V23.794c0-13.078-10.615-23.717-23.662-23.717z' fill='%23fff'%3E%3C/path%3E%3C/svg%3E"); } .torrent-item__ffprobe > div.m-audio::before { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' viewBox='0 0 24 24' xml:space='preserve'%3E%3Cpath d='M12 2a5 5 0 0 0-5 5v5a5 5 0 0 0 10 0V7a5 5 0 0 0-5-5z' fill='%23fff'%3E%3C/path%3E%3Cpath d='M6 11a1 1 0 1 0-2 0v1a8.001 8.001 0 0 0 7 7.938V21a1 1 0 1 0 2 0v-1.062A8.001 8.001 0 0 0 20 12v-1a1 1 0 1 0-2 0v1a6 6 0 0 1-12 0z' fill='%23fff'%3E%3C/path%3E%3C/svg%3E"); } .torrent-item__ffprobe > div.m-subtitle::before { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' viewBox='0 0 32 32' xml:space='preserve'%3E%3Cpath d='M27 27H5a3 3 0 0 1-3-3V8a3 3 0 0 1 3-3h22a3 3 0 0 1 3 3v16a3 3 0 0 1-3 3zM5 7a1 1 0 0 0-1 1v16a1 1 0 0 0 1 1h22a1 1 0 0 0 1-1V8a1 1 0 0 0-1-1zm7 9a1 1 0 0 0-1-1H8a1 1 0 0 0 0 2h3a1 1 0 0 0 1-1zm13 0a1 1 0 0 0-1-1h-8a1 1 0 0 0 0 2h8a1 1 0 0 0 1-1zm0 5a1 1 0 0 0-1-1h-3a1 1 0 0 0 0 2h3a1 1 0 0 0 1-1zm-8 0a1 1 0 0 0-1-1H8a1 1 0 0 0 0 2h8a1 1 0 0 0 1-1z' fill='%23fff'%3E%3C/path%3E%3C/svg%3E"); } .torrent-item__ffprobe > div.m-resolution { background: rgba(0, 0, 0, 0.2); font-weight: 600; -webkit-box-shadow: inset 0 0 0 0.1em rgba(255, 255, 255, 0.3); -moz-box-shadow: inset 0 0 0 0.1em rgba(255, 255, 255, 0.3); box-shadow: inset 0 0 0 0.1em rgba(255, 255, 255, 0.3); } .torrent-item__ffprobe > div.m-resolution::before { display: none; } .torrent-item__ffprobe > div.m-general { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; font-size: 1.39em; background: transparent; outline: 0.1em solid rgba(255, 255, 255, 0.3); padding: 0; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .torrent-item__ffprobe > div.m-general > div:nth-child(1) { font-weight: 600; background: rgba(255, 255, 255, 0.3); -webkit-border-radius: 0.25em; -moz-border-radius: 0.25em; border-radius: 0.25em; padding: 0.65em; font-size: 1.2em; } .torrent-item__ffprobe > div.m-general > div:nth-child(2) { padding: 0.9em; } .torrent-item__ffprobe > div.m-general::before { display: none; } .torrent-item__ffprobe::after { content: ""; display: block; clear: both; } .torrent-item + .torrent-item { margin-top: 1em; } .torrent-item.focus::after { content: ""; position: absolute; top: -0.5em; left: -0.5em; right: -0.5em; bottom: -0.5em; border: 0.3em solid #fff; -webkit-border-radius: 0.7em; -moz-border-radius: 0.7em; border-radius: 0.7em; z-index: -1; } .torrent-item--popular { background-color: rgba(255, 255, 255, 0.2); } .torrent-file { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; background: rgba(0, 0, 0, 0.2); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; padding: 1em; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; position: relative; padding-bottom: 2em; } .torrent-file__title { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; font-size: 1.3em; line-height: 1.2; overflow: hidden; padding-right: 1em; -o-text-overflow: ellipsis; text-overflow: ellipsis; } .torrent-file__title .exe { -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; background: rgba(255, 255, 255, 0.06); padding: 0.2em 0.4em; display: inline-block; margin-left: 0.6em; } .torrent-file__size { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; background: #262829; font-size: 1.3em; padding: 0.3em 0.5em; } .torrent-file .time-line { position: absolute; left: 1em; right: 1em; bottom: 1em; display: block !important; } .torrent-file.focus { background-color: rgba(255, 255, 255, 0.2); } .torrent-error > div + div { margin-top: 1.3em; } .torrent-error > div { line-height: 1.2; } .torrent-error > div > div { font-size: 1.4em; } .torrent-error > div > ul { margin: 0; margin-top: 0.2em; font-size: 1.2em; font-weight: 300; } .torrent-error > div > ul > li { position: relative; padding-left: 1em; } .torrent-error > div > ul > li::before { content: ""; display: block; width: 0.3em; height: 0.3em; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; background-color: #ddd; position: absolute; top: 0.5em; left: 0; } .torrent-error > div > ul > li + li { margin-top: 0.2em; } .torrent-error code { background-color: #4c4c4c; -webkit-border-radius: 0.2em; -moz-border-radius: 0.2em; border-radius: 0.2em; padding: 0 0.5em; word-break: break-all; font-family: inherit; font-size: inherit; } .error + .torrent-error { margin-top: 2em; } .torrent-filter { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; margin-bottom: 2em; } @media screen and (min-width: 767px) { .torrent-filter .simple-button.filter--back { display: none; } } @media screen and (max-width: 580px) { .torrent-filter { white-space: nowrap; } .torrent-filter .simple-button.filter--search div { display: none; } } .torrent-serial { position: relative; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; background: #1d1f20; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .torrent-serial__progress { width: 0.3em; position: absolute; height: 0; background: #fff; top: 50%; right: 0; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; -webkit-transition: height 0.1s linear; -o-transition: height 0.1s linear; -moz-transition: height 0.1s linear; transition: height 0.1s linear; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .torrent-serial__img { width: 12em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; height: 7em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; -webkit-align-self: flex-start; -ms-flex-item-align: start; align-self: flex-start; opacity: 0; -webkit-transition: opacity 0.2s; -o-transition: opacity 0.2s; -moz-transition: opacity 0.2s; transition: opacity 0.2s; } .torrent-serial__img.loaded { opacity: 1; } @media screen and (max-width: 400px) { .torrent-serial__img { width: 7em; height: 5em; } } .torrent-serial__content { padding: 0.8em 1em; -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; overflow: hidden; } @media screen and (max-width: 480px) { .torrent-serial__content { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } } .torrent-serial__body { float: left; max-width: 80%; } @media screen and (max-width: 580px) { .torrent-serial__body { max-width: 72%; } } .torrent-serial__title { font-size: 1.7em; overflow: hidden; line-height: 1.2; -o-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; margin-top: -0.1em; } @media screen and (max-width: 580px) { .torrent-serial__title { font-size: 1.6em; } } @media screen and (max-width: 400px) { .torrent-serial__title { font-size: 1.4em; } } .torrent-serial__line { font-size: 1.1em; margin-top: 0.5em; font-weight: 300; line-height: 1.2; } .torrent-serial__line b { font-weight: 500; } .torrent-serial__line span + span:before { content: "•"; display: inline-block; margin: 0 0.5em; vertical-align: baseline; } @media screen and (max-width: 400px) { .torrent-serial__line span:last-child { display: none; } } @media screen and (max-width: 580px) { .torrent-serial__line { font-size: 1em; } } @media screen and (max-width: 400px) { .torrent-serial__line { padding-right: 1em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .torrent-serial__line span + span { margin-top: 0.5em; } .torrent-serial__line span + span:before { display: none; } } .torrent-serial__clear { clear: both; } .torrent-serial__size { -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; background: #262829; font-size: 1.3em; padding: 0.3em 0.5em; } .torrent-serial__exe { font-size: 1.4em; margin-top: 0.2em; } .torrent-serial__detail { text-align: right; margin-left: auto; white-space: nowrap; float: right; } @media screen and (max-width: 400px) { .torrent-serial__detail { font-size: 0.9em; } } .torrent-serial__episode { position: absolute; background-color: rgba(0, 0, 0, 0.7); left: 0; top: 0; -webkit-border-radius: 0.2em; -moz-border-radius: 0.2em; border-radius: 0.2em; padding: 0.3em 0.5em; font-size: 1.4em; font-weight: 600; } @media screen and (max-width: 400px) { .torrent-serial__episode { font-size: 1.2em; } } .torrent-serial.focus { background-color: #353535; } @media screen and (max-width: 400px) { .torrent-serial { padding-bottom: 3.4em; } } @media screen and (max-width: 400px) { .torrent-serial { padding-bottom: 0; } } .torrent-serial .time-line { display: block !important; } @media screen and (max-width: 480px) { .torrent-serial .time-line { position: absolute; top: 5em; left: 1em; width: 10em; } } @media screen and (max-width: 400px) { .torrent-serial .time-line { top: 3em; width: 5em; } } .torrent-install { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } @media screen and (max-width: 580px) { .torrent-install { display: block; } } .torrent-install__left, .torrent-install__details { width: 50%; } @media screen and (max-width: 580px) { .torrent-install__left, .torrent-install__details { width: 100%; } } .torrent-install__left { padding-right: 3em; } @media screen and (max-width: 580px) { .torrent-install__left { display: none; } } .torrent-install__title { font-size: 2em; line-height: 1.4; margin-bottom: 0.7em; } .torrent-install__descr { font-size: 1.3em; line-height: 1.4em; margin-bottom: 3em; } .torrent-install__label { font-size: 1.2em; margin-bottom: 1em; } .torrent-install__links:after { display: block; content: ""; clear: both; } .torrent-install__link { float: left; margin-right: 1em; margin-bottom: 1em; padding: 1em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; background-color: #363636; } .torrent-install__link > div:first-child { font-size: 1.1em; margin-bottom: 0.4em; } .torrent-install__link > div:last-child { font-size: 1.2em; } .torrent-checklist__title { font-size: 2em; line-height: 1.4; margin-bottom: 0.7em; } .torrent-checklist__descr { font-size: 1.2em; line-height: 1.4em; margin-bottom: 2em; } .torrent-checklist__progress-steps { margin-bottom: 1em; } .torrent-checklist__progress-bar { background-color: rgba(255, 255, 255, 0.15); -webkit-border-radius: 5em; -moz-border-radius: 5em; border-radius: 5em; margin-bottom: 2em; } .torrent-checklist__progress-bar > div { height: 0.5em; background-color: #fff; -webkit-border-radius: 5em; -moz-border-radius: 5em; border-radius: 5em; } .torrent-checklist__content { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .torrent-checklist__footer { margin-top: 2em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .torrent-checklist__steps, .torrent-checklist__info { width: 50%; } @media screen and (max-width: 480px) { .torrent-checklist__steps { display: none; } } .torrent-checklist__list { margin: 0; } .torrent-checklist__list > li { margin-bottom: 1em; color: #8D8D8D; } .torrent-checklist__list > li.wait { color: #fff; } .torrent-checklist__list > li.check { text-decoration: line-through; } .torrent-checklist__info > div { font-size: 1.2em; line-height: 1.6; } @media screen and (max-width: 480px) { .torrent-checklist__info { width: 100%; } } .torrnet-folder-name { font-size: 1.4em; padding: 1.4em 0; opacity: 0.5; } .torrnet-folder-name::before { content: ""; display: inline-block; width: 1em; height: 1em; background: url(../img/icons/menu/catalog.svg) no-repeat 50% 50%; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; margin-right: 0.7em; margin-top: -0.3em; } body.platform--orsay .torrnet-folder-name::before, body.platform--netcast .torrnet-folder-name::before { display: none; } body.platform--orsay .torrent-item__ffprobe > div::before, body.platform--netcast .torrent-item__ffprobe > div::before { display: none; } .feed { padding: 0 1.5em; } .feed-head { padding-bottom: 3em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .feed-head__icon { width: 8.2em; height: 8.2em; position: relative; margin-right: 2em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } @media screen and (max-width: 580px) { .feed-head__icon { margin: 0; margin-bottom: 1em; font-size: 1.2em; } } .feed-head__img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; } .feed-head__body { line-height: 1.4; } .feed-head__title { font-size: 2.2em; } .feed-head__info { font-size: 1.4em; margin-top: 0.1em; font-weight: 300; } @media screen and (max-width: 580px) { .feed-head { -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; text-align: center; } } .feed-item { position: relative; padding-left: 3em; } @media screen and (max-width: 580px) { .feed-item { padding-left: 0; } } .feed-item__head { margin-bottom: 1em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .feed-item__icon { padding: 0.5em; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; background: rgba(255, 255, 255, 0.15); margin-right: 1em; } .feed-item__icon svg { width: 1.8em !important; height: 1.8em !important; } .feed-item__label { padding: 0.3em 0.5em; background: rgba(0, 0, 0, 0.3); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; font-size: 1.1em; } .feed-item__label--top { background-color: #D69517; } .feed-item__label--now { background-color: #6F8DDC; } .feed-item__label--now_playing { background-color: #DA6FDC; } .feed-item__label--uhd { background-color: #69B96C; } .feed-item__label--popular { background-color: #B9A769; } .feed-item__label--trailer { background-color: #9291A4; } .feed-item__label--episode { background-color: #CD5050; } .feed-item__body { padding-left: 3.8em; line-height: 1.4; width: 60%; } @media screen and (max-width: 400px) { .feed-item__body { width: 90%; } } .feed-item__title { font-size: 2.5em; overflow: hidden; -o-text-overflow: "."; text-overflow: "."; display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical; } @media screen and (max-width: 580px) { .feed-item__title { font-size: 2em; } } .feed-item__info { font-size: 1.3em; opacity: 0.5; margin-top: 0.7em; } @media screen and (max-width: 580px) { .feed-item__info { font-size: 1.1em; } } .feed-item__descr { font-size: 1.3em; font-weight: 300; margin-top: 1.7em; line-height: 1.6; overflow: hidden; -o-text-overflow: "."; text-overflow: "."; display: -webkit-box; -webkit-line-clamp: 5; line-clamp: 5; -webkit-box-orient: vertical; } .feed-item__tags { margin-top: 1.3em; } .feed-item__right { position: absolute; top: 0; right: 8%; width: 20%; } @media screen and (max-width: 767px) { .feed-item__right { width: 26%; } } @media screen and (max-width: 400px) { .feed-item__right { position: relative; width: 67%; margin-left: 3.7em; right: 0; padding-bottom: 1em; } } .feed-item__poster-img, .feed-item__image-img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; opacity: 0; } .feed-item__poster-box, .feed-item__image-box { position: relative; padding-bottom: 150%; background: #262829; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; } .feed-item__poster-box.loaded, .feed-item__image-box.loaded { background: transparent; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } .feed-item__poster-box.loaded .feed-item__poster-img, .feed-item__poster-box.loaded .feed-item__image-img, .feed-item__image-box.loaded .feed-item__poster-img, .feed-item__image-box.loaded .feed-item__image-img { opacity: 1; } .feed-item__image-box { padding-bottom: 56%; } .feed-item__minicard { position: absolute; top: 50%; right: -2em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -webkit-align-items: flex-end; -moz-box-align: end; -ms-flex-align: end; align-items: flex-end; } .feed-item__minicard-poster { width: 9em; margin-left: 2em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .feed-item__minicard .feed-item__title { font-size: 1.7em; max-width: 11em; } .feed-item__minicard .feed-item__info { font-size: 1.1em; } .feed-item__buttons { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; margin-top: 3em; } .feed-item__tags::before { content: url(../img/icons/menu/bookmark.svg); width: 1em; height: 1em; height: 1.2em; margin-right: 0.7em; } .feed-item + .feed-item { margin-top: 6em; } .feed-item:not(:last-child)::after { content: ""; display: block; background-color: rgba(255, 255, 255, 0.3); position: absolute; top: 2.8em; left: 4.4em; bottom: -6em; width: 2px; } @media screen and (max-width: 580px) { .feed-item:not(:last-child)::after { left: 1.3em; } } .feed-item--episode .feed-item__body, .feed-item--trailer .feed-item__body { width: 48%; } .feed-item--episode .feed-item__right, .feed-item--trailer .feed-item__right { width: 35%; } .feed-item--episode .feed-item__descr, .feed-item--trailer .feed-item__descr { min-height: 6em; } @media screen and (max-width: 767px) { .feed-item--trailer .feed-item__body, .feed-item--episode .feed-item__body { width: 87%; } .feed-item--trailer .feed-item__minicard, .feed-item--episode .feed-item__minicard { top: auto; bottom: -5em; left: 0; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .feed-item--trailer .feed-item__right, .feed-item--episode .feed-item__right { position: relative; width: 80%; right: 0; margin-left: 3.7em; margin-bottom: 7em; } .feed-item--trailer .feed-item__title, .feed-item--episode .feed-item__title { font-size: 2em; } .feed-item--trailer .feed-item__poster-img, .feed-item--episode .feed-item__poster-img { width: 23%; min-width: 9em; } } .files { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; overflow: hidden; } .files__left { width: 20em; padding: 2.5em 1.5em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .files__left .full-start__poster { display: inline-block; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } @media screen and (max-width: 580px) { .files__left .full-start__poster { display: none; margin-right: 2em; } .files__left .full-start__poster .full-start__img { font-size: 0.28em; } } @media screen and (max-width: 767px) { .files__left { width: 17em; } } @media screen and (max-width: 580px) { .files__left { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; width: 100%; padding-bottom: 1em; } } .files__body { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 100%; max-width: -webkit-calc(100% - 20em); max-width: -moz-calc(100% - 20em); max-width: calc(100% - 20em); } @media screen and (max-width: 767px) { .files__body { max-width: -webkit-calc(100% - 17em); max-width: -moz-calc(100% - 17em); max-width: calc(100% - 17em); } } @media screen and (max-width: 580px) { .files__body { width: 100%; max-width: 100%; } } .files__info { overflow: hidden; } .files__title { font-size: 2em; font-weight: 700; margin-top: 1.1em; } @media screen and (max-width: 580px) { .files__title { margin-top: 0.5em; white-space: nowrap; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; margin-top: 0; } } .files__title-original { font-size: 1.5em; margin-top: 0.8em; } @media screen and (max-width: 580px) { .files { display: block; } } .explorer { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .explorer__left { width: 27%; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } @media screen and (max-width: 767px) { .explorer__left { display: none; } } .explorer__card { padding-left: 1.5em; } .explorer__files { width: 73%; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .explorer__files-head { padding: 1.5em; padding-bottom: 0; line-height: 1.4; } .explorer__files-head .scroll__body::after { display: none !important; } @media screen and (max-width: 767px) { .explorer__files { width: 100%; } } .explorer__files .torrent-filter { margin-bottom: 0; } .explorer__files .torrent-filter .simple-button { font-size: 1.2em; -webkit-border-radius: 0.7em; -moz-border-radius: 0.7em; border-radius: 0.7em; } .explorer__files .torrent-filter .simple-button:not(.focus) { background-color: rgba(0, 0, 0, 0.07); } .explorer__files .empty-filter { max-width: 100%; padding: 3em 1.5em 0 1.5em; } .explorer__search { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .explorer__search > svg { width: 1.2em; height: 1.2em; margin-right: 1em; } .explorer__search > span { font-size: 1.1em; } .explorer--fullsize .explorer__card, .explorer--fullsize .explorer__left { display: none; } .explorer--fullsize .explorer__files { width: 100%; } .explorer-list { padding: 0 1.5em; } .explorer-card { line-height: 1.4; } .explorer-card__head { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -webkit-align-items: flex-start; -moz-box-align: start; -ms-flex-align: start; align-items: flex-start; margin-bottom: 3.3em; } .explorer-card__head-left { width: 7em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; margin-right: 1.5em; } .explorer-card__head-body { padding-top: 0.7em; } .explorer-card__head-img { position: relative; padding-bottom: 150%; } .explorer-card__head-img > img { -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; position: absolute; top: 0; left: 0; height: 100%; width: 100%; background-color: #3E3E3E; } .explorer-card__head-img.focus::after { content: ""; position: absolute; top: -0.5em; left: -0.5em; right: -0.5em; bottom: -0.5em; border: 0.3em solid #fff; -webkit-border-radius: 0.7em; -moz-border-radius: 0.7em; border-radius: 0.7em; z-index: -1; pointer-events: none; } .explorer-card__head-create { font-size: 1.1em; } .explorer-card__head-rate { margin-top: 1em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .explorer-card__head-rate > svg { width: 1.5em !important; height: 1.5em !important; margin-right: 0.5em; } .explorer-card__head-rate > span { font-size: 1.5em; font-weight: 600; } .explorer-card__head-age { border: 1px solid #fff; display: inline-block; -webkit-border-radius: 0.2em; -moz-border-radius: 0.2em; border-radius: 0.2em; padding: 0.2em 0.3em; margin-top: 1.4em; font-size: 0.9em; } .explorer-card__title { font-size: 2.3em; font-weight: 700; line-height: 1.1; margin-bottom: 0.3em; } .explorer-card__title.small { font-size: 1.6em; } .explorer-card__genres { margin-bottom: 2em; } .explorer-card__descr { font-size: 1.15em; font-weight: 300; } @media screen and (max-width: 991px) { body.light--version .explorer__left { display: none; } body.light--version .explorer__files { width: 100%; } } .bookmarks-folder__layer { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; background-color: #3E3E3E; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; } .bookmarks-folder__body { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; background-color: rgba(255, 255, 255, 0.1); border-radius: 1em; position: relative; } .bookmarks-folder__body .i-1 { height: 80%; top: 20%; } .bookmarks-folder__body .i-2 { height: 60%; top: 40%; } .bookmarks-folder__head { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; padding: 1em; line-height: 1.3; } .bookmarks-folder__title { font-weight: 300; font-size: 1.5em; } .bookmarks-folder__num { font-weight: 600; font-size: 1.2em; } .about { font-size: 1.4em; line-height: 1.3; font-weight: 300; } .about > div + div { margin-top: 1.5em; } .about small { font-weight: 400; } .about__contacts { padding-top: 1em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -0.5em; } .about__contacts > div { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; padding: 0.5em; width: 50%; } .about__contacts > div span { max-width: 90%; overflow: hidden; display: block; -o-text-overflow: ellipsis; text-overflow: ellipsis; } .about__rules { padding-top: 1em; font-size: 0.9em; } .about__rules ol { list-style-type: none; counter-reset: item; } .about__rules li { counter-increment: item; display: table; } .about__rules li > h6 { font-size: 1em; } .about__rules h1, .about__rules h2, .about__rules h3, .about__rules h4, .about__rules h5, .about__rules h6 { font-weight: 500; margin: 0; } .about__rules li > * + * { margin-top: 1.5em; } .about__rules li > *:first-child { padding-top: 0px; } .about__rules li:before { content: counters(item, ".") ". "; display: table-cell; vertical-align: top; padding-right: 0.9em; padding-top: 0em; font-size: 1em; } .about__rules li li:before { content: counters(item, ".") " "; } .about__rules li + li { margin-top: 1.8em; } .about__rules ol { padding-left: 0px; } .about__rules > ol > li:before { padding-top: 0px; font-size: 1em; font-weight: 700; padding-right: 0.48em; } .about__rules a { color: inherit; } body.platform--orsay .about__contacts, body.platform--netcast .about__contacts { display: block; } body.platform--orsay .about__contacts > div, body.platform--netcast .about__contacts > div { float: left; } .error { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .error__ico { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; margin-right: 2em; width: 7em; height: 7em; background: url(../img/error.svg) no-repeat 50% 50%; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; } .error__text { font-size: 1.4em; line-height: 1.2; margin-top: 0.7em; font-weight: 300; } .error__title { font-size: 1.7em; } .season-info { position: relative; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; background-color: rgba(0, 0, 0, 0.3); padding: 1.2em; margin-bottom: 1.5em; line-height: 1.4; } .season-info__title { font-size: 1.7em; } .season-info__head { margin-top: 0.5em; font-weight: 100; } .season-info__overview { margin-top: 1em; } .season-info.focus::after, .season-info.hover::after { content: ""; position: absolute; top: -0.5em; left: -0.5em; right: -0.5em; bottom: -0.5em; border: 0.3em solid #fff; -webkit-border-radius: 0.7em; -moz-border-radius: 0.7em; border-radius: 0.7em; z-index: -1; pointer-events: none; } .season-episode { position: relative; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; background-color: rgba(0, 0, 0, 0.3); display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; will-change: transform; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .season-episode__body { padding: 1.2em; line-height: 1.3; -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; position: relative; } @media screen and (max-width: 480px) { .season-episode__body { padding: 0.8em 1.2em; } } .season-episode__img { position: relative; width: 13em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; min-height: 8.2em; } .season-episode__img > img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; opacity: 0; -webkit-transition: opacity 0.3s; -o-transition: opacity 0.3s; -moz-transition: opacity 0.3s; transition: opacity 0.3s; } .season-episode__img--loaded > img { opacity: 1; } @media screen and (max-width: 480px) { .season-episode__img { width: 7em; min-height: 6em; } } .season-episode__folder { padding: 1em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .season-episode__folder > svg { width: 4.4em !important; height: 4.4em !important; } .season-episode__viewed { position: absolute; top: 1em; left: 1em; background: rgba(0, 0, 0, 0.45); -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; padding: 0.25em; font-size: 0.76em; } .season-episode__viewed > svg { width: 1.5em !important; height: 1.5em !important; } .season-episode__episode-number { position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; font-size: 2em; } .season-episode__loader { position: absolute; top: 50%; left: 50%; width: 2em; height: 2em; margin-left: -1em; margin-top: -1em; background: url(../img/loader.svg) no-repeat center center; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; } .season-episode__head, .season-episode__footer { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .season-episode__timeline { margin: 0.8em 0; } .season-episode__timeline > .time-line { display: block !important; } .season-episode__title { font-size: 1.7em; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical; } @media screen and (max-width: 480px) { .season-episode__title { font-size: 1.4em; } } .season-episode__time { padding-left: 2em; } .season-episode__info { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .season-episode__info > * { overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical; } .season-episode__quality { padding-left: 1em; white-space: nowrap; } .season-episode__scan-file { position: absolute; bottom: 0; left: 0; right: 0; } .season-episode__scan-file .broadcast__scan { margin: 0; } .season-episode.focus::after { content: ""; position: absolute; top: -0.6em; left: -0.6em; right: -0.6em; bottom: -0.6em; -webkit-border-radius: 0.7em; -moz-border-radius: 0.7em; border-radius: 0.7em; border: solid 0.3em #fff; z-index: -1; pointer-events: none; } .season-episode--folder .season-episode__footer { margin-top: 0.8em; } .season-episode-split { font-size: 0.8em; margin: 0 1em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .season-episode-rate { display: -webkit-inline-box; display: -webkit-inline-flex; display: -moz-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .season-episode-rate > svg { width: 1.3em !important; height: 1.3em !important; } .season-episode-rate > span { font-weight: 600; font-size: 1.1em; padding-left: 0.7em; } .simple-button { margin-right: 1em; font-size: 1.3em; background-color: rgba(0, 0, 0, 0.3); padding: 0.3em 1.2em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; height: 2.8em; } .simple-button > svg { width: 1.5em; height: 1.5em; } .simple-button > svg + span { margin-left: 1em; } .simple-button > span { margin-top: -0.2em; } .simple-button.focus { background-color: #fff; color: #000; } .simple-button--filter > span { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .simple-button--filter > div { font-size: 0.7em; padding: 0.3em 0.5em; background-color: rgba(255, 255, 255, 0.3); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; margin-left: 1em; } .simple-button--filter > div::first-letter { text-transform: uppercase; } @media screen and (min-width: 767px) { .simple-button--filter { overflow: hidden; } .simple-button--filter > div { overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; white-space: nowrap; } } .simple-button--inline { display: inline; display: -webkit-inline-box; display: -webkit-inline-flex; display: -moz-inline-box; display: -ms-inline-flexbox; display: inline-flex; } .simple-button--invisible:not(.focus) { background-color: rgba(0, 0, 0, 0.07); } @media screen and (max-width: 580px) { .simple-button.filter--search span { display: none; } } .search-box { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: transparent; z-index: 50; width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding: 1.5em; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } .search-box .search__input { padding-left: 0; width: 50%; } .search-box .search__input.filled::after { content: ""; display: inline-block; border-right: 0.15em solid #fff; height: 1em; margin: -1em 0; margin-left: 0.1em; -webkit-animation: animation-search-input-line 0.8s infinite; -moz-animation: animation-search-input-line 0.8s infinite; -o-animation: animation-search-input-line 0.8s infinite; animation: animation-search-input-line 0.8s infinite; } @media screen and (max-width: 767px) { .search-box .search__input { width: 100%; } } .search-box__keypad { width: 50%; } @media screen and (max-width: 767px) { .search-box__keypad { width: 100%; } } .search-box--focus { -webkit-box-pack: start; -webkit-justify-content: flex-start; -moz-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } body.system--keyboard .search-box .simple-keyboard-input { border-bottom: 2px solid rgba(255, 255, 255, 0.15); } .console { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: #1d1f20; z-index: 100; padding: 1.5em 0; } .console__line { padding: 0.3em 1.5em; font-size: 1.1em; line-height: 1.2; word-break: break-all; } .console__line:nth-child(2n) { background-color: rgba(255, 255, 255, 0.05); } .console__line.focus { background-color: rgba(255, 255, 255, 0.2); } .console__tabs .scroll__body { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .console__tab { font-size: 1.1em; background-color: #3e3e3e; padding: 0.6em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; white-space: nowrap; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .console__tab + .console__tab { margin-left: 1em; } .console__tab > span { font-size: 0.7em; background-color: #ddd3; padding: 0.3em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; text-align: center; min-width: 1.8em; display: inline-block; } .console__tab.focus { background: #fff; color: #000; } .console__time { color: #7c7c7c; font-weight: 300; } .time-line { margin-top: 1em; -webkit-border-radius: 3em; -moz-border-radius: 3em; border-radius: 3em; background-color: rgba(255, 255, 255, 0.3); } .time-line > div { height: 0.3em; -webkit-border-radius: 3em; -moz-border-radius: 3em; border-radius: 3em; background-color: #fff; } .noty { position: fixed; left: 0; right: 0; bottom: 0; z-index: 99; background: #65eaa7; color: #000; -webkit-transform: translateY(100%); -moz-transform: translateY(100%); -ms-transform: translateY(100%); -o-transform: translateY(100%); transform: translateY(100%); -webkit-transition: opacity 0.3s, -webkit-transform 0.3s; transition: opacity 0.3s, -webkit-transform 0.3s; -o-transition: opacity 0.3s, -o-transform 0.3s; -moz-transition: transform 0.3s, opacity 0.3s, -moz-transform 0.3s; transition: transform 0.3s, opacity 0.3s; transition: transform 0.3s, opacity 0.3s, -webkit-transform 0.3s, -moz-transform 0.3s, -o-transform 0.3s; opacity: 0; line-height: 1.4; } .noty__body { padding: 1.5em; text-align: center; } .noty__text { font-size: 1.2em; } .noty--visible { -webkit-transform: translateY(0%); -moz-transform: translateY(0%); -ms-transform: translateY(0%); -o-transform: translateY(0%); transform: translateY(0%); opacity: 1; } .noty--style--glass { background: rgba(255, 255, 255, 0.2); -webkit-backdrop-filter: blur(1em); backdrop-filter: blur(1em); color: #fff; } .helper { background: #4b8dcb; position: absolute; bottom: 0; left: 0; right: 0; z-index: 98; -webkit-transform: translateY(100%); -moz-transform: translateY(100%); -ms-transform: translateY(100%); -o-transform: translateY(100%); transform: translateY(100%); -webkit-transition: opacity 0.3s, -webkit-transform 0.3s; transition: opacity 0.3s, -webkit-transform 0.3s; -o-transition: opacity 0.3s, -o-transform 0.3s; -moz-transition: transform 0.3s, opacity 0.3s, -moz-transform 0.3s; transition: transform 0.3s, opacity 0.3s; transition: transform 0.3s, opacity 0.3s, -webkit-transform 0.3s, -moz-transform 0.3s, -o-transform 0.3s; opacity: 0; pointer-events: none; text-align: center; color: #fff; } .helper__ico { margin-right: 1em; width: 1.8em; height: 1.8em; } .helper__body { font-size: 1.3em; padding: 1em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; } .helper--visible { -webkit-transform: translateY(0%); -moz-transform: translateY(0%); -ms-transform: translateY(0%); -o-transform: translateY(0%); transform: translateY(0%); opacity: 1; } @-webkit-keyframes helper-blink { from { opacity: 0; } to { opacity: 0.3; } } @-moz-keyframes helper-blink { from { opacity: 0; } to { opacity: 0.3; } } @-o-keyframes helper-blink { from { opacity: 0; } to { opacity: 0.3; } } @keyframes helper-blink { from { opacity: 0; } to { opacity: 0.3; } } .helper-blink { position: absolute; top: 0; right: 0; left: 0; bottom: 0; background-color: #fff; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; -webkit-animation-duration: 0.2s; -moz-animation-duration: 0.2s; -o-animation-duration: 0.2s; animation-duration: 0.2s; -webkit-animation-name: helper-blink; -moz-animation-name: helper-blink; -o-animation-name: helper-blink; animation-name: helper-blink; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; -o-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-direction: alternate; -moz-animation-direction: alternate; -o-animation-direction: alternate; animation-direction: alternate; pointer-events: none; } .pincode { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #1d1f20; z-index: 20; } .pincode__container { margin: auto; max-width: 80%; padding-top: 6em; } .pincode__title { font-size: 2.2em; margin-bottom: 0.7em; line-height: 1.4; font-weight: 300; width: 100%; } .pincode__body { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .pincode__left { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; padding-top: 1.6em; } .pincode__right { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; font-size: 1.2em; -webkit-transform: translate3d(0, 50%, 0); -moz-transform: translate3d(0, 50%, 0); transform: translate3d(0, 50%, 0); opacity: 0; -webkit-transition: opacity 0.1s, -webkit-transform 0.3s; transition: opacity 0.1s, -webkit-transform 0.3s; -o-transition: opacity 0.1s, -o-transform 0.3s; -moz-transition: transform 0.3s, opacity 0.1s, -moz-transform 0.3s; transition: transform 0.3s, opacity 0.1s; transition: transform 0.3s, opacity 0.1s, -webkit-transform 0.3s, -moz-transform 0.3s, -o-transform 0.3s; } .pincode__code { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; padding-bottom: 4em; } .pincode__code > div { position: relative; width: 3em; height: 3.8em; -webkit-border-radius: 0.4em; -moz-border-radius: 0.4em; border-radius: 0.4em; background-color: #3E3E3E; } .pincode__code > div::before { display: block; content: ""; position: absolute; bottom: -1em; left: 0; width: 100%; height: 0.2em; background-color: #ddd; } .pincode__code > div + div { margin-left: 2em; } .pincode__code > div.fill::after { display: block; content: ""; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; background-color: #ddd; position: absolute; top: 50%; left: 50%; width: 1em; height: 1em; margin: -0.5em; } .pincode__text { margin-top: 2em; max-width: 62%; line-height: 1.6; font-size: 1.2em; } .pincode .head-backward { margin: 0; } .pincode.mobile .pincode__container { padding-top: 2em; height: 90vh; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } @media screen and (min-width: 580px) { .pincode.mobile .pincode__container { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; -moz-box-orient: horizontal; -moz-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: normal; -webkit-justify-content: normal; -moz-box-pack: normal; -ms-flex-pack: normal; justify-content: normal; } } .pincode.mobile .pincode__code { display: grid; grid-template-columns: repeat(4, 1fr); gap: 3em; } @media screen and (min-width: 580px) { .pincode.mobile .pincode__code { width: 40%; gap: 1.8em; } } .pincode.mobile .pincode__code > div { width: auto; min-height: 4em; height: 7vh; } .pincode.mobile .pincode__code > div + div { margin-left: 0; } .pincode.animate .pincode__right { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; } body.mouse--controll .pincode__container { padding-top: 1em; } @media screen and (min-width: 580px) { body.mouse--controll .pincode.mobile .pincode__container { padding: 0; height: 80vh; } } .pincode-remote { height: 30em; width: 13em; background: -webkit-gradient(linear, left top, left bottom, from(black), to(transparent)); background: -webkit-linear-gradient(top, black, transparent); background: -moz-linear-gradient(top, black, transparent); background: -o-linear-gradient(top, black, transparent); background: linear-gradient(180deg, black, transparent); -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; position: relative; padding-top: 10em; } .pincode-remote__light { position: absolute; top: 1em; right: 1em; background-color: red; width: 0.5em; height: 0.5em; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; } .pincode-remote__circle { width: 9em; height: 9em; margin: auto; position: relative; } .pincode-remote__circle-center { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; height: 4.4em; } .pincode-remote__circle-pulse { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; opacity: 0; border: 0.2em solid #fff; } .pincode-remote__nums { position: absolute; top: 0; left: 0; width: 9em; height: 9em; } .pincode-remote__nums span { font-size: 1.2em; padding: 0.2em 0.3em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; min-width: 1.4em; display: inline-block; } .pincode-remote__num-top, .pincode-remote__num-bottom { height: 2.3em; text-align: center; padding-top: 0.3em; } .pincode-remote__num-left, .pincode-remote__num-right { width: 2.3em; text-align: center; } .pincode-remote__num-center { width: 4.4em; text-align: center; } .pincode-remote__remove { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; width: 9em; margin: auto; margin-top: 2em; } .pincode-remote__remove-icon { width: 1.6em; height: 1.6em; margin-right: 1em; } .pincode-remote__remove-text { font-size: 0.9em; } .pincode-remote.push .pincode-remote__circle-pulse { -webkit-animation: animation-pincode-remote-pulse 300ms linear forwards; -moz-animation: animation-pincode-remote-pulse 300ms linear forwards; -o-animation: animation-pincode-remote-pulse 300ms linear forwards; animation: animation-pincode-remote-pulse 300ms linear forwards; } .pincode-remote.push .pincode-remote__circle svg { -webkit-animation: animation-pincode-remote-pulse-circle 200ms ease 0s 1 normal forwards; -moz-animation: animation-pincode-remote-pulse-circle 200ms ease 0s 1 normal forwards; -o-animation: animation-pincode-remote-pulse-circle 200ms ease 0s 1 normal forwards; animation: animation-pincode-remote-pulse-circle 200ms ease 0s 1 normal forwards; } .pincode-remote.push .pincode-remote__light { -webkit-animation: animation-pincode-remote-light 300ms ease 0s 1 normal forwards; -moz-animation: animation-pincode-remote-light 300ms ease 0s 1 normal forwards; -o-animation: animation-pincode-remote-light 300ms ease 0s 1 normal forwards; animation: animation-pincode-remote-light 300ms ease 0s 1 normal forwards; } @-webkit-keyframes animation-pincode-remote-pulse { 0% { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } 100% { -webkit-transform: scale(1.2); transform: scale(1.2); opacity: 0; } } @-moz-keyframes animation-pincode-remote-pulse { 0% { -moz-transform: scale(1); transform: scale(1); opacity: 1; } 100% { -moz-transform: scale(1.2); transform: scale(1.2); opacity: 0; } } @-o-keyframes animation-pincode-remote-pulse { 0% { -o-transform: scale(1); transform: scale(1); opacity: 1; } 100% { -o-transform: scale(1.2); transform: scale(1.2); opacity: 0; } } @keyframes animation-pincode-remote-pulse { 0% { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 1; } 100% { -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); opacity: 0; } } @-webkit-keyframes animation-pincode-remote-pulse-circle { 0% { -webkit-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.1); transform: scale(1.1); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @-moz-keyframes animation-pincode-remote-pulse-circle { 0% { -moz-transform: scale(1); transform: scale(1); } 50% { -moz-transform: scale(1.1); transform: scale(1.1); } 100% { -moz-transform: scale(1); transform: scale(1); } } @-o-keyframes animation-pincode-remote-pulse-circle { 0% { -o-transform: scale(1); transform: scale(1); } 50% { -o-transform: scale(1.1); transform: scale(1.1); } 100% { -o-transform: scale(1); transform: scale(1); } } @keyframes animation-pincode-remote-pulse-circle { 0% { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); } 100% { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); transform: scale(1); } } @-webkit-keyframes animation-pincode-remote-light { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } @-moz-keyframes animation-pincode-remote-light { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } @-o-keyframes animation-pincode-remote-light { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } @keyframes animation-pincode-remote-light { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } .pincode-keyboard { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3em; height: 40vh; margin-top: 3em; background: #3e3e3e; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; padding: 3em; -webkit-box-shadow: 0px 1 3em #000; -moz-box-shadow: 0px 1 3em #000; box-shadow: 0px 1 3em #000; } @media screen and (min-width: 580px) { .pincode-keyboard { margin-top: 0; margin-left: auto; width: 40%; height: 70vh; } } .pincode-keyboard > div { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; } .pincode-keyboard > div span { font-size: 2.2em; font-weight: 600; } .pincode-keyboard > div svg { width: 2.4em !important; height: 2.4em !important; } .pincode-keyboard > div.focus { background: white; color: #000; } .pincode-keyboard > div.focus svg { -webkit-filter: invert(1); filter: invert(1); } .no-network { position: fixed; z-index: 100; background: #1e1f21; left: 0; right: 0; bottom: 0; top: 0; padding: 2em; } .no-network__title { font-size: 2.2em; } .no-network__desc { font-size: 1.5em; margin-top: 0.7em; line-height: 1.2; } .screensaver-layer { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 10000; display: none; } .screensaver { position: fixed; right: 0; bottom: 0; z-index: 10000; background-color: #000; top: 0; left: 0; } .screensaver__video { position: fixed; top: 0; width: 100%; height: 100%; left: 0; -o-object-fit: cover; object-fit: cover; } .screensaver__video-overlay { position: fixed; left: 0; top: 0; width: 100%; height: 100%; opacity: 1; background-color: #000; } .screensaver__title { position: fixed; bottom: 10%; z-index: 3; left: 5%; width: 50%; text-shadow: 2px 2px 2px #000; opacity: 0; -webkit-transition: opacity 0.5s; -o-transition: opacity 0.5s; -moz-transition: opacity 0.5s; transition: opacity 0.5s; } .screensaver__title.visible { opacity: 0.5; } .screensaver__title-name { font-size: 3em; font-weight: 300; margin-bottom: 0.25em; } .screensaver__title-tagline { font-weight: 300; font-size: 1.5em; } .screensaver__preload { position: fixed; top: 0; width: 100%; height: 100%; left: 0; background: url(../img/loader.svg) no-repeat 50% 50%; } .screensaver__slides > img { position: fixed; top: 0; width: 100%; height: 100%; left: 0; -webkit-transition: opacity 0.5s; -o-transition: opacity 0.5s; -moz-transition: opacity 0.5s; transition: opacity 0.5s; opacity: 0; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50%; } .screensaver__slides > img.visible { opacity: 1; } .screensaver__slides > img.lt { -webkit-transform-origin: 0 0; -moz-transform-origin: 0 0; -ms-transform-origin: 0 0; -o-transform-origin: 0 0; transform-origin: 0 0; } .screensaver__slides > img.rt { -webkit-transform-origin: 100% 0; -moz-transform-origin: 100% 0; -ms-transform-origin: 100% 0; -o-transform-origin: 100% 0; transform-origin: 100% 0; } .screensaver__slides > img.br { -webkit-transform-origin: 100% 100%; -moz-transform-origin: 100% 100%; -ms-transform-origin: 100% 100%; -o-transform-origin: 100% 100%; transform-origin: 100% 100%; } .screensaver__slides > img.lb { -webkit-transform-origin: 0 100%; -moz-transform-origin: 0 100%; -ms-transform-origin: 0 100%; -o-transform-origin: 0 100%; transform-origin: 0 100%; } .screensaver__slides > img.ct { -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50%; } .screensaver__slides > img.animate { -webkit-animation: screensaver-slide-animate 45s linear; -moz-animation: screensaver-slide-animate 45s linear; -o-animation: screensaver-slide-animate 45s linear; animation: screensaver-slide-animate 45s linear; } .screensaver__gradient { position: fixed; bottom: 0; left: 0; width: 100%; height: 45%; background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), color-stop(1%, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.75))); background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 1%, rgba(0, 0, 0, 0.75) 100%); background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 1%, rgba(0, 0, 0, 0.75) 100%); background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 1%, rgba(0, 0, 0, 0.75) 100%); background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 1%, rgba(0, 0, 0, 0.75) 100%); z-index: 2; } .screensaver__datetime { position: fixed; bottom: 10%; z-index: 3; right: 5%; width: 50%; text-shadow: 2px 2px 2px #000; text-align: right; opacity: 1; -webkit-transition: opacity 0.5s; -o-transition: opacity 0.5s; -moz-transition: opacity 0.5s; transition: opacity 0.5s; opacity: 0.5; } .screensaver__datetime-time { font-size: 3em; font-weight: 300; margin-bottom: 0.25em; } .screensaver__datetime-date { font-weight: 300; font-size: 1.5em; } .screensaver-chrome { position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 10000; } .screensaver-chrome__iframe { position: fixed; border: 0; left: 0; top: 0; width: 100%; height: 100%; z-index: 1; } .screensaver-chrome__overlay { position: fixed; border: 0; left: 0; top: 0; width: 100%; height: 100%; z-index: 2; } @-webkit-keyframes screensaver-slide-animate { from { -webkit-transform: scale(1); transform: scale(1); } to { -webkit-transform: scale(1.2); transform: scale(1.2); } } @-moz-keyframes screensaver-slide-animate { from { -moz-transform: scale(1); transform: scale(1); } to { -moz-transform: scale(1.2); transform: scale(1.2); } } @-o-keyframes screensaver-slide-animate { from { -o-transform: scale(1); transform: scale(1); } to { -o-transform: scale(1.2); transform: scale(1.2); } } @keyframes screensaver-slide-animate { from { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); transform: scale(1); } to { -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } } .plugins-catalog__title { font-size: 1.7em; line-height: 1.4; } .plugins-catalog__descr { font-size: 1.2em; line-height: 1.6; margin-bottom: 1.2em; font-weight: 300; } .plugins-catalog__line { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; padding: 1em 1em; font-size: 1.2em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; background-color: #323232; white-space: nowrap; } .plugins-catalog__line:nth-child(2n) { background-color: transparent; } .plugins-catalog__line.focus { background-color: #fff; color: #323232; } @media screen and (min-width: 767px) { .plugins-catalog__line.focus .plugins-catalog__detail { display: none; } .plugins-catalog__line.focus .plugins-catalog__button { display: block; } } @media screen and (max-width: 480px) { .plugins-catalog__line { display: block; } } .plugins-catalog__url { padding-right: 2em; margin-right: auto; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; } @media screen and (max-width: 480px) { .plugins-catalog__url { margin-bottom: 0.6em; } } .plugins-catalog__button { display: none; } .plugins-catalog__block + .plugins-catalog__block { margin-top: 4em; } @-webkit-keyframes scan { from { left: 0%; } to { left: 80%; } } @-moz-keyframes scan { from { left: 0%; } to { left: 80%; } } @-o-keyframes scan { from { left: 0%; } to { left: 80%; } } @keyframes scan { from { left: 0%; } to { left: 80%; } } .broadcast__text { font-size: 1.2em; line-height: 1.6; margin-bottom: 1em; text-align: center; } .broadcast__scan { position: relative; height: 0.2em; margin-bottom: 1em; } .broadcast__scan > div { background-color: #fff; position: absolute; left: 0%; height: 100%; width: 20%; -webkit-border-radius: 5em; -moz-border-radius: 5em; border-radius: 5em; -webkit-animation-duration: 1s; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-name: scan; -moz-animation-name: scan; -o-animation-name: scan; animation-name: scan; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; -o-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-direction: alternate; -moz-animation-direction: alternate; -o-animation-direction: alternate; animation-direction: alternate; -webkit-animation-timing-function: linear; -moz-animation-timing-function: linear; -o-animation-timing-function: linear; animation-timing-function: linear; } .broadcast__device { font-size: 1.2em; padding: 1em; background-color: rgba(255, 255, 255, 0.1); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; } .broadcast__device:nth-child(2n) { background-color: transparent; } .broadcast__device.focus { background-color: #fff; color: #000; } .watched-history { position: relative; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; background-color: rgba(0, 0, 0, 0.3); display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; padding: 1em; margin-bottom: 1em; } .watched-history__icon { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .watched-history__icon > svg { width: 1.5em !important; height: 1.5em !important; } .watched-history__body { padding-left: 1em; padding-top: 0.1em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .watched-history__body > span + span::before { content: " ● "; vertical-align: top; display: inline-block; margin: 0 0.5em; } .watched-history.focus::after { content: ""; position: absolute; top: -0.5em; left: -0.5em; right: -0.5em; bottom: -0.5em; -webkit-border-radius: 0.7em; -moz-border-radius: 0.7em; border-radius: 0.7em; border: solid 0.3em #fff; z-index: -1; pointer-events: none; } .timetable { padding: 0 1.5em; } .timetable:after { content: ""; display: block; clear: both; } .timetable__inner { padding-bottom: 100%; } @media screen and (max-width: 480px) { .timetable__inner { padding-bottom: 120%; } } @media screen and (max-width: 400px) { .timetable__inner { padding-bottom: 115%; } } .timetable__item { float: left; width: 14.28%; position: relative; } @media screen and (max-width: 767px) { .timetable__item { width: 20%; } } @media screen and (max-width: 580px) { .timetable__item { width: 25%; } } @media screen and (max-width: 400px) { .timetable__item { width: 33.33%; } } .timetable__item:before { content: ""; display: block; position: absolute; top: 0.2em; left: 0.2em; right: 0.2em; bottom: 0.2em; background-color: rgba(255, 255, 255, 0.1); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; } .timetable__item--any:before { background-color: rgba(255, 255, 255, 0.3); } .timetable__item.focus { color: #000; } .timetable__item.focus:before { background-color: #fff; } .timetable__body { position: absolute; left: 1em; bottom: 1em; right: 1em; } .timetable__body > div { white-space: nowrap; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-height: 1.4; } .timetable__body > div > span { display: inline-block; width: 0.5em; height: 0.9em; margin-right: 0.5em; -webkit-border-radius: 0.2em; -moz-border-radius: 0.2em; border-radius: 0.2em; margin-bottom: -0.1em; } .timetable__date { position: absolute; top: 1em; left: 1em; font-size: 0.9em; } .timetable__preview { margin-bottom: 0.8em; } .timetable__preview > img { width: 5em; height: 3.1em; margin-bottom: 0.3em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; } .timetable__preview > div { font-size: 0.9em; } .extensions { position: fixed; top: 0; left: 0; right: 0; bottom: 0; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; z-index: 20; background-color: #232425; } .extensions__head { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; padding: 1em 1.5em; } .extensions__head-title { font-size: 1.5em; } .extensions__block-head { padding: 0 1.5em; margin-bottom: 1em; } .extensions__block-title { font-size: 1.2em; } .extensions__block-body { min-height: 10em; } .extensions__block-body .scroll__body { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .extensions__block-empty, .extensions__block-add { padding: 1em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 20em; min-height: 10em; position: relative; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .extensions__block-empty.focus:after, .extensions__block-add.focus:after { content: ""; position: absolute; top: -0.5em; left: -0.5em; right: -0.5em; bottom: -0.5em; border: 0.3em solid #fff; -webkit-border-radius: 1.4em; -moz-border-radius: 1.4em; border-radius: 1.4em; z-index: -1; pointer-events: none; } .extensions__block-add { -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; background-color: #404040; margin-right: 1em; } .extensions__block + .extensions__block { margin-top: 2.4em; } .extensions__item { background-color: #404040; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; padding: 1em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; min-height: 10em; width: 20em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; position: relative; will-change: transform; } .extensions__item-author { color: #8D8D8D; font-size: 0.84em; margin-bottom: 0.4em; } .extensions__item-name { font-size: 1.1em; line-height: normal; margin-bottom: 0.8em; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; } .extensions__item-descr { line-height: 1.5; margin-bottom: 0.3em; font-size: 0.84em; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; } .extensions__item-footer { margin-top: auto; padding-top: 1em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .extensions__item-check { width: 1.2em; height: 1.2em; background-color: rgba(0, 0, 0, 0.18); background-image: url(../img/loader.svg); background-repeat: no-repeat; -webkit-background-size: 1em 1em; -moz-background-size: 1em; -o-background-size: 1em; background-size: 1em; background-position: 50% 50%; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; } .extensions__item-code { background-color: rgba(0, 0, 0, 0.18); -webkit-border-radius: 0.1em; -moz-border-radius: 0.1em; border-radius: 0.3em; padding: 0.3em 0.4em 0.4em; font-size: 0.78em; margin-right: 1em; } .extensions__item-code.success { color: #6DCE4B; } .extensions__item-code.error { color: #DD7337; } .extensions__item-code.yellow { color: #ffd016; } .extensions__item-error { width: 1.2em; height: 1.2em; background: #d74545; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; margin-right: 0.5em; position: relative; } .extensions__item-error::after { content: "!"; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); color: #fff; font-size: 0.8em; font-weight: 900; } .extensions__item-proto { margin-right: 0.5em; } .extensions__item-proto > svg { width: 1em !important; height: 1em !important; } .extensions__item-proto.protocol-https { color: #6DCE4B; } .extensions__item-proto.protocol-http { opacity: 0.3; } .extensions__item-status { font-size: 0.78em; color: #8D8D8D; } .extensions__item-disabled { background-color: rgba(0, 0, 0, 0.18); -webkit-border-radius: 0.1em; -moz-border-radius: 0.1em; border-radius: 0.3em; padding: 0.3em 0.4em 0.4em; font-size: 0.78em; margin-left: auto; color: #DD7337; } .extensions__item-included { width: 1.2em; height: 1.2em; background-color: rgba(0, 0, 0, 0.18); -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; text-align: center; padding-top: 0.24em; margin-right: 0.5em; } .extensions__item-included:after { content: ""; display: inline-block; width: 0.2em; height: 0.4em; border-right: 0.15em solid #fff; border-bottom: 0.15em solid #fff; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .extensions__item-premium { margin-left: 1em; background-color: #D8C39A; color: #000; padding: 0.1em 0.5em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; font-size: 0.8em; } .extensions__item-body { padding: 1em; } .extensions__item-imagebox { position: relative; padding-bottom: 57%; background-color: #5c5c5c; -webkit-border-top-left-radius: 1em; -moz-border-radius-topleft: 1em; border-top-left-radius: 1em; -webkit-border-top-right-radius: 1em; -moz-border-radius-topright: 1em; border-top-right-radius: 1em; } .extensions__item-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; -webkit-transition: opacity 0.2s; -o-transition: opacity 0.2s; -moz-transition: opacity 0.2s; transition: opacity 0.2s; -webkit-border-top-left-radius: 1em; -moz-border-radius-topleft: 1em; border-top-left-radius: 1em; -webkit-border-top-right-radius: 1em; -moz-border-radius-topright: 1em; border-top-right-radius: 1em; } .extensions__item-image.loaded { opacity: 1; } .extensions__item-overlay { position: absolute; bottom: 0; right: 0; padding: 1em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; left: 0; background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), color-stop(99%, rgba(0, 0, 0, 0.89)), to(rgba(0, 0, 0, 0.89))); background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.89) 99%, rgba(0, 0, 0, 0.89) 100%); background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.89) 99%, rgba(0, 0, 0, 0.89) 100%); background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.89) 99%, rgba(0, 0, 0, 0.89) 100%); background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.89) 99%, rgba(0, 0, 0, 0.89) 100%); -webkit-border-bottom-right-radius: 1em; -moz-border-radius-bottomright: 1em; border-bottom-right-radius: 1em; -webkit-border-bottom-left-radius: 1em; -moz-border-radius-bottomleft: 1em; border-bottom-left-radius: 1em; padding-top: 4em; } .extensions__item + .extensions__item { margin-left: 1em; } .extensions__item.focus:after { content: ""; position: absolute; top: -0.5em; left: -0.5em; right: -0.5em; bottom: -0.5em; border: 0.3em solid #fff; -webkit-border-radius: 1.4em; -moz-border-radius: 1.4em; border-radius: 1.4em; z-index: -1; pointer-events: none; } .extensions__item--recomend { padding: 0; width: 32.7%; min-width: 20em; } .extensions__item--theme, .extensions__item--screensaver { padding: 0; } .extensions__item--theme .extensions__item-name, .extensions__item--screensaver .extensions__item-name { margin-bottom: 0; } .extensions__item--theme .extensions__item-premium, .extensions__item--screensaver .extensions__item-premium { position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); -webkit-border-top-left-radius: 0; -moz-border-radius-topleft: 0; border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -moz-border-radius-topright: 0; border-top-right-radius: 0; margin: 0; } .extensions__item--screensaver { width: 30%; min-width: 20em; } .extensions__item--screensaver .extensions__item-imagebox, .extensions__item--screensaver .extensions__item-image { -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; } .extensions__item--screensaver .extensions__item-time { padding-left: 1em; margin-left: auto; } .extensions__item.active:before { content: "✔"; position: absolute; top: 1em; right: 1em; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; width: 2em; height: 2em; background-color: #fff; display: block; z-index: 1; color: #000; text-align: center; line-height: 2em; } .extensions__cub { position: absolute; top: 1em; right: 1em; background-color: rgba(0, 0, 0, 0.18); -webkit-border-radius: 0.1em; -moz-border-radius: 0.1em; border-radius: 0.3em; padding: 0.3em 0.4em 0.4em; font-size: 0.78em; } .extensions-info { line-height: 1.8; } .extensions-info > * + * { margin-top: 2em; } .extensions-info__image { -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; width: 100%; } .extensions-info__descr { font-size: 1.2em; } .extensions-info__instruction { font-size: 1.1em; } .extensions-info__footer { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .extensions-info__footer > div { width: 50%; padding-top: 0.5em; } .extensions-info__label { padding-top: 0.1em; color: rgba(255, 255, 255, 0.5); } .extensions-info__value { font-size: 1.1em; word-break: break-all; padding-right: 1em; } .ad-countdown { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; background-color: rgba(0, 0, 0, 0.3); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; } .ad-countdown__text { padding: 0.4em; } .ad-countdown__time { min-width: 1em; text-align: center; background-color: #ffe216; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; padding: 0.4em; min-width: 2em; color: #000; } .ad-countdown--player { position: absolute; right: 0; bottom: 100%; margin-bottom: 3em; -webkit-transition: margin-bottom 0.3s; -o-transition: margin-bottom 0.3s; -moz-transition: margin-bottom 0.3s; transition: margin-bottom 0.3s; } .player .player-panel.panel--visible .ad-countdown.ad-countdown--player { margin-bottom: 1em; } @-webkit-keyframes ad-video-loader { 0% { background-position: -150% 0, -150% 0; } 66% { background-position: 250% 0, -150% 0; } 100% { background-position: 250% 0, 250% 0; } } @-moz-keyframes ad-video-loader { 0% { background-position: -150% 0, -150% 0; } 66% { background-position: 250% 0, -150% 0; } 100% { background-position: 250% 0, 250% 0; } } @-o-keyframes ad-video-loader { 0% { background-position: -150% 0, -150% 0; } 66% { background-position: 250% 0, -150% 0; } 100% { background-position: 250% 0, 250% 0; } } @keyframes ad-video-loader { 0% { background-position: -150% 0, -150% 0; } 66% { background-position: 250% 0, -150% 0; } 100% { background-position: 250% 0, 250% 0; } } .ad-video-block { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #000; z-index: 60; } .ad-video-block__loader { position: absolute; left: 50%; top: 50%; height: 0.5em; width: 10em; margin: -0.2em 0 0 -5em; background: no-repeat -webkit-gradient(linear, left top, left bottom, color-stop(0, #ffe216)), no-repeat -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff)), rgba(255, 255, 255, 0.1); background: no-repeat -webkit-linear-gradient(#ffe216 0 0), no-repeat -webkit-linear-gradient(#fff 0 0), rgba(255, 255, 255, 0.1); background: no-repeat -moz-linear-gradient(#ffe216 0 0), no-repeat -moz-linear-gradient(#fff 0 0), rgba(255, 255, 255, 0.1); background: no-repeat -o-linear-gradient(#ffe216 0 0), no-repeat -o-linear-gradient(#fff 0 0), rgba(255, 255, 255, 0.1); background: no-repeat linear-gradient(#ffe216 0 0), no-repeat linear-gradient(#fff 0 0), rgba(255, 255, 255, 0.1); -webkit-background-size: 60% 100%; -moz-background-size: 60% 100%; -o-background-size: 60% 100%; background-size: 60% 100%; -webkit-animation: ad-video-loader 3s infinite; -moz-animation: ad-video-loader 3s infinite; -o-animation: ad-video-loader 3s infinite; animation: ad-video-loader 3s infinite; -webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; } .ad-video-block__video { position: fixed; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; } .ad-video-block__video.loaded { opacity: 1; } .ad-video-block__vast { position: fixed; top: 0px; left: 0; width: 100%; height: 100%; pointer-events: none; } .ad-video-block__vast-line { position: fixed; left: 0; bottom: 0; width: 100%; background-color: #000; height: 4em; } .ad-video-block__footer { position: fixed; left: 0; right: 0; bottom: 0; } .ad-video-block__text { padding: 1em; color: #fff; text-shadow: 0 0em 0.4em #000; max-width: 80%; } .ad-video-block__info { position: fixed; top: 0; left: 0; padding: 1em; color: #fff; text-shadow: 0 0em 0.4em #000; font-size: 0.9em; } .ad-video-block__progress { background-color: rgba(0, 0, 0, 0.3); } .ad-video-block__progress-fill { background-color: #ffe216; height: 0.3em; width: 0%; -webkit-transition: width 0.1s linear; -o-transition: width 0.1s linear; -moz-transition: width 0.1s linear; transition: width 0.1s linear; } .ad-video-block__skip { position: fixed; right: 1em; bottom: 1em; background-color: rgba(0, 0, 0, 0.5); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; } .ad-video-block__skip span { display: inline-block; padding: 0.4em; min-width: 2em; text-align: center; } .ad-preroll { position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 60; } .ad-preroll__bg, .ad-preroll__over { position: fixed; background: #454545; left: 0; top: 0; width: 100%; height: 100%; -webkit-transform: translate3d(-100%, 0, 0); -moz-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); -webkit-transition: -webkit-transform 0.4s; transition: -webkit-transform 0.4s; -o-transition: -o-transform 0.4s; -moz-transition: transform 0.4s, -moz-transform 0.4s; transition: transform 0.4s; transition: transform 0.4s, -webkit-transform 0.4s, -moz-transform 0.4s, -o-transform 0.4s; } .ad-preroll__bg.animate, .ad-preroll__over.animate { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .ad-preroll__over { background: #000; } .ad-preroll__text { position: fixed; text-align: center; left: 0; top: 50%; width: 100%; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition: opacity 0.4s, -webkit-transform 0.6s; transition: opacity 0.4s, -webkit-transform 0.6s; -o-transition: opacity 0.4s, -o-transform 0.6s; -moz-transition: transform 0.6s, opacity 0.4s, -moz-transform 0.6s; transition: transform 0.6s, opacity 0.4s; transition: transform 0.6s, opacity 0.4s, -webkit-transform 0.6s, -moz-transform 0.6s, -o-transform 0.6s; color: #fff; font-size: 4em; font-weight: 700; opacity: 0; } @media screen and (max-width: 580px) { .ad-preroll__text { font-size: 2.3em; } } .ad-preroll__text.animate { -webkit-transform: translate3d(0, -50%, 0); -moz-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0); opacity: 1; } .ad-server { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -webkit-align-items: flex-start; -moz-box-align: start; -ms-flex-align: start; align-items: flex-start; position: relative; background-color: rgba(255, 255, 255, 0.1); -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; margin: 1.5em 2em; } .ad-server__text { padding: 1em; -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; line-height: 1.4; } .ad-server__qr { width: 8em; height: 8em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .ad-server__qr svg { width: 8em !important; height: 8em !important; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; } .ad-server__label { position: absolute; left: 0; bottom: 0; background-color: #ffe216; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; padding: 0.5em; color: #000; } .online { padding: 1.2em; -webkit-border-radius: 0.3em; -moz-border-radius: 0.3em; border-radius: 0.3em; background-color: rgba(0, 0, 0, 0.3); position: relative; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; } .online__title { font-size: 1.6em; } .online__body { position: relative; } .online .time-line { position: absolute; left: 0; bottom: 0; right: 0; } .online__quality { margin-top: 1em; } .online + .online { margin-top: 1em; } .online.focus { -webkit-box-shadow: 0 0 0 0.2em #fff; -moz-box-shadow: 0 0 0 0.2em #fff; box-shadow: 0 0 0 0.2em #fff; margin-left: -0.8em; margin-right: -0.8em; padding: 1.2em 1.8em; } @-webkit-keyframes animation-remote-button-blink { 0% { fill-opacity: 0.4; } 20% { fill-opacity: 1; } 60% { fill-opacity: 1; } 100% { fill-opacity: 0.4; } } @-moz-keyframes animation-remote-button-blink { 0% { fill-opacity: 0.4; } 20% { fill-opacity: 1; } 60% { fill-opacity: 1; } 100% { fill-opacity: 0.4; } } @-o-keyframes animation-remote-button-blink { 0% { fill-opacity: 0.4; } 20% { fill-opacity: 1; } 60% { fill-opacity: 1; } 100% { fill-opacity: 0.4; } } @keyframes animation-remote-button-blink { 0% { fill-opacity: 0.4; } 20% { fill-opacity: 1; } 60% { fill-opacity: 1; } 100% { fill-opacity: 0.4; } } .remote-helper { position: absolute; top: 100%; right: 1.5em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; z-index: 10; pointer-events: none; opacity: 0; -webkit-transition: opacity 0.15s ease, -webkit-transform 0.2s ease; transition: opacity 0.15s ease, -webkit-transform 0.2s ease; -o-transition: opacity 0.15s ease, -o-transform 0.2s ease; -moz-transition: opacity 0.15s ease, transform 0.2s ease, -moz-transform 0.2s ease; transition: opacity 0.15s ease, transform 0.2s ease; transition: opacity 0.15s ease, transform 0.2s ease, -webkit-transform 0.2s ease, -moz-transform 0.2s ease, -o-transform 0.2s ease; line-height: 1.4; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .remote-helper.active { opacity: 1; -webkit-transform: translate3d(0, -100%, 0); -moz-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } .remote-helper__textbox { background: rgba(0, 0, 0, 0.6); -webkit-border-radius: 0.5em; -moz-border-radius: 0.5em; border-radius: 0.5em; padding: 0.8em 1em; margin-right: 1em; width: 11em; margin-top: 1.5em; } .remote-helper__text { overflow: hidden; -o-text-overflow: "."; text-overflow: "."; display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; } .remote-helper__remote { width: 9.5em; height: auto; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .remote-helper__remote svg { width: 9.5em !important; height: 12.8em !important; } .remote-helper.highlight--ok .remote-helper__button-ok { -webkit-animation: animation-remote-button-blink 1s ease infinite; -moz-animation: animation-remote-button-blink 1s ease infinite; -o-animation: animation-remote-button-blink 1s ease infinite; animation: animation-remote-button-blink 1s ease infinite; } .remote-helper.highlight--up .remote-helper__button-up { -webkit-animation: animation-remote-button-blink 1s ease infinite; -moz-animation: animation-remote-button-blink 1s ease infinite; -o-animation: animation-remote-button-blink 1s ease infinite; animation: animation-remote-button-blink 1s ease infinite; } .remote-helper.highlight--down .remote-helper__button-down { -webkit-animation: animation-remote-button-blink 1s ease infinite; -moz-animation: animation-remote-button-blink 1s ease infinite; -o-animation: animation-remote-button-blink 1s ease infinite; animation: animation-remote-button-blink 1s ease infinite; } .remote-helper.highlight--left .remote-helper__button-left { -webkit-animation: animation-remote-button-blink 1s ease infinite; -moz-animation: animation-remote-button-blink 1s ease infinite; -o-animation: animation-remote-button-blink 1s ease infinite; animation: animation-remote-button-blink 1s ease infinite; } .remote-helper.highlight--right .remote-helper__button-right { -webkit-animation: animation-remote-button-blink 1s ease infinite; -moz-animation: animation-remote-button-blink 1s ease infinite; -o-animation: animation-remote-button-blink 1s ease infinite; animation: animation-remote-button-blink 1s ease infinite; } .iframe { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 100; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; background-color: rgba(0, 0, 0, 0.8); } .iframe__body { position: fixed; top: 2em; right: 2em; bottom: 2em; left: 2em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; background: url(../img/loader.svg) no-repeat 50% 50%; } .iframe__window { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 100%; height: 100%; background-color: transparent; border: 0; pointer-events: none; } .iframe--loaded .iframe__window { background-color: #fff; } .mapping--line { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } .mapping--line > * + * { margin-left: 1em; } .mapping--list { padding: 0 1em; } .mapping--list > * + * { margin-top: 1em; } .mapping--grid { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; padding: 0 1em; } .mapping--grid > * { padding: 0 0.5em 1em 0.5em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .cols--3 > * { width: 33.3333333333%; } @media screen and (max-width: 767px) { .cols--3 > * { width: 50%; } } @media screen and (max-width: 580px) { .cols--3 > * { width: 100%; } } @media screen and (max-width: 480px) { .cols--3 > * { width: 100%; } } .cols--4 > * { width: 25%; } @media screen and (max-width: 767px) { .cols--4 > * { width: 33.3333333333%; } } @media screen and (max-width: 580px) { .cols--4 > * { width: 50%; } } @media screen and (max-width: 480px) { .cols--4 > * { width: 100%; } } .cols--5 > * { width: 20%; } @media screen and (max-width: 767px) { .cols--5 > * { width: 25%; } } @media screen and (max-width: 580px) { .cols--5 > * { width: 33.3333333333%; } } @media screen and (max-width: 480px) { .cols--5 > * { width: 50%; } } .cols--6 > * { width: 16.6666666667%; } @media screen and (max-width: 767px) { .cols--6 > * { width: 20%; } } @media screen and (max-width: 580px) { .cols--6 > * { width: 25%; } } @media screen and (max-width: 480px) { .cols--6 > * { width: 33.3333333333%; } } @media screen and (min-width: 767px) { body.size--bigger .cols--3 > * { width: 50%; } body.size--bigger .cols--4 > * { width: 33.3333333333%; } body.size--bigger .cols--5 > * { width: 25%; } body.size--bigger .cols--6 > * { width: 20%; } } .cols--3 > * { width: 33.3333333333%; } @media screen and (max-width: 767px) { .cols--3 > * { width: 50%; } } @media screen and (max-width: 580px) { .cols--3 > * { width: 100%; } } @media screen and (max-width: 480px) { .cols--3 > * { width: 100%; } } .cols--4 > * { width: 25%; } @media screen and (max-width: 767px) { .cols--4 > * { width: 33.3333333333%; } } @media screen and (max-width: 580px) { .cols--4 > * { width: 50%; } } @media screen and (max-width: 480px) { .cols--4 > * { width: 100%; } } .cols--5 > * { width: 20%; } @media screen and (max-width: 767px) { .cols--5 > * { width: 25%; } } @media screen and (max-width: 580px) { .cols--5 > * { width: 33.3333333333%; } } @media screen and (max-width: 480px) { .cols--5 > * { width: 50%; } } @media screen and (min-width: 767px) { body.size--bigger .cols--3 > * { width: 50%; } body.size--bigger .cols--4 > * { width: 33.3333333333%; } body.size--bigger .cols--5 > * { width: 25%; } } .cols--3 > * { width: 33.3333333333%; } @media screen and (max-width: 767px) { .cols--3 > * { width: 50%; } } @media screen and (max-width: 580px) { .cols--3 > * { width: 100%; } } @media screen and (max-width: 480px) { .cols--3 > * { width: 100%; } } .cols--4 > * { width: 25%; } @media screen and (max-width: 767px) { .cols--4 > * { width: 33.3333333333%; } } @media screen and (max-width: 580px) { .cols--4 > * { width: 50%; } } @media screen and (max-width: 480px) { .cols--4 > * { width: 100%; } } @media screen and (min-width: 767px) { body.size--bigger .cols--3 > * { width: 50%; } body.size--bigger .cols--4 > * { width: 33.3333333333%; } } .cols--3 > * { width: 33.3333333333%; } @media screen and (max-width: 767px) { .cols--3 > * { width: 50%; } } @media screen and (max-width: 580px) { .cols--3 > * { width: 100%; } } @media screen and (max-width: 480px) { .cols--3 > * { width: 100%; } } @media screen and (min-width: 767px) { body.size--bigger .cols--3 > * { width: 50%; } } body.platform--orsay .cols--3, body.platform--orsay .cols--4, body.platform--orsay .cols--5, body.platform--orsay .cols--6, body.platform--netcast .cols--3, body.platform--netcast .cols--4, body.platform--netcast .cols--5, body.platform--netcast .cols--6 { display: block; } body.platform--orsay .cols--3::after, body.platform--orsay .cols--4::after, body.platform--orsay .cols--5::after, body.platform--orsay .cols--6::after, body.platform--netcast .cols--3::after, body.platform--netcast .cols--4::after, body.platform--netcast .cols--5::after, body.platform--netcast .cols--6::after { content: ""; display: block; clear: both; } body.platform--orsay .cols--3 > *, body.platform--orsay .cols--4 > *, body.platform--orsay .cols--5 > *, body.platform--orsay .cols--6 > *, body.platform--netcast .cols--3 > *, body.platform--netcast .cols--4 > *, body.platform--netcast .cols--5 > *, body.platform--netcast .cols--6 > * { float: left; } body.platform--orsay svg, body.platform--netcast svg { max-width: 100%; width: 100%; max-height: 100%; height: 100%; } body.platform--orsay .head__time, body.platform--netcast .head__time { position: absolute; top: 1em; right: 1.5em; } body.platform--orsay .head__split, body.platform--netcast .head__split { display: none; } body.platform--orsay .head__logo-icon, body.platform--netcast .head__logo-icon { margin-right: 1.5em; } body.platform--orsay .head__actions, body.platform--netcast .head__actions { position: absolute; top: 0.4em; right: 18em; } body.platform--orsay .head__markers, body.platform--netcast .head__markers { position: absolute; top: 1.15em; right: 15em; } body.platform--orsay .head__action svg, body.platform--netcast .head__action svg { width: 1.6em; height: 1.6em; } body.platform--orsay .full-start__button > svg, body.platform--netcast .full-start__button > svg { width: 1.5em; height: 1.5em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } body.platform--orsay .full-start__button > span, body.platform--netcast .full-start__button > span { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } body.platform--orsay .full-start__tags > div, body.platform--netcast .full-start__tags > div { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } body.platform--orsay .full-start__tag > img, body.platform--netcast .full-start__tag > img { height: 1em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } body.platform--orsay .full-start__tag > div, body.platform--netcast .full-start__tag > div { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } body.platform--orsay .full-start__buttons-scroll, body.platform--netcast .full-start__buttons-scroll { width: auto; } body.platform--orsay .simple-button > svg, body.platform--netcast .simple-button > svg { width: 1.5em; height: 1.5em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } body.platform--orsay .simple-button > svg + span, body.platform--netcast .simple-button > svg + span { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } body.platform--orsay .simple-button--filter > div, body.platform--netcast .simple-button--filter > div { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } body.platform--orsay .menu__ico, body.platform--netcast .menu__ico { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: left; -webkit-align-items: left; -moz-box-align: left; -ms-flex-align: left; align-items: left; -webkit-box-pack: left; -webkit-justify-content: left; -moz-box-pack: left; -ms-flex-pack: left; justify-content: left; } body.platform--orsay .menu__ico > svg, body.platform--netcast .menu__ico > svg { position: absolute; width: 1.2em; height: 1.2em; margin-right: 1em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } body.platform--orsay .menu__text, body.platform--netcast .menu__text { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } body.platform--orsay .player-panel .button > svg, body.platform--netcast .player-panel .button > svg { position: absolute; width: 1.2em; height: 1.2em; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; } body.platform--orsay .player-panel__timeend, body.platform--netcast .player-panel__timeend { position: absolute; right: 1.5em; } body.platform--orsay .player-panel__position > div::after, body.platform--netcast .player-panel__position > div::after { top: 0.25em; } body.platform--orsay .player-panel__playpause div, body.platform--netcast .player-panel__playpause div { width: 1em; } body.platform--orsay .player-panel__next-episode-name, body.platform--netcast .player-panel__next-episode-name { padding-top: 0.5em; } body.platform--orsay .settings-folder__icon svg, body.platform--netcast .settings-folder__icon svg { width: 2em; height: 2em; } body.platform--orsay .menu__ico svg, body.platform--netcast .menu__ico svg { width: 1.5em; height: 1.5em; } body.platform--orsay .torrent-filter, body.platform--netcast .torrent-filter { margin-bottom: 0; padding-bottom: 2em; } body.platform--orsay .info__icon.icon--book, body.platform--orsay .card__icon.icon--book, body.platform--netcast .info__icon.icon--book, body.platform--netcast .card__icon.icon--book { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAF62lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDIgNzkuMTYwOTI0LCAyMDE3LzA3LzEzLTAxOjA2OjM5ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgKFdpbmRvd3MpIiB4bXA6Q3JlYXRlRGF0ZT0iMjAyMi0wOC0wNlQxMzo1MTo1MyswMzowMCIgeG1wOk1vZGlmeURhdGU9IjIwMjItMDgtMDZUMTM6NTI6MjYrMDM6MDAiIHhtcDpNZXRhZGF0YURhdGU9IjIwMjItMDgtMDZUMTM6NTI6MjYrMDM6MDAiIGRjOmZvcm1hdD0iaW1hZ2UvcG5nIiBwaG90b3Nob3A6Q29sb3JNb2RlPSIzIiBwaG90b3Nob3A6SUNDUHJvZmlsZT0ic1JHQiBJRUM2MTk2Ni0yLjEiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MDA1OGI1ZmYtMmFiNy05NzQ2LTgyN2QtMDEyMzRjMTI0YTA0IiB4bXBNTTpEb2N1bWVudElEPSJhZG9iZTpkb2NpZDpwaG90b3Nob3A6NGViZWE3MzgtOWY5NS1iYzQwLWFiMjgtOWU5MmYyYTBkOWFkIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6ZjRlYjQwNDAtMWUwYi1hYTQwLWI0MjYtNzA5YmEzNjAxMmE0Ij4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDpmNGViNDA0MC0xZTBiLWFhNDAtYjQyNi03MDliYTM2MDEyYTQiIHN0RXZ0OndoZW49IjIwMjItMDgtMDZUMTM6NTE6NTMrMDM6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAoV2luZG93cykiLz4gPHJkZjpsaSBzdEV2dDphY3Rpb249InNhdmVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOjAwNThiNWZmLTJhYjctOTc0Ni04MjdkLTAxMjM0YzEyNGEwNCIgc3RFdnQ6d2hlbj0iMjAyMi0wOC0wNlQxMzo1MjoyNiswMzowMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgc3RFdnQ6Y2hhbmdlZD0iLyIvPiA8L3JkZjpTZXE+IDwveG1wTU06SGlzdG9yeT4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5VtBfmAAACJ0lEQVRoge3aO2gVQRSA4S8So1aCmghKYiU+CIKpLGws7ARFtBLfhZJSO0EUC1stIkQQNZjGF0IKCxEbK8GIIiKICFooiBaCxkjQY7G3CMtNdu6LbLE/DJfZ2TNz/mV2bzGnKyIksAIj2I2/mEkJaoFu9OARTuJLYUREFLV1EfE0Fo43ETEUBXkuSng6h7C9pefbGptrOcxLd8JE63P9T/iIZU0klcI0VufW7S0KShGZzvUv4XJyWs2xH3dm9f8UBaRsraSvwUKTIrIQNJxXWUUaphIpG5VI2ahEykYlUjYqkbJRiZSNSqRsVCJloxIpG5VI2ahEykYlUjYqkbJRiZSNSiSRfozjLjZ2cqFOigzjPQ5gH97ibKcW64TIVrzCFdkR82wuyM4fd7R70XaK9GAUL7BlnvsG8AQPsLJdi7dLZC++4kSdsXu4Wef6HlkhwHA7EmhVpF/2dO9jeW7sN47JTmiPyqomvuXuWSzbgq8x1EoizYhM1X7PmXu/j6MPN2Zdm8Aa2fF2nkFM4lqt/73RpJoRGcJDnEdXbuyDrEriIH7WiZ3BKWzC8zrjx/ESuxrOqqjGIyKuJtaMnEmYK98OR8SvhLmvt6MWpYjHWIuLTcSOycozxlpNIkVk6RzXf8i+VjvxuYUcpnAE2/BujnuWFE2SIlIvyRGskv0XtItn2IDT+JcbK375E/Zxb0Tcqu3VyYgYbOJdaLT1RcREbc3bETFQFPMfBi4+MPqpLd0AAAAASUVORK5CYII="); } body.platform--orsay .info__icon.icon--like, body.platform--orsay .card__icon.icon--like, body.platform--netcast .info__icon.icon--like, body.platform--netcast .card__icon.icon--like { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAF62lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDIgNzkuMTYwOTI0LCAyMDE3LzA3LzEzLTAxOjA2OjM5ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgKFdpbmRvd3MpIiB4bXA6Q3JlYXRlRGF0ZT0iMjAyMi0wOC0wNlQxMzo1MjozMCswMzowMCIgeG1wOk1vZGlmeURhdGU9IjIwMjItMDgtMDZUMTM6NTI6NDUrMDM6MDAiIHhtcDpNZXRhZGF0YURhdGU9IjIwMjItMDgtMDZUMTM6NTI6NDUrMDM6MDAiIGRjOmZvcm1hdD0iaW1hZ2UvcG5nIiBwaG90b3Nob3A6Q29sb3JNb2RlPSIzIiBwaG90b3Nob3A6SUNDUHJvZmlsZT0ic1JHQiBJRUM2MTk2Ni0yLjEiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NmFjZTliMDUtNTczMy01ZDQ2LTgwNzMtYTg2MjhmYWE1YzhmIiB4bXBNTTpEb2N1bWVudElEPSJhZG9iZTpkb2NpZDpwaG90b3Nob3A6ZGM2YWYxZTMtMmYwMC1hZDRmLWJkYWEtNTdmZDdlZDU0OGU5IiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6ODhkYWRlYTMtMDEzNi03MzRiLTkzZTItYTMwYzIzYjQ1YzNmIj4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDo4OGRhZGVhMy0wMTM2LTczNGItOTNlMi1hMzBjMjNiNDVjM2YiIHN0RXZ0OndoZW49IjIwMjItMDgtMDZUMTM6NTI6MzArMDM6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAoV2luZG93cykiLz4gPHJkZjpsaSBzdEV2dDphY3Rpb249InNhdmVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOjZhY2U5YjA1LTU3MzMtNWQ0Ni04MDczLWE4NjI4ZmFhNWM4ZiIgc3RFdnQ6d2hlbj0iMjAyMi0wOC0wNlQxMzo1Mjo0NSswMzowMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgc3RFdnQ6Y2hhbmdlZD0iLyIvPiA8L3JkZjpTZXE+IDwveG1wTU06SGlzdG9yeT4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz42yx8HAAAEKklEQVRogd2aW4iVVRiGn9lTNmnFNJjmCUowEtMJC7GyiEiUIJBIogNMQVEERkoHu7Cwbgwl7Co6kDeGRRFoTgVZZJJoRmBpdCAUsywtlSm0rOHpYu8ta9as+d2Hf2/39MKCtdf6vvd73/Wf/3+3qfwfcEYVsW3ALGA6MLH0+zfgO2AHcLhGDaNKvFOBMaWxA8BuYDvwTyUklRgpAHcBNwLXAhdF84eBz4CPgHXA/koKA53AnSXeq4Cx0fxPwJYS71rgeCabmtUWq/usHP3qK+qYDM4OdZXaVwXvQXVZltahJi5Wt1dRKMaf6m0J3hvUn+vg/Ua9PMFLm4MP9muATUBHYgN+CGwDfqG4744GLgPmAecn4p8AVpT6dwNrEjHHgfeAncAhisfeWOAKYD7QnshZAKzP2rWmDrESKyxupaG24Ei1x/RueLs6LzF+RH1I7crgHacuVf9K5F8fxoZJ7erviU05LaNQ3NrVNcmlGIiNamcVvBPVTyOO/pAjDF4bBe5Sz6yiWNhWZph4rUZO1A8irk9iIzOigBPquXUURH05YaK3Tk7UAxHn3NDIm9HkrTkURF0XcH6cE+eVkdZtZSMXRhM7cipYbovUR3LmfCvSPAP1vmjwlpyLNqJ1R5qXFSjeHpRxDHg/cd5uNewEfgx+X1cAZgYDuymaGQ7YFvQnF4AJwcDe5mqpC7uCfmcBGBkMHGmymHpwNOifVQBOBAPnNFdLXTg76P9bAA4GA5OaLKYeTAn6fQXgy2BgGsW7z+GAWUF/f4GBR38XMKe5emrCeIqPD2VsLQDvRkFLmqenZixi4J7TW75Sbo0v+S1w9R6qdVq8hS9jj0qh5Gh55Hg9rYsNcFI3wNPAgOeReKu83QKrH7fnI417ynNh0DgH48UWEF9uTyX0daeMoC5MBK9qAROLE7oeDmMqTXryNJq4N6FnZRw3VPLjieSlp8FET0LH6lRsFskzCZIHm2hiQaL+q0PFn4psdYKspwkm5ibqvp6VUwnpSwnSRj4Oz07Ue+dUeZWSv5Egn9sAE9MTdTZXkltNkd5Ekdk5mpis/hHxf15pfrXFNifMdOdgYrx6NOL9Vh3RKCOUVinEMfWSOkx0qfsjzn3qqGp4ailcUL+OCh9VJ9TA1aH+EHEdUkdXy1XrKo60eMMW4lezPxHErU39KuLoUyfVoqlWI6gXOPjr0171vArz4y9ix9VLa9VTjxEsvjc+HAn63lMfpFuinH6Lp96atdRrBHWK+nck7IuM+I0Oxpx6deRhBHVmQtymRFz8MUn1pjw05GUE9eqEyA3B/AuJ+YV51c/TCOr8hNhn1ccS4/fkWTtvI6g3J0THuD/vuo0wgnpHholHG1GzUUZQH0iYWN6oeo00grokMDHoOTvPVs3fnGrBcxRf/484+SKtQUj9F2VY4j/PoZgrWh6XUQAAAABJRU5ErkJggg=="); } body.platform--orsay .info__icon.icon--wath, body.platform--orsay .card__icon.icon--wath, body.platform--netcast .info__icon.icon--wath, body.platform--netcast .card__icon.icon--wath { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAF62lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDIgNzkuMTYwOTI0LCAyMDE3LzA3LzEzLTAxOjA2OjM5ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgKFdpbmRvd3MpIiB4bXA6Q3JlYXRlRGF0ZT0iMjAyMi0wOC0wNlQxMzo1Mjo1MCswMzowMCIgeG1wOk1vZGlmeURhdGU9IjIwMjItMDgtMDZUMTM6NTM6MDQrMDM6MDAiIHhtcDpNZXRhZGF0YURhdGU9IjIwMjItMDgtMDZUMTM6NTM6MDQrMDM6MDAiIGRjOmZvcm1hdD0iaW1hZ2UvcG5nIiBwaG90b3Nob3A6Q29sb3JNb2RlPSIzIiBwaG90b3Nob3A6SUNDUHJvZmlsZT0ic1JHQiBJRUM2MTk2Ni0yLjEiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6N2JlMWUxZTMtZTA1MC1jYjRhLTk0OTEtZjk5ZWNhZTJlYTkxIiB4bXBNTTpEb2N1bWVudElEPSJhZG9iZTpkb2NpZDpwaG90b3Nob3A6OTIyZThhY2EtMWJkZS02NzQyLWIwNjUtNDcxMDE4NjJjNzI0IiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6NTg1MDgxYmEtMTM0ZS04NjRmLThhM2QtM2I4M2QxZWIwN2YyIj4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDo1ODUwODFiYS0xMzRlLTg2NGYtOGEzZC0zYjgzZDFlYjA3ZjIiIHN0RXZ0OndoZW49IjIwMjItMDgtMDZUMTM6NTI6NTArMDM6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAoV2luZG93cykiLz4gPHJkZjpsaSBzdEV2dDphY3Rpb249InNhdmVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOjdiZTFlMWUzLWUwNTAtY2I0YS05NDkxLWY5OWVjYWUyZWE5MSIgc3RFdnQ6d2hlbj0iMjAyMi0wOC0wNlQxMzo1MzowNCswMzowMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgc3RFdnQ6Y2hhbmdlZD0iLyIvPiA8L3JkZjpTZXE+IDwveG1wTU06SGlzdG9yeT4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7vBmHKAAAEu0lEQVRogc2aWWxVRRjHfz0hlMVWEYGyWW0UsbEulIjGgKA+GBdiNOGBoA/VxBdfjBF948UXX0Rc4oI2UYu4gIVIorgUI1gVKyoSCJomVZEqrWJBWjDavw/TQ+dO59ye7V76Tya5M/PN//v+d2bO8p2pkEROuBBYBFwN1AFzgBqgeqj/OHAE+AXoAjqAz4Ef83BekVFIDbACuBO4PiXHbqAVeAMjMB0kpSmXSmqWdFL54k1JC9PElHRApaS1CQLrl9QrqUfSiQTjnpM0JUlsSZbWbcAzQG1E/29AG7ATOAB0A73AACBgIjAVsxwvAa4DbgLmRvD1Ag8CLbGii6l4TZF/70NJKyRNSPIPDpVA0nJJW4rwr4vDFcfZWxEOtku6JkXwUeUySW9H+Pooq5CtHtIBSU05CnDLXZL+8PhtTytkk4esQ1JdCUWEZYbMknUROTNRRGs8JNvLIMAtGzxxPB9XyA2ewR+cARFhafHEs9K1811+/wLOtur7gIZYl0A/bgXGY+7eadEGLLPqg5hHnxOnWxxlTznKByVNz/BvPmZxrc/AUynpqBNbq21jG8/2TOGqDM6RdNzhS3OvCcsyT3xX+YRsdIw+yygCSV0W3zFJVRn5tjgxfuoKqfaonZeDkE6L76ikyRn55njivEASwdBWucfZXO3ADxk2Z6lwCHjHabsfOD0jHY7K23OYjVLMCDL7wsahcEZqgEZLYR/wbln+33T4Bui06rOBhoDC6zOMbREhNjv1mwPgWqexrUzBZMEup74gwCQNbOSSDCgxOp16bYDJdtg4XMIA8krZ/AqcsurTAmCm1TAA/JmTMxeDQH9OXH0YMSHOCYDJVsPfOToDqLR+VwP35cjdZ/sJnM7csnWhA+v3OGA98FpO3AWxBhTOwFmYbEdeeMjTtgrYS7ZXAyh81fgnAH63GiYBUzI6sPEqsJjC9QxGxF7g3pS8VcAsq94XYHKxNmaSL3YB9fhvtC8BL6fgnEXhyukJgJ8co4tSEI+GY8By4FFPXxPwHXB+Ar46p/5zAHzpNC5NQJgUj+NfapcDzQl43KeRb33P+L05PfkWK1UamW76OMH4/c7YxrBjn9NxYxnEIOkRSYclfSWpNuaY+U6sRyRVhJ2rnc5ypn/GJbR/xYl1nTScDjoP6HHW3VzMG9lYwlRMlt5GPXAgvLP3AtscgxdLHVUKPOHU92A+YRRkUS7WSNxSxiU2WlngiW9x2O8aNzuG/cqewsmrdDuxFexj13i8pFPOgJ1jQMRmjcS0YkKQ+T7hYuMZFPGkJ54HXLuowU97Bm8YIyI2+WyLkXziIXlfCb+2piwTJL3u8b8nasxohO0esm7ll8DzlSUqTOyFOChpYlohyMyCDy2SGnIUUCfzfd2H3Rrl6hnXybMRDiSzd5ZmELBI0guS/ovgj3WhSXJgoAlYy/AhGRf7gfeAL4CDDB8YsHEuJkU7D1iI+Zp1ZQTfv8DqIZ+jIumhmhmYx4SVMWxPYk5DhNmOKoyISTHGtgIPMzIRF42Uy2GJpG1Fllta7FDKx6Ksx5zqgbuBO4D5KTm6gK2YNNHXaQPJKsRGI+bM1hWYd+rpmJRNuJQGMMusB5Mn+B7YgdlTmfE/MLYJX09+eAkAAAAASUVORK5CYII="); } body.platform--orsay .info__icon.icon--history, body.platform--orsay .card__icon.icon--history, body.platform--netcast .info__icon.icon--history, body.platform--netcast .card__icon.icon--history { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAFEmlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDIgNzkuMTYwOTI0LCAyMDE3LzA3LzEzLTAxOjA2OjM5ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgKFdpbmRvd3MpIiB4bXA6Q3JlYXRlRGF0ZT0iMjAyMi0wOC0wOVQxODoxNDo0MCswMzowMCIgeG1wOk1vZGlmeURhdGU9IjIwMjItMDgtMDlUMTg6MTY6MDErMDM6MDAiIHhtcDpNZXRhZGF0YURhdGU9IjIwMjItMDgtMDlUMTg6MTY6MDErMDM6MDAiIGRjOmZvcm1hdD0iaW1hZ2UvcG5nIiBwaG90b3Nob3A6Q29sb3JNb2RlPSIzIiBwaG90b3Nob3A6SUNDUHJvZmlsZT0ic1JHQiBJRUM2MTk2Ni0yLjEiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6YWYyYjJiNmItMDY0ZS0zNTQyLTllMDItNjdkYzBjNzAyZjUzIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOmFmMmIyYjZiLTA2NGUtMzU0Mi05ZTAyLTY3ZGMwYzcwMmY1MyIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ4bXAuZGlkOmFmMmIyYjZiLTA2NGUtMzU0Mi05ZTAyLTY3ZGMwYzcwMmY1MyI+IDx4bXBNTTpIaXN0b3J5PiA8cmRmOlNlcT4gPHJkZjpsaSBzdEV2dDphY3Rpb249ImNyZWF0ZWQiIHN0RXZ0Omluc3RhbmNlSUQ9InhtcC5paWQ6YWYyYjJiNmItMDY0ZS0zNTQyLTllMDItNjdkYzBjNzAyZjUzIiBzdEV2dDp3aGVuPSIyMDIyLTA4LTA5VDE4OjE0OjQwKzAzOjAwIiBzdEV2dDpzb2Z0d2FyZUFnZW50PSJBZG9iZSBQaG90b3Nob3AgQ0MgKFdpbmRvd3MpIi8+IDwvcmRmOlNlcT4gPC94bXBNTTpIaXN0b3J5PiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Ps2f9JwAAASiSURBVGiBzZpbbBdFFMZ/XSmlXoBYm1JrBaKEBiIWbPCCUQyiJGKURI2Jt4i+IUYSI/KgiT4QjfEC1niJCUb7AHjDRPFBU0LwkmpRQQIPmHCpJNKiSQvhouLnw3TjOv/Z7e7OtPRLzsPMznznfDu7szNnp0oSgTAFuBKYC1wCXAQ0AOOBKmAA6AV+BfYD3cC3wN4Qzqs8hTQCdwFLgOtLcnwHbALWA/tKRyKpjM2UtE7SSYXFRklzy8RUtEONpDWBg3fhTUl1RWIr8mjdBqwFLs5o0wv8AHQBBwbLxwev1QIXAM2Yd2kO0JTB9QewAng3V3Q5FT+TcfdOSeqQdKuk2gJ3cYykRZLekjSQwd+ehy+Pww9THJyWtFrShQWCT7M6SasyBHVKqvIR8mkK8eeSpgUQYNskSetTfHaVFfJxCuGjwyDAtgdTfG8pKuTZFKKbR0BEbG2SjjlieDuvkIUpIq4ZQRGxtcj93txvt3VNv/2YZUUSC4DOXNNgeFwG7HTUT8AsewCIrIvtVIpYzpkTAfAzcIejvuN/pcTwNDuGcNsZeJzSbIMjvjnx9aEaNowCAbHVqPJ9+coWMt4h4vlRELxtjzvinJoUstzR4FwPh0/LLFuaAwsZq8op+bmkkO3WxY0eziYneI5JujuwmFesWA/FQhpViRs9HE138LVLOiuQkBkO/lkRcIM1rfUDX3pMl3876pYBu4BZHrwxdmO2ykksioCrrMpvAjhzoQXYATwSgMu+0bMjYKpVOVxCYrwKfASc58HRZZUnR5hsRxL7PRzkxRJgD3Bdyf6HrHJ9hMmEJPF7SfKiaAK2AqtL9LVjnBgB51iVxxlZrAI2FOxzwirX2ItGgGAZuwLISmjkQkTlCNT6khbEB8BNBfuMs8p/RsBhq/L80iEVx1LgTuBowX52jP0R0GNVeg9zDuzAfBzXlexvT1B9EXDQqry6JHlerAFaMRumsmizyj0RlR+XeR4OsjCA+X48FoBroVX+Cbl3htd6LOqmOfg+k8lZhVg0Xurgb4vfkd2WwqUed+sfq/wUcAvwmwdnEg9Y5SPA9ljlSkvhX5KqS96xMZLek/S9pHmBRiFpR6xY10r/bazqHcP15DAE4WsPOeKckRSCpM1Wg1Py2+4Ohx22YvwxvpZs1OJQu2kUBB/ba4745ruEIPNs27hnFIhY4IirM9nGTpmOw8z31dbMcDnutOVIoAn4hcr11SQSyyt79XsSuNdB9jUwPWR0OdGA+YVti1iBvUZMGcrXHUM5oESKcgRsiqSDjjic720W0TYHiRQ+T+WyxZKOOnzvTOszFGFXiph3JE0cBgFjJb2c4nOvMj4HQxFHkr5IIe6V9IRM3thXQLWkZZL2pfjqljQhiyOvozdSHEhmyfCCyp1YaJX59d2Twf9+Hq4iBwYeBl4iOx+1Z3CW6cYcnunDJAqE2ULXYabT2ZjtQlbm8TSwEngxV3QF72Cj0n8fh8QnKvj7u+wzPV+Va7MQ2CozYxWOyfeY00zgPuB2yn8wD2COOXVgHslS8BWSxBWYM1utmHxyPebP69mYg2cnMJn+PkxadhewBbPV9g7iX1LytK49HD5tAAAAAElFTkSuQmCC"); } body.platform--orsay .player-info__name, body.platform--netcast .player-info__name { padding-right: 4em; } body.platform--orsay .player-info__time, body.platform--netcast .player-info__time { position: absolute; right: 0; } body.platform--orsay .player-info__line, body.platform--netcast .player-info__line { position: relative; } body.platform--orsay.system--keyboard .settings-input__content, body.platform--orsay.system--keyboard .search-box { -webkit-box-pack: start; -webkit-justify-content: flex-start; -moz-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } body.orsay-player--show { background: transparent; } body.orsay-player--show #app, body.orsay-player--show .modal, body.orsay-player--show .helper { visibility: hidden; } body.orsay-player--show #app *, body.orsay-player--show .modal *, body.orsay-player--show .helper * { visibility: hidden !important; } body.orsay-player--show .player { background: transparent; } .https { padding: 4em; text-align: center; } .https__icon { width: 10em; margin: auto; } .https__icon > svg { width: 10em; height: 4em; } .https__text { font-size: 1.3em; line-height: 1.8; margin: auto; max-width: 20em; padding-top: 3em; } body.touch-device .scroll { overflow: auto !important; } body.touch-device .scroll > .scroll__content > .scroll__body:after { content: ""; display: block; width: 1.5em; height: 1.5em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } body.touch-device .scroll--horizontal { padding-top: 1em; padding-bottom: 1em; } body.touch-device .full-start__buttons-scroll .scroll__body:after { display: none !important; } body.touch-device .full-start__buttons-scroll .scroll__body .full-start__buttons:after { content: ""; display: block; width: 0.75em; height: 1.5em; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } @media screen and (max-width: 480px) { body.touch-device .settings__body .scroll, body.touch-device .modal__body .scroll, body.touch-device .selectbox__body .scroll { -ms-scroll-chaining: none; overscroll-behavior: none; } } @-webkit-keyframes animation-card-focus { 40% { -webkit-transform: translate3d(0, -1em, 0); transform: translate3d(0, -1em, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-moz-keyframes animation-card-focus { 40% { -moz-transform: translate3d(0, -1em, 0); transform: translate3d(0, -1em, 0); } 100% { -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-o-keyframes animation-card-focus { 40% { transform: translate3d(0, -1em, 0); } 100% { transform: translate3d(0, 0, 0); } } @keyframes animation-card-focus { 40% { -webkit-transform: translate3d(0, -1em, 0); -moz-transform: translate3d(0, -1em, 0); transform: translate3d(0, -1em, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-webkit-keyframes animation-trigger-enter { 40% { -webkit-transform: scale(1.2); transform: scale(1.2); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @-moz-keyframes animation-trigger-enter { 40% { -moz-transform: scale(1.2); transform: scale(1.2); } 100% { -moz-transform: scale(1); transform: scale(1); } } @-o-keyframes animation-trigger-enter { 40% { -o-transform: scale(1.2); transform: scale(1.2); } 100% { -o-transform: scale(1); transform: scale(1); } } @keyframes animation-trigger-enter { 40% { -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } 100% { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); transform: scale(1); } } @-webkit-keyframes animation-file-focus { 40% { -webkit-transform: translate3d(-1em, 0, 0); transform: translate3d(-1em, 0, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-moz-keyframes animation-file-focus { 40% { -moz-transform: translate3d(-1em, 0, 0); transform: translate3d(-1em, 0, 0); } 100% { -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-o-keyframes animation-file-focus { 40% { transform: translate3d(-1em, 0, 0); } 100% { transform: translate3d(0, 0, 0); } } @keyframes animation-file-focus { 40% { -webkit-transform: translate3d(-1em, 0, 0); -moz-transform: translate3d(-1em, 0, 0); transform: translate3d(-1em, 0, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-webkit-keyframes animation-button-focus { 40% { -webkit-transform: scale(0.9); transform: scale(0.9); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @-moz-keyframes animation-button-focus { 40% { -moz-transform: scale(0.9); transform: scale(0.9); } 100% { -moz-transform: scale(1); transform: scale(1); } } @-o-keyframes animation-button-focus { 40% { -o-transform: scale(0.9); transform: scale(0.9); } 100% { -o-transform: scale(1); transform: scale(1); } } @keyframes animation-button-focus { 40% { -webkit-transform: scale(0.9); -moz-transform: scale(0.9); -o-transform: scale(0.9); transform: scale(0.9); } 100% { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); transform: scale(1); } } @-webkit-keyframes animation-modal { 0% { opacity: 0; -webkit-transform: translate3d(0, -5em, 0) scale(0.9); transform: translate3d(0, -5em, 0) scale(0.9); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0) scale(1); transform: translate3d(0, 0, 0) scale(1); } } @-moz-keyframes animation-modal { 0% { opacity: 0; -moz-transform: translate3d(0, -5em, 0) scale(0.9); transform: translate3d(0, -5em, 0) scale(0.9); } 100% { opacity: 1; -moz-transform: translate3d(0, 0, 0) scale(1); transform: translate3d(0, 0, 0) scale(1); } } @-o-keyframes animation-modal { 0% { opacity: 0; transform: translate3d(0, -5em, 0) scale(0.9); } 100% { opacity: 1; transform: translate3d(0, 0, 0) scale(1); } } @keyframes animation-modal { 0% { opacity: 0; -webkit-transform: translate3d(0, -5em, 0) scale(0.9); -moz-transform: translate3d(0, -5em, 0) scale(0.9); transform: translate3d(0, -5em, 0) scale(0.9); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0) scale(1); -moz-transform: translate3d(0, 0, 0) scale(1); transform: translate3d(0, 0, 0) scale(1); } } @-webkit-keyframes animation-full-poster { 0% { -webkit-transform: translate3d(-2em, 0, 0); transform: translate3d(-2em, 0, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-moz-keyframes animation-full-poster { 0% { -moz-transform: translate3d(-2em, 0, 0); transform: translate3d(-2em, 0, 0); } 100% { -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-o-keyframes animation-full-poster { 0% { transform: translate3d(-2em, 0, 0); } 100% { transform: translate3d(0, 0, 0); } } @keyframes animation-full-poster { 0% { -webkit-transform: translate3d(-2em, 0, 0); -moz-transform: translate3d(-2em, 0, 0); transform: translate3d(-2em, 0, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-webkit-keyframes animation-full-background { 0% { -webkit-transform: translate3d(10%, 0, 0); transform: translate3d(10%, 0, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-moz-keyframes animation-full-background { 0% { -moz-transform: translate3d(10%, 0, 0); transform: translate3d(10%, 0, 0); } 100% { -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-o-keyframes animation-full-background { 0% { transform: translate3d(10%, 0, 0); } 100% { transform: translate3d(0, 0, 0); } } @keyframes animation-full-background { 0% { -webkit-transform: translate3d(10%, 0, 0); -moz-transform: translate3d(10%, 0, 0); transform: translate3d(10%, 0, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-webkit-keyframes animation-opacity { 0% { opacity: 0; } 100% { opacity: 1; } } @-moz-keyframes animation-opacity { 0% { opacity: 0; } 100% { opacity: 1; } } @-o-keyframes animation-opacity { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes animation-opacity { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes animation-opacity-blink { 0% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 0; } } @-moz-keyframes animation-opacity-blink { 0% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 0; } } @-o-keyframes animation-opacity-blink { 0% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 0; } } @keyframes animation-opacity-blink { 0% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 0; } } @-webkit-keyframes animation-zoom-down { 0% { -webkit-transform: scale(1.2); transform: scale(1.2); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @-moz-keyframes animation-zoom-down { 0% { -moz-transform: scale(1.2); transform: scale(1.2); } 100% { -moz-transform: scale(1); transform: scale(1); } } @-o-keyframes animation-zoom-down { 0% { -o-transform: scale(1.2); transform: scale(1.2); } 100% { -o-transform: scale(1); transform: scale(1); } } @keyframes animation-zoom-down { 0% { -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } 100% { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); transform: scale(1); } } @-webkit-keyframes animation-activity { 0% { -webkit-transform: translate3d(0, 14%, 0); transform: translate3d(0, 14%, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-moz-keyframes animation-activity { 0% { -moz-transform: translate3d(0, 14%, 0); transform: translate3d(0, 14%, 0); } 100% { -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-o-keyframes animation-activity { 0% { transform: translate3d(0, 14%, 0); } 100% { transform: translate3d(0, 0, 0); } } @keyframes animation-activity { 0% { -webkit-transform: translate3d(0, 14%, 0); -moz-transform: translate3d(0, 14%, 0); transform: translate3d(0, 14%, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-webkit-keyframes animation-from-below { 0% { -webkit-transform: translate3d(0, 50%, 0); transform: translate3d(0, 50%, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-moz-keyframes animation-from-below { 0% { -moz-transform: translate3d(0, 50%, 0); transform: translate3d(0, 50%, 0); } 100% { -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-o-keyframes animation-from-below { 0% { transform: translate3d(0, 50%, 0); } 100% { transform: translate3d(0, 0, 0); } } @keyframes animation-from-below { 0% { -webkit-transform: translate3d(0, 50%, 0); -moz-transform: translate3d(0, 50%, 0); transform: translate3d(0, 50%, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-webkit-keyframes animation-down { 0% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; } 100% { -webkit-transform: translate3d(0, 50%, 0); transform: translate3d(0, 50%, 0); opacity: 0; } } @-moz-keyframes animation-down { 0% { -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; } 100% { -moz-transform: translate3d(0, 50%, 0); transform: translate3d(0, 50%, 0); opacity: 0; } } @-o-keyframes animation-down { 0% { transform: translate3d(0, 0, 0); opacity: 1; } 100% { transform: translate3d(0, 50%, 0); opacity: 0; } } @keyframes animation-down { 0% { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; } 100% { -webkit-transform: translate3d(0, 50%, 0); -moz-transform: translate3d(0, 50%, 0); transform: translate3d(0, 50%, 0); opacity: 0; } } body.advanced--animation:not(.no--animation) .card:not(.card--wide).focus .card__view, body.advanced--animation:not(.no--animation) .card:not(.card--wide).hover .card__view { -webkit-animation: animation-card-focus 0.2s; -moz-animation: animation-card-focus 0.2s; -o-animation: animation-card-focus 0.2s; animation: animation-card-focus 0.2s; } body.advanced--animation:not(.no--animation) .card:not(.card--wide).animate-trigger-enter .card__view { -webkit-animation: animation-trigger-enter 0.2s forwards; -moz-animation: animation-trigger-enter 0.2s forwards; -o-animation: animation-trigger-enter 0.2s forwards; animation: animation-trigger-enter 0.2s forwards; } body.advanced--animation:not(.no--animation) .card-episode.focus .full-episode, body.advanced--animation:not(.no--animation) .card-episode.hover .full-episode { -webkit-animation: animation-card-focus 0.2s; -moz-animation: animation-card-focus 0.2s; -o-animation: animation-card-focus 0.2s; animation: animation-card-focus 0.2s; } body.advanced--animation:not(.no--animation) .card-episode.animate-trigger-enter .full-episode { -webkit-animation: animation-trigger-enter 0.2s forwards; -moz-animation: animation-trigger-enter 0.2s forwards; -o-animation: animation-trigger-enter 0.2s forwards; animation: animation-trigger-enter 0.2s forwards; } body.advanced--animation:not(.no--animation) .explorer-card__head-img.focus, body.advanced--animation:not(.no--animation) .explorer-card__head-img.hover { -webkit-animation: animation-card-focus 0.2s; -moz-animation: animation-card-focus 0.2s; -o-animation: animation-card-focus 0.2s; animation: animation-card-focus 0.2s; } body.advanced--animation:not(.no--animation) .explorer-card__head-img.animate-trigger-enter { -webkit-animation: animation-trigger-enter 0.2s forwards; -moz-animation: animation-trigger-enter 0.2s forwards; -o-animation: animation-trigger-enter 0.2s forwards; animation: animation-trigger-enter 0.2s forwards; } body.advanced--animation:not(.no--animation) .torrent-item.focus, body.advanced--animation:not(.no--animation) .torrent-item.hover { -webkit-animation: animation-file-focus 0.2s; -moz-animation: animation-file-focus 0.2s; -o-animation: animation-file-focus 0.2s; animation: animation-file-focus 0.2s; } body.advanced--animation:not(.no--animation) .torrent-item.animate-trigger-enter { -webkit-animation: animation-trigger-enter 0.2s forwards; -moz-animation: animation-trigger-enter 0.2s forwards; -o-animation: animation-trigger-enter 0.2s forwards; animation: animation-trigger-enter 0.2s forwards; } body.advanced--animation:not(.no--animation) .head .head__action.focus, body.advanced--animation:not(.no--animation) .head .head__action.hover, body.advanced--animation:not(.no--animation) .menu .menu__item.focus, body.advanced--animation:not(.no--animation) .menu .menu__item.hover, body.advanced--animation:not(.no--animation) .full-start__button.focus, body.advanced--animation:not(.no--animation) .full-start__button.hover, body.advanced--animation:not(.no--animation) .simple-button.focus, body.advanced--animation:not(.no--animation) .simple-button.hover, body.advanced--animation:not(.no--animation) .full-descr__tag.focus, body.advanced--animation:not(.no--animation) .full-descr__tag.hover, body.advanced--animation:not(.no--animation) .tag-count.focus, body.advanced--animation:not(.no--animation) .tag-count.hover, body.advanced--animation:not(.no--animation) .full-review.focus, body.advanced--animation:not(.no--animation) .full-review.hover, body.advanced--animation:not(.no--animation) .full-review-add.focus, body.advanced--animation:not(.no--animation) .full-review-add.hover { -webkit-animation: animation-button-focus 0.2s; -moz-animation: animation-button-focus 0.2s; -o-animation: animation-button-focus 0.2s; animation: animation-button-focus 0.2s; } body.advanced--animation:not(.no--animation) .head .head__action.animate-trigger-enter:not([data-action]), body.advanced--animation:not(.no--animation) .menu .menu__item.animate-trigger-enter:not([data-action]), body.advanced--animation:not(.no--animation) .full-start__button.animate-trigger-enter:not([data-action]), body.advanced--animation:not(.no--animation) .simple-button.animate-trigger-enter:not([data-action]), body.advanced--animation:not(.no--animation) .full-descr__tag.animate-trigger-enter:not([data-action]), body.advanced--animation:not(.no--animation) .tag-count.animate-trigger-enter:not([data-action]), body.advanced--animation:not(.no--animation) .full-review.animate-trigger-enter:not([data-action]), body.advanced--animation:not(.no--animation) .full-review-add.animate-trigger-enter:not([data-action]) { -webkit-animation: animation-trigger-enter 0.2s forwards; -moz-animation: animation-trigger-enter 0.2s forwards; -o-animation: animation-trigger-enter 0.2s forwards; animation: animation-trigger-enter 0.2s forwards; } body.advanced--animation:not(.no--animation) .full-person.focus .full-person__photo, body.advanced--animation:not(.no--animation) .full-person.hover .full-person__photo { -webkit-animation: animation-button-focus 0.2s; -moz-animation: animation-button-focus 0.2s; -o-animation: animation-button-focus 0.2s; animation: animation-button-focus 0.2s; } body.advanced--animation:not(.no--animation) .full-person.animate-trigger-enter .full-person__photo { -webkit-animation: animation-trigger-enter 0.2s forwards; -moz-animation: animation-trigger-enter 0.2s forwards; -o-animation: animation-trigger-enter 0.2s forwards; animation: animation-trigger-enter 0.2s forwards; } body.advanced--animation:not(.no--animation) .settings-folder.focus .settings-folder__icon, body.advanced--animation:not(.no--animation) .settings-folder.hover .settings-folder__icon { -webkit-animation: animation-button-focus 0.2s; -moz-animation: animation-button-focus 0.2s; -o-animation: animation-button-focus 0.2s; animation: animation-button-focus 0.2s; } body.advanced--animation:not(.no--animation) .settings-folder.animate-trigger-enter .settings-folder__icon { -webkit-animation: animation-trigger-enter 0.2s forwards; -moz-animation: animation-trigger-enter 0.2s forwards; -o-animation: animation-trigger-enter 0.2s forwards; animation: animation-trigger-enter 0.2s forwards; } body.advanced--animation:not(.no--animation) .modal.animate .modal__content { -webkit-animation: animation-modal 0.3s; -moz-animation: animation-modal 0.3s; -o-animation: animation-modal 0.3s; animation: animation-modal 0.3s; } body.advanced--animation:not(.no--animation) .modal.modal--full.animate .modal__content { -webkit-animation: animation-from-below 0.3s; -moz-animation: animation-from-below 0.3s; -o-animation: animation-from-below 0.3s; animation: animation-from-below 0.3s; } body.advanced--animation:not(.no--animation) .full-start__background.loaded { -webkit-animation: animation-full-background 0.3s; -moz-animation: animation-full-background 0.3s; -o-animation: animation-full-background 0.3s; animation: animation-full-background 0.3s; } body.advanced--animation:not(.no--animation) .activity:not(.activity--load) .activity__body { -webkit-animation: animation-activity 0.2s; -moz-animation: animation-activity 0.2s; -o-animation: animation-activity 0.2s; animation: animation-activity 0.2s; } body.advanced--animation:not(.no--animation) .animate-opacity { -webkit-animation: animation-opacity 0.3s; -moz-animation: animation-opacity 0.3s; -o-animation: animation-opacity 0.3s; animation: animation-opacity 0.3s; } body.advanced--animation:not(.no--animation) .animate-up-content { -webkit-animation: animation-activity 0.2s; -moz-animation: animation-activity 0.2s; -o-animation: animation-activity 0.2s; animation: animation-activity 0.2s; } @media screen and (max-width: 480px) { .selectbox.animate .selectbox__content, .settings.animate .settings__content { -webkit-animation: animation-from-below 0.3s forwards; -moz-animation: animation-from-below 0.3s forwards; -o-animation: animation-from-below 0.3s forwards; animation: animation-from-below 0.3s forwards; } .selectbox.animate-down .selectbox__content, .settings.animate-down .settings__content { -webkit-animation: animation-down 0.3s forwards; -moz-animation: animation-down 0.3s forwards; -o-animation: animation-down 0.3s forwards; animation: animation-down 0.3s forwards; } .modal.animate .modal__content { -webkit-animation: animation-from-below 0.3s !important; -moz-animation: animation-from-below 0.3s !important; -o-animation: animation-from-below 0.3s !important; animation: animation-from-below 0.3s !important; } .modal.animate-down .modal__content { -webkit-animation: animation-down 0.3s !important; -moz-animation: animation-down 0.3s !important; -o-animation: animation-down 0.3s !important; animation: animation-down 0.3s !important; } } @media screen and (min-width: 767px) { body.light--version .wrap__left { position: static; background: transparent; margin-left: 0; width: 13.5em; } body.light--version .background { display: none; } body.light--version .card--category { width: 20%; } body.light--version .files__left { font-size: 0.7em; } body.light--version .files__body { max-width: inherit; } body.light--version .timetable__item { width: 16.66%; } body.light--version .card--small .card__title { margin-top: 0.5em; } } @media screen and (max-width: 767px) { body.light--version.menu--open .wrap__content { -webkit-transform: translate3d(15em, 0, 0); -moz-transform: translate3d(15em, 0, 0); transform: translate3d(15em, 0, 0); } } body.light--version .card__img, body.light--version .card__quality, body.light--version .card__vote, body.light--version .items-line__more, body.light--version .card-more__box, body.light--version .card__type, body.light--version .card__promo, body.light--version .torrent-item, body.light--version .explorer-card__head-img > img, body.light--version .full-start__img, body.light--version .full-start-new__poster.loaded img, body.light--version .full-episode__img img, body.light--version .full-episode__body, body.light--version .register, body.light--version .full-episode--next .full-episode__img:after, body.light--version .season-episode, body.light--version .season-episode__img > img, body.light--version .card__textbox, body.light--version .ad-bot__content, body.light--version .ad-bot__marker, body.light--version .full-review, body.light--version .full-review-add, body.light--version .bookmarks-folder__layer { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } body.light--version .card .card__view::after, body.light--version .torrent-item::after, body.light--version .explorer-card__head-img::after, body.light--version .full-episode.focus::after, body.light--version .card-more .card-more__box::after, body.light--version .card-episode.focus .full-episode::after, body.light--version .feed-item__poster-img, body.light--version .feed-item__poster-box, body.light--version .feed-item__image-box, body.light--version .feed-item__image-img, body.light--version .register::after, body.light--version .season-episode::after, body.light--version .ad-bot.focus .ad-bot__content::after, body.light--version .full-review-add::after { -webkit-border-radius: 0.4em; -moz-border-radius: 0.4em; border-radius: 0.4em; } body.light--version .full-start__button, body.light--version .info__icon, body.light--version .full-start__tag, body.light--version .full-start__tag.tag--quality, body.light--version .full-descr__tag, body.light--version .full-start .info__rate, body.light--version .explorer__files .torrent-filter .simple-button, body.light--version .card-watched, body.light--version .feed-item__buttons .simple-button { -webkit-border-radius: 0.2em; -moz-border-radius: 0.2em; border-radius: 0.2em; } body.light--version .torrent-item__details { font-size: 0.95em; } body.glass--style .selectbox__content, body.glass--style .settings__content, body.glass--style .settings-input__content, body.glass--style .modal__content, body.glass--style .settings-input--free, body.glass--style .navigation-bar__body, body.glass--style .discuss-rules, body.glass--style .bell__item { background-color: rgba(0, 0, 0, 0.3); -webkit-backdrop-filter: blur(1.6em); backdrop-filter: blur(1.6em); } @media screen and (max-width: 480px) { body.glass--style .selectbox__content, body.glass--style .modal__content, body.glass--style .settings__content { background-color: #262829; } } body.glass--style .selectbox-item.focus, body.glass--style .settings-folder.focus, body.glass--style .settings-param.focus { background-color: #fff; color: #000; } body.glass--style .selectbox-item.focus .settings-folder__icon, body.glass--style .selectbox-item.focus .selectbox-item__checkbox, body.glass--style .settings-folder.focus .settings-folder__icon, body.glass--style .settings-folder.focus .selectbox-item__checkbox, body.glass--style .settings-param.focus .settings-folder__icon, body.glass--style .settings-param.focus .selectbox-item__checkbox { -webkit-filter: invert(1); filter: invert(1); } body.glass--style .selectbox-item.focus::after { border-color: #000; } body.glass--style .settings-param-title > span { color: rgba(255, 255, 255, 0.4); } body.glass--style .settings-input__links { background: rgba(221, 221, 221, 0.06); } body.glass--style .settings-input__input { border: 0; } body.glass--style .settings-input--free .settings-input__content { background: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; } body.glass--style .torrent-serial { background: rgba(132, 135, 137, 0.15); } body.glass--style .torrent-serial.focus { background: rgba(255, 255, 255, 0.35); } body.glass--style .card-more__box, body.glass--style .bookmarks-folder__layer { background: rgba(0, 0, 0, 0.3); } body.glass--style-opacity--medium .selectbox__content, body.glass--style-opacity--medium .settings__content, body.glass--style-opacity--medium .settings-input__content, body.glass--style-opacity--medium .modal__content, body.glass--style-opacity--medium .settings-input--free, body.glass--style-opacity--medium .navigation-bar__body, body.glass--style-opacity--medium .bell__item { background-color: rgba(20, 20, 20, 0.6); -webkit-backdrop-filter: blur(1.1em); backdrop-filter: blur(1.1em); } body.glass--style-opacity--medium .player-panel, body.glass--style-opacity--medium .player-info, body.glass--style-opacity--medium .player-footer, body.glass--style-opacity--medium .player-video__paused, body.glass--style-opacity--medium .player-video__loader, body.glass--style-opacity--medium .normalization, body.glass--style-opacity--medium .bell__item { background-color: rgba(0, 0, 0, 0.6); } @media screen and (max-width: 480px) { body.glass--style-opacity--medium .selectbox__content, body.glass--style-opacity--medium .modal__content, body.glass--style-opacity--medium .settings__content { background-color: #262829; } } body.glass--style-opacity--blacked .selectbox__content, body.glass--style-opacity--blacked .settings__content, body.glass--style-opacity--blacked .settings-input__content, body.glass--style-opacity--blacked .modal__content, body.glass--style-opacity--blacked .settings-input--free, body.glass--style-opacity--blacked .navigation-bar__body, body.glass--style-opacity--blacked .bell__item { background-color: rgba(20, 20, 20, 0.9); -webkit-backdrop-filter: blur(0.5em); backdrop-filter: blur(0.5em); } body.glass--style-opacity--blacked .player-panel, body.glass--style-opacity--blacked .player-info, body.glass--style-opacity--blacked .player-footer, body.glass--style-opacity--blacked .player-video__paused, body.glass--style-opacity--blacked .player-video__loader, body.glass--style-opacity--blacked .normalization, body.glass--style-opacity--blacked .bell__item { background-color: rgba(0, 0, 0, 0.85); } @media screen and (max-width: 480px) { body.glass--style-opacity--blacked .selectbox__content, body.glass--style-opacity--blacked .modal__content, body.glass--style-opacity--blacked .settings__content { background-color: #262829; } } body.glass--style.platform--browser .card .card__icons-inner, body.glass--style.platform--browser .card .card__marker, body.glass--style.platform--browser .card .card__vote, body.glass--style.platform--browser .card .card-watched, body.glass--style.platform--nw .card .card__icons-inner, body.glass--style.platform--nw .card .card__marker, body.glass--style.platform--nw .card .card__vote, body.glass--style.platform--nw .card .card-watched, body.glass--style.platform--apple .card .card__icons-inner, body.glass--style.platform--apple .card .card__marker, body.glass--style.platform--apple .card .card__vote, body.glass--style.platform--apple .card .card-watched { background-color: rgba(0, 0, 0, 0.3); -webkit-backdrop-filter: blur(1em); backdrop-filter: blur(1em); } body.glass--style.platform--browser .card-watched__item, body.glass--style.platform--nw .card-watched__item, body.glass--style.platform--apple .card-watched__item { color: #fff; } body.glass--style.platform--browser .card-watched__item:nth-child(2), body.glass--style.platform--nw .card-watched__item:nth-child(2), body.glass--style.platform--apple .card-watched__item:nth-child(2) { opacity: 0.8; } body.glass--style.platform--browser .card-watched__item:nth-child(3), body.glass--style.platform--nw .card-watched__item:nth-child(3), body.glass--style.platform--apple .card-watched__item:nth-child(3) { opacity: 0.6; } body.glass--style.platform--browser .card-watched__item:nth-child(4), body.glass--style.platform--nw .card-watched__item:nth-child(4), body.glass--style.platform--apple .card-watched__item:nth-child(4) { opacity: 0.4; } body.glass--style.platform--browser .card-watched__item:nth-child(5), body.glass--style.platform--nw .card-watched__item:nth-child(5), body.glass--style.platform--apple .card-watched__item:nth-child(5) { opacity: 0.2; } body.glass--style.platform--browser .head__action:not(.focus), body.glass--style.platform--nw .head__action:not(.focus), body.glass--style.platform--apple .head__action:not(.focus) { background-color: rgba(0, 0, 0, 0.06); -webkit-backdrop-filter: blur(1em); backdrop-filter: blur(1em); }