@import url(https://fonts.googleapis.com/css?family=Roboto:300,400,500&subset=cyrillic);@font-face {
    font-family: Arial Rounded MT Pro Cyr;
    src: url(../../static/media/ArialRoundedMTProCyr-Bold.560ad27b.eot);
    src: url(../../static/media/ArialRoundedMTProCyr-Bold.560ad27b.eot?#iefix) format("embedded-opentype"),url(../../static/media/ArialRoundedMTProCyr-Bold.6f0c4ce4.woff2) format("woff2"),url(../../static/media/ArialRoundedMTProCyr-Bold.4f02e64a.woff) format("woff"),url(../../static/media/ArialRoundedMTProCyr-Bold.e02291a2.ttf) format("truetype");
    font-weight: 700;
    font-style: normal;
    -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

@font-face {
    font-family: vk-icons;
    src: url(../../static/media/vk-icons.9c5fdb70.eot);
    src: url(../../static/media/vk-icons.9c5fdb70.eot#iefix) format("embedded-opentype"),url(../../static/media/vk-icons.3b47b842.ttf) format("truetype"),url(../../static/media/vk-icons.340fff5e.woff) format("woff"),url(../../static/media/vk-icons.f477f54d.svg#vk-icons) format("svg");
    font-weight: 400;
    font-style: normal;
    -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

.c-icon--vk {
    font-family: vk-icons!important;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    letter-spacing: 0;
    -webkit-font-feature-settings: "liga";
    -ms-font-feature-settings: "liga" 1;
    font-feature-settings: "liga",normal,"dlig";
    -webkit-font-variant-ligatures: discretionary-ligatures;
    font-variant-ligatures: discretionary-ligatures;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 24px;
    -o-user-select: none
}

.c-button,.c-icon--vk {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.c-button {
    font-size: 16px;
    font-family: Arial Rounded MT Pro Cyr;
    padding: 8px 20px;
    margin: 2.5px 0;
    cursor: pointer;
    outline: none;
    color: inherit;
    border-radius: 10px;
    background: none;
    border: 1px solid transparent;
    display: inline-block;
    text-decoration: none;
    text-align: center;
    vertical-align: middle
}

.c-button:active {
    -webkit-transform: scale(.95);
    transform: scale(.95)
}

.c-button:active,.web .c-button:hover {
    background: #f6f6f6
}

.c-button:disabled {
    background: #f6f6f6;
    color: #888;
    border: 1px solid #ddd
}

.c-button--wide {
    width: 100%;
    box-sizing: border-box
}

body {
    background: #fff!important;
    font-family: Roboto!important
}

.theme-dark,.theme-dark #root {
    color: #fff!important
}

.Panel--tm-gray .Panel__in,.Panel--tm-gray:after,.Panel__in {
    background: #fff!important
}

.theme-dark .Panel--tm-gray:after,.theme-dark .Panel__in {
    background: #262626!important
}

.theme-dark .Panel__in {
    color: #fff!important
}

#AppContainer {
    height: 100%;
    width: 100%
}

.noscroll {
    overflow: hidden
}

@supports (padding-top: constant(safe-area-inset-top)) {
    :root {
        --safe-area-inset-top:constant(safe-area-inset-top);
        --safe-area-inset-bottom: constant(safe-area-inset-bottom)
    }
}

@supports (padding-top: env(safe-area-inset-top)) {
    :root {
        --safe-area-inset-top:env(safe-area-inset-top);
        --safe-area-inset-bottom: env(safe-area-inset-bottom)
    }
}

#external_link {
    display: none
}

#clipboard,#external_link {
    position: absolute;
    top: -9999px;
    height: -9999px
}

.theme-dark {
    background: #262626!important
}

.android .hide-item--android,.ios .hide-item--ios,.mobile_web .hide-item--mobile_web,.web .hide-item--web {
    display: none
}

.beforeLoad {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 900;
    width: 100%;
    height: 100%;
    background: #fff
}

.theme-dark {
    background: #262626
}

.android .playlist-wrapper,.ios .playlist-wrapper,.mobile_web .playlist-wrapper,.playlist-wrapper {
    max-height: 400px;
    overflow: auto
}

.c-title {
    font-family: Arial Rounded MT PRO Cyr
}

.c-title--h1 {
    font-size: 30px
}

.c-title--h2 {
    font-size: 24px
}

.c-title--h3 {
    font-size: 18px
}

.c-title--center {
    text-align: center
}

.hr {
    width: 100%;
    height: 1px;
    border: none;
    background: #ddd
}

.theme-dark hr {
    background: #333
}

.hq {
    background: #1c82bd;
    color: #fff;
    font-size: 8px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
    padding: 2px 4px;
    margin-bottom: 2px;
    border-radius: 4px;
    font-weight: 500
}

.popup--animated {
    -webkit-transition: .3s cubic-bezier(.57,.57,.41,1);
    transition: .3s cubic-bezier(.57,.57,.41,1)
}

.web .popup_close:hover {
    cursor: pointer
}

.popup_close:active:after,.popup_close:active:before,.web .popup_close:hover:after,.web .popup_close:hover:before {
    background: #aaa
}

.popup_close:after,.popup_close:before {
    border-radius: 2px
}

@media screen and (max-width: 400px) {
    .popup_bottom .popup {
        width:100%;
        margin: 0;
        border-radius: 10px 10px 0 0
    }
}

.theme-dark .popup {
    background: #262626
}

.c-input {
    display: inline-block;
    position: relative;
    vertical-align: top;
    width: 100%
}

.c-input__text {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 8px 15px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 16px;
    outline: none;
    font-weight: 300;
    box-sizing: border-box;
    margin: 5px 0;
    width: 100%;
    font-family: inherit
}

.c-input__text:disabled {
    background: #f5f5f5
}

.theme-dark .c-input__text:disabled {
    background: #333;
    color: #888
}

textarea.c-input__text {
    resize: vertical;
    min-height: 100px
}

.c-input__text:placeholder {
    font-weight: 300
}

.c-input__text:focus {
    border: 1px solid #262626
}

.c-input__placeholder {
    color: #262626;
    position: absolute;
    left: 15px;
    top: 0;
    font-size: 14px;
    padding: 0 3px;
    background: #fff;
    margin-left: -2px;
    -webkit-transition: .15s;
    transition: .15s;
    opacity: 0;
    border-radius: 2px;
    font-weight: 300;
    color: #888;
    z-index: 2;
    pointer-events: none
}

.c-input__placeholder_fixed,.c-input__text:focus+.c-input__placeholder {
    top: -3px;
    opacity: 1;
    color: #262626
}

.c-input__placeholder_fixed {
    color: #888
}

.c-input--2 {
    width: calc(50% - 4px)
}

.c-input--2+.c-input--2,.c-input--3+.c-input--3 {
    margin-left: 8px
}

.c-input--3 {
    width: calc(33% - 5px)
}

.c-input--link:before {
    content: attr(data-link);
    display: inline-block;
    position: absolute;
    top: 14px;
    left: 16px;
    color: #333;
    font-weight: 300;
    z-index: 1
}

.c-input__text--link {
    position: relative;
    z-index: 2;
    background: none
}

.c-input--with-icon {
    padding: 0 20px;
    box-sizing: border-box
}

.c-input--with-icon-nopad {
    padding: 0 5px 0 20px
}

.c-input--with-icon-nopad-left {
    padding-left: 0
}

.c-input--with-icon .c-input__icon {
    display: inline-block;
    vertical-align: top;
    padding-top: 8px;
    font-size: 26px;
    line-height: 30px;
    margin-right: 15px;
    width: 30px;
    text-align: center
}

.c-input--with-icon .c-input__text,.c-input--with-icon .c-select__select {
    display: inline-block;
    vertical-align: middle;
    box-sizing: border-box;
    width: calc(100% - 50px)
}

.c-input--with-icon .c-input__placeholder {
    left: 85px
}

.c-input--with-icon+.c-input__note {
    padding-left: 70px
}

.c-input__text--noborder {
    border-radius: 0;
    border: none;
    border-bottom: 1px solid #ddd
}

.c-input__text--noborder:focus {
    border: none;
    border-bottom: 1px solid #000
}

.c-input--with-icon-nopad-left .c-input__icon {
    margin-right: 5px
}

.c-input--with-icon-nopad-left .c-input__text,.c-input--with-icon-nopad-left .c-select__select {
    width: calc(100% - 40px)
}

.c-input--with-icon-nopad-left .c-input__placeholder {
    left: 54px
}

.theme-dark .c-input__text {
    border: 1px solid #555
}

.c-gallery__card {
    width: 300px;
    width: calc(100% - 20px);
    max-width: 100%;
    height: 120px;
    border-radius: 10px;
    background: #f5f5f5;
    background-size: cover!important;
    background-position: 50%!important;
    padding: 10px;
    margin: 0 10px;
    box-sizing: border-box;
    box-shadow: 0 6px 14px rgba(0,0,0,.3);
    position: relative;
    display: inline-block;
    vertical-align: middle;
    overflow: hidden
}

.c-gallery__card:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.3);
    background: -webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.8)),color-stop(50%,rgba(0,0,0,.1)),to(transparent));
    background: -webkit-linear-gradient(bottom,rgba(0,0,0,.8),rgba(0,0,0,.1) 50%,transparent);
    background: linear-gradient(0deg,rgba(0,0,0,.8),rgba(0,0,0,.1) 50%,transparent)
}

.c-gallery__card:not(:last-child) {
    margin-right: 20px
}

.c-gallery__type-text {
    font-family: Arial Rounded MT Pro Cyr;
    font-size: 12px;
    color: hsla(0,0%,100%,.8);
    text-shadow: 0 3px 7px #000
}

.c-gallery__main-content {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 10px;
    box-sizing: border-box
}

.c-gallery__subtitle,.c-gallery__title {
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
    color: #fff
}

.c-gallery__title {
    font-family: Arial Rounded MT Pro Cyr
}

.c-input-select,.c-select {
    position: relative
}

.c-select {
    display: inline-block;
    vertical-align: top;
    width: 100%
}

.c-select__select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 8px 15px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 16px;
    outline: none;
    font-weight: 300;
    box-sizing: border-box;
    margin: 5px 0;
    width: 100%;
    font-family: inherit
}

.c-select__select:disabled {
    background: #f5f5f5
}

.c-select__select:disabled:hover {
    cursor: not-allowed
}

.theme-dark .c-select__select:disabled {
    background: #333;
    color: #888
}

.c-input-select__dropdown-icon {
    position: absolute;
    color: #aaa;
    right: 15px;
    top: 12px;
    pointer-events: none
}

.c-select__select {
    cursor: pointer;
    background: none
}

.c-select__options,.c-select__select:focus {
    border: 1px solid #262626
}

.c-select__options {
    width: 100%;
    padding: 5px 0;
    border-radius: 5px;
    box-sizing: border-box;
    top: calc(100% + 5px);
    left: 0;
    position: absolute;
    z-index: 100;
    background: #fff;
    box-shadow: 0 4px 4px rgba(0,0,0,.3);
    display: none
}

.c-select__options--above {
    top: auto;
    bottom: calc(100% + 5px)
}

.c-select__option {
    padding: 5px 15px;
    cursor: pointer
}

.c-select__option:hover {
    background: rgba(0,0,0,.05)
}

.theme-dark option {
    background: #262626;
    color: #fff!important
}

.c-switch {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin: 10px 0
}

.c-switch:after {
    content: "";
    display: block;
    clear: both
}

.c-switch__label {
    display: block;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer
}

.c-switch__checkbox {
    display: none
}

.c-switch__text {
    padding: 2px 0;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    display: inline-block;
    max-width: calc(100% - 50px)
}

.c-switch__switch-label {
    width: 40px;
    height: 25px;
    background: #f6f6f6;
    vertical-align: middle;
    border: 1px solid #ddd;
    border-radius: 20px;
    position: relative;
    cursor: pointer;
    float: right
}

.c-switch__checkbox+.c-switch__switch-label:after,.c-switch__switch-label {
    display: inline-block;
    -webkit-transition: .15s ease-in-out;
    transition: .15s ease-in-out
}

.c-switch__checkbox+.c-switch__switch-label:after {
    content: "";
    width: 19px;
    height: 19px;
    background: #ddd;
    border-radius: 50%;
    position: absolute;
    top: 2px;
    left: 2px;
    border: 1px solid #aaa
}

.c-switch__checkbox:checked+.c-switch__switch-label {
    background: #262626;
    border: 1px solid #111
}

.c-switch__checkbox:checked+.c-switch__switch-label:after {
    left: calc(100% - 23px);
    background: #fff;
    border: 1px solid #f6f6f6
}

.web .c-switch:hover .c-switch__switch-label {
    border: 1px solid #aaa
}

.web .c-switch:hover .c-switch__checkbox:checked+.c-switch__switch-label {
    border: 1px solid #262626
}

.theme-dark .c-input__text {
    background: #262626;
    border: 1px solid #333;
    color: inherit
}

.theme-dark .c-input__text:focus,.theme-dark .c-select__select:focus {
    border: 1px solid #fff
}

.theme-dark .c-input__placeholder {
    background: #262626;
    color: #fff!important
}

.theme-dark .c-switch__switch-label {
    background: #1d1d1d;
    border: 1px solid #555
}

.theme-dark .c-switch__checkbox+.c-switch__switch-label:after {
    background: #333;
    border: 1px solid #555
}

.theme-dark .c-select__select {
    color: #fff;
    border: 1px solid #555
}

.theme-dark .c-select__select option {
    color: #262626
}

.theme-dark .c-switch__checkbox:checked+.c-switch__switch-label {
    background: #fff;
    border: 1px solid #fff
}

.theme-dark .c-switch__checkbox:checked+.c-switch__switch-label:after {
    background: #262626;
    border: 1px solid #111
}

.l-center {
    text-align: center
}

.l-panel {
    min-height: 56px;
    border-bottom: 1px solid #ddd;
    margin-bottom: 15px;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    background: #fff;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    z-index: 100
}

.ios .l-panel {
    border-top: var(--safe-area-inset-top) solid transparent
}

.c-panel__back {
    font-size: 20px;
    cursor: default;
    vertical-align: middle;
    display: inline-block;
    width: 30px;
    padding: 10px;
    text-align: center;
    margin: 0 10px
}

.web .c-panel__back {
    cursor: pointer
}

.web .c-panel__back:hover {
    background: rgba(0,0,0,.05);
    border-radius: 5px
}

.web.theme-dark .c-panel__back:hover {
    background: hsla(0,0%,100%,.05)
}

.c-panel__title {
    width: calc(100% - 180px);
    display: inline-block;
    vertical-align: middle;
    font-size: 18px;
    font-family: Arial Rounded MT PRO Cyr;
    padding-top: 20px;
    padding-bottom: 15px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.c-panel__title--center {
    width: 100%;
    max-width: 100%;
    text-align: center
}

.theme-dark .l-panel {
    background: #262626;
    border-bottom: 1px solid #333
}

.player {
    position: relative;
    background: #fff;
    width: 100%;
    box-sizing: border-box;
    border-top: 1px solid #ddd;
    padding: 0
}

.ios .player {
    border-bottom: var(--safe-area-inset-bottom) solid transparent;
    position: sticky;
    position: -webkit-sticky
}

.theme-dark .player {
    background: #262626;
    border-top: 1px solid #333
}

.player .c-category__text {
    width: 100%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.Tabbar {
    height: 58px;
    box-shadow: none!important
}

.weirdTabbarFix .Tabbar {
    bottom: 75px!important
}

.theme-dark .Tabbar {
    background: #262626
}

#notice,.Tabbar:before {
    display: none
}

#notice {
    position: fixed;
    bottom: calc(10px + var(--safe-area-inset-bottom));
    left: 10px;
    width: calc(100% - 20px);
    padding: 15px 50px 15px 20px;
    background: #111;
    color: #fff;
    border: 1px solid #333;
    border-radius: 10px;
    box-sizing: border-box;
    -webkit-animation: popup_up .15s ease-in-out;
    animation: popup_up .15s ease-in-out;
    z-index: 999
}

.notice--hidden {
    display: none!important
}

.notice--active {
    display: block!important
}

#notice.notice_hide {
    -webkit-animation: notice_hide .15s ease-in-out forwards;
    animation: notice_hide .15s ease-in-out forwards
}

.notice_close {
    display: inline-block;
    position: absolute;
    top: 8px;
    right: 10px;
    width: 32px;
    height: 32px
}

.notice_close:after,.notice_close:before {
    content: "";
    display: inline-block;
    background: #555;
    position: absolute;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.notice_close:after {
    width: 2px;
    height: 16px;
    margin-left: -1px;
    left: 50%;
    top: 8px
}

.notice_close:before {
    width: 16px;
    height: 2px;
    margin-top: -1px;
    top: 50%;
    left: 8px
}

.web .notice_close:hover {
    cursor: pointer
}

.web .notice_close:hover:after,.web .notice_close:hover:before {
    background: #aaa
}

@-webkit-keyframes notice_hide {
    0% {
        display: block!important;
        opacity: 1
    }

    to {
        -webkit-transform: translateY(50px);
        transform: translateY(50px);
        opacity: 0;
        display: none
    }
}

@keyframes notice_hide {
    0% {
        display: block!important;
        opacity: 1
    }

    to {
        -webkit-transform: translateY(50px);
        transform: translateY(50px);
        opacity: 0;
        display: none
    }
}

#offline {
    background: #bd1c1c;
    color: #fff;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 5px;
    border-bottom: var(--safe-area-inset-bottom) solid transparent;
    box-sizing: border-box;
    text-align: center;
    display: none;
    z-index: 900;
    font-weight: 400;
    font-size: 14px;
    -webkit-animation: popup_up .15s ease-in-out;
    animation: popup_up .15s ease-in-out
}

#offline:after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 14px;
    height: 14px;
    border-left: 2px solid transparent;
    border-top: 2px solid transparent;
    border-color: #fff transparent transparent #fff;
    border-style: solid;
    border-width: 2px;
    border-radius: 50%;
    box-sizing: border-box;
    margin-left: 5px;
    -webkit-animation: spinner 1s linear infinite;
    animation: spinner 1s linear infinite
}

.offline--active {
    display: block!important
}

.l-content {
    margin: 58px auto 0;
    padding: 5px 0 15px;
    width: 100%;
    max-width: 400px;
    box-sizing: border-box
}

.ios .l-content {
    border-top: var(--safe-area-inset-top) solid transparent
}

.c-menu-buttons__item {
    margin: 0;
    border-radius: 5px;
    padding: 8px;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.c-menu-buttons__item:active,.web .c-menu-buttons__item:hover {
    background: rgba(0,0,0,.05)
}

.web .c-menu-buttons__item:hover {
    cursor: pointer
}

.theme-dark.web .c-menu-buttons__item:hover .theme-dark .c-menu-buttons__item:active {
    background: hsla(0,0%,100%,.05)
}

.c-menu-buttons__item:active {
    -webkit-transform: scale(.95);
    transform: scale(.95)
}

.c-menu-buttons__icon {
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
    font-size: 24px;
    color: inherit
}

.c-menu-buttons__icon--outlined {
    font-family: Material Icons Outlined
}

.c-menu-buttons__text {
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 40px);
    box-sizing: border-box;
    padding-left: 8px;
    font-family: Arial Rounded MT Pro Cyr;
    color: inherit
}

.c-menu-buttons__item--destructive {
    color: #bd1c1c
}

.c-category {
    width: 100%;
    padding: 0 20px;
    border-radius: 10px;
    box-sizing: border-box;
    margin-bottom: 5px;
    display: block;
    color: inherit;
    cursor: default;
    text-decoration: none;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.c-category:active,.web .c-category:hover {
    background: rgba(0,0,0,.05)
}

.c-category:active .c-category__icon--additional,.web .c-category:hover .c-category__icon--additional {
    background: #f2f2f2
}

.theme-dark .c-category:active .c-category__icon--additional,.theme-dark.web .c-category:hover .c-category__icon--additional {
    background: #242424
}

.web .c-category {
    cursor: pointer
}

.c-category__text-content {
    display: inline-block;
    vertical-align: middle;
    box-sizing: border-box;
    width: calc(100% - 50px)
}

.c-category__icon {
    display: inline-block;
    vertical-align: middle;
    font-size: 34px;
    margin-right: 15px
}

.c-category__icon--additional {
    position: absolute;
    font-size: 12px;
    padding: 1px;
    background: #fff;
    border-radius: 50% 0 0 0;
    left: 43px;
    top: calc(50% + 5px)
}

.c-category__icon--additional:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 10px;
    height: 10px;
    border-radius: 5px 0 0 0;
    border-left: 1px solid transparent;
    border-top: 1px solid transparent;
    -webkit-transition: .3s linear;
    transition: .3s linear;
    border-color: rgba(0,0,0,.05) transparent transparent rgba(0,0,0,.05);
    border-style: solid;
    border-width: 1px
}

.c-category__icon--additional:empty {
    display: none
}

.theme-dark .c-category__icon--additional {
    background: #262626
}

.theme-dark .c-category__icon--black {
    color: #fff
}

.theme-dark .c-category__icon--brown {
    color: #c54d1e
}

.theme-dark .c-category__icon--purple {
    color: #a581e4
}

.theme-dark .c-category__icon--red {
    color: #f74747
}

.c-category__icon--image {
    width: 34px;
    height: 34px;
    border-radius: 5px;
    background-repeat: no-repeat!important;
    background-size: contain!important;
    background-position: 50%!important;
    position: relative
}

.c-category__icon--image:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    box-sizing: border-box;
    border: 1px solid rgba(0,0,0,.05)
}

.theme-dark .c-category__icon--image:after {
    border: 1px solid hsla(0,0%,100%,.05)
}

.theme-dark .c-category__icon--additional:after {
    border-top: 1px solid hsla(0,0%,100%,.05);
    border-left: 1px solid hsla(0,0%,100%,.05)
}

.c-category__icon--blue {
    color: #1c82bd
}

.c-category__icon--green {
    color: #86c44e
}

.c-category__icon--red {
    color: #bd1c1c
}

.c-category__icon--black {
    color: #262626
}

.c-category__icon--orange {
    color: #e6a00a
}

.c-category__icon--red-orange {
    color: #f1600b
}

.c-category__icon--brown {
    color: #652a13
}

.c-category__icon--purple {
    color: #673ab7
}

.c-category__icon--grey {
    color: #888
}

.c-category__icon--filled {
    color: #fff;
    font-size: 24px;
    padding: 5px;
    border-radius: 50%;
    margin: -5px 15px -5px -5px
}

.c-category__icon--filled.c-category__icon--blue {
    background-color: #08aeea;
    background-image: -webkit-linear-gradient(135deg,#08aeea,#2af5f2);
    background-image: linear-gradient(315deg,#08aeea,#2af5f2)
}

.c-category__icon--filled.c-category__icon--red {
    background-color: #ff9a9a;
    background-image: -webkit-linear-gradient(315deg,#ff9a9a,#bd1c1c);
    background-image: linear-gradient(135deg,#ff9a9a,#bd1c1c)
}

.c-category__icon--filled.c-category__icon--green {
    background-color: #85ffbd;
    background-image: -webkit-linear-gradient(316deg,#85ffbd,#86c44e);
    background-image: linear-gradient(134deg,#85ffbd,#86c44e)
}

.c-category__icon--filled.c-category__icon--orange {
    background-color: #fbab7e;
    background-image: -webkit-linear-gradient(135deg,#fbab7e,#f7ce68);
    background-image: linear-gradient(315deg,#fbab7e,#f7ce68)
}

.c-category__icon--filled.c-category__icon--purple {
    background-color: #8bc6ec;
    background-image: -webkit-linear-gradient(315deg,#8bc6ec,#673ab7);
    background-image: linear-gradient(135deg,#8bc6ec,#673ab7)
}

.c-category__icon--filled.c-category__icon--brown {
    background-color: #c1785b;
    background-image: -webkit-linear-gradient(316deg,#c1785b,#652a13);
    background-image: linear-gradient(134deg,#c1785b,#652a13)
}

.c-category__icon--filled.c-category__icon--black {
    background-color: #444;
    background-image: -webkit-linear-gradient(316deg,#444,#262626);
    background-image: linear-gradient(134deg,#444,#262626)
}

.c-category--nopad {
    padding: 10px 0
}

.c-category--small-pad {
    padding: 0 10px
}

.c-category--small-pad .c-category__icon--additional {
    left: 30px
}

.c-category--nopad:hover {
    background: transparent
}

.c-category__icon--text {
    font-family: Arial Rounded MT Pro Cyr;
    font-size: 16px;
    max-width: 30px;
    word-break: break-word
}

.c-category--compact {
    display: inline-block;
    vertical-align: middle;
    width: auto;
    text-align: center;
    padding: 10px;
    width: 25%
}

.c-category--compact .c-category__icon {
    font-size: 26px;
    line-height: 30px;
    margin: 0 0 5px
}

.c-category--compact .c-category__text {
    display: none
}

.c-category--compact .c-category__title {
    font-size: 12px;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden
}

.c-category--compact .c-category__text-content {
    display: block;
    width: 100%
}

.c-category__title {
    font-family: Arial Rounded MT Pro Cyr
}

.c-category__text {
    font-size: 14px;
    font-weight: 400;
    word-wrap: break-word;
    word-break: normal;
    word-break: break-word
}

.c-category--with-button {
    position: relative
}

.c-category__button {
    display: inline-block;
    position: absolute;
    top: 50%;
    right: 10px;
    padding: 5px;
    margin-top: -17px;
    color: #aaa;
    border-radius: 5px
}

.c-category__button--clickable:active,.web .c-category__button--clickable:hover {
    background: rgba(0,0,0,.05)
}

.c-category--with-button .c-category__title {
    width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.c-category--with-button .c-category__text-content {
    text-decoration: none;
    display: inline-block;
    color: inherit
}

.c-category__date {
    font-size: 14px;
    color: #888
}

.c-category__click-area {
    display: inline-block;
    width: 100%;
    padding: 10px 0
}

.c-category--with-button .c-category__click-area {
    width: calc(100% - 30px)
}

.c-subtitle {
    font-family: Roboto;
    font-weight: 300
}

.c-subtitle--grey {
    font-size: 14px;
    color: #888
}

.lang__flag {
    display: inline-block;
    vertical-align: middle;
    margin-bottom: 2px;
    margin-right: 3px;
    position: relative;
    border-radius: 4px;
    overflow: hidden;
    width: 18px;
    height: 14px;
    background-size: cover!important;
    background-position: 50%!important
}

.lang__flag:after {
    content: "";
    position: absolute;
    border: 1px solid rgba(0,0,0,.05);
    border-radius: 4px;
    box-sizing: border-box
}

#preloader,.lang__flag:after {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

#preloader {
    position: fixed;
    background: hsla(0,0%,100%,.5);
    z-index: 980;
    display: none;
    -webkit-animation: fade_in .15s ease-in-out;
    animation: fade_in .15s ease-in-out
}

#preloader.preloader--active {
    display: block
}

.preloader--fill {
    background: #fff!important
}

.theme-dark .preloader--fill {
    background: #262626
}

#preloader:after {
    content: "";
    display: block;
    width: 30px;
    height: 30px;
    box-sizing: border-box;
    border-right: 2px solid transparent;
    border-top: 2px solid transparent;
    border-color: #000 #000 transparent transparent;
    border-style: solid;
    border-width: 2px;
    border-radius: 50%;
    margin: -15px;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 100;
    -webkit-animation: spinner 1s linear infinite;
    animation: spinner 1s linear infinite
}

.theme-dark #preloader {
    background: rgba(0,0,0,.5)
}

.theme-dark #preloader:after {
    border-top: 2px solid #fff;
    border-right: 2px solid #fff
}

.offline_hide_anim,.preloader_hide_anim {
    opacity: 0;
    -webkit-transition: .15s linear;
    transition: .15s linear;
    -webkit-animation: fade_out 1s ease-in-out;
    animation: fade_out 1s ease-in-out
}

.c-input__note {
    color: #888;
    font-size: 14px;
    font-weight: 300;
    -webkit-transition: .15s linear;
    transition: .15s linear;
    margin: 0 0 5px
}

.c-input__note--center {
    text-align: center
}

.popup_wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background: rgba(0,0,0,.5);
    z-index: 900;
    overflow-x: hidden;
    box-sizing: border-box;
    -webkit-animation: popup_wrapper_show .3s ease-in-out;
    animation: popup_wrapper_show .3s ease-in-out
}

.ios .popup_wrapper {
    position: sticky;
    position: -webkit-sticky
}

.popup_mask {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0
}

.popup_bottom_wrapper {
    display: table-cell;
    vertical-align: bottom;
    height: 100vh;
    width: 100vw;
    overflow: hidden;
    vertical-align: top;
    box-sizing: border-box;
    padding-top: 65px
}

.popup_bottom .popup_bottom_wrapper {
    vertical-align: bottom
}

.popup_middle .popup_bottom_wrapper {
    vertical-align: middle
}

.popup {
    width: calc(100% - 30px);
    display: block;
    max-width: 400px;
    padding: 30px;
    margin: 15px auto;
    border-radius: 10px;
    box-sizing: border-box;
    background: #fff;
    position: relative;
    -webkit-animation: popup_down .15s ease-in-out;
    animation: popup_down .15s ease-in-out
}

.popup_bottom .popup {
    -webkit-animation: popup_up .15s cubic-bezier(.57,.57,.41,1);
    animation: popup_up .15s cubic-bezier(.57,.57,.41,1)
}

.popup_middle .popup {
    -webkit-animation: popup_up .15s ease-in-out;
    animation: popup_up .15s ease-in-out;
    margin-top: 15px
}

.popup_wrapper_hide {
    -webkit-animation: popup_wrapper_hide .15s linear forwards;
    animation: popup_wrapper_hide .15s linear forwards
}

.popup_wrapper_hide .popup,.popup_wrapper_hide.popup_middle .popup {
    -webkit-animation: popup_hide_up .35s cubic-bezier(.57,.57,.41,1) forwards;
    animation: popup_hide_up .35s cubic-bezier(.57,.57,.41,1) forwards
}

.popup_wrapper_hide.popup_bottom .popup {
    -webkit-animation: popup_hide_down .3s cubic-bezier(.57,.57,.41,1) forwards;
    animation: popup_hide_down .3s cubic-bezier(.57,.57,.41,1) forwards
}

.popup_close {
    display: inline-block;
    position: absolute;
    top: 20px;
    right: 20px;
    width: 32px;
    height: 32px
}

.popup_close:after,.popup_close:before {
    content: "";
    display: inline-block;
    background: #ddd;
    position: absolute;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.popup_close:after {
    width: 2px;
    height: 16px;
    margin-left: -1px;
    left: 50%;
    top: 8px
}

.popup_close:before {
    width: 16px;
    height: 2px;
    margin-top: -1px;
    top: 50%;
    left: 8px
}

@-webkit-keyframes popup_up {
    0% {
        -webkit-transform: translateY(100px);
        transform: translateY(100px);
        opacity: 0
    }
}

@keyframes popup_up {
    0% {
        -webkit-transform: translateY(100px);
        transform: translateY(100px);
        opacity: 0
    }
}

@-webkit-keyframes popup_down {
    0% {
        -webkit-transform: translateY(-50px);
        transform: translateY(-50px);
        opacity: 0
    }
}

@keyframes popup_down {
    0% {
        -webkit-transform: translateY(-50px);
        transform: translateY(-50px);
        opacity: 0
    }
}

@-webkit-keyframes popup_wrapper_hide {
    to {
        opacity: 0;
        display: none
    }
}

@keyframes popup_wrapper_hide {
    to {
        opacity: 0;
        display: none
    }
}

@-webkit-keyframes popup_wrapper_show {
    to {
        opacity: 1
    }
}

@keyframes popup_wrapper_show {
    to {
        opacity: 1
    }
}

@-webkit-keyframes popup_hide_up {
    to {
        -webkit-transform: translateY(-50px);
        transform: translateY(-50px);
        opacity: 0;
        display: none
    }
}

@keyframes popup_hide_up {
    to {
        -webkit-transform: translateY(-50px);
        transform: translateY(-50px);
        opacity: 0;
        display: none
    }
}

@-webkit-keyframes popup_hide_down {
    to {
        -webkit-transform: translateY(150px);
        transform: translateY(150px);
        opacity: 0;
        display: none
    }
}

@keyframes popup_hide_down {
    to {
        -webkit-transform: translateY(150px);
        transform: translateY(150px);
        opacity: 0;
        display: none
    }
}

.c-scroll-text {
    width: 100%;
    overflow: hidden;
    position: relative
}

.c-scroll-text__content--scrollable {
    -webkit-animation-duration: 20s;
    animation-duration: 20s;
    -webkit-animation-name: marquee;
    animation-name: marquee;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear
}

@-webkit-keyframes marquee {
    0% {
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }

    40%,60% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    to {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }
}

@keyframes marquee {
    0% {
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }

    40%,60% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    to {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }
}

.center_logo {
    width: 50px;
    height: 50px;
    border-radius: 10px;
    margin: 10px auto;
    display: block
}

.c-empty {
    width: 100%;
    display: block;
    text-align: center;
    margin: 40px 0
}

.c-empty__icon {
    font-size: 50px;
    margin-bottom: 10px;
    color: #ddd
}

.c-empty__text {
    color: #888
}

.c-player-layout-wrap {
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    align-items: center;
    height: calc(100vh - 68px);
    overflow: hidden;
    margin-bottom: -15px;
    -webkit-overflow-scrolling: auto!important
}

.c-player-layout {
    text-align: center;
    position: relative;
    height: 100%;
    max-height: 600px;
    width: 100%
}

.c-player-volume {
    display: block;
    width: 100%;
    padding: 15px;
    box-sizing: border-box
}

.c-player-volume__icon {
    width: calc(15% - 5px);
    display: inline-block;
    vertical-align: middle;
    margin-top: 5px;
    border-radius: 5px
}

.web .c-player-volume__icon:hover {
    color: #555;
    cursor: pointer
}

.web.theme-dark .c-player-volume__icon:hover {
    color: #ddd
}

.c-player-volume__slider {
    width: calc(70% - 5px);
    display: inline-block;
    vertical-align: middle
}

.web .c-player-volume__slider {
    cursor: pointer
}

.c-player__control,.l-category-list {
    box-sizing: border-box
}

.c-player__control {
    display: inline-block;
    vertical-align: middle;
    font-size: 40px;
    text-align: center;
    padding: 10px 5px;
    cursor: default;
    border-radius: 5px;
    height: 100%;
    min-width: 30px
}

.c-player__control--10 {
    width: calc(10% - 5px)
}

.c-player__control--15 {
    width: calc(15% - 5px)
}

.c-player__control--20 {
    width: calc(20% - 5px)
}

.c-player__control--25 {
    width: calc(25% - 5px)
}

.c-player__control--30 {
    width: calc(30% - 5px)
}

.c-player__control--small-icon {
    font-size: 20px;
    color: #888
}

.c-player__control:active,.web .c-player__control:hover {
    background: rgba(0,0,0,.05)
}

.web .c-player__control {
    cursor: pointer
}

.c-player-controls {
    width: 100%;
    margin: 10px 0;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: center;
    align-items: center
}

.c-button--primary {
    border: 1px solid transparent;
    background: #262626;
    color: #fff
}

.c-button--primary:disabled {
    opacity: .8
}

.c-button--primary:active,.web .c-button--primary:hover {
    background: #111
}

.c-player-controls-wrapper {
    background: #fff;
    padding: 20px 0;
    box-sizing: border-box;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%
}

.theme-dark .c-player-controls-wrapper {
    background: #262626
}

#player_preloader {
    position: fixed;
    bottom: calc(12px + var(--safe-area-inset-bottom));
    left: 20px;
    width: 34px;
    height: 34px;
    box-sizing: border-box;
    display: none;
    -webkit-animation: fade_out .15s ease-in-out forwards;
    animation: fade_out .15s ease-in-out forwards
}

#player_preloader.player-preloader--active {
    display: block;
    -webkit-animation: fade_in .15s ease-in-out;
    animation: fade_in .15s ease-in-out
}

.player-preloader--fill {
    background: #fff!important
}

.theme-dark .player-preloader--fill {
    background: #262626
}

#player_preloader:after {
    content: "";
    display: block;
    width: 16px;
    height: 16px;
    box-sizing: border-box;
    border-right: 2px solid #fff;
    border-top: 2px solid #fff;
    border-color: #000 #000 #fff #fff;
    border-style: solid;
    border-width: 2px;
    border-radius: 50%;
    margin: -8px;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 100;
    -webkit-animation: spinner 1s linear infinite;
    animation: spinner 1s linear infinite
}

.theme-dark #player_preloader:after {
    border-top: 2px solid #000;
    border-right: 2px solid #000
}

.preloader--active~#player_preloader {
    display: none
}

@-webkit-keyframes fade_in {
    0% {
        opacity: 1
    }
}

@keyframes fade_in {
    0% {
        opacity: 1
    }
}

@-webkit-keyframes fade_out {
    to {
        opacity: 0
    }
}

@keyframes fade_out {
    to {
        opacity: 0
    }
}

.c-button--secondary {
    border: 1px solid #ddd
}

.theme-dark .c-button--secondary {
    border: 1px solid #555
}

.theme-dark .c-button--secondary:active,.theme-dark.web .c-button--secondary:hover {
    background: hsla(0,0%,100%,.05)
}

.c-player__cover {
    border-radius: 10px;
    background-size: contain!important;
    background-position: 50%!important;
    background-repeat: no-repeat!important;
    width: 300px;
    height: 300px;
    max-width: 100%;
    margin: 0 auto 20px;
    background: #ddd;
    position: relative;
    max-height: calc(100vh - 298px)
}

.c-player__cover--animate {
    -webkit-animation: player_cover .2s ease-in-out;
    animation: player_cover .2s ease-in-out
}

.c-player__preloader {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    border-left: 2px solid #fff;
    border-top: 2px solid #fff;
    border-color: #000 #fff #fff #000;
    border-style: solid;
    border-width: 2px;
    border-radius: 50%;
    box-sizing: border-box;
    margin: -10px;
    -webkit-animation: spinner 1s linear infinite;
    animation: spinner 1s linear infinite
}

.c-player__preloader--active {
    display: block
}

@-webkit-keyframes spinner {
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

@keyframes spinner {
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

@-webkit-keyframes player_cover {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes player_cover {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.qr {
    padding: 20px;
    border-radius: 10px;
    background: #fff
}

.qr__container {
    display: flex;
    justify-content: center
}

.qr__link {
    position: absolute;
    left: -9999px;
    top: -9999px
}

/*# sourceMappingURL=main.c591b306.chunk.css.map */