.notification {
    display: none;
}

.js-dropdown-content {
    display: none;
    opacity: 0;
    transition: opacity .2s ease;
}

.js-dropdown-content.is-active {
    display: block;
    opacity: 1;
    visibility: visible;
}

.page__modal-content {
    overflow-y: auto;
}

.player__interaction-item--volume.is-active .player__volume.js-dropdown-content {
    display: block;
}

.player__menu-icons {
    display: none;
}

.header__mob-toggler,
.header__authorize-mob {
    display: none;
}

.header__mob-wrapper {
    display: none;
    position: fixed;
    z-index: 1000;
    top: 76px;
    padding: 15px 15px 15px 15px;
    height: 100%;
    width: 100%;
    background-color: #FFFFFF;
}

.catalog__mob-filters {
    display: none;
}


.catalog__mob-wrapper-filter,
.catalog__mob-wrapper-sort {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transform: translateY(-10px);
    transition: 
        max-height 0.35s ease,
        opacity 0.25s ease,
        transform 0.25s ease;
            position: fixed;
    z-index: 10000;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    pointer-events: none;
}

.catalog__mob-wrapper-filter.is-active,
.catalog__mob-wrapper-sort.is-active {
    max-height: 100%; 
    opacity: 1;
    pointer-events: all;
    transform: translateY(0);
}

.catalog__mob-wrapper-filter .catalog__filter {
    width: 100%;
    height: 100%;
    margin-top: 200px;
}

.catalog__mob-wrapper-filter,
.catalog__mob-wrapper-sort {
    backdrop-filter: blur(5px);
}

@media screen and (max-width: 1280px) {
    body, html {
        font-size: calc(.125vw + 9.6px);
    }

    .header__nav-link {
        font-size: 13px!important;
    }
}

@media screen and (max-width: 1040px) {
    body, html {
        font-size: calc(.125vw + 8.25px);
    }

    .header__nav-link {
        font-size: 13px!important;
    }
}

@media screen and (max-width: 768px) {
    body, html {
        font-size: 16px;
    }

    .header  .col-7 {
        display: none;
    }

    .home__intro-title {
        font-size: 14vw;
    }

    .home__intro-content .button {
        margin-top: 16px;
    }

    .page__section + .page__section {
        margin-top: 45px;
    }

    .home__welcome .title,
    .home__welcome .text,
    .home__offers .title.title--regular.title--weight--medium,
    .home__offers .text {
        text-align: center;
    }

    .home__welcome .row,
    .home__offers .row {
        flex-direction: column;
        gap: 16px;
    }

    .home__welcome .row .col-4,
    .home__offers .row .col-6 {
        max-width: 100%;
    }

    .home__welcome-item .svg-icon {
        width: 40px;
        height: 40px;
    }

    .home__welcome-item-content {
        margin-top: 15px;
        padding-top: 15px;
        border-top: 1px solid #DEDEDE;
    }

    .home__welcome-item {
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    .home__welcome .home__welcome-item .title {
        font-size: 16px;
    }

    .home__offer-header h3 {
        margin-bottom: 0;
    }

    .home__offer-header {
        padding-bottom: 15px;
    }

    .home__offer-main {
        margin-top: 15px;
    }

    .home__offer-main .list--checked li {
        max-width: 100%;
        flex: 0 0 100%;
    }

    .home__offer .button {
        margin-top: 20px;
        max-width: 100%;
        width: 100%;
    }

    .home__offer-header h3 {
        font-size: 20px;
    }

    .home__about .row {
        flex-direction: column;
    }

    .home__about .row .col-3 {
        max-width: 100%;
    }

    .home__about .row .col-3 .title {
        text-align: center;
    }

    .home__about-item {
        text-align: center;
    }

    .home__purchase .title {
        text-align: center;
    }

    .home__purchase-steps {
        flex-direction: column;
        gap: 20px;
    }

    .home__purchase-step-icon {
        width: 32px;
        height: 32px;
        left: 50%;
        top: -36px;
        transform: translateX(-50%) rotate(90deg);
    }

    .home__licenses .title.title--regular.title--weight--medium {
        text-align: center!important;
        padding-top: 0;
    }

    .home__licenses-content,
    .home__tariffs-row {
        display: flex;
        flex-direction: column;
    }

    .home__licenses-box .col-4 h3 {
        font-size: 24px;
    }
    
    .home__licenses-box .col-4:nth-child(2) {
        margin-top: 15px;
        padding-top: 15px;
    }

    .home__tariffs-content [data-tabs-content] .home__tariffs-row {
        padding-top: 0;
    }

    .home__tariffs .row.mt-5.pt-5 {
        flex-direction: column;
        gap: 20px;
    }

    .home__tariffs .row.mt-5.pt-5 .col-6 {
        max-width: 100%;
        flex: 0 0 100%;
    }

    .home__tariff--vip .home__tariff-header .title {
        font-size: 32px;
    }

    .home__tariffs .tabs__nav .row {
        overflow-x: auto;
        flex-wrap: nowrap;
        justify-content: unset !important;
        width: 100%;
        padding-left: 16px;
    }

    .home__tariffs .tabs__nav {
        overflow-x: scroll;
        width: 100%;
    }

    .home__tariff--vip hr {
        display: none;
    }

    .home__tariff-main .row .col-3.d-flex.flex-column {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .home__dignities .title--offset-bottom {
        padding-bottom: 10px;
    }

    .home__dignities .row {
        flex-direction: column;
        gap: 20px;
    }

    .home__dignities .row .col-4 {
        max-width: 100%;
    }

    .home__dignities-item-icon {
        margin-bottom: 0;
    }

    .home__dignities-item-icon .svg-icon {
        width: 40px;
        height: 40px;
    }

    .home__dignities-item .col-8 {
        padding-top: 15px;
        border-top: 1px solid #FFF;
    }

    .home__faq {
        padding-top: 70px;
    }

    .home__faq-question-button {
        font-size: 20px;
    }

    .home__faq-question-content {
        max-width: 80%;
    }

    .footer .row {
        flex-direction: column;
        gap: 20px;
    }

    .footer .col-auto {
        order: 1;
    }

    .footer .col-4 {
        order: 3;
        max-width: 100%;
    }

    .footer .d-inline-block {
        font-size: 14px;
    }

    .about__header h1 {
        font-size: 36px;
    }

    .about__content-wrapper {
        display: flex;
        flex-direction: column;
        gap: 55px;
        padding-top: 0;
    }

    .about__content {
        margin-top: 15px!important;
    }

    .about__content-text .title {
        margin-bottom: 20px;
    }

    .about__content-text-title {
        margin-bottom: 14px;
    }

    .about__content-text-block + .about__content-text-block {
        margin-top: 20px;
    }

    .about__content-managment .row {
        flex-direction: column;
    }

    .about__content-managment .col-6 {
        max-width: 100%;
    }

    .about__content-documents {
        grid-template-columns: 1fr 1fr;
    }

    .about__content-partners {
        grid-template-columns: 1fr;
    }

    .prices__template {
        padding-top: 70px;
    }
    
    .prices__template .row {
        flex-direction: column;
        gap: 16px;
    }

    .prices__template .col-6 {
        max-width: 100%;
    }

    .page__modal--authorization .page__modal-nav a {
        font-size: 18px;
    }

    .personal__account-wrapper,
    .personal__account-list,
    .personal__account-list,
    .personal__account-list {
        display: flex!important;
        flex-direction: column;
    }


    .personal__account .title--weight--medium.pb-5 {
        padding-bottom: 0!important;
    }

    .personal__account-wrapper.my-5,
    .personal__account-wrapper.mt-5  {
        margin-top: 0!important;
    }

    .personal__account-data-item .button {
        width: 100%;
    }

    .personal__account-wrapper.my-5 .personal__account-data-item {
        border-top: 1px solid #DEDEDE;
    }
    
    .personal__navigation {
        overflow-x: auto;
    }

    #react-profiles .col-7 {
        max-width: 100%;
        flex: 0 0 100%;
    }

    .top__buttons {
        flex-direction: column;
        gap: 10px;
    }

    .top__buttons div {
        width: 100%;
    }

    .top__buttons .button {
        width: 100%;
    }

    .page__player-main {
        padding: 10px 15px;
        flex-wrap: wrap;
        justify-content: space-between;
        position: relative;
        gap: 10px;
    }

    .page__player-song {
        width: 100%;
        flex: 0 0 100%;
    }
    
    .page__player-song:after,
    .player__oscillogram {
        display: none;
    }
    
    .page__player-duration-total {
        position: relative;
        padding-left: 6px;
    }

    .page__player-duration-total::before {
        position: absolute;
        left: 1px;
        top: 0;
        content: '/';
        font-weight: 600;
        font-size: 0.875rem;
    }

    .page__player-duration {
        padding: 0;
    }

    .page__player-interaction .player__interaction-item:not(:last-of-type) {
        margin-right: 12px;
    }

    .player__interaction-item {
        width: 30px;
        height: 30px;
    }

    .page__player-interaction {
        width: auto;
    }

    .page__player-interaction .player__interaction-item--demo .button {
        padding: 3px 8px;
        min-width: auto;
    }

    .page__player-play {
        width: 30px;
        height: 30px;
        position: absolute;
        top: 24px;
        left: 75px;
    }

    .page__player-poster {
        margin-left: 0;
    }

    .personal__table table th, .personal__table table td {
        padding: 20px 15px;
    } 

    .personal__table {
        overflow-x: auto;
    }

    .personal__table table {
        min-width: 995px;
    }

    .personal__order-documents-list {
        display: flex;
        flex-direction: column;
    }

    .personal__order-documents .row {
        flex-direction: column;
    }

    .personal__order-documents .row .ml-auto {
        margin-left: 0!important;
        padding-left: 0;
        margin-top: 30px;
    }

    .personal__order-documents .row .ml-auto .button {
        width: 100%;
    }

    .personal__order-documents .title.pb-4 {
        padding-bottom: 0!important;
    }

    .personal__order-detail .row {
        flex-wrap: nowrap;
        overflow-x: auto;
    }

    .personal__order-profile .row {
        flex-direction: column;
    }

    .personal__order-profile .row .col-2 {
        max-width: 100%;
    }

    .card__collection-content p.text--small > span {
        display: block;
    }

    .catalog__filter {
        display: none;
    }

    .catalog__main {
        padding-left: 0;
    }

    .catalog__nav {
        overflow-x: auto;
        padding: 0 16px;
    }

    .card__collection-content .title {
        font-size: 16px;
        padding-bottom: 0!important;
    }

    .card__collection-description {
        margin-bottom: 5px;
    }

    .select--sorting {
        display: none!important;
    }

    .player__control-track {
        display: none;
    }

    .player__control-play {
        width: 40px;
    }

    .player__control-play-button {
        width: 30px;
        height: 30px;
        left: 5px;
        top: 5px;
    }

    .player__wrapper {
        align-items: center;
    }

    .player__controls {
        width: 3.28125rem;
    }

    .player__song {
        padding: 0;
        padding-left: 8px;
    }

    .player__controls {
        height: 40px;
    }

    .player {
        height: 4rem;
    }

    .player__song:after {
        display: none;
    }

    .player__interaction-item--volume {
        display: none;
    }

    .player__duration {
        display: none!important;
    }

    .player__interaction .player__interaction-item {
        display: none;
    }

    .player__interaction .player__interaction-item:last-child {
        display: block;
    }

    .player__interaction {
        width: auto;
        margin-left: auto;
    }

    .player__menu-icons {
        display: flex;
        gap: 8px;
    }

    .player__menu-icons .player__interaction-item {
        display: block;
    }

    .player__menu-list {
        padding: 10px;
        text-align: left;
    }

    .player__menu {
        width: 10.5rem;
    }

    .mob-hide {
        display: none;
    }

    .header__mob-toggler,
    .header__authorize-mob {
        display: block;
    }

    .header__mob-toggler {
        background-image: url("data:image/svg+xml,%3Csvg width='26' height='15' viewBox='0 0 26 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cline x1='0.5' y1='0.5' x2='25.5' y2='0.5' stroke='black' stroke-linecap='round'/%3E%3Cline x1='0.5' y1='7.5' x2='15.5' y2='7.5' stroke='black' stroke-linecap='round'/%3E%3Cline x1='0.5' y1='14.5' x2='25.5' y2='14.5' stroke='black' stroke-linecap='round'/%3E%3C/svg%3E%0A");
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
        width: 26px;
        height: 14px;
    }

    .header__mob-toggler.active {
        background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_71_2213)'%3E%3Cpath d='M9.19095 8.00096L15.7534 1.43854C16.0822 1.10966 16.0822 0.576475 15.7534 0.247632C15.4245 -0.081242 14.8913 -0.081242 14.5624 0.247632L7.99998 6.81006L1.43756 0.247632C1.10869 -0.081242 0.575499 -0.081242 0.246656 0.247632C-0.0821873 0.576507 -0.0822186 1.10969 0.246656 1.43854L6.80908 8.00096L0.246656 14.5634C-0.0822186 14.8923 -0.0822186 15.4254 0.246656 15.7543C0.57553 16.0832 1.10872 16.0831 1.43756 15.7543L7.99998 9.19186L14.5624 15.7543C14.8913 16.0832 15.4245 16.0831 15.7533 15.7543C16.0822 15.4254 16.0822 14.8922 15.7533 14.5634L9.19095 8.00096Z' fill='black'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_71_2213'%3E%3Crect width='16' height='16' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
    }

    .header .row {
        justify-content: space-between;
        padding: 18px 0;
    }

    .header__mob-wrap .header__nav {
        flex-direction: column;
        gap: 36px;
    }

    .header__nav-link {
        padding: 0;
    }

    .header__nav-link {
        font-size: 20px!important;
    }

    .header__nav-link.is-current {
        font-weight: 700;
    }

    .header__nav-link + .header__nav-link {
        margin-left: 0;
    }

    .header__nav-link {
        max-width: max-content;
    }

    .header__nav-link.is-current:after {
        bottom: 0;
    }

    .catalog__content--albums,
    .catalog__content--playlists {
        padding-left: 10px;
    }

    .catalog__mob-filters {
        display: block;
    }

    .catalog__mob-filters-top {
        display: flex;
        justify-content: space-between;
        padding: 15px;
        border-bottom: 1px solid #E5E5E5;
        align-items: center;
    }

    .catalog__mob-sort-toggler {
        position: relative;
        padding-right: 13px;
    }

    .catalog__mob-filters-top .select--sorting {
        display: flex !important;
        margin: unset !important;
    }

    .catalog__mob-sort-toggler::after {
        content: '';
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: center;
        width: 8px;
        height: 8px;
        background-image: url("data:image/svg+xml,%3Csvg width='8' height='8' viewBox='0 0 8 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_71_2319)'%3E%3Cpath d='M4.21953 6.06925L7.90953 2.36901C8.03036 2.24778 8.03016 2.0515 7.90891 1.93047C7.78767 1.80953 7.59128 1.80984 7.47036 1.93109L3.99999 5.41108L0.529627 1.93096C0.40869 1.80973 0.212426 1.80942 0.091176 1.93034C0.030395 1.99101 4.28145e-06 2.0705 4.27798e-06 2.14998C4.27451e-06 2.22926 0.0301919 2.30843 0.0905509 2.36899L3.78046 6.06925C3.83855 6.12764 3.91761 6.1604 3.99999 6.1604C4.08236 6.1604 4.16133 6.12754 4.21953 6.06925Z' fill='black'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_71_2319'%3E%3Crect width='8' height='8' fill='white' transform='translate(8) rotate(90)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
    }

    .catalog__mob-wrapper-filter .catalog__filter {
        display: grid;
        grid-template-columns: minmax(160px, 160px) 1fr;
        width: 100%;
        max-width: 100%;
    }

    .catalog__mob-wrapper-filter .catalog__filter-main {
        position: relative;
    }   

    .catalog__mob-wrapper-filter .catalog__filter-list {
        height: 100%;
    }

    .catalog__mob-wrapper-filter .catalog__filter-settings {
        position: relative;
        left: 0;
        width: 100%;
    }

    .catalog__mob-inner {
        height: 100%;
    }

    .StyledHeader__info {
        flex-wrap: wrap;
    }

    .card__detailed-image {
        max-width: 10rem;
    }

    .card__detailed-header {
        padding-right: 0;
    }

    .catalog__mob-filters-toggler {
        border-bottom: 1px solid  rgb(16, 219, 146);
    }

    .card__detailed-info {
        padding-left: 0;
        margin-top: 1rem;
    }

    .page__wrapper.page__wrapper--catalog-albums {
        overflow-y: auto;
    }

    .catalog__mob-filters-top .select--sorting p {
        display: none;
    }

    .catalog__mob-inner .catalog__filter-settings {
    }

    .card__back {
        margin-top: 10px;
    }
}