@-webkit-keyframes stroke-animation-30e261c5 {
    0% {
        stroke-dashoffset: 70.87433px;
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    12.5% {
        stroke-dashoffset: 7.53982px;
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    12.5001% {
        stroke-dashoffset: 7.53982px;
        -webkit-transform: rotateX(180deg) rotate(72.5deg);
        transform: rotateX(180deg) rotate(72.5deg)
    }

    25% {
        stroke-dashoffset: 70.87433px;
        -webkit-transform: rotateX(180deg) rotate(72.5deg);
        transform: rotateX(180deg) rotate(72.5deg)
    }

    25.0001% {
        stroke-dashoffset: 70.87433px;
        -webkit-transform: rotate(270deg);
        transform: rotate(270deg)
    }

    37.5% {
        stroke-dashoffset: 7.53982px;
        -webkit-transform: rotate(270deg);
        transform: rotate(270deg)
    }

    37.5001% {
        stroke-dashoffset: 7.53982px;
        -webkit-transform: rotateX(180deg) rotate(161.5deg);
        transform: rotateX(180deg) rotate(161.5deg)
    }

    50% {
        stroke-dashoffset: 70.87433px;
        -webkit-transform: rotateX(180deg) rotate(161.5deg);
        transform: rotateX(180deg) rotate(161.5deg)
    }

    50.0001% {
        stroke-dashoffset: 70.87433px;
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    62.5% {
        stroke-dashoffset: 7.53982px;
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    62.5001% {
        stroke-dashoffset: 7.53982px;
        -webkit-transform: rotateX(180deg) rotate(251.5deg);
        transform: rotateX(180deg) rotate(251.5deg)
    }

    75% {
        stroke-dashoffset: 70.87433px;
        -webkit-transform: rotateX(180deg) rotate(251.5deg);
        transform: rotateX(180deg) rotate(251.5deg)
    }

    75.0001% {
        stroke-dashoffset: 70.87433px;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }

    87.5% {
        stroke-dashoffset: 7.53982px;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }

    87.5001% {
        stroke-dashoffset: 7.53982px;
        -webkit-transform: rotateX(180deg) rotate(341.5deg);
        transform: rotateX(180deg) rotate(341.5deg)
    }

    to {
        stroke-dashoffset: 70.87433px;
        -webkit-transform: rotateX(180deg) rotate(341.5deg);
        transform: rotateX(180deg) rotate(341.5deg)
    }
}

@keyframes stroke-animation-30e261c5 {
    0% {
        stroke-dashoffset: 70.87433px;
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    12.5% {
        stroke-dashoffset: 7.53982px;
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    12.5001% {
        stroke-dashoffset: 7.53982px;
        -webkit-transform: rotateX(180deg) rotate(72.5deg);
        transform: rotateX(180deg) rotate(72.5deg)
    }

    25% {
        stroke-dashoffset: 70.87433px;
        -webkit-transform: rotateX(180deg) rotate(72.5deg);
        transform: rotateX(180deg) rotate(72.5deg)
    }

    25.0001% {
        stroke-dashoffset: 70.87433px;
        -webkit-transform: rotate(270deg);
        transform: rotate(270deg)
    }

    37.5% {
        stroke-dashoffset: 7.53982px;
        -webkit-transform: rotate(270deg);
        transform: rotate(270deg)
    }

    37.5001% {
        stroke-dashoffset: 7.53982px;
        -webkit-transform: rotateX(180deg) rotate(161.5deg);
        transform: rotateX(180deg) rotate(161.5deg)
    }

    50% {
        stroke-dashoffset: 70.87433px;
        -webkit-transform: rotateX(180deg) rotate(161.5deg);
        transform: rotateX(180deg) rotate(161.5deg)
    }

    50.0001% {
        stroke-dashoffset: 70.87433px;
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    62.5% {
        stroke-dashoffset: 7.53982px;
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    62.5001% {
        stroke-dashoffset: 7.53982px;
        -webkit-transform: rotateX(180deg) rotate(251.5deg);
        transform: rotateX(180deg) rotate(251.5deg)
    }

    75% {
        stroke-dashoffset: 70.87433px;
        -webkit-transform: rotateX(180deg) rotate(251.5deg);
        transform: rotateX(180deg) rotate(251.5deg)
    }

    75.0001% {
        stroke-dashoffset: 70.87433px;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }

    87.5% {
        stroke-dashoffset: 7.53982px;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }

    87.5001% {
        stroke-dashoffset: 7.53982px;
        -webkit-transform: rotateX(180deg) rotate(341.5deg);
        transform: rotateX(180deg) rotate(341.5deg)
    }

    to {
        stroke-dashoffset: 70.87433px;
        -webkit-transform: rotateX(180deg) rotate(341.5deg);
        transform: rotateX(180deg) rotate(341.5deg)
    }
}

@-webkit-keyframes rotate-animation-30e261c5 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

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

@keyframes rotate-animation-30e261c5 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}
.crono-row:nth-child(odd) {
    background: #fbfbfb;
}

.wrap[data-v-30e261c5] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 20px 0
}

.loader[data-v-30e261c5] {
    -webkit-animation: rotate-animation-30e261c5 2s linear infinite;
    animation: rotate-animation-30e261c5 2s linear infinite;
    height: 26px;
    width: 26px
}

.static-circle[data-v-30e261c5] {
    fill: transparent;
    stroke: #e6edf0;
    stroke-width: 2px
}

.circle[data-v-30e261c5] {
    fill: transparent;
    stroke: #86909a;
    stroke-dasharray: 75.3982236862px;
    stroke-width: 2px;
    -webkit-animation-name: stroke-animation-30e261c5;
    animation-name: stroke-animation-30e261c5;
    -webkit-transition-property: stroke;
    transition-property: stroke;
    -webkit-animation-duration: 4s;
    animation-duration: 4s;
    -webkit-animation-timing-function: cubic-bezier(.35, 0, .25, 1);
    animation-timing-function: cubic-bezier(.35, 0, .25, 1);
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-transform-origin: center;
    transform-origin: center
}

#app,
.fullHeight[data-v-30e261c5] {
    height: calc(100vh - 60px);
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.sm .loader[data-v-30e261c5] {
    width: 20px;
    height: 20px
}

.method-item__icon[data-v-f54d2bae] {
    width: 36px;
    height: 36px;
    font-size: 36px;
    margin-right: 23px
}

.menuActive[data-v-500056dc] {
    opacity: 1;
    visibility: visible
}

.methods__list-trash[data-v-500056dc] {
    position: absolute;
    top: 0;
    right: -40px;
    width: 40px;
    margin: 0
}

.methods__list-trash[data-v-500056dc]:hover {
    opacity: 1;
    border-radius: 3px;
    visibility: visible
}

.menu[data-v-58c751d8] {
    position: relative;
    background: #fff no-repeat 50%;
    background-image: url(/img/more-vertical.3cc68a7c.svg);
    background-size: 4px 14px;
    width: 20px;
    -webkit-transition: all .5s ease;
    transition: all .5s ease;
    cursor: pointer
}

.menu__list li[data-v-58c751d8] {
    list-style: none
}

.menu__list.js-active[data-v-58c751d8] {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.menu__list[data-v-58c751d8] {
    border-radius: 3px;
    background-color: #fff;
    -webkit-box-shadow: 0 15px 18px 0 rgba(0, 0, 0, .06);
    box-shadow: 0 15px 18px 0 rgba(0, 0, 0, .06);
    border: 1px solid hsla(0, 0%, 93%, .62);
    padding: 5px 0;
    margin: 0;
    list-style: none;
    position: absolute;
    right: -100px;
    top: 40px;
    z-index: 99;
    width: 200px;
    -webkit-transition: all .25s ease;
    transition: all .25s ease;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(15px);
    transform: translateY(15px);
    text-transform: none
}

.menu__list[data-v-58c751d8]:after {
    border-bottom: 8px solid hsla(0, 0%, 93%, .62);
    top: -8px
}

.menu__list[data-v-58c751d8]:after,
.menu__list[data-v-58c751d8]:before {
    content: "";
    display: block;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    position: absolute;
    right: 100px
}

.menu__list[data-v-58c751d8]:before {
    border-bottom: 8px solid #fff;
    z-index: 2;
    top: -7px
}

.menu__list hr[data-v-58c751d8] {
    margin: 5px 0
}

.menu__list li[data-v-58c751d8] {
    border-radius: 4px;
    font-size: 1.4rem;
    line-height: 1.43;
    text-align: left;
    color: #646464;
    padding: 10px 20px !important;
    -webkit-transition: all .35s ease;
    transition: all .35s ease;
    cursor: pointer;
    margin: 0 5px !important
}

.menu__list li[data-v-58c751d8]:hover {
    background: #eef3f4
}

.menuActive[data-v-58c751d8] {
    opacity: 1;
    visibility: visible
}

.notification-modal-wrapper {
    max-width: 560px;
    background-color: #fff;
    position: relative;
    border-radius: 3px;
    -webkit-box-shadow: 0 15px 18px 0 hsla(0, 0%, 64%, .06);
    box-shadow: 0 15px 18px 0 hsla(0, 0%, 64%, .06)
}

.modal__content[data-v-0acfd29a] {
    position: relative
}

.modal__content[data-v-0acfd29a]:after,
.modal__content[data-v-0acfd29a]:before {
    content: "";
    display: table;
    width: 100%
}

.modal__header[data-v-0acfd29a] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 30px
}

.modal__question[data-v-0acfd29a] {
    margin: 0;
    font-size: 24px
}

.modal__warning[data-v-0acfd29a] {
    font-size: 16px;
    line-height: 1.5;
    color: #3b3b3b;
    text-align: center;
    padding: 0 93px 0 93px
}

.modal__item-deleted[data-v-0acfd29a] {
    font-weight: 700
}

.modal__buttons-container[data-v-0acfd29a] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 40px;
    margin-bottom: 35px
}

.btn[data-v-0acfd29a] {
    width: 200px;
    font-size: 13px;
    cursor: pointer
}

.btn__delete[data-v-0acfd29a] {
    background-color: #d0021b;
    color: #fff;
    margin-right: 9px
}

.btn__cancel[data-v-0acfd29a] {
    color: #414141;
    border: 1px solid rgba(8, 54, 87, .15);
    margin-left: 9px;
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.btn__cancel.js-active[data-v-0acfd29a],
.btn__cancel[data-v-0acfd29a]:hover {
    border-color: #86909a;
    color: #4b5761
}

.project-titles__name[data-v-a540e114] {
    display: inline-block;
    text-overflow: ellipsis;
    word-wrap: break-word;
    overflow: hidden;
    height: 33px;
    max-width: 390px
}

.removed--wrap[data-v-a540e114] {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap
}

.item__new[data-v-171866fe] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: #f3f6f8;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .2px;
    color: #071021;
    cursor: pointer
}

.item__new[data-v-171866fe]:hover {
    background-color: #e6edf0
}

.item__new[data-v-171866fe]:before {
    content: "";
    width: 15px;
    height: 15px;
    background: url(/img/plus_two.7bbbaaa1.svg) no-repeat 0 0;
    background-size: 100% 100%;
    display: inline-block;
    margin-right: 17px
}

.method__wrapper[data-v-f32e6d6c] {
    position: relative
}

.method__wrapper:hover .methods__list-trash[data-v-f32e6d6c] {
    opacity: 1;
    visibility: visible
}

.method__wrapper.cursor[data-v-f32e6d6c] {
    cursor: -webkit-grab;
    cursor: grab
}

.methods__phase-title[data-v-f32e6d6c] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.methods__add-phase[data-v-f32e6d6c] {
    height: 38px;
    border-radius: 6px;
    background-color: #f8f9fa;
    border: 0;
    display: block;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 100%;
    margin: 30px 0;
    -webkit-transition: all .2s;
    transition: all .2s;
    font-size: 12px
}

.methods__add-phase[data-v-f32e6d6c]:hover {
    background-color: #f0f2f5
}

.methods__add-phase[data-v-f32e6d6c]:active {
    background-color: #dfe2e8
}

.image__container[data-v-a2adcc62] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-item-align: center;
    align-self: center;
    width: 45px;
    height: 45px;
    margin-left: 16px;
    overflow: hidden;
    border-radius: 3px;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.image__container .icon[data-v-a2adcc62] {
    font-size: 45px
}

.method__item[data-v-a2adcc62] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 80px;
    border-radius: 3px;
    cursor: pointer
}

.method__item[data-v-a2adcc62]:hover {
    background-color: #f8f9fa
}

.method__info[data-v-a2adcc62] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-left: 35px
}

@media screen and (max-width:991px) {
    .method__info[data-v-a2adcc62] {
        padding-left: 20px
    }
}

.method__info p[data-v-a2adcc62] {
    margin: 0 0
}

.method__name[data-v-a2adcc62] {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.39;
    color: #252729
}

.method__description[data-v-a2adcc62] {
    font-size: 14px;
    line-height: 1.43;
    color: #646464
}

.arrow[data-v-a2adcc62] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: none;
    outline: none;
    border: none;
    margin-left: auto;
    margin-right: 18px;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

@media screen and (max-width:991px) {
    .arrow[data-v-a2adcc62] {
        display: none
    }
}

.arrow svg[data-v-a2adcc62] {
    fill: #000
}

.method__wrapper[data-v-352e5410] {
    max-width: 642px;
    margin: auto
}

.method__title[data-v-352e5410] {
    font-size: 11px;
    font-weight: 700;
    line-height: 1.36;
    letter-spacing: .8px;
    color: #414141;
    padding-left: 15px
}

.new-method__container[data-v-3589d242] {
    background-color: #fff
}

.new-method__header[data-v-3589d242] {
    margin-top: 0;
    font-size: 34px;
    letter-spacing: -.1px;
    color: #1e1e1e;
    font-weight: 400;
    text-align: center;
    -webkit-box-shadow: none;
    box-shadow: none
}

.button[data-v-3589d242] {
    display: block;
    margin: auto;
    margin-top: 55px;
    width: 260px;
    height: 40px;
    background: none;
    border-radius: 100px;
    border: 1px solid rgba(8, 54, 87, .15);
    font-size: 14px;
    color: #414141;
    letter-spacing: .2px
}

@media only screen and (max-width:500px) {
    .header[data-v-3589d242] {
        font-size: 26px
    }
}

.tag-list-item[data-v-38787d53] {
    color: #646464;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato;
    font-size: 14px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    letter-spacing: .1px;
    min-height: 36px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 3px;
    margin-right: 8px
}

.tag-list-item[data-v-38787d53]:hover {
    background-color: #f8f9fa
}

.tag-list-item[data-v-38787d53]:first-child,
.tag-list-item[data-v-38787d53]:last-child {
    margin-bottom: 0
}

.tag-list-item--selected[data-v-38787d53] {
    color: #252729;
    font-weight: 600
}

.tag-list-item--selected svg[data-v-38787d53] {
    width: 24px;
    margin: 2px;
    stroke-width: 1.05px
}

.tag-list-item--focused[data-v-38787d53] {
    background-color: #f8f9fa
}

.tag-list-item--new[data-v-38787d53] {
    color: #252729;
    font-weight: 600
}

.tag-list-item--new svg[data-v-38787d53] {
    width: 15px;
    height: 11px;
    margin: 0 17px 0 10px
}

.tag-list-item__color[data-v-38787d53] {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    margin: 0 16px 0 10px
}

.tag-list-item__avatar[data-v-38787d53] {
    font-size: 22px;
    margin: 0 16px 0 10px
}

.tag-list-item__name[data-v-38787d53] {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    word-break: break-all
}

.tags-selector .highlight {
    font-weight: 700;
    color: #171717
}

@media screen and (max-width:767px) {
    .tags-selector .tags-selector__scroll {
        height: 300px
    }

    .show-new-tag .tags-selector__scroll {
        height: 252px
    }
}

.backdrop[data-v-13d4e657] {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: #000;
    opacity: .6;
    display: none
}

@media screen and (max-width:767px) {
    .backdrop[data-v-13d4e657] {
        display: block
    }

    .tags-selector-wrap[data-v-13d4e657] {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        -webkit-transform: none;
        transform: none;
        width: auto;
        z-index: 20000000020
    }
}

.tags-selector[data-v-13d4e657] {
    width: 260px;
    padding: 8px;
    padding-right: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    font-weight: 400
}

@media screen and (max-width:767px) {
    .tags-selector[data-v-13d4e657] {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        -webkit-transform: none;
        transform: none;
        width: auto;
        border-radius: 10px;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
        padding-bottom: 0;
        background-color: #fff
    }

    .tags-selector.show-new-tag[data-v-13d4e657] {
        padding-bottom: 8px
    }

    .tags-selector[data-v-13d4e657] {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        -webkit-transform: none;
        transform: none;
        width: auto;
        border-radius: 10px;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
        padding-bottom: 0
    }
}

.tags-selector__no-item[data-v-13d4e657] {
    padding: 17px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

@media screen and (max-width:767px) {
    .tags-selector__no-item[data-v-13d4e657] {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        height: calc(100vh - 270px)
    }
}

.tags-selector__no-item img[data-v-13d4e657] {
    opacity: .4;
    width: 50px;
    height: 50px;
    -o-object-fit: contain;
    object-fit: contain
}

@media screen and (max-width:767px) {
    .tags-selector__no-item img[data-v-13d4e657] {
        width: 100px;
        height: 100px
    }
}

.tags-selector__no-item span[data-v-13d4e657] {
    color: #646464;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato;
    font-size: 14px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    margin-top: 12px;
    color: #aaaab5;
    font-size: 12px
}

.tags-selector__list[data-v-13d4e657] {
    max-height: 420px
}

.tags-selector__list-item-color[data-v-13d4e657] {
    width: 16px;
    height: 16px;
    background-color: transparent;
    border-radius: 50%;
    margin: 0 16px 0 10px
}

.tags-selector__list-item-name[data-v-13d4e657] {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.tags-selector__list-item[data-v-13d4e657] {
    color: #646464;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato;
    font-size: 14px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    letter-spacing: .1px;
    min-height: 36px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 3px;
    margin-right: 8px;
    cursor: pointer
}

.tags-selector__list-item[data-v-13d4e657]:hover {
    background-color: #f8f9fa
}

.tags-selector__list-item[data-v-13d4e657]:active {
    background-color: #f0f2f5
}

.tags-selector__list-item[data-v-13d4e657]:first-child,
.tags-selector__list-item[data-v-13d4e657]:last-child {
    margin-bottom: 0
}

.tags-selector__list-item--selected[data-v-13d4e657] {
    color: #252729;
    font-weight: 600
}

.tags-selector__list-item--selected svg[data-v-13d4e657] {
    width: 24px;
    margin: 2px;
    stroke-width: 1.05px
}

.tags-selector__list-item--selector[data-v-13d4e657] {
    color: #252729;
    margin-bottom: 4px;
    font-weight: 600
}

.tags-selector__list-item--selector svg[data-v-13d4e657] {
    width: 15px;
    height: 11px;
    margin: 0 17px 0 10px
}

.tags-selector__list-item--selector--selected[data-v-13d4e657] {
    background-color: #f8f9fa
}

.tags-selector__list-item--new[data-v-13d4e657] {
    color: #252729;
    margin-top: 4px;
    font-weight: 600
}

.tags-selector__list-item--new img[data-v-13d4e657] {
    width: 15px;
    height: 11px;
    margin: 0 17px 0 10px;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.tags-selector__list-item--new-focused[data-v-13d4e657] {
    background-color: #f8f9fa
}

.tags-selector__placeholder[data-v-13d4e657] {
    color: #646464;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato;
    font-size: 14px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    position: absolute;
    opacity: .5;
    cursor: pointer;
    height: 20px;
    width: 110px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin-left: calc(50% - 50px);
    margin-top: auto;
    margin-bottom: auto;
    -webkit-transition: margin .2s linear;
    transition: margin .2s linear
}

.tags-selector__placeholder.active[data-v-13d4e657] {
    margin-left: 44px;
    pointer-events: none
}

.tags-selector__input-container[data-v-13d4e657] {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 8px;
    margin-right: 8px;
    margin-bottom: 4px;
    background-color: #f8f9fa;
    border-radius: 4px;
    height: 41px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 5px 10px
}

.tags-selector__input-container svg[data-v-13d4e657] {
    margin-right: 16px;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: opacity .1s;
    transition: opacity .1s
}

.tags-selector__input-container svg.active[data-v-13d4e657] {
    visibility: visible;
    opacity: 1;
    pointer-events: none
}

.tags-selector__input-container input[data-v-13d4e657] {
    color: #646464;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato;
    font-size: 14px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border: 0;
    outline: none;
    background-color: transparent
}

.tags-selector__header[data-v-13d4e657] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-right: 8px
}

.tags-selector__tags[data-v-13d4e657] {
    font-size: 1.6rem;
    text-align: center;
    width: 100%
}

.tags-selector__button[data-v-13d4e657] {
    width: 36px;
    height: 36px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    border: 0;
    background: transparent;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0
}

.tags-selector__button[data-v-13d4e657]:hover {
    background-color: #f8f9fa
}

.tags-selector__button[data-v-13d4e657]:focus {
    outline: none
}

.tags-selector__button[data-v-13d4e657]:active {
    background-color: #f0f2f5
}

@media screen and (min-width:768px) {
    .tags-selector__button--close[data-v-13d4e657] {
        display: none
    }
}

.drop-target {
    height: 50%;
    opacity: 0;
    display: none
}

.drop-target,
.drop-target:before {
    width: 100%;
    position: absolute;
    left: 0
}

.drop-target:before {
    content: "";
    height: 6px;
    background-color: #abc0c8;
    top: 0;
    margin-top: -3px;
    border-radius: 2px
}

.drop-target--top {
    top: 0
}

.drop-target--bottom {
    top: 50%
}

.drop-target--bottom:before {
    top: 100%
}

.drop-target--active {
    opacity: 1
}

.drop-enabled .drop-target {
    display: block
}

.drop-enabled .base-uploader {
    z-index: 950
}

.drop-last,
.drop-wrap {
    position: relative
}

.drop-last {
    height: 340px;
    opacity: 0;
    cursor: text
}

.drop-last:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 6px;
    background-color: #abc0c8;
    top: 0;
    left: 0;
    margin-top: -3px;
    border-radius: 2px
}

.drop-last.drop-target--active {
    opacity: 1
}

.builder-content {
    cursor: text;
    min-height: calc(100vh - 154px)
}

.builder-list-wrap {
    cursor: default
}

.section-wrap--paragraph+.section-wrap--paragraph[data-local=true] {
    display: none
}

.section-wrap--paragraph[data-local=true]+.section-wrap--paragraph {
    margin-top: -42px
}

.section-wrap--not-paragraph+.section-wrap--not-paragraph {
    margin-top: 42px
}

.builder-dragging .section-wrap--paragraph[data-local=true] {
    opacity: 0
}


/* DRAG */

.cdk-drag-preview {
    /*box-sizing: border-box;*/
    border-radius: 4px;
    box-shadow: 0 2px 2px -3px rgba(0, 0, 0, 0.04),
                0 4px 5px 1px rgba(0, 0, 0, 0.01),
                0 1px 6px 2px rgba(0, 0, 0, 0.01);
  }
  
  .cdk-drag-animating {
    transition: transform 250ms cubic-bezier(0, 0, 0.2, 0.1);
  }
  
  .side-dropdown-menu:last-child {
    border: 1px solid #fdfdfd;
  }
  /*
  .section-wrap--paragraph:not(.note-class-selected) {
    transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
    transform: rotate(20deg) !important;
  }
  */
  .not-custom-placeholder {
    background-color: #fdfdfd; 
    padding: 4px; 
    height: 50px;
    border-radius: 8px; 
    margin-bottom: 11px;
    transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
  }
  .not-custom-placeholder-row {
    background-color: #fdfdfd; 
    padding: 4px; 
    height: 40px;
    border-radius: 8px; 
    margin-bottom: 0px;
    transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
  }

  .hidden__component {
    opacity: 0;
  }

  /* - */

.survey__theme[data-v-150fef83] {
    font-size: 16px;
    line-height: 1.5;
    color: #3b3b3b;
    margin: 0;
    text-decoration: none
}

.theme__container[data-v-150fef83] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: auto;
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
    width: 173px;
    height: 34px;
    border-radius: 3px;
    background-color: #f3f6f8
}

.theme__talebook[data-v-150fef83] {
    font-weight: 600
}

@media only screen and (min-width:479px) {
    .theme__container[data-v-150fef83] {
        display: none
    }
}

.text-center[data-v-219bc738] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    top: 50%;
    left: 50%;
    position: absolute;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.btn--orange[data-v-219bc738] {
    margin-top: 60px
}

.btn--orange a[data-v-219bc738] {
    text-decoration: none;
    color: #fff
}

.btn--white[data-v-219bc738] {
    margin-top: 15px;
    border: 1px solid rgba(8, 54, 87, .15)
}

.g__title[data-v-219bc738] {
    padding-right: 0
}

.public__question[data-v-f34fb92c] {
    display: inline;
    position: relative;
    font-size: 1.8rem;
    font-weight: 600;
    color: #252729
}

.method__introduction[data-v-f34fb92c] {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.base-answer-add__container[data-v-1b302345] {
    border-bottom: 1px solid #fff;
    border-radius: 3px;
    color: #3b3b3b;
    cursor: pointer;
    font-size: 1.6rem;
    margin-left: -15px;
    padding: 16px 75px 16px 15px;
    position: relative;
    margin-right: 45px
}

.base-answer-add__container.active[data-v-1b302345],
.base-answer-add__container[data-v-1b302345]:focus,
.base-answer-add__container[data-v-1b302345]:focus-within,
.base-answer-add__container[data-v-1b302345]:hover {
    background-color: #f8f9fa
}

.base-answer-add__container.active .base-answer-add__tags-avatars[data-v-1b302345] .tags-avatars__list--empty,
.base-answer-add__container:focus .base-answer-add__tags-avatars[data-v-1b302345] .tags-avatars__list--empty,
.base-answer-add__container:focus-within .base-answer-add__tags-avatars[data-v-1b302345] .tags-avatars__list--empty,
.base-answer-add__container:hover .base-answer-add__tags-avatars[data-v-1b302345] .tags-avatars__list--empty {
    opacity: 1
}

.base-answer-add__container.active .base-answer-add__menu[data-v-1b302345],
.base-answer-add__container:focus .base-answer-add__menu[data-v-1b302345],
.base-answer-add__container:focus-within .base-answer-add__menu[data-v-1b302345],
.base-answer-add__container:hover .base-answer-add__menu[data-v-1b302345] {
    opacity: 1;
    visibility: visible
}

.base-answer-add__container.active:hover span.empty[data-v-1b302345],
.base-answer-add__container:focus-within:hover span.empty[data-v-1b302345],
.base-answer-add__container:focus:hover span.empty[data-v-1b302345],
.base-answer-add__container:hover:hover span.empty[data-v-1b302345] {
    opacity: 1
}

.base-answer-add__menu[data-v-1b302345]:hover {
    background-color: #f7f9f9
}

.base-answer-add__tags-avatars[data-v-1b302345] .tags-avatars__list--empty {
    opacity: 0
}

.base-answer-add__input[data-v-1b302345] {
    display: block;
    min-height: 100%;
    border: 0;
    background: transparent;
    padding: 0;
    width: 100%;
    outline: 0;
    resize: none;
    height: auto;
    cursor: pointer;
    font-size: 1.6rem;
    line-height: 2rem !important;
    text-align: left;
    color: #3b3b3b
}

.base-answer-add__input[data-v-1b302345]:focus {
    opacity: 1;
    visibility: visible
}

.base-answer-add__menu[data-v-1b302345] {
    width: 42px;
    height: 100%;
    border: 0;
    color: #555;
    text-align: center;
    margin: 0 5px;
    position: absolute;
    right: -47px !important;
    top: 0;
    outline: 0;
    background: #fff url(/img/trash-2.4eef53fa.svg) no-repeat 50%;
    opacity: 0;
    -webkit-transition: all .5s ease;
    transition: all .5s ease
}

.sortable-ghost .base-answer__container {
    border-bottom: 1px solid #f5f5f5;
    -webkit-transition: none !important;
    transition: none !important;
    background: #dae7ed !important
}

.sortable-ghost .base-answer__container>* {
    opacity: 0 !important
}

.answer-drag-class {
    opacity: 1 !important;
    border: 0
}

.answer-drag-class .base-answer__container {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
    border: 0;
    margin-right: 60px;
    padding-left: 15px;
    opacity: 1 !important;
    background: #fff;
    border-radius: 3px;
    -webkit-box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21);
    box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21)
}

.answer-drag-class .base-answer__container textarea {
    min-height: unset !important
}

.base-answer[data-v-480c0145]:after {
    content: "";
    display: block;
    margin-right: 45px;
    margin-left: -15px;
    border-bottom: 1px solid #f2f2f2
}

.base-answer.answer-drag-class[data-v-480c0145]:after,
.base-answer.sortable-ghost[data-v-480c0145]:after {
    display: none
}

.base-answer__container[data-v-480c0145] {
    border-radius: 3px;
    color: #3b3b3b;
    cursor: pointer;
    font-size: 1.6rem;
    margin-left: -15px;
    padding: 16px 75px 16px 15px;
    margin-right: 45px;
    position: relative;
    -webkit-transition: visibility .6s ease, -webkit-box-shadow .6s ease;
    transition: visibility .6s ease, -webkit-box-shadow .6s ease;
    transition: box-shadow .6s ease, visibility .6s ease;
    transition: box-shadow .6s ease, visibility .6s ease, -webkit-box-shadow .6s ease
}

.base-answer__container.active[data-v-480c0145],
.base-answer__container[data-v-480c0145]:focus,
.base-answer__container[data-v-480c0145]:focus-within,
.base-answer__container[data-v-480c0145]:hover {
    background: #fff;
    -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08)
}

.base-answer__container.active .base-answer__tags-avatars[data-v-480c0145] .tags-avatars__list--empty,
.base-answer__container:focus .base-answer__tags-avatars[data-v-480c0145] .tags-avatars__list--empty,
.base-answer__container:focus-within .base-answer__tags-avatars[data-v-480c0145] .tags-avatars__list--empty,
.base-answer__container:hover .base-answer__tags-avatars[data-v-480c0145] .tags-avatars__list--empty {
    opacity: 1
}

.base-answer__container.active .base-answer__menu[data-v-480c0145],
.base-answer__container:focus .base-answer__menu[data-v-480c0145],
.base-answer__container:focus-within .base-answer__menu[data-v-480c0145],
.base-answer__container:hover .base-answer__menu[data-v-480c0145] {
    opacity: 1;
    visibility: visible
}

.base-answer__container.active:hover span.empty[data-v-480c0145],
.base-answer__container:focus-within:hover span.empty[data-v-480c0145],
.base-answer__container:focus:hover span.empty[data-v-480c0145],
.base-answer__container:hover:hover span.empty[data-v-480c0145] {
    opacity: 1
}

.base-answer__menu[data-v-480c0145]:hover {
    background-color: #f7f9f9
}

.base-answer__tags-avatars[data-v-480c0145] .tags-avatars__list--empty {
    opacity: 0
}

.base-answer__input[data-v-480c0145] {
    display: block;
    min-height: 100%;
    border: 0;
    background: transparent;
    font-size: 1.6rem;
    line-height: 2rem;
    text-align: left;
    padding: 0;
    color: #3b3b3b;
    width: 100%;
    outline: 0;
    resize: none;
    height: auto;
    cursor: pointer
}

.base-answer__input[data-v-480c0145]:focus {
    opacity: 1;
    visibility: visible
}

.base-answer__menu[data-v-480c0145] {
    width: 42px;
    height: 100%;
    border: 0;
    color: #555;
    text-align: center;
    margin: 0 5px;
    position: absolute;
    right: -47px !important;
    top: 0;
    outline: 0;
    background: #fff url(/img/trash-2.4eef53fa.svg) no-repeat 50%;
    opacity: 0;
    -webkit-transition: all .5s ease;
    transition: all .5s ease
}

.base-answer__indicators[data-v-480c0145] {
    margin-top: 2px
}

.base-answer__indicators div[data-v-480c0145],
.base-answer__indicators[data-v-480c0145] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.base-answer__indicators div[data-v-480c0145] {
    margin-right: 8px;
    font-size: 1.2rem
}

.base-answer__indicators div span[data-v-480c0145] {
    margin-left: 2px
}

.selectable[data-v-480c0145] {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.selectable[data-v-480c0145]::-moz-selection {
    background-color: #fff;
    color: #3b3b3b
}

.selectable[data-v-480c0145]::selection {
    background-color: #fff;
    color: #3b3b3b
}

.base-button-submit[data-v-02fff6e0] {
    background: #f3f6f8 url(/img/enter.5d6f4370.svg) no-repeat 50%;
    width: 26px;
    height: 26px;
    border-radius: 2px;
    background-color: #f3f6f8;
    border: 0;
    z-index: 10;
    -webkit-transition: all .4s ease;
    transition: all .4s ease
}

@media screen and (max-width:767px) and (max-width:767px) {

    .tooltip__tip,
    .tooltip__tip-position {
        -webkit-transition: opacity .3s !important;
        transition: opacity .3s !important;
        will-change: opacity !important;
        -webkit-transform: none !important;
        transform: none !important
    }
}

.base-card-add[data-v-d7aa07a8] {
    margin-left: -15px;
    position: relative;
    cursor: text
}

.base-card-add--survey[data-v-d7aa07a8] {
    margin-left: 0
}

.base-card-add__container[data-v-d7aa07a8] {
    border-radius: 3px;
    color: #3b3b3b;
    font-size: 1.6rem;
    padding: 5px 5px 5px 14px;
    -webkit-transition: background-color .15s, border .15s;
    transition: background-color .15s, border .15s;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    border: 1px solid transparent;
    min-height: 48px
}

.base-card-add--survey .base-card-add__container[data-v-d7aa07a8] {
    background-color: #f8f9fa;
    border-color: #f8f9fa;
    padding-top: 13px;
    padding-bottom: 13px
}

.base-card-add--active .base-card-add__container[data-v-d7aa07a8],
.base-card-add:hover .base-card-add__container[data-v-d7aa07a8] {
    background-color: #f8f9fa;
    border-color: #f8f9fa
}

.base-card-add--survey.base-card-add--active .base-card-add__container[data-v-d7aa07a8],
.base-card-add--survey.base-card-add:hover .base-card-add__container[data-v-d7aa07a8] {
    background-color: #f0f2f5;
    border-color: #f0f2f5
}

.base-card-add--survey.base-card-add--active .base-card-add__container[data-v-d7aa07a8],
.base-card-add--survey.base-card-add--active:hover .base-card-add__container[data-v-d7aa07a8] {
    border-color: #dfe2e8;
    background-color: #f8f9fa
}

.base-card-add__body[data-v-d7aa07a8] {
    width: 100%
}

.base-card-add__input[data-v-d7aa07a8] {
    display: block;
    min-height: 100%;
    border: 0;
    background: transparent;
    font-size: 1.6rem;
    line-height: 2rem;
    text-align: left;
    padding: 0;
    color: #3b3b3b;
    width: 100%;
    outline: 0;
    resize: none;
    height: auto;
    line-height: 30px;
    height: 30px
}

.base-card-add__foot[data-v-d7aa07a8] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: default
}

.base-card-add__tags[data-v-d7aa07a8] {
    opacity: 0;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.base-card-add--active .base-card-add__tags[data-v-d7aa07a8],
.base-card-add:hover .base-card-add__tags[data-v-d7aa07a8] {
    opacity: 1
}

@-webkit-keyframes card-dragging-anim-c673bf6a {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
        box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08)
    }

    to {
        -webkit-transform: rotate(-2deg);
        transform: rotate(-2deg);
        -webkit-box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21);
        box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21)
    }
}

@keyframes card-dragging-anim-c673bf6a {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
        box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08)
    }

    to {
        -webkit-transform: rotate(-2deg);
        transform: rotate(-2deg);
        -webkit-box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21);
        box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21)
    }
}

.base-card[data-v-c673bf6a] {
    border-bottom: 1px solid #f2f2f2;
    margin-left: -15px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    position: relative
}

.base-card--active[data-v-c673bf6a] {
    z-index: 950
}

.base-card--dragging[data-v-c673bf6a] {
    opacity: 1 !important;
    border: 0
}

.base-card--sentence[data-v-c673bf6a] {
    -webkit-user-select: auto;
    -moz-user-select: auto;
    -ms-user-select: auto;
    user-select: auto;
    margin-left: 0
}

.base-card--option[data-v-c673bf6a] {
    border: 0;
    border: 1px solid #f4f4f4;
    border-radius: 6px;
    margin-bottom: 8px;
    margin-left: 0
}

.base-card__dropdown-positioner[data-v-c673bf6a] {
    height: 52px;
    margin-bottom: -52px
}

.base-card__container[data-v-c673bf6a] {
    border-radius: 3px;
    color: #3b3b3b;
    cursor: pointer;
    font-size: 1.6rem;
    padding: 6px 6px 6px 15px;
    -webkit-transition: -webkit-box-shadow .15s;
    transition: -webkit-box-shadow .15s;
    transition: box-shadow .15s;
    transition: box-shadow .15s, -webkit-box-shadow .15s;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    position: relative
}

.base-card--sentence .base-card__container[data-v-c673bf6a] {
    cursor: auto;
    padding-left: 0
}

.base-card--active .base-card__container[data-v-c673bf6a],
.base-card--dragging .base-card__container[data-v-c673bf6a],
.base-card:hover .base-card__container[data-v-c673bf6a] {
    background: #fff;
    -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08)
}

.base-card--option:hover .base-card__container[data-v-c673bf6a],
.base-card--sentence:hover .base-card__container[data-v-c673bf6a] {
    background: transparent;
    -webkit-box-shadow: none;
    box-shadow: none
}

.base-card--option .base-card__container[data-v-c673bf6a] {
    -webkit-transition: background-color .15s;
    transition: background-color .15s
}

.base-card--option .base-card__container[data-v-c673bf6a]:focus {
    background-color: #f8f9fa;
    outline: none
}

.base-card--option:hover .base-card__container[data-v-c673bf6a] {
    background-color: #f8f9fa
}

.base-card--option:active .base-card__container[data-v-c673bf6a] {
    background-color: #f0f2f5
}

.base-card--dragging .base-card__container[data-v-c673bf6a] {
    -webkit-animation: card-dragging-anim-c673bf6a .3s;
    animation: card-dragging-anim-c673bf6a .3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

.base-card--ghost .base-card__container[data-v-c673bf6a] {
    -webkit-transition: none !important;
    transition: none !important;
    background: #dae7ed !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

.base-card--ghost .base-card__container[data-v-c673bf6a]:after,
.base-card--ghost .base-card__container[data-v-c673bf6a]:before {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 1px;
    background: #fff
}

.base-card--ghost .base-card__container[data-v-c673bf6a]:before {
    top: -1px
}

.base-card--ghost .base-card__container[data-v-c673bf6a]:after {
    bottom: -1px
}

.base-card--ghost .base-card__container>[data-v-c673bf6a] {
    -webkit-transition: none;
    transition: none;
    opacity: 0 !important
}

.base-card--disabled .base-card__container[data-v-c673bf6a] {
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

.base-card__body[data-v-c673bf6a] {
    width: 100%
}

.base-card--canedit .base-card__body[data-v-c673bf6a] {
    width: calc(100% - 49px)
}

.base-card__lock[data-v-c673bf6a] {
    margin-right: 10px;
    font-size: 12px
}

.tooltip__trigger {
    line-height: 1.1
}

.base-card__breadcrumbs[data-v-c673bf6a] {
    text-transform: uppercase;
    list-style: none;
    padding: 0;
    margin: 0;
    color: #aaaab5;
    font-size: 1rem;
    margin-bottom: 4px;
    margin-top: 7px;
    letter-spacing: .86px;
    white-space: nowrap;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.base-card__breadcrumbs>li[data-v-c673bf6a] {
    display: inline-block;
    margin: 0;
    padding: 0;
    overflow: hidden;
    text-overflow: ellipsis
}

.base-card__breadcrumbs>li[data-v-c673bf6a]:first-of-type {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    max-width: 30%
}

.base-card__breadcrumbs>li[data-v-c673bf6a]:before {
    content: "/";
    margin: 0 14px
}

.base-card__breadcrumbs>li[data-v-c673bf6a]:first-of-type:before {
    display: none
}

.base-card__input[data-v-c673bf6a] {
    display: block;
    border: 0;
    background: transparent;
    font-size: 1.6rem;
    line-height: 2rem;
    text-align: left;
    padding: 0;
    color: #3b3b3b;
    width: 100%;
    outline: 0;
    resize: none;
    height: auto;
    cursor: pointer;
    pointer-events: none;
    line-height: 1.6;
    margin: 5px 0
}

.base-card--editting .base-card__input[data-v-c673bf6a] {
    pointer-events: auto;
    cursor: auto
}

.base-card__indicators[data-v-c673bf6a] {
    margin-top: 2px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.base-card__indicators div[data-v-c673bf6a] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    margin-right: 8px;
    min-height: 20px;
    align-items: center;
    font-size: 1.2rem
}

.base-card__indicators div span[data-v-c673bf6a] {
    margin-left: 2px
}

.base-card__foot[data-v-c673bf6a] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative
}

.base-card__tags[data-v-c673bf6a] {
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.base-card--empty-tags .base-card__tags[data-v-c673bf6a] {
    opacity: 0
}

.base-card--active .base-card__tags[data-v-c673bf6a],
.base-card--dragging .base-card__tags[data-v-c673bf6a],
.base-card:hover .base-card__tags[data-v-c673bf6a] {
    opacity: 1
}

.base-card__edit-wrap[data-v-c673bf6a] {
    height: 100%;
    margin-left: -25px;
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    background-color: #fff
}

.base-card__edit-wrap[data-v-c673bf6a]:after {
    content: "";
    position: absolute;
    right: 100%;
    top: 0;
    bottom: 0;
    width: 30px;
    pointer-events: none;
    background: -webkit-gradient(linear, left top, right top, from(hsla(0, 0%, 100%, 0)), to(#fff));
    background: linear-gradient(90deg, hsla(0, 0%, 100%, 0), #fff)
}

.base-card--active .base-card__edit-wrap[data-v-c673bf6a],
.base-card--dragging .base-card__edit-wrap[data-v-c673bf6a],
.base-card:hover .base-card__edit-wrap[data-v-c673bf6a] {
    opacity: 1
}

.base-card--editting .base-card__edit-wrap[data-v-c673bf6a],
.base-card--editting:hover .base-card__edit-wrap[data-v-c673bf6a] {
    opacity: 0;
    pointer-events: none
}

.base-card__edit[data-v-c673bf6a] {
    width: 36px;
    height: 36px;
    border-radius: 3px;
    font-size: 1.8rem;
    padding: 8px 9px;
    background-color: #fff;
    display: inline-block;
    vertical-align: top;
    line-height: 1px;
    -webkit-transition: all .2s;
    transition: all .2s
}

.base-card__edit[data-v-c673bf6a]:hover {
    background-color: #f8f9fa
}

.base-card__edit[data-v-c673bf6a]:active {
    background-color: #f0f2f5
}

@media screen and (max-width:767px) {
    .base-card__edit[data-v-c673bf6a] {
        display: none
    }
}

.base-card__edit-icon[data-v-c673bf6a],
.base-card__expand-icon[data-v-c673bf6a] {
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s;
    cursor: pointer
}

.base-card--active .base-card__edit-icon[data-v-c673bf6a],
.base-card--active .base-card__expand-icon[data-v-c673bf6a],
.base-card--dragging .base-card__edit-icon[data-v-c673bf6a],
.base-card--dragging .base-card__expand-icon[data-v-c673bf6a],
.base-card:hover .base-card__edit-icon[data-v-c673bf6a],
.base-card:hover .base-card__expand-icon[data-v-c673bf6a] {
    opacity: .7
}

.base-card--editting .base-card__edit-icon[data-v-c673bf6a],
.base-card--editting .base-card__expand-icon[data-v-c673bf6a],
.base-card--editting:hover .base-card__edit-icon[data-v-c673bf6a],
.base-card--editting:hover .base-card__expand-icon[data-v-c673bf6a] {
    opacity: 0
}

.base-card__expand-icon[data-v-c673bf6a] {
    width: 20px;
    height: 19px;
    vertical-align: top
}

.base-card__enter-archive[data-v-c673bf6a] {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background-color: #fff;
    border-radius: 3px;
    font-size: 12px;
    color: #858585;
    padding-right: 15px
}

.base-card__enter-archive-icon[data-v-c673bf6a] {
    margin-left: 15px;
    background-color: #f3f6f8;
    width: 25px;
    height: 25px;
    border-radius: 3px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.base-card__sentence[data-v-c673bf6a] {
    margin: 5px 0
}

.base-card__option[data-v-c673bf6a] {
    position: relative;
    min-height: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 7px 0;
    padding-left: 38px;
    font-size: 16px;
    counter-increment: surveyCard
}

.base-card__option[data-v-c673bf6a]:before {
    content: counter(surveyCard, upper-alpha);
    position: absolute;
    background-color: #f8f9fa;
    width: 26px;
    height: 26px;
    left: 0;
    top: 50%;
    margin-top: -13px;
    border-radius: 3px;
    text-align: center;
    line-height: 26px;
    font-size: 12px;
    color: rgba(65, 65, 65, .5);
    -webkit-transition: all .2s;
    transition: all .2s
}

.base-card--selected .base-card__option[data-v-c673bf6a]:before {
    background-color: #059fa3;
    color: #fff
}

.base-card__option--check[data-v-c673bf6a]:before {
    content: "";
    background-repeat: no-repeat;
    background-position: 50%;
    border: 1px solid #86909a;
    background-color: #fff
}

.base-card--selected .base-card__option--check[data-v-c673bf6a]:before {
    background-color: #059fa3;
    background-image: url(/img/check-white.f66c6586.svg);
    border-color: #059fa3
}

.base-container--with-padding[data-v-b8005690] {
    padding-bottom: 400px
}

.highlights-slider[data-v-1a29a21e] {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.highlights-slider__quote[data-v-1a29a21e] {
    position: absolute;
    left: 60px;
    bottom: 70px;
    right: 0;
    background-color: #fff;
    border: 1px solid #e1d6da;
    -webkit-box-shadow: 0 24px 94px rgba(0, 0, 0, .05);
    box-shadow: 0 24px 94px rgba(0, 0, 0, .05);
    padding: 18px 22px;
    font-size: 14px
}

.highlights-slider__avatar[data-v-1a29a21e] {
    width: 87px;
    height: 87px;
    border-radius: 50%;
    overflow: hidden
}

.highlights-slider__avatar img[data-v-1a29a21e] {
    width: 100%;
    height: 100%
}

.highlights-slider__nav[data-v-1a29a21e] {
    border-radius: 4px;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.highlights-slider__nav-btn[data-v-1a29a21e] {
    width: 45px;
    height: 42px;
    background-color: #171717;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    cursor: pointer;
    color: #fff;
    font-size: 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.base-input-2[data-v-d1dd236c] {
    border: 0;
    background: transparent;
    text-align: left;
    color: #3b3b3b;
    width: 100%;
    outline: 0
}

.base-input-2[data-v-d1dd236c]::-webkit-input-placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-input-2[data-v-d1dd236c]::-moz-placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-input-2[data-v-d1dd236c]:-ms-input-placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-input-2[data-v-d1dd236c]::-ms-input-placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-input-2[data-v-d1dd236c]::placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-input-2--textarea[data-v-d1dd236c] {
    resize: none;
    padding: 0
}

.base-menu__list li {
    font-size: 1.4rem;
    line-height: 1.43;
    text-align: left;
    color: #646464;
    padding: 10px !important;
    -webkit-transition: all .35s ease;
    transition: all .35s ease;
    cursor: pointer;
    margin: 0 !important;
    letter-spacing: normal;
    list-style-type: none !important;
    border-radius: 4px
}

.base-menu__list li:hover {
    background: #eef3f4
}

.base-menu__list li.is-active {
    font-weight: 600;
    color: #252729;
    background: #f8f9fa
}

.base-menu__container[data-v-04da2cee] {
    width: 42px;
    height: 100%;
    display: inline-block;
    vertical-align: top;
    border: 0;
    background: transparent;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: .8px;
    color: #555;
    text-align: center;
    margin: 0 5px;
    right: -60px;
    top: 0;
    outline: 0;
    background: url(/img/more-vertical.3cc68a7c.svg) no-repeat 50%;
    background-size: 5px 15px;
    -webkit-transition: all .5s ease;
    transition: all .5s ease
}

.base-menu__container[data-v-04da2cee]:hover {
    cursor: pointer
}

.base-menu__list[data-v-04da2cee] {
    border-radius: 3px;
    background-color: #fff;
    -webkit-box-shadow: 0 15px 18px 0 rgba(0, 0, 0, .06);
    box-shadow: 0 15px 18px 0 rgba(0, 0, 0, .06);
    border: 1px solid hsla(0, 0%, 93%, .62);
    padding: 5px;
    margin: 0;
    position: relative;
    top: calc(50% + 20px);
    list-style: none;
    z-index: 99;
    width: 200px;
    -webkit-transition: all .25s ease;
    transition: all .25s ease;
    opacity: 0;
    visibility: hidden;
    text-transform: none;
    left: 50%
}

.base-menu__list[data-v-04da2cee]:after {
    border-bottom: 8px solid hsla(0, 0%, 93%, .62);
    top: -8px
}

.base-menu__list[data-v-04da2cee]:after,
.base-menu__list[data-v-04da2cee]:before {
    content: "";
    display: block;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    position: absolute
}

.base-menu__list[data-v-04da2cee]:before {
    border-bottom: 8px solid #fff;
    z-index: 2;
    top: -7px;
    right: 91px
}

.base-menu__list--center[data-v-04da2cee] {
    -webkit-transform: translateX(-50%) translateY(15px);
    transform: translateX(-50%) translateY(15px)
}

.base-menu__list--center[data-v-04da2cee]:after,
.base-menu__list--center[data-v-04da2cee]:before {
    right: 91px
}

.base-menu__list--center.menuActive[data-v-04da2cee] {
    -webkit-transform: translate(-50%);
    transform: translate(-50%)
}

.base-menu__list--left[data-v-04da2cee] {
    -webkit-transform: translateX(-89%) translateY(15px);
    transform: translateX(-89%) translateY(15px)
}

.base-menu__list--left[data-v-04da2cee]:after,
.base-menu__list--left[data-v-04da2cee]:before {
    right: 13px
}

.base-menu__list--left.menuActive[data-v-04da2cee] {
    -webkit-transform: translate(-89%);
    transform: translate(-89%)
}

.base-menu .menuActive[data-v-04da2cee] {
    opacity: 1 !important;
    visibility: visible
}

.base-menu--new[data-v-04da2cee] {
    width: auto;
    text-transform: inherit;
    font-weight: inherit;
    vertical-align: initial;
    background: transparent;
    padding: 0;
    margin: 0;
    font-size: inherit;
    position: relative;
    right: auto;
    top: auto;
    letter-spacing: inherit
}

.base-menu__list--new[data-v-04da2cee] {
    position: absolute
}

.method-icon[data-v-4bc84951] {
    width: 1em;
    height: 1em;
    border-radius: 4px;
    color: #fff;
    line-height: 1
}

.icon {
    vertical-align: top
}

.base-multiline-input[data-v-253562a4] {
    border: 0;
    background: transparent;
    text-align: left;
    width: 100%;
    outline: 0;
    resize: none;
    padding: 0
}

.base-multiline-input[data-v-253562a4]::-webkit-input-placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-multiline-input[data-v-253562a4]::-moz-placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-multiline-input[data-v-253562a4]:-ms-input-placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-multiline-input[data-v-253562a4]::-ms-input-placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-multiline-input[data-v-253562a4]::placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-multiline-input__div[data-v-253562a4]:hover {
    cursor: text
}

.base-saving[data-v-03e5114a] {
    font-size: 1.2rem;
    letter-spacing: .1px;
    color: #414141;
    font-weight: 400;
    position: relative;
    visibility: hidden;
    opacity: 0;
    min-width: 53px;
    -webkit-transition: all .35s ease 1s;
    transition: all .35s ease 1s;
    display: inline-block;
    vertical-align: middle;
    height: 20px;
    padding-left: 26px;
    padding-top: 2px
}

.base-saving[data-v-03e5114a]:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    background: url(/img/save.501dcb93.svg) no-repeat 0 0;
    background-size: 100%;
    margin-right: 4px;
    position: absolute;
    left: 0;
    top: 0
}

.base-saving.saving[data-v-03e5114a] {
    visibility: visible;
    opacity: 1;
    -webkit-transition-delay: 0s;
    transition-delay: 0s
}

.sortable-cards[data-v-ce9fcb4a] {
    display: block
}

.sortable-cards[data-v-a60bfaa2] {
    display: block;
    counter-reset: surveyCard
}

.base-subtitle[data-v-3016ad13] {
    height: 28px;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato;
    font-size: 20px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #000;
    margin: 0 0 8px;
    -webkit-transition: border-bottom .25s;
    transition: border-bottom .25s;
    border-bottom: 1px dashed #fff
}

.base-subtitle[data-v-3016ad13]:hover:not(.cant-edit) {
    border-bottom: 1px dashed #8e8e8e
}

.base-subtitle[data-v-3016ad13]:focus-within {
    border-bottom: 1px dashed #1d1d1d !important
}

.base-subtitle__div-title[data-v-3016ad13] {
    height: 28px;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato;
    font-size: 20px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #000;
    margin: 0 0 8px;
    border-bottom: 1px dashed #fff
}

.tags-avatars {
    margin: 0;
    opacity: 1;
    min-width: 37px;
    min-height: 26px;
    display: inline-block;
    vertical-align: top
}

.tags-avatars__count {
    position: absolute;
    bottom: 5px;
    right: 4px;
    height: 15px;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato;
    font-size: 12px;
    font-weight: 700;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: .3px;
    text-align: right;
    color: #171717;
    background-color: #fff;
    padding-top: 3px
}

.tags-avatars__count--1 {
    width: 11px
}

.tags-avatars__count--2 {
    width: 16px
}

.tags-avatars__count--3 {
    width: 22px
}

.tags-avatars__count--4 {
    width: 28px
}

.tags-avatars__count:hover {
    background-color: #f8f9fa
}

.tags-avatars__list-item {
    width: 4px;
    height: 24px;
    border-radius: 2.5px;
    margin: 0 1px
}

.tags-avatars__list {
    padding: 7px 3px;
    width: 38px;
    height: 36px;
    border-radius: 2px;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: .1px;
    border: 1px dashed transparent;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: 1;
    background-size: 100% auto;
    overflow: visible;
    border-radius: 3px;
    position: relative;
    vertical-align: top;
    -webkit-transition: all .15s;
    transition: all .15s
}

.tags-avatars__list:hover {
    background-color: #f8f9fa
}

.tags-avatars__list:active {
    background-color: #f0f2f5
}

.tags-avatars__list--empty {
    background-color: transparent;
    -webkit-box-shadow: 0 0 0 transparent;
    box-shadow: 0 0 0 transparent;
    font-size: 22px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tags-avatars__list--empty:hover {
    background-color: #f8f9fa
}

.tags-avatars__list--empty:active {
    background-color: #f0f2f5
}

.base-textarea[data-v-62c20df6] {
    border: 0;
    background: transparent;
    text-align: left;
    width: 100%;
    outline: 0;
    resize: none;
    color: #3b3b3b;
    padding: 0;
    font-size: 16px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.5;
    letter-spacing: normal
}

.base-textarea[data-v-62c20df6]::-webkit-input-placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-textarea[data-v-62c20df6]::-moz-placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-textarea[data-v-62c20df6]:-ms-input-placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-textarea[data-v-62c20df6]::-ms-input-placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-textarea[data-v-62c20df6]::placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-uploader[data-v-5d09a106] {
    position: relative;
    border-radius: 4px;
    width: 100%
}

.base-uploader[data-v-5d09a106]:focus {
    outline: none
}

.base-uploader[data-v-5d09a106]:after {
    content: "";
    position: absolute;
    left: -4px;
    top: -4px;
    right: -4px;
    bottom: -4px;
    border: 2px solid transparent;
    -webkit-transition: all .2s;
    transition: all .2s;
    pointer-events: none;
    border-radius: 8px
}

.base-uploader--drag-over-active[data-v-5d09a106]:after {
    border-color: #abc0c8
}

.base-uploader--drag-over[data-v-5d09a106]:after,
.base-uploader[data-v-5d09a106]:focus:after {
    border-color: #0a9fa3
}

.base-uploader__ico[data-v-5d09a106] {
    width: 34px;
    height: 34px
}

.base-uploader__container[data-v-5d09a106] {
    width: 100%;
    height: 100%;
    position: relative;
    background-color: #f3f6f8;
    border-radius: 4px;
    overflow: hidden
}

.base-uploader__background[data-v-5d09a106] {
    position: relative;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 4px;
    overflow: hidden
}

.base-uploader__background--filed[data-v-5d09a106] {
    cursor: -webkit-zoom-in;
    cursor: zoom-in
}

.base-uploader__background--empty[data-v-5d09a106] {
    cursor: pointer;
    -webkit-transition: all .2s;
    transition: all .2s
}

.base-uploader--theme-circle .base-uploader__background--empty[data-v-5d09a106]:before {
    content: "";
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .2);
    opacity: 0;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-transition: all .2s;
    transition: all .2s;
    border-radius: 4px
}

.base-uploader--theme-circle .base-uploader__background--empty[data-v-5d09a106]:hover:before {
    opacity: 1
}

.base-uploader__image[data-v-5d09a106] {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto
}

.base-uploader__modal-container[data-v-5d09a106] {
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, .8)
}

.base-uploader__modal-content[data-v-5d09a106] {
    margin: 60px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: calc(100vw - 120px);
    min-height: calc(100vh - 120px)
}

.base-uploader__modal-x[data-v-5d09a106] {
    z-index: 9999;
    top: 15px;
    right: 45px;
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: 700;
    cursor: pointer;
    position: fixed
}

.base-uploader__modal-img[data-v-5d09a106] {
    max-width: 100%
}

.base-uploader__remove[data-v-5d09a106] {
    position: absolute;
    top: 6px;
    right: 6px;
    opacity: 0;
    cursor: pointer;
    -webkit-transition: all .2s;
    transition: all .2s;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.base-uploader__container:hover .base-uploader__remove[data-v-5d09a106] {
    opacity: 1
}

.base-uploader--theme-default .base-uploader__badge[data-v-5d09a106] {
    top: 6px;
    left: 6px;
    z-index: 80;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: absolute;
    background-color: rgba(44, 44, 44, .8);
    padding: 5px 10px 4px 25px;
    border-radius: 3px;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato;
    font-size: 10px;
    font-weight: 700;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.5;
    letter-spacing: .1px;
    color: #fff
}

.base-uploader--theme-default .base-uploader__uploading[data-v-5d09a106]:before {
    content: "";
    height: 15px;
    width: 15px;
    border-radius: 50%;
    border: 2px solid #86909a;
    border-top-color: #fff;
    display: block;
    position: absolute;
    top: 5px;
    left: 5px;
    -webkit-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
    background: transparent
}

.base-uploader--theme-default .base-uploader__uploading[data-v-5d09a106]:after {
    display: none
}

.base-uploader--theme-default .base-uploader__background--empty[data-v-5d09a106]:hover,
.base-uploader:focus .base-uploader--theme-default .base-uploader__background--empty[data-v-5d09a106] {
    background-color: #e6edf0
}

.base-uploader--cant-edit .base-uploader--theme-default .base-uploader__background--empty[data-v-5d09a106] {
    cursor: default;
    background-color: transparent
}

.base-uploader--cant-edit .base-uploader--theme-default .base-uploader__background--empty[data-v-5d09a106]:hover {
    background-color: transparent
}

.base-uploader--theme-circle .base-uploader__badge[data-v-5d09a106],
.base-uploader--theme-compact .base-uploader__badge[data-v-5d09a106] {
    top: 0;
    left: 0;
    z-index: 80;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: absolute;
    background-color: rgba(0, 0, 0, .2);
    border-radius: 3px;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.base-uploader--theme-circle .base-uploader__uploading[data-v-5d09a106]:before,
.base-uploader--theme-compact .base-uploader__uploading[data-v-5d09a106]:before {
    content: "";
    height: 15px;
    width: 15px;
    border-radius: 50%;
    border: 2px solid #86909a;
    border-top-color: #fff;
    display: block;
    -webkit-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
    background: transparent
}

.base-uploader--theme-circle .base-uploader__uploading[data-v-5d09a106]:after,
.base-uploader--theme-compact .base-uploader__uploading[data-v-5d09a106]:after {
    display: none
}

.base-uploader--theme-circle .base-uploader__background--empty[data-v-5d09a106]:hover,
.base-uploader--theme-compact .base-uploader__background--empty[data-v-5d09a106]:hover,
.base-uploader:focus .base-uploader--theme-circle .base-uploader__background--empty[data-v-5d09a106],
.base-uploader:focus .base-uploader--theme-compact .base-uploader__background--empty[data-v-5d09a106] {
    background-color: #e6edf0
}

.base-uploader--cant-edit .base-uploader--theme-circle .base-uploader__background--empty[data-v-5d09a106],
.base-uploader--cant-edit .base-uploader--theme-compact .base-uploader__background--empty[data-v-5d09a106] {
    cursor: default
}

.base-uploader--cant-edit .base-uploader--theme-circle .base-uploader__background--empty[data-v-5d09a106]:hover,
.base-uploader--cant-edit .base-uploader--theme-compact .base-uploader__background--empty[data-v-5d09a106]:hover {
    background-color: transparent
}

.base-uploader--theme-logo[data-v-5d09a106],
.base-uploader--theme-simple-logo[data-v-5d09a106] {
    height: 109px;
    width: 109px;
    margin-left: auto;
    margin-right: auto;
    border: 1px dashed #dfe2e8
}

.base-uploader--theme-logo .base-uploader__container[data-v-5d09a106],
.base-uploader--theme-simple-logo .base-uploader__container[data-v-5d09a106] {
    position: absolute;
    left: 6px;
    top: 6px;
    right: 6px;
    bottom: 6px;
    width: auto;
    height: auto
}

.base-uploader--theme-logo .base-uploader__remove[data-v-5d09a106],
.base-uploader--theme-simple-logo .base-uploader__remove[data-v-5d09a106] {
    left: 50%;
    top: 50%;
    width: 24px;
    height: 24px;
    margin: -12px 0 0 -12px
}

.base-uploader--theme-logo .base-uploader__background[data-v-5d09a106]:before,
.base-uploader--theme-simple-logo .base-uploader__background[data-v-5d09a106]:before {
    content: "";
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: 0;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-transition: all .2s;
    transition: all .2s
}

.base-uploader--theme-logo .base-uploader__background[data-v-5d09a106]:hover:before,
.base-uploader--theme-simple-logo .base-uploader__background[data-v-5d09a106]:hover:before,
.base-uploader:focus .base-uploader--theme-logo .base-uploader__background[data-v-5d09a106]:before,
.base-uploader:focus .base-uploader--theme-simple-logo .base-uploader__background[data-v-5d09a106]:before {
    opacity: .2
}

.base-uploader--theme-logo.base-uploader--cant-edit .base-uploader__background[data-v-5d09a106],
.base-uploader--theme-logo.base-uploader--cant-edit .base-uploader__background[data-v-5d09a106]:hover,
.base-uploader--theme-simple-logo.base-uploader--cant-edit .base-uploader__background[data-v-5d09a106],
.base-uploader--theme-simple-logo.base-uploader--cant-edit .base-uploader__background[data-v-5d09a106]:hover {
    background: transparent
}

.base-uploader--theme-logo.base-uploader--cant-edit .base-uploader__background[data-v-5d09a106]:before,
.base-uploader--theme-simple-logo.base-uploader--cant-edit .base-uploader__background[data-v-5d09a106]:before {
    display: none
}

.base-uploader--theme-logo .base-uploader__background--empty[data-v-5d09a106]:hover,
.base-uploader--theme-simple-logo .base-uploader__background--empty[data-v-5d09a106]:hover,
.base-uploader:focus .base-uploader--theme-logo .base-uploader__background--empty[data-v-5d09a106],
.base-uploader:focus .base-uploader--theme-simple-logo .base-uploader__background--empty[data-v-5d09a106] {
    background-color: #e6edf0
}

.base-uploader--cant-edit .base-uploader--theme-logo .base-uploader__background--empty[data-v-5d09a106],
.base-uploader--cant-edit .base-uploader--theme-simple-logo .base-uploader__background--empty[data-v-5d09a106] {
    background-color: transparent;
    cursor: default
}

.base-uploader--cant-edit .base-uploader--theme-logo .base-uploader__background--empty[data-v-5d09a106]:hover,
.base-uploader--cant-edit .base-uploader--theme-simple-logo .base-uploader__background--empty[data-v-5d09a106]:hover {
    background-color: transparent
}

.base-uploader--theme-simple-logo[data-v-5d09a106] {
    border: 0;
    height: 1em;
    width: 1em
}

.base-uploader--theme-simple-logo .base-uploader__container[data-v-5d09a106] {
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: transparent
}

.base-uploader__circle[data-v-5d09a106] {
    height: 38px;
    width: 38px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, .1);
    border-radius: 50%;
    position: relative
}

.base-uploader__logo-symbol[data-v-5d09a106] {
    font-size: 42px;
    font-weight: 600
}

.btn[data-v-1e6ff079] {
    white-space: nowrap
}

.share-dropdown__link {
    margin: -5px;
    margin-left: -70px;
    padding: 5px;
    padding-left: 70px
}

.share-dropdown__link:before {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0
}

.share-dropdown__link.tutorial-highlighted-element:before {
    left: 5px;
    top: 5px;
    right: 5px;
    bottom: 5px
}

.survey__header[data-v-5f9a4308] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%;
    margin-right: auto
}

.survey__theme[data-v-5f9a4308] {
    font-size: 16px;
    line-height: 1.5;
    color: #3b3b3b;
    margin: 0;
    text-decoration: none
}

.survey__saving[data-v-5f9a4308] {
    position: absolute;
    right: 0;
    top: 50%;
    margin: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.survey__saving .header__submenu-saved[data-v-5f9a4308] {
    position: static
}

.theme__container[data-v-5f9a4308] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 173px;
    height: 34px;
    border-radius: 3px;
    background-color: #f3f6f8
}

.theme__talebook[data-v-5f9a4308] {
    font-weight: 600
}

.project__name[data-v-5f9a4308] {
    position: absolute;
    left: 50%;
    top: 50%;
    margin: 0;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    color: #252729;
    line-height: 1.39;
    font-size: 18px
}

@media only screen and (max-width:479px) {
    .survey__header[data-v-5f9a4308] {
        margin-right: 0
    }

    .project__name[data-v-5f9a4308] {
        display: none
    }

    .theme__container[data-v-5f9a4308] {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

@-webkit-keyframes archiving-animation-item-2db6c2fc {
    0% {
        opacity: 0
    }

    20% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    to {
        opacity: 0;
        -webkit-transform: translateX(-150px) scale(.6);
        transform: translateX(-150px) scale(.6)
    }
}

@keyframes archiving-animation-item-2db6c2fc {
    0% {
        opacity: 0
    }

    20% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    to {
        opacity: 0;
        -webkit-transform: translateX(-150px) scale(.6);
        transform: translateX(-150px) scale(.6)
    }
}

.archiving-animation__item[data-v-2db6c2fc] {
    position: absolute;
    left: 100%;
    top: 50%;
    margin-top: -10px;
    width: 21px;
    height: 21px;
    -webkit-animation: archiving-animation-item-2db6c2fc 1.2s 1;
    animation: archiving-animation-item-2db6c2fc 1.2s 1;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-timing-function: cubic-bezier(.5, 0, .75, 0);
    animation-timing-function: cubic-bezier(.5, 0, .75, 0);
    font-size: 21px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.archiving-animation__tag[data-v-2db6c2fc] {
    width: 16px;
    height: 16px;
    border-radius: 50%
}

.archiving-animation__avatar[data-v-2db6c2fc] {
    width: 21px;
    height: 21px;
    border-radius: 3px;
    overflow: hidden
}

.archiving-animation__avatar img[data-v-2db6c2fc] {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    vertical-align: top
}

.v-leave-active {
    display: none !important
}

.js-static[data-v-4b69d216] {
    width: 100%;
    position: fixed;
    margin-bottom: 0;
    z-index: 99
}

.js-surveys[data-v-4b69d216] {
    margin: 0;
    width: 100%
}

.sidebar-dl[data-v-3fd8247a] {
    font-size: 1.4rem;
    color: #646464;
    text-align: right
}

.sidebar-dl dt[data-v-3fd8247a] {
    float: left;
    clear: left;
    text-align: left
}

.sidebar-dl dd[data-v-3fd8247a] {
    margin-bottom: 10px
}

.sidebar-dl dd[data-v-3fd8247a]:last-child {
    margin-bottom: 0
}

.sidebar-tags__header[data-v-3fd8247a] {
    margin-top: 42px;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.39;
    color: #252729
}

.tags-selector__list-item .highlight {
    font-weight: 700;
    color: #171717
}

.tags-selector .vb-invisible {
    z-index: 1
}

.tags-selector .vb-dragger {
    right: 2px
}

.tags-selector .vb-dragger-styler {
    right: -1px;
    width: 4px;
    opacity: .3;
    border-radius: 20px;
    background-color: #555;
    height: 100%
}

.tags-selector[data-v-7f28e026] {
    position: relative;
    padding-top: 44px;
    padding-right: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.tags-selector__list-container[data-v-7f28e026] {
    margin-top: 43px;
    padding-top: 4px
}

.tags-selector__background[data-v-7f28e026] {
    z-index: 1;
    top: 0;
    width: 100%;
    position: absolute;
    border-radius: 3px;
    border: 1px solid transparent
}

.tags-selector__background--focused[data-v-7f28e026] {
    background-color: #fff;
    -webkit-box-shadow: 0 12px 23px -1px rgba(0, 0, 0, .1);
    box-shadow: 0 12px 23px -1px rgba(0, 0, 0, .1)
}

.tags-selector__background.js-active[data-v-7f28e026] {
    z-index: 999
}

.tags-selector__no-item[data-v-7f28e026] {
    padding: 17px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.tags-selector__no-item img[data-v-7f28e026] {
    opacity: .4;
    width: 50px;
    height: 50px;
    -o-object-fit: contain;
    object-fit: contain
}

.tags-selector__no-item span[data-v-7f28e026] {
    color: #646464;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato;
    font-size: 14px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    margin-top: 12px;
    color: #aaaab5;
    font-size: 12px
}

.tags-selector__list[data-v-7f28e026] {
    max-height: 420px
}

.tags-selector__list-content[data-v-7f28e026] {
    padding: 0 3px
}

.tags-selector__list-item-color[data-v-7f28e026] {
    width: 16px;
    height: 16px;
    background-color: #9f55b1;
    border-radius: 50%;
    margin: 0 16px 0 10px
}

.tags-selector__list-item-name[data-v-7f28e026] {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1
}

.tags-selector__list-item[data-v-7f28e026] {
    color: #646464;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato;
    font-size: 14px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    letter-spacing: .1px;
    min-height: 36px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 3px;
    margin: 4px 0
}

.tags-selector__list-item[data-v-7f28e026]:hover {
    background-color: #f8f9fa
}

.tags-selector__list-item[data-v-7f28e026]:first-child,
.tags-selector__list-item[data-v-7f28e026]:last-child {
    margin-bottom: 0
}

.tags-selector__list-item[data-v-7f28e026]:first-child {
    margin-top: 0
}

.tags-selector__list-item--selected[data-v-7f28e026] {
    color: #252729;
    font-weight: 600
}

.tags-selector__list-item--selected svg[data-v-7f28e026] {
    width: 24px;
    margin: 2px;
    stroke-width: 1.05px
}

.tags-selector__list-item--new[data-v-7f28e026] {
    color: #252729;
    font-weight: 600
}

.tags-selector__list-item--new svg[data-v-7f28e026] {
    width: 15px;
    height: 11px;
    margin: 0 17px 0 10px;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.tags-selector__list-item--new-focused[data-v-7f28e026] {
    background-color: #f8f9fa
}

.tags-selector__placeholder[data-v-7f28e026] {
    color: #646464;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato;
    font-size: 14px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    position: absolute;
    opacity: .5;
    cursor: pointer;
    height: 20px;
    width: 50px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin-left: calc(50% - 25px);
    margin-top: auto;
    margin-bottom: auto;
    -webkit-transition: margin .2s linear;
    transition: margin .2s linear
}

.tags-selector__placeholder.active[data-v-7f28e026] {
    margin-left: 44px
}

.tags-selector--mode-responders .tags-selector__placeholder[data-v-7f28e026] {
    width: 100px;
    margin-left: calc(50% - 50px)
}

.tags-selector--mode-responders .tags-selector__placeholder.active[data-v-7f28e026] {
    margin-left: 44px
}

.tags-selector__input-container[data-v-7f28e026] {
    position: absolute;
    top: 3px;
    left: 3px;
    right: 3px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background-color: #eeeff2;
    border-radius: 4px;
    height: 41px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 5px 10px;
    cursor: pointer
}

.tags-selector__input-container[data-v-7f28e026]:hover {
    background-color: #dde0e3;
    cursor: pointer
}

.tags-selector__input-container svg[data-v-7f28e026] {
    margin-right: 16px;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: opacity .1s;
    transition: opacity .1s
}

.tags-selector__input-container svg.active[data-v-7f28e026] {
    visibility: visible;
    opacity: 1
}

.tags-selector__input-container input[data-v-7f28e026] {
    color: #646464;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato;
    font-size: 14px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    cursor: pointer;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border: 0;
    outline: none;
    background-color: transparent
}

.tags-selector__header[data-v-7f28e026] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-right: 8px
}

.tags-selector__tags[data-v-7f28e026] {
    width: 173px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.sidebar-tags__container .sidebar-tags__list-outside-selector .tag-list-item__name {
    padding-right: 40px;
    position: relative
}

.sidebar-tags__container .sidebar-tags__list-outside-selector .tag-list-item:hover .tag-list-item__name:after {
    content: "";
    width: 20px;
    height: 100%;
    background: url(/img/check.3ae8add3.svg) no-repeat 0 0;
    background-size: 80% 100%;
    position: absolute;
    right: 10px;
    top: 0;
    opacity: .7
}

.sidebar-tags-enter-active[data-v-350045c8],
.sidebar-tags-leave-active[data-v-350045c8] {
    -webkit-transition: opacity .3s ease;
    transition: opacity .3s ease;
    position: absolute;
    width: calc(100% - 8px)
}

.sidebar-tags-leave-to[data-v-350045c8] {
    opacity: 0
}

.sidebar-tags-move[data-v-350045c8] {
    -webkit-transition: .5s cubic-bezier(.59, .12, .34, .95);
    transition: .5s cubic-bezier(.59, .12, .34, .95);
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform
}

.sidebar-tags__container[data-v-350045c8] {
    position: relative
}

.sidebar-tags__selector[data-v-350045c8] {
    color: #646464;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato;
    font-size: 14px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    cursor: pointer;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 8px;
    margin-bottom: 4px;
    background-color: #edeff0;
    border-radius: 4px;
    height: 40px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 5px 10px;
    color: #a5adb4
}

.sidebar-tags__header[data-v-350045c8] {
    margin-top: 46px;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.39;
    color: #252729
}

.sidebar-tags__tag-list-item[data-v-350045c8] {
    margin-left: 4px;
    margin-right: 4px !important;
    margin-top: 4px;
    cursor: pointer
}

.sidebar-tags__tag-list-item[data-v-350045c8]:hover {
    background-color: #eeeff2 !important
}

.answer-modal-modal-wrapper {
    max-width: 1150px;
    background-color: #fff;
    position: relative;
    border-radius: 3px
}

.answer-modal[data-v-43046193] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 670px
}

.answer-modal__content[data-v-43046193] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%
}

.answer-modal__content textarea[data-v-43046193] {
    min-height: 31px
}

.answer-modal__tags[data-v-43046193] {
    position: relative;
    width: 320px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    background-color: #f8f9fa;
    border-radius: 0 3px 3px 0
}

.answer-modal__header[data-v-43046193] {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    line-height: 30px;
    max-width: 557px;
    font-size: 24px;
    color: #000;
    margin-left: 112px;
    margin-top: 50px;
    padding-bottom: 8px;
    border-bottom: 1px dashed #fff;
    -webkit-transition: border-bottom .25s;
    transition: border-bottom .25s
}

.answer-modal__header--editable[data-v-43046193]:hover {
    border-bottom: 1px dashed #8e8e8e
}

.answer-modal__header--editable[data-v-43046193]:active,
.answer-modal__header--editable[data-v-43046193]:focus {
    border-bottom: 1px dashed #1d1d1d
}

.answer-modal__description[data-v-43046193] {
    font-size: 16px;
    line-height: 1.5;
    color: #3b3b3b;
    margin-left: 112px;
    margin-top: 42px
}

.answer-modal__exit[data-v-43046193] {
    right: 13px;
    top: 13px
}

.answer-modal__tags-header[data-v-43046193] {
    margin-top: 46px;
    margin-left: 33px;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.39;
    color: #252729
}

.answer-modal__ul[data-v-43046193] {
    list-style: none;
    padding: 0;
    margin: 20px 33px
}

.answer-modal__ul li[data-v-43046193] {
    list-style: none !important;
    margin-bottom: 30px;
    padding-left: 15px
}

.answer-modal__li[data-v-43046193] {
    color: #646464;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato;
    font-size: 14px
}

.answer-modal__span[data-v-43046193] {
    margin-left: 45px
}

.method-edit[data-v-43046193] {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    margin: 42px 112px
}

.method-edit .editor li[data-v-43046193] {
    margin-left: 1000px
}

.tags-in-modals[data-v-43046193] {
    top: 106px;
    right: 255px
}

.methods__list ul li[data-v-43046193],
.methods__list ul[data-v-43046193] {
    list-style-type: disc
}

@media only screen and (max-width:767px) {
    .methods__list-answer-input[data-v-43046193] {
        line-height: 2.5rem
    }

    .modal__close-x[data-v-43046193] {
        display: block;
        -webkit-transform: translate(-1px, 40px);
        transform: translate(-1px, 40px)
    }

    .modal__close-x svg[data-v-43046193] {
        width: 16px
    }

    .answer-modal[data-v-43046193] {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .answer-modal__header[data-v-43046193] {
        max-width: inherit
    }

    .answer-modal__content[data-v-43046193] {
        min-height: 464px;
        width: 100%;
        padding-left: 15px;
        padding-right: 15px
    }

    .answer-modal__content .answer-modal__header[data-v-43046193] {
        margin-top: 33px;
        margin-left: 0
    }

    .answer-modal__content .method-edit[data-v-43046193] {
        width: 100%;
        margin: 0;
        margin-top: 25px
    }

    .answer-modal__tags[data-v-43046193] {
        position: static;
        min-height: 200px;
        width: 100%
    }

    .answer-modal__tags-header[data-v-43046193] {
        margin-top: 30px
    }
}

@media only screen and (min-width:768px) and (max-width:1200px) {
    .answer-modal__content[data-v-43046193] {
        padding-left: 33px
    }

    .answer-modal__header[data-v-43046193] {
        width: 95%;
        margin-left: 0;
        margin-top: 32px;
        max-width: none
    }

    .answer-modal__tags[data-v-43046193] {
        min-width: 258px
    }

    .answer-modal .method-edit[data-v-43046193] {
        margin-left: 0;
        margin-top: 28px
    }

    .answer-modal .method-edit .editor[data-v-43046193] {
        width: 95%
    }
}

.edit-contact__autocomplete {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.edit-contact__autocomplete input {
    border: none;
    outline: none
}

.edit-contact__saving-indicator[data-v-6e46cbc4] {
    margin-right: 28px;
    position: absolute !important;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.edit-contact__item[data-v-6e46cbc4] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 55px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0;
    padding-left: 100px;
    border-bottom: 1px solid #f2f2f2;
    font-size: 16px;
    line-height: 1.5;
    color: #3b3b3b
}

.edit-contact__data[data-v-6e46cbc4] {
    display: block;
    width: 181px;
    text-align: left
}

.edit-contact__input[data-v-6e46cbc4] {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    border: none;
    outline: none;
    color: #414141
}

.button__container .buttons[data-v-6e46cbc4] {
    width: 90px;
    height: 30px;
    border-radius: 15px;
    outline: none;
    background: none;
    border: none;
    font-size: 11px;
    line-height: 1.36;
    letter-spacing: .8px;
    color: #414141;
    text-transform: uppercase
}

.button__container .buttons[data-v-6e46cbc4]:active,
.button__container .buttons[data-v-6e46cbc4]:focus {
    border: 1px solid #68bf65;
    color: #68bf65
}

.edit-contact-modal-modal-wrapper {
    max-width: 691px;
    min-height: 591px;
    background-color: #fff;
    position: relative;
    border-radius: 3px
}

.modal__header[data-v-29687834] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 58px 0 0 0
}

.modal__container[data-v-29687834] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, .51);
    z-index: 999;
    overflow-x: hidden;
    overflow-y: auto;
    height: 100%
}

.header__info[data-v-29687834] {
    margin: 0;
    margin-top: 0;
    font-size: 2.4rem;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal
}

.header__email[data-v-29687834] {
    font-size: 1.4rem;
    color: #646464;
    line-height: 1.43;
    margin-top: .3rem
}

.edit-contact__list[data-v-29687834] {
    padding: 0;
    margin: 48px 0 0 0;
    font-size: 1.6rem
}

.edit-contact__item[data-v-29687834] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 55px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0;
    padding-left: 100px;
    border-bottom: 1px solid #f2f2f2;
    font-size: 16px;
    line-height: 1.5;
    color: #3b3b3b
}

.edit-contact__data[data-v-29687834] {
    display: block;
    width: 181px;
    text-align: left
}

.edit-contact__input[data-v-29687834] {
    border: none;
    outline: none
}

.button__container .buttons[data-v-29687834] {
    width: 90px;
    height: 30px;
    border-radius: 15px;
    outline: none;
    background: none;
    border: none;
    font-size: 11px;
    line-height: 1.36;
    letter-spacing: .8px;
    color: #414141;
    text-transform: uppercase;
    opacity: .5
}

.button__container .buttons.js-selected[data-v-29687834],
.button__container .buttons[data-v-29687834]:active,
.button__container .buttons[data-v-29687834]:focus {
    border: 1px solid #68bf65;
    color: #68bf65;
    opacity: 1
}

.invoices-modal-modal-wrapper {
    max-width: 691px;
    min-height: 591px;
    background-color: #fff;
    position: relative;
    border-radius: 3px
}

.modal__header[data-v-6b702948] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 58px 0 10px 0
}

.modal__header h2[data-v-6b702948] {
    margin-top: 0;
    font-size: 24px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal
}

.modal__container[data-v-6b702948] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, .51);
    z-index: 999;
    overflow-x: hidden;
    overflow-y: auto;
    height: 100%
}

.settings__list[data-v-6b702948] {
    margin-top: 0;
    margin-bottom: 0
}

.settings__list li[data-v-6b702948] {
    padding: 16px 0;
    border-bottom: none
}

.invoice__year[data-v-6b702948] {
    margin-top: 30px;
    padding: 0 0 15px 0;
    border-bottom: 1px solid #f2f2f2
}

.invoice__year h2[data-v-6b702948] {
    font-size: 11px;
    line-height: 1.36;
    letter-spacing: .8px;
    font-weight: 400;
    color: #414141;
    opacity: .5;
    margin: 0
}

.invoice__left[data-v-6b702948] {
    margin-left: 16px;
    font-size: 14px;
    color: #3b3b3b;
    line-height: 1.5
}

.invoice__middle[data-v-6b702948] {
    font-size: 14px;
    color: #646464;
    position: absolute;
    -webkit-transform: translateX(175px);
    transform: translateX(175px)
}

.invoice__right[data-v-6b702948] {
    margin-right: 32px
}

.invoice__download[data-v-6b702948] {
    font-size: 14px;
    color: #252729;
    font-weight: 700;
    text-decoration: none
}

@media only screen and (min-width:582px) {
    .invoices__left[data-v-6b702948] {
        font-size: 16px;
        color: #3b3b3b;
        line-height: 1.5
    }

    .invoices__middle[data-v-6b702948] {
        font-size: 14px;
        color: #3b3b3b;
        position: absolute;
        -webkit-transform: translateX(280px);
        transform: translateX(280px)
    }

    .invoices__download[data-v-6b702948] {
        font-size: 14px;
        color: #252729;
        font-weight: 700;
        text-decoration: none
    }
}

.manage-tags-modal .tags-modal-wrapper {
    max-width: 560px;
    padding: 30px 8px 8px
}

.fade-enter-active[data-v-460b3c7e],
.fade-leave-active[data-v-460b3c7e] {
    -webkit-transition: opacity .25s;
    transition: opacity .25s
}

.fade-enter[data-v-460b3c7e],
.fade-leave-to[data-v-460b3c7e] {
    opacity: 0
}

.manage-tags__placeholder[data-v-460b3c7e] {
    color: #646464;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato;
    font-size: 14px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    position: absolute;
    opacity: .5;
    cursor: text;
    height: 20px;
    width: 110px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin-left: calc(50% - 54px);
    margin-top: auto;
    margin-bottom: auto;
    -webkit-transition: margin .2s linear;
    transition: margin .2s linear
}

.manage-tags__placeholder.active[data-v-460b3c7e] {
    margin-left: 37px;
    pointer-events: none
}

.manage-tags__input-container[data-v-460b3c7e] {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-top: 8px;
    margin-bottom: 8px;
    background-color: #f8f9fa;
    border-radius: 4px;
    height: 41px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 5px 10px
}

.manage-tags__input-container svg[data-v-460b3c7e] {
    margin-right: 10px;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: opacity .1s;
    transition: opacity .1s
}

.manage-tags__input-container svg.active[data-v-460b3c7e] {
    visibility: visible;
    opacity: 1;
    pointer-events: none
}

.manage-tags__input-container input[data-v-460b3c7e] {
    color: #646464;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato;
    font-size: 14px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border: 0;
    outline: none;
    background-color: transparent
}

.manage-tags__modal-title[data-v-460b3c7e] {
    font-size: 20px;
    color: #000;
    text-align: center;
    margin-top: 0
}

.manage-tags__list-item[data-v-460b3c7e] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 44px;
    padding: 8px !important;
    border-radius: 4px;
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.manage-tags__list-item[data-v-460b3c7e]:hover {
    background-color: #f8f9fa
}

.manage-tags__list-item--new[data-v-460b3c7e] {
    background-color: #f8f9fa;
    font-size: 14px;
    color: #646464
}

.manage-tags__add-new[data-v-460b3c7e] {
    color: #646464;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato;
    font-size: 14px;
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.43;
    letter-spacing: normal;
    margin-left: 14px;
    overflow: hidden;
    text-overflow: ellipsis
}

.manage-tags__color[data-v-460b3c7e] {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    margin-right: 13px
}

.manage-tags__error-info[data-v-460b3c7e] {
    position: absolute;
    left: 1px;
    top: 20px;
    color: #d0011b
}

.manage-tags__input--error[data-v-460b3c7e],
.manage-tags__input--error[data-v-460b3c7e]:focus,
.manage-tags__input--error[data-v-460b3c7e]:hover {
    border-bottom: 1px dashed #d0011b !important
}

.manage-tags__input[data-v-460b3c7e] {
    color: #646464;
    border: 0;
    border-bottom: 1px dashed #fff;
    -webkit-transition: border-bottom .25s;
    transition: border-bottom .25s;
    background: transparent;
    outline: 0;
    width: 96%;
    padding: 0;
    font-size: 14px;
    height: 20px
}

.manage-tags__input[data-v-460b3c7e]:hover {
    cursor: text;
    border-bottom: 1px dashed #8e8e8e
}

.manage-tags__input[data-v-460b3c7e]:focus {
    border-bottom: 1px dashed #1d1d1d
}

.update-card[data-v-2040f921],
.update-card[data-v-285979c6] {
    cursor: pointer;
    margin-left: 20px;
    color: #53b7cb
}

.survey__theme[data-v-35f14389] {
    font-size: 16px;
    line-height: 1.5;
    color: #3b3b3b;
    margin: 0;
    text-decoration: none
}

.theme__container[data-v-35f14389] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: auto;
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
    width: 173px;
    height: 34px;
    border-radius: 3px;
    background-color: #f3f6f8
}

.theme__talebook[data-v-35f14389] {
    font-weight: 600
}

@media only screen and (min-width:479px) {
    .theme__container[data-v-35f14389] {
        display: none
    }
}

.magic-link-modal__img[data-v-5e92902f],
.reset-password-request-modal__img[data-v-3421e35a] {
    display: block;
    margin: 0 auto;
    width: 100%;
    max-width: 168px;
    height: auto
}

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
    line-height: 1.15;
}

main {
    display: block
}

hr {
    overflow: visible
}

pre {
    font-family: monospace, monospace;
    font-size: 1em
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

b,
strong {
    font-weight: bolder
}

code,
kbd,
samp {
    font-family: monospace, monospace;
    font-size: 1em
}

img {
    border-style: none
}

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15
}

button,
input {
    overflow: visible
}

[type=button],
[type=reset],
[type=submit],
button {
    -webkit-appearance: button
}

[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner,
button::-moz-focus-inner {
    border-style: none;
    padding: 0
}

[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring,
button:-moz-focusring {
    outline: 1px dotted ButtonText
}

fieldset {
    padding: .35em .75em .625em
}

legend {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    white-space: normal
}

progress {
    vertical-align: baseline
}

[type=checkbox],
[type=radio] {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0
}

[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

details {
    display: block
}

summary {
    display: list-item
}

[hidden],
template {
    display: none
}

html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0;
    overflow-x: hidden;
    touch-action: pan-y;
    padding-top: env(safe-area-inset-top);
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
    display: block
}

audio,
canvas,
progress,
video {
    display: inline-block;
    vertical-align: baseline
}

audio:not([controls]) {
    display: none;
    height: 0
}

[hidden],
template {
    display: none
}

a {
    background-color: transparent
}

a:active,
a:hover {
    outline: 0
}

abbr[title] {
    border-bottom: 1px dotted
}

b,
strong {
    font-weight: 700
}

dfn {
    font-style: italic
}

h1 {
    font-size: 2em;
    margin: .67em 0
}

mark {
    background: #ff0;
    color: #000
}

small {
    font-size: 80%
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sup {
    top: -.5em
}

sub {
    bottom: -.25em
}

img {
    border: 0
}

svg:not(:root) {
    overflow: hidden
}

figure {
    margin: 1em 40px
}

hr {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    height: 0
}

pre {
    overflow: auto
}

code,
kbd,
pre,
samp {
    font-family: monospace, monospace;
    font-size: 1em
}

button,
input,
optgroup,
select,
textarea {
    color: inherit;
    font: inherit;
    margin: 0
}

button {
    overflow: visible
}

button,
select {
    text-transform: none
}

button,
html input[type=button],
input[type=reset],
input[type=submit] {
    -webkit-appearance: button;
    cursor: pointer
}

button[disabled],
html input[disabled] {
    cursor: default
}

button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0
}

input {
    line-height: normal
}

input[type=checkbox],
input[type=radio] {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    height: auto
}

input[type=search] {
    -webkit-appearance: textfield;
    -webkit-box-sizing: content-box;
    box-sizing: content-box
}

input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

fieldset {
    border: 1px solid silver;
    margin: 0 2px;
    padding: .35em .625em .75em
}

legend {
    border: 0;
    padding: 0
}

textarea {
    overflow: auto
}

optgroup {
    font-weight: 700
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

td,
th {
    padding: 0
}

*,
:after,
:before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

html {
    font-size: 10px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}

body {
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.42857143;
    color: #333;
    background-color: #fff
}

button,
input,
select,
textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit
}

a {
    color: #337ab7;
    text-decoration: none
}

a:focus,
a:hover {
    color: #23527c;
    text-decoration: underline
}

a:focus {
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px
}

figure {
    margin: 0
}

img {
    vertical-align: middle
}

.img-responsive {
    display: block;
    max-width: 100%;
    height: auto
}

.img-rounded {
    border-radius: 6px
}

.img-thumbnail {
    padding: 4px;
    line-height: 1.42857143;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    display: inline-block;
    max-width: 100%;
    height: auto
}

.img-circle {
    border-radius: 50%
}

hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid #eee
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0
}

.sr-only-focusable:active,
.sr-only-focusable:focus {
    position: static;
    width: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    clip: auto
}

[role=button] {
    cursor: pointer
}

.container {
    max-width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-left: 0px;
    padding-right: 0px
}

.crono-row-h {
    height: 40px !important;
}

@media (min-width:768px) {
    .container {
        width: 750px
    }
}

@media (min-width:992px) {
    .container {
        width: 100%
    }
    
}

.crono-content-global {
    width: calc(100% - 70px);
}

@media (max-width:1027px) {
    .md-wrapper, .small-wrapper{
        margin: 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 0px !important;
        padding-right: 0px !important;
    }
    .crono-content-global {
        width: 100% !important;
    }
    .container {
        width: 100% !important;
    }
    .wide-menu {
        border-bottom: 1px solid transparent; /*e2e6e6*/
        margin-bottom: 0px;
        padding-bottom: 36px;
        padding-left: 90px !important;
        padding-right: 90px !important;
    }
}

@media (max-width:1165px) {
    .container {
        width: 100%
    }
    .crono-padding-left-right {
        padding-left: 2.5rem !important;
        padding-right: 2.5rem !important;
    }
    .full-padding-left-right {
        padding-left: 2.5rem !important;
        padding-right: 0rem !important;
    }
    .full-padding-left-right-cds {
        padding-left: 1.8rem !important;
        padding-right: 0rem !important;
    }
    .crono-text-title {
        font-weight: 600 !important;
        font-size: 1.2rem !important;
    }
    
}

@media (min-width:1200px) {
    .container {
        /*max-width: 1306px*/
    }
}

.container-fluid {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px
}

.row {
    margin-left: -15px;
    margin-right: -15px
}

.col-lg-1,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-md-1,
.col-md-10,
.col-md-11,
.col-md-12,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-sm-1,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-xs-1,
.col-xs-10,
.col-xs-11,
.col-xs-12,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9 {
    position: relative;
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px
}

.col-xs-1,
.col-xs-10,
.col-xs-11,
.col-xs-12,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9 {
    float: left
}

.col-xs-12 {
    width: 100%
}

.col-xs-11 {
    width: 91.66666667%
}

.col-xs-10 {
    width: 83.33333333%
}

.col-xs-9 {
    width: 75%
}

.col-xs-8 {
    width: 66.66666667%
}

.col-xs-7 {
    width: 58.33333333%
}

.col-xs-6 {
    width: 50%
}

.col-xs-5 {
    width: 41.66666667%
}

.col-xs-4 {
    width: 33.33333333%
}

.col-xs-3 {
    width: 25%
}

.col-xs-2 {
    width: 16.66666667%
}

.col-xs-1 {
    width: 8.33333333%
}

.col-xs-pull-12 {
    right: 100%
}

.col-xs-pull-11 {
    right: 91.66666667%
}

.col-xs-pull-10 {
    right: 83.33333333%
}

.col-xs-pull-9 {
    right: 75%
}

.col-xs-pull-8 {
    right: 66.66666667%
}

.col-xs-pull-7 {
    right: 58.33333333%
}

.col-xs-pull-6 {
    right: 50%
}

.col-xs-pull-5 {
    right: 41.66666667%
}

.col-xs-pull-4 {
    right: 33.33333333%
}

.col-xs-pull-3 {
    right: 25%
}

.col-xs-pull-2 {
    right: 16.66666667%
}

.col-xs-pull-1 {
    right: 8.33333333%
}

.col-xs-pull-0 {
    right: auto
}

.col-xs-push-12 {
    left: 100%
}

.col-xs-push-11 {
    left: 91.66666667%
}

.col-xs-push-10 {
    left: 83.33333333%
}

.col-xs-push-9 {
    left: 75%
}

.col-xs-push-8 {
    left: 66.66666667%
}

.col-xs-push-7 {
    left: 58.33333333%
}

.col-xs-push-6 {
    left: 50%
}

.col-xs-push-5 {
    left: 41.66666667%
}

.col-xs-push-4 {
    left: 33.33333333%
}

.col-xs-push-3 {
    left: 25%
}

.col-xs-push-2 {
    left: 16.66666667%
}

.col-xs-push-1 {
    left: 8.33333333%
}

.col-xs-push-0 {
    left: auto
}

.col-xs-offset-12 {
    margin-left: 100%
}

.col-xs-offset-11 {
    margin-left: 91.66666667%
}

.col-xs-offset-10 {
    margin-left: 83.33333333%
}

.col-xs-offset-9 {
    margin-left: 75%
}

.col-xs-offset-8 {
    margin-left: 66.66666667%
}

.col-xs-offset-7 {
    margin-left: 58.33333333%
}

.col-xs-offset-6 {
    margin-left: 50%
}

.col-xs-offset-5 {
    margin-left: 41.66666667%
}

.col-xs-offset-4 {
    margin-left: 33.33333333%
}

.col-xs-offset-3 {
    margin-left: 25%
}

.col-xs-offset-2 {
    margin-left: 16.66666667%
}

.col-xs-offset-1 {
    margin-left: 8.33333333%
}

.col-xs-offset-0 {
    margin-left: 0
}

@media (min-width:768px) {

    .col-sm-1,
    .col-sm-10,
    .col-sm-11,
    .col-sm-12,
    .col-sm-2,
    .col-sm-3,
    .col-sm-4,
    .col-sm-5,
    .col-sm-6,
    .col-sm-7,
    .col-sm-8,
    .col-sm-9 {
        float: left
    }

    .col-sm-12 {
        width: 100%
    }

    .col-sm-11 {
        width: 91.66666667%
    }

    .col-sm-10 {
        width: 83.33333333%
    }

    .col-sm-9 {
        width: 75%
    }

    .col-sm-8 {
        width: 66.66666667%
    }

    .col-sm-7 {
        width: 58.33333333%
    }

    .col-sm-6 {
        width: 50%
    }

    .col-sm-5 {
        width: 41.66666667%
    }

    .col-sm-4 {
        width: 33.33333333%
    }

    .col-sm-3 {
        width: 25%
    }

    .col-sm-2 {
        width: 16.66666667%
    }

    .col-sm-1 {
        width: 8.33333333%
    }

    .col-sm-pull-12 {
        right: 100%
    }

    .col-sm-pull-11 {
        right: 91.66666667%
    }

    .col-sm-pull-10 {
        right: 83.33333333%
    }

    .col-sm-pull-9 {
        right: 75%
    }

    .col-sm-pull-8 {
        right: 66.66666667%
    }

    .col-sm-pull-7 {
        right: 58.33333333%
    }

    .col-sm-pull-6 {
        right: 50%
    }

    .col-sm-pull-5 {
        right: 41.66666667%
    }

    .col-sm-pull-4 {
        right: 33.33333333%
    }

    .col-sm-pull-3 {
        right: 25%
    }

    .col-sm-pull-2 {
        right: 16.66666667%
    }

    .col-sm-pull-1 {
        right: 8.33333333%
    }

    .col-sm-pull-0 {
        right: auto
    }

    .col-sm-push-12 {
        left: 100%
    }

    .col-sm-push-11 {
        left: 91.66666667%
    }

    .col-sm-push-10 {
        left: 83.33333333%
    }

    .col-sm-push-9 {
        left: 75%
    }

    .col-sm-push-8 {
        left: 66.66666667%
    }

    .col-sm-push-7 {
        left: 58.33333333%
    }

    .col-sm-push-6 {
        left: 50%
    }

    .col-sm-push-5 {
        left: 41.66666667%
    }

    .col-sm-push-4 {
        left: 33.33333333%
    }

    .col-sm-push-3 {
        left: 25%
    }

    .col-sm-push-2 {
        left: 16.66666667%
    }

    .col-sm-push-1 {
        left: 8.33333333%
    }

    .col-sm-push-0 {
        left: auto
    }

    .col-sm-offset-12 {
        margin-left: 100%
    }

    .col-sm-offset-11 {
        margin-left: 91.66666667%
    }

    .col-sm-offset-10 {
        margin-left: 83.33333333%
    }

    .col-sm-offset-9 {
        margin-left: 75%
    }

    .col-sm-offset-8 {
        margin-left: 66.66666667%
    }

    .col-sm-offset-7 {
        margin-left: 58.33333333%
    }

    .col-sm-offset-6 {
        margin-left: 50%
    }

    .col-sm-offset-5 {
        margin-left: 41.66666667%
    }

    .col-sm-offset-4 {
        margin-left: 33.33333333%
    }

    .col-sm-offset-3 {
        margin-left: 25%
    }

    .col-sm-offset-2 {
        margin-left: 16.66666667%
    }

    .col-sm-offset-1 {
        margin-left: 8.33333333%
    }

    .col-sm-offset-0 {
        margin-left: 0
    }
}

@media (min-width:992px) {

    .col-md-1,
    .col-md-10,
    .col-md-11,
    .col-md-12,
    .col-md-2,
    .col-md-3,
    .col-md-4,
    .col-md-5,
    .col-md-6,
    .col-md-7,
    .col-md-8,
    .col-md-9 {
        float: left
    }

    .col-md-12 {
        width: 100%
    }

    .col-md-11 {
        width: 91.66666667%
    }

    .col-md-10 {
        width: 83.33333333%
    }

    .col-md-9 {
        width: 75%
    }

    .col-md-8 {
        width: 66.66666667%
    }

    .col-md-7 {
        width: 58.33333333%
    }

    .col-md-6 {
        width: 50%
    }

    .col-md-5 {
        width: 41.66666667%
    }

    .col-md-4 {
        width: 33.33333333%
    }

    .col-md-3 {
        width: 25%
    }

    .col-md-2 {
        width: 16.66666667%
    }

    .col-md-1 {
        width: 8.33333333%
    }

    .col-md-pull-12 {
        right: 100%
    }

    .col-md-pull-11 {
        right: 91.66666667%
    }

    .col-md-pull-10 {
        right: 83.33333333%
    }

    .col-md-pull-9 {
        right: 75%
    }

    .col-md-pull-8 {
        right: 66.66666667%
    }

    .col-md-pull-7 {
        right: 58.33333333%
    }

    .col-md-pull-6 {
        right: 50%
    }

    .col-md-pull-5 {
        right: 41.66666667%
    }

    .col-md-pull-4 {
        right: 33.33333333%
    }

    .col-md-pull-3 {
        right: 25%
    }

    .col-md-pull-2 {
        right: 16.66666667%
    }

    .col-md-pull-1 {
        right: 8.33333333%
    }

    .col-md-pull-0 {
        right: auto
    }

    .col-md-push-12 {
        left: 100%
    }

    .col-md-push-11 {
        left: 91.66666667%
    }

    .col-md-push-10 {
        left: 83.33333333%
    }

    .col-md-push-9 {
        left: 75%
    }

    .col-md-push-8 {
        left: 66.66666667%
    }

    .col-md-push-7 {
        left: 58.33333333%
    }

    .col-md-push-6 {
        left: 50%
    }

    .col-md-push-5 {
        left: 41.66666667%
    }

    .col-md-push-4 {
        left: 33.33333333%
    }

    .col-md-push-3 {
        left: 25%
    }

    .col-md-push-2 {
        left: 16.66666667%
    }

    .col-md-push-1 {
        left: 8.33333333%
    }

    .col-md-push-0 {
        left: auto
    }

    .col-md-offset-12 {
        margin-left: 100%
    }

    .col-md-offset-11 {
        margin-left: 91.66666667%
    }

    .col-md-offset-10 {
        margin-left: 83.33333333%
    }

    .col-md-offset-9 {
        margin-left: 75%
    }

    .col-md-offset-8 {
        margin-left: 66.66666667%
    }

    .col-md-offset-7 {
        margin-left: 58.33333333%
    }

    .col-md-offset-6 {
        margin-left: 50%
    }

    .col-md-offset-5 {
        margin-left: 41.66666667%
    }

    .col-md-offset-4 {
        margin-left: 33.33333333%
    }

    .col-md-offset-3 {
        margin-left: 25%
    }

    .col-md-offset-2 {
        margin-left: 16.66666667%
    }

    .col-md-offset-1 {
        margin-left: 8.33333333%
    }

    .col-md-offset-0 {
        margin-left: 0
    }
}

@media (min-width:1200px) {

    .col-lg-1,
    .col-lg-10,
    .col-lg-11,
    .col-lg-12,
    .col-lg-2,
    .col-lg-3,
    .col-lg-4,
    .col-lg-5,
    .col-lg-6,
    .col-lg-7,
    .col-lg-8,
    .col-lg-9 {
        float: left
    }

    .col-lg-12 {
        width: 100%
    }

    .col-lg-11 {
        width: 91.66666667%
    }

    .col-lg-10 {
        width: 83.33333333%
    }

    .col-lg-9 {
        width: 75%
    }

    .col-lg-8 {
        width: 66.66666667%
    }

    .col-lg-7 {
        width: 58.33333333%
    }

    .col-lg-6 {
        width: 50%
    }

    .col-lg-5 {
        width: 41.66666667%
    }

    .col-lg-4 {
        width: 33.33333333%
    }

    .col-lg-3 {
        width: 25%
    }

    .col-lg-2 {
        width: 16.66666667%
    }

    .col-lg-1 {
        width: 8.33333333%
    }

    .col-lg-pull-12 {
        right: 100%
    }

    .col-lg-pull-11 {
        right: 91.66666667%
    }

    .col-lg-pull-10 {
        right: 83.33333333%
    }

    .col-lg-pull-9 {
        right: 75%
    }

    .col-lg-pull-8 {
        right: 66.66666667%
    }

    .col-lg-pull-7 {
        right: 58.33333333%
    }

    .col-lg-pull-6 {
        right: 50%
    }

    .col-lg-pull-5 {
        right: 41.66666667%
    }

    .col-lg-pull-4 {
        right: 33.33333333%
    }

    .col-lg-pull-3 {
        right: 25%
    }

    .col-lg-pull-2 {
        right: 16.66666667%
    }

    .col-lg-pull-1 {
        right: 8.33333333%
    }

    .col-lg-pull-0 {
        right: auto
    }

    .col-lg-push-12 {
        left: 100%
    }

    .col-lg-push-11 {
        left: 91.66666667%
    }

    .col-lg-push-10 {
        left: 83.33333333%
    }

    .col-lg-push-9 {
        left: 75%
    }

    .col-lg-push-8 {
        left: 66.66666667%
    }

    .col-lg-push-7 {
        left: 58.33333333%
    }

    .col-lg-push-6 {
        left: 50%
    }

    .col-lg-push-5 {
        left: 41.66666667%
    }

    .col-lg-push-4 {
        left: 33.33333333%
    }

    .col-lg-push-3 {
        left: 25%
    }

    .col-lg-push-2 {
        left: 16.66666667%
    }

    .col-lg-push-1 {
        left: 8.33333333%
    }

    .col-lg-push-0 {
        left: auto
    }

    .col-lg-offset-12 {
        margin-left: 100%
    }

    .col-lg-offset-11 {
        margin-left: 91.66666667%
    }

    .col-lg-offset-10 {
        margin-left: 83.33333333%
    }

    .col-lg-offset-9 {
        margin-left: 75%
    }

    .col-lg-offset-8 {
        margin-left: 66.66666667%
    }

    .col-lg-offset-7 {
        margin-left: 58.33333333%
    }

    .col-lg-offset-6 {
        margin-left: 50%
    }

    .col-lg-offset-5 {
        margin-left: 41.66666667%
    }

    .col-lg-offset-4 {
        margin-left: 33.33333333%
    }

    .col-lg-offset-3 {
        margin-left: 25%
    }

    .col-lg-offset-2 {
        margin-left: 16.66666667%
    }

    .col-lg-offset-1 {
        margin-left: 8.33333333%
    }

    .col-lg-offset-0 {
        margin-left: 0
    }
}

.clearfix:after,
.clearfix:before,
.container-fluid:after,
.container-fluid:before,
.container:after,
.container:before,
.rblock-definitions:after,
.rblock-definitions:before,
.rblock:after,
.rblock:before,
.row:after,
.row:before,
.scale-cards__header:after,
.scale-cards__header:before,
.section--explore:after,
.section--explore:before,
.section--inspire:after,
.section--inspire:before,
.section--light:after,
.section--light:before {
    content: " ";
    display: table
}

.clearfix:after,
.container-fluid:after,
.container:after,
.rblock-definitions:after,
.rblock:after,
.row:after,
.scale-cards__header:after,
.section--explore:after,
.section--inspire:after,
.section--light:after {
    clear: both
}

.center-block {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.pull-right {
    float: right !important
}

.pull-left {
    float: left !important
}

.hide {
    display: none !important
}

.show {
    display: block !important
}

.invisible {
    visibility: hidden
}

.text-hide {
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0
}

.hidden {
    display: none !important
}

.affix {
    position: fixed
}

@use "sass:map";

.fancybox-bg {
    background-color: #000
}

.fancybox-is-open .fancybox-bg {
    opacity: .8
}

.fancybox-button {
    width: 40px;
    height: 40px;
    background-color: rgba(0, 0, 0, .5);
    border-radius: 3px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition: opacity .2s, background-color .2s;
    transition: opacity .2s, background-color .2s
}

.fancybox-button:hover {
    background-color: #363636
}

.fancybox-button:disabled {
    opacity: .4 !important
}

.fancybox-button div {
    height: auto
}

.fancybox-button svg {
    height: auto;
    width: auto
}

.fancybox-toolbar {
    right: 6px;
    top: 6px
}

.fancybox-toolbar>.fancybox-button {
    margin-left: 8px
}

.fancybox-navigation .fancybox-button--arrow_left,
.fancybox-navigation .fancybox-button--arrow_right {
    border-radius: 3px;
    padding: 0;
    width: 40px;
    height: 40px;
    top: calc(50% - 20px);
    -webkit-transition: opacity .2s, background-color .2s;
    transition: opacity .2s, background-color .2s;
    background-clip: inherit
}

.fancybox-navigation .fancybox-button--arrow_right {
    right: 6px
}

.fancybox-navigation .fancybox-button--arrow_left {
    left: 6px
}

.fancybox-image {
    background-color: transparent
}

@-webkit-keyframes shine-lines {
    0% {
        background-position: -100px
    }

    40% {
        background-position: 140px
    }

    to {
        background-position: 140px
    }
}

@keyframes shine-lines {
    0% {
        background-position: -100px
    }

    40% {
        background-position: 140px
    }

    to {
        background-position: 140px
    }
}

.skeleton {
    background-image: linear-gradient(90deg, #f3f6f8, #f8f9fa 40px, #f3f6f8 80px) !important;
    background-size: 600px;
    display: inline-block;
    width: 200px;
    border-radius: 20px;
    height: 8px;
    -webkit-animation: shine-lines 1.4s linear infinite;
    animation: shine-lines 1.4s linear infinite
}

[data-aos^=fade][data-aos^=fade].aos-animate {
    -webkit-transform: none;
    transform: none
}

.g__title {
    font-size: 3.4rem;
    color: #1d1d1d;
    font-weight: 400;
    margin-top: 23px;
    margin-bottom: 40px;
    position: relative;
    z-index: 10
}

.g__title .headers__title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%
}

.g__title .headers__title--nomg {
    margin-top: 0;
    margin-bottom: 0
}

.g__title .headers__title .headers__inputs {
    width: 100%;
    resize: none;
    border: none;
    outline: none;
    border-bottom: 1px dashed #fff;
    -webkit-transition: border-bottom .25s;
    transition: border-bottom .25s;
    display: inline-block;
    overflow: hidden;
    overflow-y: hidden;
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text
}

.g__title .headers__title .headers__inputs:hover {
    border-bottom: 1px dashed #8e8e8e
}

.g__title .headers__title .headers__inputs:focus {
    border-bottom: 1px dashed #1d1d1d
}

.g__title .headers__title .headers__inputs::-webkit-input-placeholder {
    color: #000
}

.g__title .headers__title .headers__inputs::-moz-placeholder {
    color: #000
}

.g__title .headers__title .headers__inputs:-ms-input-placeholder {
    color: #000
}

.g__title .headers__title .headers__inputs::-ms-input-placeholder {
    color: #000
}

.g__title .headers__title .headers__inputs::placeholder {
    color: #000
}

.g__title.center {
    text-align: center
}

.g__title.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-right: 0;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap
}

.g__title.flex .main__title {
    -webkit-box-flex: 2;
    -ms-flex-positive: 2;
    flex-grow: 2;
    max-width: 100%;
    width: calc(100% - 100px);
    padding-right: 0;
    margin-bottom: 0
}

.g__title.flex .main__title .underline {
    width: 100%
}

.g__title.flex .main__title.nowrap {
    white-space: nowrap;
    overflow: hidden;
    padding-bottom: 10px
}

.g__title.flex .buttons__share {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media screen and (max-width:767px) {
    .g__title.flex .buttons__share {
        width: 80px
    }

    .g__title.flex .buttons__share .share__icon {
        margin: 0;
        right: auto
    }
}

.g__title.flex .share__icon {
    position: relative
}

.g__title .btn,
.g__title .method-section-add {
    vertical-align: middle;
    display: block;
    position: relative;
    padding: 8px 35px
}

@media screen and (min-width:768px) {
    .g__title {
        font-size: 3.4rem
    }

    .g__title .btn,
    .g__title .method-section-add {
        display: inline-block;
        margin-left: 20px;
        top: -5px
    }
}

.g__title h2 {
    display: inline-block;
    max-width: calc(100% - 150px)
}

@media screen and (max-width:767px) {
    .g__title {
        font-size: 2.6rem;
        padding-right: 70px;
        position: relative
    }

    .g__title .share__icon {
        position: absolute;
        right: 0;
        top: 7px;
        margin-top: 0
    }

    .g__title .share__icon.edit {
        right: 40px
    }

    .g__title .share__info {
        width: 280px;
        right: 20px
    }

    .g__title .share__info.is-active {
        width: 248px
    }

    .g__title .share__info.is-active p {
        width: 100%
    }
}

.g__title.light {
    font-weight: 300
}

.g-subtitle {
    font-size: 2.4rem;
    font-weight: 400;
    margin-top: -6px;
    margin-bottom: 20px
}

.md-wrapper,
.small-wrapper {
    margin: 0 auto;
    /*max-width: 636px;*/
    padding-left: 167px;
    padding-right: 193px;
}

.lg-wrapper {
    margin: 0 auto;
    max-width: 1040px
}

.method-popup {
    width: 100%;
    margin: 100px 0 50px 0;
    padding: 60px 20px 200px 20px;
    background: #6470bf;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 0 0 hsla(0, 0%, 87%, .5);
    box-shadow: 0 1px 0 0 hsla(0, 0%, 87%, .5);
    color: #fff;
    position: relative
}

.method-popup .method-popup__circle {
    position: absolute;
    top: -45px;
    width: 90px;
    height: 90px;
    border-radius: 50%;
    border: 24px solid #3d4792;
    background: #8fb6ff;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-box-shadow: 0 15px 18px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 15px 18px 0 rgba(0, 0, 0, .15)
}

.method-popup .method-popup__circle:before {
    content: "";
    background: url(/img/logotype-grey.435a73f1.svg) no-repeat 0 0;
    background-size: 100% 100%;
    width: 44px;
    height: 35px;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

@media screen and (max-width:767px) {
    .method-popup {
        display: none
    }
}

@media screen and (min-width:768px) {
    .method-popup {
        padding: 49px 200px 75px 60px;
        margin-left: -60px;
        width: calc(100% + 106px);
        margin-bottom: 101px
    }

    .method-popup .method-popup__circle {
        left: -45px;
        top: 93px;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }
}

@media screen and (min-width:992px) {
    .method-popup {
        padding-left: 106px;
        margin-left: -106px;
        padding-right: 243px;
        margin-top: 40px
    }

    .method-popup .method-popup__circle {
        width: 118px;
        height: 118px;
        left: -37px;
        top: 43px;
        -webkit-transform: translate(0);
        transform: translate(0);
        border-width: 29px
    }

    .method-popup .method-popup__circle:before {
        width: 62px;
        height: 50px
    }
}

.method-popup__close {
    position: absolute;
    right: 20px;
    top: 20px;
    background: url(/img/close-circle.7352e0ab.svg) no-repeat 0 0;
    border: 0;
    width: 20px;
    height: 20px;
    background-size: 100% 100%;
    border-radius: 50%;
    -webkit-transition: all .35s ease;
    transition: all .35s ease;
    outline: 0
}

.method-popup__close:hover {
    -webkit-box-shadow: 0 0 15px 0 hsla(0, 0%, 100%, .1);
    box-shadow: 0 0 15px 0 hsla(0, 0%, 100%, .1)
}

.method-popup__dsc {
    font-size: 1.6rem;
    line-height: 1.63;
    margin: 0 0 25px 0
}

.method-popup__dsc.small-width {
    max-width: 350px;
    margin: 0 auto
}

.method-popup__more {
    font-size: 1.4rem;
    font-weight: 700;
    margin: 0;
    color: #fff
}

.method-edit {
    font-size: 1.6rem;
    color: #3a3a3a;
    line-height: 2.4rem
}

.method-edit p {
    margin: 0 0 20px 0
}

@media screen and (min-width:768px) {
    .method-edit p {
        margin-bottom: 24px
    }
}

.medium-editor-element {
    outline: 0
}

.medium-editor-anchor-preview {
    margin-top: -40px
}

.text-center {
    text-align: center
}

.dragged__item[data-aos^=fade][data-aos^=fade].aos-animate {
    -webkit-transform: none !important;
    transform: none !important
}

.g__error {
    display: none;
    font-size: 12px;
    line-height: 1.25;
    letter-spacing: .3px;
    color: #d0011b;
    padding-top: 5px
}

.js-show {
    display: block
}

.g-icon-page {
    display: inline-block;
    vertical-align: middle;
    width: 16px;
    height: 20px;
    background: url(/img/file.4d4bb9e2.svg) no-repeat 0 0;
    background-size: 100% 100%;
    margin-right: 5px;
    position: relative;
    top: -1px
}

.g-modal__overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, .6);
    z-index: 1001;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.g-modal__overlay.js-active {
    opacity: 1;
    visibility: visible
}

.g-switch {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-height: 30px
}

.g-switch.inline {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.g-switch label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: center;
    position: relative;
    border: 1px solid #f2f2f2;
    min-height: 40px;
    overflow: hidden;
    margin-right: -1px;
    cursor: pointer;
    padding: 0 30px;
    -webkit-transition: all .4s ease;
    transition: all .4s ease
}

.g-switch label:first-child {
    border-radius: 40px 0 0 40px
}

.g-switch label:last-child {
    border-radius: 0 40px 40px 0
}

.g-switch label input {
    display: none
}

.g-switch label input:checked+.g-switch__txt {
    color: #fff
}

.g-switch label input:checked+.g-switch__txt:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #059fa3;
    display: block;
    z-index: -1
}

.g-switch label:hover {
    color: #037d81
}

.g-switch__txt {
    font-size: 1.4rem;
    font-weight: 400;
    letter-spacing: .2px;
    text-transform: none
}

.g-upload {
    width: 100%;
    height: 150px;
    border-radius: 3px;
    border: 1px dashed transparent;
    position: relative;
    margin-bottom: 31px;
    cursor: pointer;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    background-size: cover;
    background-position: 50%
}

.g-upload.empty {
    border-color: #d6d6d6
}

.g-upload.empty .g-upload__remove {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.g-upload.empty:after,
.g-upload.empty:before {
    content: "";
    background: rgba(75, 75, 75, .3);
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.g-upload.empty:before {
    width: 14px;
    height: 1px
}

.g-upload.empty:after {
    height: 14px;
    width: 1px
}

.g-upload.empty:hover {
    border-color: #059fa3
}

.g-upload.empty:hover:after,
.g-upload.empty:hover:before {
    background-color: #059fa3
}

.g-upload.js-guest {
    border-color: #d6d6d6
}

.g-upload.js-guest:after,
.g-upload.js-guest:before {
    display: none !important
}

.g-upload.js-guest:hover {
    border-color: #d6d6d6
}

.g-upload.js-uploading:before {
    content: "";
    height: 40px;
    width: 40px;
    border-radius: 50%;
    border: 2px solid #fff;
    border-top-color: #059fa3;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -20px 0 0 -20px;
    -webkit-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
    background: transparent
}

.g-upload.js-uploading:after {
    display: none
}

.g-upload:not(.empty):before {
    content: "";
    position: absolute;
    top: -1px;
    left: -1px;
    right: -1px;
    bottom: -1px;
    opacity: 0;
    background-color: #000;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    border-radius: 3px
}

.g-upload:not(.empty):hover:before {
    opacity: .59
}

.g-upload:not(.empty):hover .g-upload__remove {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.g-upload.small {
    display: inline-block;
    vertical-align: top;
    margin-right: 20px;
    margin-bottom: 0;
    width: 79px;
    height: 79px
}

.g-upload__remove {
    border: 0;
    background: transparent;
    position: absolute;
    top: -1px;
    right: -1px;
    padding: 0;
    outline: 0;
    width: 30px;
    height: 30px;
    display: none;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    border-radius: 0 0 0 3px
}

.g-upload__remove svg {
    display: block;
    height: 12px
}

.g-upload__remove svg path {
    fill: #fff
}

.g-upload__remove:hover {
    background: #059fa3
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg)
    }
}

.editmode__bar {
    background: #fff;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    -webkit-box-shadow: 0 -17px 18px 0 hsla(0, 0%, 64%, .06);
    box-shadow: 0 -17px 18px 0 hsla(0, 0%, 64%, .06);
    padding: 9px 0;
    text-align: center;
    z-index: 99
}

.editmode__bar .btn,
.editmode__bar .method-section-add {
    margin: 0 20px
}

@media screen and (min-width:768px) {

    .editmode__bar .btn,
    .editmode__bar .method-section-add {
        min-width: 320px;
        margin: 0 40px
    }
}

.editmode__bar.skip-intro {
    z-index: 9001
}

.g-progressbar {
    width: 597px;
    height: 8px;
    background-color: #f8f9fa;
    border-radius: 10px;
    position: relative
}

.g-progressbar--text {
    margin-right: 68px
}

.g-progressbar__bar {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    border-radius: 10px;
    background-color: #05a0a4;
    -webkit-transition: all .2s;
    transition: all .2s
}

.g-progressbar__text {
    position: absolute;
    right: -68px;
    top: 50%;
    line-height: 14px;
    font-size: 14px;
    color: #aaaab5;
    margin-top: -7px;
    font-weight: 600;
    text-align: right
}

.tip-wrapper {
    position: relative
}

.tip-wrapper.edit-btn:before {
    content: "";
    position: absolute;
    right: 3px;
    top: 5px;
    background-color: #4b5761;
    border: 5px solid #fff;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    z-index: 5
}

@media screen and (max-width:991px) {
    .tip-wrapper.edit-btn:before {
        width: 15px;
        height: 15px;
        border-width: 3px;
        right: 30px
    }
}

.tip-wrapper.overlay:before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    opacity: .8;
    z-index: 9000
}

.tip-wrapper.overlay>:first-child {
    z-index: 9004;
    position: relative
}

.tip-wrapper.overlay .tip-tooltip {
    z-index: 9005 !important
}

.tip-wrapper.overlay.all>* {
    z-index: 9004;
    position: relative
}

.tip-tooltip {
    position: absolute !important;
    background: #fff;
    border-radius: 4px;
    -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
    background-color: #fff;
    border: 1px solid #e0e0e0;
    z-index: 1001;
    width: 292px;
    padding: 16px 30px;
    text-align: center;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

@media screen and (max-width:767px) {
    .tip-tooltip {
        left: auto;
        -webkit-transform: none;
        transform: none;
        right: 0
    }
}

.tip-tooltip[data-position=bottom] {
    top: calc(100% + 25px)
}

.tip-tooltip p {
    font-size: 14px;
    line-height: 1.43;
    color: #646464;
    margin: 5px 0 0
}

.tip-tooltip button {
    border: 0;
    background: #f8f9fa;
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .2px;
    color: #252729;
    margin: 24px -30px -16px;
    display: block;
    width: calc(100% + 60px);
    border-radius: 0 0 4px 4px;
    padding: 13px 15px;
    outline: 0;
    -webkit-transition: .3s ease;
    transition: .3s ease
}

.tip-tooltip button:hover {
    background-color: #e9ecef
}

.icon-locked {
    width: 13px;
    background: url(/img/lock.fb8ab9ff.svg) no-repeat 0 0
}

.icon-locked,
.icon-locked-green {
    height: 15px;
    display: inline-block;
    vertical-align: middle;
    margin: 0 4px 0 0;
    position: relative;
    top: -2px
}

.icon-locked-green {
    width: 11px;
    background: url(/img/lock-green.5c96e608.svg) no-repeat 0 0
}

.input-base {
    border: 0;
    outline: 0
}

.input-base::-webkit-input-placeholder {
    color: #d0d0d0
}

.input-base:-moz-placeholder,
.input-base::-moz-placeholder {
    color: #d0d0d0
}

.input-base:-ms-input-placeholder {
    color: #d0d0d0
}

.page-title {
    margin-top: 42px !important;
    height: 41px !important
}

.dl-info {
    font-size: 1.6rem
}

.dl-info dt {
    float: left;
    padding: 12px 0
}

.dl-info dd {
    border-bottom: 1px solid #f2f2f2;
    text-align: right;
    padding: 12px 0;
    margin: 0
}

.dl-info dd:last-child {
    border-bottom: 0
}

.link {
    cursor: pointer;
    -webkit-transition: color .2s;
    transition: color .2s
}

.link:hover {
    text-decoration: none
}

.link--dark {
    color: #3b3b3b
}

.link--dark:hover {
    color: #aaaab5
}

.link--primary {
    color: #06a1a5;
    font-weight: 700
}

.progress-bar {
    height: 8px;
    border-radius: 10px;
    display: block;
    background-color: #f8f9fa
}

.progress-bar__bar {
    display: block;
    height: 100%;
    border-radius: 200px;
    background-color: #000000;
    width: 20%;
    -webkit-transition: all .2s;
    transition: all .2s
}

@-webkit-keyframes drag-static-fallback-anim {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
        box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08)
    }

    to {
        -webkit-transform: rotate(-2deg);
        transform: rotate(-2deg);
        -webkit-box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21);
        box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21)
    }
}

@keyframes drag-static-fallback-anim {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
        box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08)
    }

    to {
        -webkit-transform: rotate(-2deg);
        transform: rotate(-2deg);
        -webkit-box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21);
        box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21)
    }
}

.drag-fallback-with-padding {
    opacity: 1 !important;
    margin: 0;
    padding: 0;
    position: relative;
    list-style: none
}

.drag-fallback-with-padding>* {
    background-color: #fff;
    position: relative;
    height: auto !important;
    -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
    -webkit-animation: drag-static-fallback-anim .3s;
    animation: drag-static-fallback-anim .3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    border-radius: 5px;
    overflow: hidden;
    padding: 0 10px !important;
    margin: 0 -10px !important
}

.drag-static-ghost {
    height: 0;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important
}

.drag-static-ghost>* {
    display: none !important
}

.drag-static-ghost:before {
    content: "";
    position: absolute;
    height: 4px !important;
    background-color: #f0f2f5 !important;
    border-radius: 2px !important;
    left: 0;
    right: 0;
    top: -2px
}

.drag-static-fallback {
    opacity: 1 !important;
    margin: 0;
    padding: 0;
    position: relative;
    list-style: none
}

.drag-static-fallback>* {
    background-color: #fff;
    position: relative;
    height: auto !important;
    -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
    -webkit-animation: drag-static-fallback-anim .3s;
    animation: drag-static-fallback-anim .3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    padding: 10px !important;
    margin: -10px !important;
    overflow: hidden
}

.drag-static-fallback .ql-selection-preview,
.drag-static-fallback .ql-tooltip {
    display: none
}

.drag-static-clone {
    opacity: .4
}

.drag-static-clone .methods__question-edit {
    background-color: #dce7ec
}

.drag-static-clone--left .methods__question-edit {
    background-color: #edf0f2
}

.powered-by {
    position: fixed;
    left: 13px;
    bottom: 17px;
    background-color: #f3f6f8;
    border-radius: 3px;
    white-space: nowrap;
    font-size: 16px;
    padding: 5px 12px;
    z-index: 10000
}

.powered-by,
.powered-by:hover {
    color: #3b3b3b;
    text-decoration: none
}

.powered-by:hover {
    background-color: #edf1f4
}

.powered-by strong {
    font-weight: 600
}

.drag-ghost {
    background-color: #dce7ec !important;
    border-radius: 2px !important;
    display: block !important
}

.drag-ghost>* {
    opacity: 0
}

.drag-ghost-faded {
    opacity: .3
}

.drag-fallback {
    opacity: 1 !important;
    margin: 0;
    padding: 0;
    position: relative;
    list-style: none
}

.drag-fallback>* {
    background-color: #fff;
    position: relative;
    height: auto !important;
    -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
    -webkit-animation: drag-static-fallback-anim .3s;
    animation: drag-static-fallback-anim .3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    border-radius: 5px;
    overflow: hidden
}

.drag-static-clone {
    pointer-events: none;
    background-color: #dce7ec
}

.drag-static-clone>* {
    visibility: hidden
}

.drag-static-clone .methods__question-edit {
    background-color: #dce1e5;
    border-radius: 3px;
    margin-left: -67px
}

.drag-static-clone .methods__question-edit:after,
.drag-static-clone .methods__question-edit:before,
.drag-static-clone .methods__question-edit>* {
    opacity: 0
}

.drag-static-clone--left .methods__question-edit {
    background-color: #dce7ec
}

.drag-static-fallback .hide-in-drag-fallback,
.show-in-drag-fallback {
    display: none
}

.drag-static-fallback .show-in-drag-fallback {
    display: block
}

.drag-static-clone+.drag-static-ghost {
    height: 0 !important
}

.light-info {
    text-align: center;
    background-color: #f8f9fa;
    padding: 18px 34px;
    color: #41484f;
    max-width: 810px;
    margin: 0 auto
}

.light-info .link {
    margin-left: 29px
}

.counted-column-list {
    list-style: none;
    padding: 0;
    margin: 0;
    counter-reset: counter-column-count;
    margin-left: -8px
}

.counted-column-list__col {
    width: 33.333%;
    padding-left: 8px;
    position: relative;
    float: left
}

.counted-column-list>li,
.counted-column-list__item {
    background-color: #f8f9fa;
    padding: 16px;
    padding-left: 43px;
    position: relative;
    counter-increment: counter-column-count;
    margin-bottom: 4px;
    font-size: 16px;
    page-break-inside: avoid;
    display: inline-block;
    width: 100%
}

.counted-column-list>li:before,
.counted-column-list__item:before {
    content: counter(counter-column-count, decimal-leading-zero);
    position: absolute;
    left: 16px;
    top: 16px;
    color: rgba(59, 59, 59, .5)
}

.image-placeholder {
    padding-bottom: 70%;
    border-radius: 7px;
    background-color: #f0f2f5;
    color: rgba(59, 59, 59, .5);
    font-size: 56px;
    position: relative
}

.image-placeholder .icon {
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -28px 0 0 -28px
}

.method-icon[data-method=competitor-analysis],
.method-icon[data-method=custom-method],
.method-icon[data-method=expert-interview],
.method-icon[data-method=notepad-method],
.method-icon[data-method=own-ideation],
.method-icon[data-method=own-inspiration],
.method-icon[data-method=own],
.method-icon[data-method=stakeholder-interview],
.method-icon[data-method=user-interview],
[data-method-color=competitor-analysis],
[data-method-color=custom-method],
[data-method-color=expert-interview],
[data-method-color=notepad-method],
[data-method-color=own-ideation],
[data-method-color=own-inspiration],
[data-method-color=own],
[data-method-color=stakeholder-interview],
[data-method-color=user-interview] {
    background: #192262;
    color: #fff
}

.method-icon[data-method=flows-method],
.method-icon[data-method=personas-method],
.method-icon[data-method=problem-definition],
.method-icon[data-method=problem-valuation],
.method-icon[data-method=solution-definition],
.method-icon[data-method=solution-valuation],
[data-method-color=flows-method],
[data-method-color=personas-method],
[data-method-color=problem-definition],
[data-method-color=problem-valuation],
[data-method-color=solution-definition],
[data-method-color=solution-valuation] {
    background: #194962;
    color: #fff
}

.method-icon[data-method=interactive-prototype],
.method-icon[data-method=paper-prototype],
[data-method-color=interactive-prototype],
[data-method-color=paper-prototype] {
    background: #4f1962;
    color: #fff
}

div[data-avatar="0"],
span[data-avatar="0"] {
    background: #f3ce9b;
    color: #e59629
}

div[data-avatar="1"],
span[data-avatar="1"] {
    background: #b7e2e3;
    color: #5bbdbf
}

div[data-avatar="2"],
span[data-avatar="2"] {
    background: #ddb7e3;
    color: #b25bbf
}

div[data-avatar="3"],
span[data-avatar="3"] {
    background: #9bbdf3;
    color: #2972e5
}

div[data-avatar="4"],
span[data-avatar="4"] {
    background: #e3b7b7;
    color: #bf5b5b
}

div[data-avatar="5"],
span[data-avatar="5"] {
    background: #bcb7e3;
    color: #675bbf
}

div[data-avatar="6"],
span[data-avatar="6"] {
    background: #aae19a;
    color: #58c23a
}

div[data-avatar="7"],
span[data-avatar="7"] {
    background: #b7d3e3;
    color: #5b9bbf
}

div[data-avatar="8"],
span[data-avatar="8"] {
    background: #dbe3b7;
    color: #adbf5b
}

div[data-avatar="9"],
span[data-avatar="9"] {
    background: #f7f7f7;
    color: #f7f7f7
}

body,
html {
    font-family: 'Plus Jakarta Sans', 'Inter', Lato, Helvetica, Tahoma, Arial, sans-serif;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale;
    font-size: 10px;
    min-height: 100vh
}

body {
    background: #fff;
    color: #222222;
    font-weight: 400;
    overflow-y: scroll !important;
    overflow-x: hidden
}

body.compensate-for-scrollbar,
body.modal-open {
    overflow: hidden !important
}

body.white-bg {
    background: #fff
}

.body-grey {
    background-color: #fbfdfd
}

#app {
    max-width: 100%;
    -webkit-transition: margin-left .3s;
    transition: margin-left .3s
}

::-moz-selection {
    background: #b6d8fc;
    color: inherit
}

::selection {
    background: #b6d8fc;
    color: inherit
}

.col-main {
    width: 100%;
    float: left
}

@media screen and (min-width:768px) {
    .col-main {
        width: 70%;
        padding-right: 8%
    }
}

@media screen and (min-width:992px) {
    .col-main {
        padding-right: 10%
    }
}

@-webkit-keyframes colAside {
    0% {
        right: -100px
    }

    to {
        right: 0
    }
}

@keyframes colAside {
    0% {
        right: -100px
    }

    to {
        right: 0
    }
}

.col-aside {
    width: 30%;
    float: right;
    -webkit-animation: colAside .6s ease forwards;
    animation: colAside .6s ease forwards
}

@media screen and (max-width:767px) {
    .col-aside {
        display: none
    }
}

@media screen and (min-width:1200px) {
    .col-aside {
        display: block;
        position: relative;
        padding-left: 100px
    }
}

.link-underline {
    position: relative
}

.link-underline:before {
    position: absolute;
    content: "";
    width: 0;
    right: 0;
    left: auto;
    bottom: -3px;
    height: 2px;
    background: #f07320;
    display: block;
    -webkit-transition: all .2s ease;
    transition: all .2s ease
}

.link-underline:hover {
    text-decoration: none
}

.link-underline:hover:before {
    right: auto;
    left: 0;
    width: 100%
}

.greyscale {
    filter: gray;
    opacity: .7
}

.container.flex .row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: stretch;
    -ms-flex-pack: stretch;
    justify-content: stretch
}

.hidden-mobile {
    display: none !important
}

@media screen and (min-width:768px) {
    .hidden-mobile {
        display: inline-block !important
    }
}

.show-mobile {
    display: none !important
}

@media screen and (max-width:767px) {
    .show-mobile {
        display: inline-block !important
    }
}

.mt-md {
    margin-top: 46px
}

.pre-wrap {
    white-space: pre-wrap
}

.btn,
.method-section-add {
    padding: 10px 30px;
    border-radius: 4px;
    font-size: 1.25rem;
    font-weight: 600;
    letter-spacing: .2px;
    color: #252729;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    display: inline-block;
    cursor: pointer;
    outline: 0;
    overflow: hidden;
    position: relative;
    text-align: center
}

.btn--nowrap {
    white-space: nowrap
}

.btn--uppercase {
    text-transform: uppercase
}

.btn:hover,
.method-section-add:hover {
    text-decoration: none
}

.btn__body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.btn__icon {
    font-size: 22px;
    margin-right: 14px
}

.btn--disabled,
.btn[disabled],
.method-section-add[disabled] {
    opacity: .5;
    cursor: default
}

.btn.loading:before,
.loading.method-section-add:before {
    content: "";
    height: 40px;
    width: 40px;
    border-radius: 50%;
    border: 2px solid #fff;
    border-top-color: #fa8c25;
    display: block;
    position: absolute;
    top: 50%;
    left: 20%;
    margin: -20px 0 0 -20px;
    -webkit-animation: spin 1s linear infinite;
    animation: spin 1s linear infinite;
    background: transparent
}

.btn.loading:after,
.loading.method-section-add:after {
    display: none
}

.btn--big {
    padding: 15px 50px;
    min-width: 280px
}

.btn--light {
    color: #3b3b3b
}

.btn--light:hover {
    color: #aaaab5
}

.btn--corners {
    border-radius: 6px
}

.btn--new-corners {
    border-radius: 4px
}

.btn--has-icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.btn--has-icon>.icon {
    margin-right: 14px;
    font-size: 22px
}

.btn--move {
    border: 2px solid #fa8c25
}

.btn--move:before {
    content: "";
    width: calc(100% + 2px);
    height: 0%;
    bottom: -1px;
    left: -1px;
    z-index: 0;
    background: #fff;
    position: absolute;
    -webkit-transition: all .4s ease;
    transition: all .4s ease
}

.btn--move:hover,
.btn--move:hover span {
    color: #fa8c25
}

.btn--move:hover:before {
    height: calc(100% + 2px)
}

.btn--warn {
    background: #d0021b;
    color: #fff
}

.btn--warn:hover {
    background: #9d0214
}

.btn--warn:active {
    background: #840111
}

.btn--orange {
    background: #059fa3;
    color: #fff;
    border-radius: 4px;
    border-color: #059fa3
}

.btn--orange:hover {
    background: #036f72;
    border-color: #036f72;
    color: #fff
}

.btn--orange:active {
    background: #035759;
    border-color: #035759
}

.btn--orange[disabled] {
    background: #abc0c8;
    border-color: #abc0c8
}

.btn--primary {
    background: #059fa3;
    color: #fff;
    border-radius: 4px;
    border-color: #059fa3
}

.btn--primary:focus,
.btn--primary:hover {
    background: #036f72;
    border-color: #036f72;
    color: #fff
}

.btn--primary:active {
    background: #035759;
    border-color: #035759
}

.btn--primary[disabled] {
    background: #abc0c8;
    border-color: #abc0c8
}

.btn--new-primary {
    background: #059fa3;
    color: #fff;
    border-radius: 4px;
    border-color: #059fa3
}

.btn--new-primary:focus,
.btn--new-primary:hover {
    background: #036f72;
    border-color: #036f72;
    color: #fff
}

.btn--new-primary:active {
    background: #035759;
    border-color: #035759
}

.btn--new-primary[disabled] {
    background: #abc0c8;
    border-color: #abc0c8
}

.btn--grey {
    background: #abc0c8;
    color: #fff
}

.btn--grey.no-hover:hover {
    background: #abc0c8 !important;
    color: #fff !important;
    cursor: default
}

.btn--grey.btn--move {
    border-color: #abc0c8
}

.btn--grey.btn--move:hover span {
    color: #abc0c8
}

.btn--outline {
    border: 1px solid #f0f2f5;
    font-size: 14px;
    font-weight: 700;
    color: #3b3b3b;
    border-radius: 4px
}

.btn--outline.js-active,
.btn--outline:hover {
    border-color: #dfe2e8
}

.btn--outline:active {
    background-color: #f8f9fa;
    border-color: #dfe2e8
}

.btn--sm-outline {
    border: 1px solid #dae1e6;
    font-size: 14px;
    font-weight: 400;
    color: #555;
    border-radius: 4px;
    background-color: transparent
}

.btn--sm-outline.js-active,
.btn--sm-outline:hover {
    border-color: #86909a;
    color: #4b5761
}

.btn--light-shadow {
    -webkit-box-shadow: 0 2px 14px rgba(0, 0, 0, .08), 0 30px 154px rgba(0, 0, 0, .11);
    box-shadow: 0 2px 14px rgba(0, 0, 0, .08), 0 30px 154px rgba(0, 0, 0, .11)
}

.btn--block {
    width: 100%
}

.btn--light {
    font-weight: 400
}

.btn--icon {
    width: 42px;
    height: 42px;
    border-radius: 3px
}

.btn--icon:hover {
    background-color: #f3f6f8
}

.btn--icon:active {
    background-color: #dae1e6
}

.buttons__share {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    top: -10px
}

@media screen and (max-width:767px) {
    .buttons__share {
        padding-top: 10px;
        top: 0;
        position: static
    }
}

.buttons__share .btn,
.buttons__share .method-section-add {
    display: inline-block;
    vertical-align: middle;
    padding: 6px 15px;
    font-size: 1.4rem;
    font-weight: 700;
    text-transform: none;
    height: 40px;
    margin-top: 15px;
    top: auto !important;
    min-width: 90px;
    white-space: nowrap
}

.buttons__share .btn:hover,
.buttons__share .method-section-add:hover {
    background: #e76610
}

.btn--sm {
    padding: .5em 1em;
    font-size: 14px
}

.btn--smd {
    padding: 1em 2em;
    font-size: 16px
}

.btn--md {
    font-size: 1.6rem;
    padding: 13px 50px
}

@media only screen and (max-width:480px) {
    .btn--hide {
        display: none
    }
}

@media only screen and (max-width:767px) {
    .buttons__share .btn--grey {
        margin-top: 0
    }
}

.btn--loading.method-section-add,
.btn.btn--loading {
    position: relative;
    background-color: #d6e0e4 !important;
    border-color: #d6e0e4 !important;
    opacity: 1;
    color: transparent
}

.btn--loading.method-section-add .icon,
.btn.btn--loading .icon {
    color: transparent
}

.btn--loading.method-section-add .base-spinner,
.btn.btn--loading .base-spinner {
    position: absolute;
    padding: 0;
    left: 50%;
    top: 50%;
    right: auto;
    bottom: auto;
    margin: -13px 0 0 -13px;
    background-color: transparent
}

.icon {
    display: inline-block;
    width: 1.2em;
    height: 1.2em;
    line-height: 1
}

.icon img,
.icon svg {
    width: 100%;
    height: 100%;
    fill: currentColor;
    vertical-align: top
}

.icon--auto,
.icon--auto img,
.icon--auto svg {
    width: auto;
    height: auto
}

.icon--flip-x {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1)
}

.icon--box {
    background-color: #f0f2f5;
    border-radius: .12em;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.icon--box svg {
    width: 62.5%;
    height: 62.5%;
    vertical-align: top;
    fill: #4b4b4b
}

.icon--box.icon--plus-12 svg {
    width: 40%;
    height: 40%
}

.icon--box.icon--green {
    background-color: #65c061;
    fill: #fff
}

.icon--box.icon--blue {
    background-color: #5782cb;
    fill: #fff
}

.icon--box.icon--cyan {
    background-color: #53b7cb;
    fill: #fff
}

.icon--box.icon--violet {
    background-color: #9f55b1;
    fill: #fff
}

.icon--box.icon--gray-500 {
    background-color: #dfe2e8;
    fill: #fff
}

.icon--box.icon--red {
    background-color: #e5411d;
    fill: #fff
}

.icon--box.icon--transparent {
    background-color: transparent;
    fill: #dfe2e8
}

.icon--add {
    background-image: url(/img/plus-small.68273311.svg);
    background-position: 50%;
    background-repeat: no-repeat
}

.icon--logotype,
.icon--logotype svg {
    color: #f67222 !important;
    fill: currentColor !important
}

.titled-icon {
    position: relative;
    -webkit-box-shadow: none;
    box-shadow: none;
    display: inline-block;
    line-height: 1em;
    border: 0;
    margin: 0;
    padding: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: transparent
}

.titled-icon,
.titled-icon:hover {
    color: inherit
}

.titled-icon:focus {
    outline: none;
    color: inherit
}

.titled-icon__text {
    opacity: 0;
    position: absolute;
    bottom: -18px;
    left: 50%;
    -webkit-transform: translate(-50%, 10px);
    transform: translate(-50%, 10px);
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    pointer-events: none;
    text-transform: uppercase;
    font-size: 1rem;
    letter-spacing: .075rem
}

.titled-icon:hover .titled-icon__text {
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    opacity: 1
}

.icon--book-open,
.titled-icon .icon--book-open {
    width: 1.15em
}

.tag-color-icon {
    display: inline-block;
    width: 1em;
    height: 1em;
    border-radius: 50%
}

.slider-target {
    width: 100%;
    display: block;
    padding: 0;
    height: 18px
}

.slider-target:active .slider-handle,
.slider-target:hover .slider-handle {
    opacity: 1
}

.slider-base {
    margin: 4px 0;
    height: 10px;
    border-radius: 10px;
    -webkit-transition: background .2s;
    transition: background .2s
}

.slider-tooltip {
    background-color: #282b35;
    border-color: #282b35
}

.slider-connect {
    border-radius: 10px;
    -webkit-transition: background .2s;
    transition: background .2s
}

.slider-handle,
.slider-horizontal .slider-handle {
    background-image: url(/img/chevron-slide.e10f7405.svg);
    background-repeat: no-repeat;
    background-position: 50%;
    -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, .2);
    box-shadow: 0 4px 8px rgba(0, 0, 0, .2);
    width: 18px;
    height: 18px;
    border: 0;
    opacity: 0;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.range-slider-fill {
    background-color: transparent
}

.range-slider--minimal {
    height: 10px
}

.range-slider--minimal .range-slider-inner {
    vertical-align: top
}

.range-slider--minimal .range-slider-fill,
.range-slider--minimal .range-slider-rail {
    height: 1px;
    border-radius: 10px;
    -webkit-transition: background .2s;
    transition: background .2s
}

.range-slider--minimal .range-slider-fill {
    background-color: #007b83
}

.range-slider--minimal .range-slider-knob {
    background: #007b83;
    width: 10px;
    height: 10px;
    opacity: 1;
    -webkit-box-shadow: 0 0 0 2px #f8f9fa;
    box-shadow: 0 0 0 2px #f8f9fa
}

.tooltip {
    position: relative
}

.tooltip__tip-position {
    left: 0;
    top: 0;
    position: absolute;
    z-index: 970;
    cursor: default;
    pointer-events: none;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato, Helvetica, Tahoma, Arial, sans-serif;
    font-weight: 400;
    text-align: left
}

.tooltip__arrow {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    -webkit-transition: opacity .3s;
    transition: opacity .3s;
    height: 16px;
    width: 16px;
    display: none
}

.tooltip--visible .tooltip__arrow {
    opacity: 1
}

.tooltip__tip {
    position: relative
}

.tooltip__tip:after,
.tooltip__tip:before {
    display: table;
    width: 100%;
    content: ""
}

.tooltip__tip-title {
    margin-bottom: 4px;
    font-weight: 600
}

.tooltip--click {
    cursor: pointer
}

.tooltip--click>.tooltip__tip-position,
.tooltip--no-behaviour>.tooltip__tip-position {
    pointer-events: auto
}

.tooltip__tip-position[data-popper-placement^=top]>.tooltip__tip>.tooltip__arrow {
    bottom: -13px
}

.tooltip__tip-position[data-popper-placement^=bottom]>.tooltip__tip>.tooltip__arrow {
    top: -13px;
    -webkit-transform: scaleY(-1);
    transform: scaleY(-1)
}

.tooltip__tip-position[data-popper-placement^=left]>.tooltip__tip>.tooltip__arrow {
    right: -13px;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

.tooltip__tip-position[data-popper-placement^=right]>.tooltip__tip>.tooltip__arrow {
    left: -13px;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg)
}

.tooltip--default>.tooltip__tip-position>.tooltip__tip {
    border-radius: 3px;
    background-color: #3d3d3d;
    font-size: 1rem;
    font-weight: 700;
    color: #fff;
    white-space: nowrap;
    padding: 2px 7px
}

.tooltip--default>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:after,
.tooltip--default>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:before {
    content: "";
    border: 5px solid transparent;
    position: absolute;
    left: 3px;
    top: 3px
}

.tooltip--default>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:before {
    border-top-color: #333536
}

.tooltip--default>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:after {
    border-top-color: #333536;
    -webkit-transform: translateY(-1.6px);
    transform: translateY(-1.6px)
}

.tooltip--light-box-md>.tooltip__tip-position>.tooltip__tip,
.tooltip--light-box-menu>.tooltip__tip-position>.tooltip__tip,
.tooltip--light-box-wide>.tooltip__tip-position>.tooltip__tip,
.tooltip--light-box-workspace-selector>.tooltip__tip-position>.tooltip__tip,
.tooltip--light-box>.tooltip__tip-position>.tooltip__tip {
    border-radius: 3px;
    -webkit-box-shadow: 0 12px 23px rgba(0, 0, 0, .08);
    box-shadow: 0 12px 23px rgba(0, 0, 0, .08);
    background-color: #fff;
    color: #3b3b3b
}

.tooltip--light-box-md>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:after,
.tooltip--light-box-md>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:before,
.tooltip--light-box-menu>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:after,
.tooltip--light-box-menu>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:before,
.tooltip--light-box-wide>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:after,
.tooltip--light-box-wide>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:before,
.tooltip--light-box-workspace-selector>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:after,
.tooltip--light-box-workspace-selector>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:before,
.tooltip--light-box>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:after,
.tooltip--light-box>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:before {
    content: "";
    border: 5px solid transparent;
    position: absolute;
    left: 3px;
    top: 3px
}

.tooltip--light-box-md>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:before,
.tooltip--light-box-menu>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:before,
.tooltip--light-box-wide>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:before,
.tooltip--light-box-workspace-selector>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:before,
.tooltip--light-box>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:before {
    border-top-color: hsla(0, 0%, 93%, .62)
}

.tooltip--light-box-md>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:after,
.tooltip--light-box-menu>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:after,
.tooltip--light-box-wide>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:after,
.tooltip--light-box-workspace-selector>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:after,
.tooltip--light-box>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:after {
    border-top-color: #fff;
    -webkit-transform: translateY(-1.6px);
    transform: translateY(-1.6px)
}

.tooltip--light-box-menu>.tooltip__tip-position>.tooltip__tip {
    width: 260px
}

.tooltip--light-box-workspace-selector>.tooltip__tip-position>.tooltip__tip {
    width: 255px
}

.tooltip--light-box-wide>.tooltip__tip-position>.tooltip__tip {
    width: 400px
}

.tooltip--light-box-md>.tooltip__tip-position>.tooltip__tip {
    width: 307px
}

.tooltip--dark>.tooltip__tip-position>.tooltip__tip {
    border-radius: 3px;
    -webkit-box-shadow: 0 15px 18px 0 rgba(0, 0, 0, .06);
    box-shadow: 0 15px 18px 0 rgba(0, 0, 0, .06);
    background-color: #333536;
    color: #fff
}

.tooltip--dark>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:after,
.tooltip--dark>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:before {
    content: "";
    border: 5px solid transparent;
    position: absolute;
    left: 3px;
    top: 3px
}

.tooltip--dark>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:before {
    border-top-color: #333536
}

.tooltip--dark>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:after {
    border-top-color: #333536;
    -webkit-transform: translateY(-1.6px);
    transform: translateY(-1.6px)
}

.tooltip--light>.tooltip__tip-position {
    width: 300px;
    max-width: 100vw
}

.tooltip--light>.tooltip__tip-position>.tooltip__tip {
    border-radius: 3px;
    -webkit-box-shadow: 0 15px 18px 0 rgba(0, 0, 0, .06);
    box-shadow: 0 15px 18px 0 rgba(0, 0, 0, .06);
    border: 1px solid hsla(0, 0%, 93%, .62);
    background-color: #fff;
    color: #3b3b3b;
    padding: 20px;
    font-size: 1.4rem;
    line-height: 1.5
}

.tooltip--light>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:after,
.tooltip--light>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:before {
    content: "";
    border: 5px solid transparent;
    position: absolute;
    left: 3px;
    top: 3px
}

.tooltip--light>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:before {
    border-top-color: hsla(0, 0%, 93%, .62);
    -webkit-transform: translateY(1.6px);
    transform: translateY(1.6px)
}

.tooltip--light>.tooltip__tip-position>.tooltip__tip>.tooltip__arrow:after {
    border-top-color: #fff
}

.tooltip--light>.tooltip__tip-position>.tooltip__tip>.tooltip__tip-title {
    color: #171717
}

.tooltip-title {
    color: #414141;
    text-align: center;
    padding: 12px;
    font-size: 1.6rem;
    font-weight: 400;
    margin-bottom: 0
}

.tooltip-tabs {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-bottom: 1px solid #f2f2f2
}

.tooltip-tabs__tab {
    width: 50%;
    background: transparent;
    border: 0;
    border-radius: 0;
    display: block;
    height: 100%;
    padding: 0 22px;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .1em;
    -webkit-transition: all .2s;
    transition: all .2s
}

.tooltip-tabs__tab>span {
    -webkit-transition: all .1s;
    transition: all .1s;
    display: inline-block;
    height: 100%;
    position: relative;
    line-height: 36px
}

.tooltip-tabs__tab>span:after {
    content: "";
    position: absolute;
    height: 2px;
    background-color: #191b23;
    bottom: 0;
    left: -6px;
    right: -6px;
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s
}

.tooltip-tabs__tab--active {
    font-weight: 700;
    color: #191b23
}

.tooltip-tabs__tab--active span:after {
    opacity: 1
}

.tooltip-tabs__tab:first-child {
    text-align: right
}

.tooltip-tabs__tab:last-child {
    text-align: left
}

.tooltip-tabs__tab:hover {
    color: #363b4b;
    font-weight: 700
}

.tooltip-tabs__tab:active>span {
    -webkit-transform: translateY(1px);
    transform: translateY(1px)
}

.selectable-items {
    list-style: none;
    padding: 0;
    margin: 0
}

.selectable-items>li {
    list-style-type: none !important;
    padding: 0 !important
}

.selectable-item {
    text-align: left;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 8px 10px;
    border-radius: 3px;
    margin: 0 -10px;
    cursor: pointer;
    font-size: 14px;
    -webkit-transition: all .2s;
    transition: all .2s;
    color: #646464
}

.selectable-item--active,
.selectable-item:hover {
    color: #252729;
    background-color: #f8f9fa
}

.selectable-item--active {
    font-weight: 600
}

.selectable-item:active {
    background-color: #edf0f2
}

.selectable-item--locked {
    cursor: default
}

.selectable-item--locked:active,
.selectable-item--locked:hover {
    color: #646464;
    background-color: transparent
}

.selectable-item__icon {
    border-radius: 3px;
    width: 25px;
    height: 25px;
    margin-right: 10px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    background-color: #abc0c8;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #fff;
    font-size: 25px;
    line-height: 25px;
    -webkit-transition: all .2s;
    transition: all .2s
}

.selectable-items-tooltip {
    width: 260px;
    padding: 15px 19px
}

.selectable-items-tooltip__title {
    font-size: 16px;
    text-align: center;
    display: block;
    color: #414141;
    margin-bottom: 15px
}

.question-type-picker {
    font-size: 1.6rem
}

.question-type-picker__tooltip {
    width: 260px
}

.question-type-picker__section {
    padding: 16px 13px;
    border-bottom: 1px solid #f2f2f2
}

.question-type-picker__section:last-child {
    border-bottom: 0
}

.question-type-picker__section--color {
    border-top: 1px solid #f2f2f2
}

.question-type-picker__active-color {
    width: 25px;
    height: 25px;
    border-radius: 3px;
    background-color: #000;
    display: inline-block;
    vertical-align: top;
    -webkit-transition: all .1s;
    transition: all .1s;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-right: 12px
}

.question-type-picker__input {
    width: 100%;
    color: #646464;
    font-size: 1.4rem;
    border: 1px solid #f8f9fa;
    background-color: #f8f9fa;
    height: 32px;
    padding-left: 24px;
    font-size: 14px;
    border-radius: 3px
}

.question-type-picker__input:focus {
    outline: none;
    border-color: #f0f2f5
}

.question-type-picker__input-wrap {
    width: 100%;
    position: relative
}

.question-type-picker__input-wrap:before {
    position: absolute;
    left: 0;
    content: "#";
    color: #646464;
    font-size: 1.4rem;
    line-height: 1.4rem;
    margin-top: -.7rem;
    top: 50%;
    margin-left: 1rem
}

.question-type-picker__input-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 15px
}

.question-type-picker__create-btn {
    margin-top: 15px;
    display: block
}

.question-type-picker .tooltip__trigger span {
    display: inline !important
}

.tooltip-prompt {
    background-color: #fff;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 14px
}

.tooltip-prompt__title {
    margin-bottom: 8px;
    font-size: 16px
}

.tooltip-prompt__desc {
    margin-bottom: 24px
}

.tooltip-prompt__body {
    text-align: center;
    padding: 16px;
    width: 100%
}

.tooltip-prompt .btn+.btn,
.tooltip-prompt .btn+.method-section-add,
.tooltip-prompt .method-section-add+.btn,
.tooltip-prompt .method-section-add+.method-section-add {
    margin-top: 8px
}

.scale {
    height: 20px;
    background-color: #f8f9fa
}

.scale,
.scale__bar {
    display: block;
    border-radius: 4px;
    position: relative
}

.scale__bar {
    height: 100%;
    background-color: #abc0c8;
    -webkit-transition: all .2s;
    transition: all .2s;
    overflow: hidden
}

.scale__percent {
    font-size: 14px;
    font-weight: 700;
    position: absolute;
    left: 6px;
    top: 0;
    line-height: 20px
}

.scale__percent--over {
    color: #fff
}

.scale--vertical {
    width: 20px;
    height: 105px
}

.scale--vertical .scale__bar {
    width: 100%;
    height: auto;
    position: absolute;
    bottom: 0;
    left: 0
}

.scale-cards {
    margin-top: 17px
}

.scale-cards__header {
    position: relative;
    margin-bottom: 16px;
    font-size: 11px;
    color: #aaaab5;
    text-transform: uppercase;
    letter-spacing: .92px
}

.scale-cards__steps {
    position: absolute;
    left: 80px;
    right: 80px;
    top: 50%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 30px;
    margin-top: -15px
}

.scale-cards__steps,
.scale-cards__steps-body {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.scale-cards__steps-body {
    -webkit-transition: all .2s;
    transition: all .2s;
    padding: 7px 17px;
    border-radius: 4px;
    overflow: hidden;
    -webkit-transition-delay: 0ms;
    transition-delay: 0ms
}

.scale-cards__steps-value {
    white-space: nowrap
}

.scale-cards__steps-value strong {
    color: #252729
}

.scale-cards__steps-slider {
    margin-left: 25px;
    width: 134px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-right: -159px;
    -webkit-transition: all .2s;
    transition: all .2s;
    -webkit-transition-delay: 0ms;
    transition-delay: 0ms
}

.scale-cards__steps-body:hover {
    background-color: #f8f9fa;
    -webkit-transition-delay: 0ms;
    transition-delay: 0ms
}

.scale-cards__steps-body:hover .scale-cards__steps-slider {
    margin-right: 0;
    -webkit-transition-delay: 0ms;
    transition-delay: 0ms
}

.scale-cards__min {
    float: left
}

.scale-cards__max {
    float: right;
    text-align: right
}

.scale-cards__grid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.scale-cards__card {
    width: 100%;
    display: block;
    text-align: center
}

.scale-cards__card .scale {
    margin: 10px auto 13px
}

.scale-cards__card-percentage,
.scale-cards__card-value {
    font-size: 14px;
    color: #252729;
    font-weight: 600
}

.scale-cards__card-percentage {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.scale-cards__card-percentage,
.scale-cards__survey {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.scale-cards__survey {
    border: 1px solid #e9e9e9;
    border-radius: 6px
}

.scale-cards__survey-item {
    width: 100%;
    height: 59px;
    border-right: 1px solid #e9e9e9;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 18px;
    cursor: pointer;
    -webkit-transition: all .2s;
    transition: all .2s
}

.scale-cards__survey-item:hover {
    background-color: #f8f9fa
}

.scale-cards__survey-item:active {
    background-color: #f0f2f5
}

.scale-cards__survey-item--selected {
    background-color: #059fa3;
    color: #fff
}

.scale-cards__survey-item--selected:hover {
    background-color: #037d81
}

.scale-cards__survey-item--selected:active {
    background-color: #005e64
}

.scale-cards__survey-item:last-child {
    border-right: 0
}

.team__title {
    font-size: 1.8rem;
    letter-spacing: -.1px;
    color: #000;
    margin-bottom: 20px;
    text-align: center;
    margin: 0;
    font-weight: 600
}

@media screen and (min-width:768px) {
    .team__title {
        font-size: 2.6rem;
        text-align: left;
        font-weight: 400
    }
}

.team__list {
    padding: 0;
    margin: 0;
    list-style: none;
    position: relative
}

.team__list.in-small-modal {
    margin: 0 -20px
}

.team__list.in-small-modal li,
.team__list.in-small-modal>div {
    padding: 14px 10px 14px;
    border-radius: 0;
    margin: 0;
    border-bottom-width: 1px
}

.team__list.in-small-modal li .remove,
.team__list.in-small-modal>div .remove {
    position: absolute;
    top: 50%;
    right: 25px;
    margin-top: -12px;
    opacity: 0;
    visibility: hidden
}

.team__list.in-small-modal li .team__input-wrapper,
.team__list.in-small-modal>div .team__input-wrapper {
    width: calc(100% - 100px)
}

.team__list.in-small-modal li .team__email,
.team__list.in-small-modal>div .team__email {
    width: 180px
}

.team__list.in-small-modal li .editable-span,
.team__list.in-small-modal>div .editable-span {
    max-width: 100%;
    width: 80%
}

.team__list.in-small-modal li .editable-span input,
.team__list.in-small-modal>div .editable-span input {
    border: 0;
    background: transparent;
    height: 25px;
    font-size: 1.6rem;
    color: #646464;
    outline: 0;
    width: 100%;
    -webkit-appearance: none
}

.team__list.in-small-modal li .editable-span input::-webkit-input-placeholder,
.team__list.in-small-modal>div .editable-span input::-webkit-input-placeholder {
    color: #3b3b3b;
    opacity: .3
}

.team__list.in-small-modal li .editable-span input:-moz-placeholder,
.team__list.in-small-modal li .editable-span input::-moz-placeholder,
.team__list.in-small-modal>div .editable-span input:-moz-placeholder,
.team__list.in-small-modal>div .editable-span input::-moz-placeholder {
    color: #3b3b3b;
    opacity: .3
}

.team__list.in-small-modal li .editable-span input:-ms-input-placeholder,
.team__list.in-small-modal>div .editable-span input:-ms-input-placeholder {
    color: #3b3b3b;
    opacity: .3
}

.team__list.in-small-modal li .editable-span input:focus,
.team__list.in-small-modal>div .editable-span input:focus {
    border-bottom: 1px dashed #aaaab5
}

.team__list.in-small-modal li:hover .remove,
.team__list.in-small-modal>div:hover .remove {
    opacity: 1;
    visibility: visible
}

@media screen and (min-width:768px) {
    .team__list.in-small-modal {
        margin: 0 -35px
    }

    .team__list.in-small-modal li,
    .team__list.in-small-modal>div {
        margin: 0 -5px;
        padding: 19px 20px 16px
    }

    .team__list.in-small-modal li .team__input-wrapper,
    .team__list.in-small-modal>div .team__input-wrapper {
        width: calc(100% - 270px)
    }
}

.team__list li {
    padding: 18px 10px 15px;
    margin: 0 -15px;
    border-bottom: 1px solid #f5f5f5;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    position: relative
}

.team__list li.team__leader:before {
    content: "";
    width: 20px;
    height: 21px;
    position: absolute;
    top: 45px;
    left: 21px;
    background: url(/img/ic-crown-orange.220f063f.svg) no-repeat 0 0;
    background-size: 100% 100%
}

@media screen and (min-width:768px) {
    .team__list li {
        padding: 24px 10px 21px;
        border-radius: 3px;
        border-bottom-width: 2px;
        margin: 0 -5px
    }

    .team__list li:hover {
        background: #f8f9fa;
        border-bottom-color: transparent
    }

    .team__list li.team__leader:before {
        left: -20px;
        top: 26px
    }

    .team__list li:hover .team__menu {
        opacity: 1;
        visibility: visible
    }
}

@media screen and (min-width:992px) {
    .team__list li.team__leader:before {
        left: -33px
    }
}

.team__list li.invite {
    border-bottom: 0
}

@media screen and (max-width:767px) {
    .team__list li.invite {
        display: none
    }
}

@media screen and (min-width:768px) {
    .team__list li.invite:hover {
        background: transparent
    }

    .team__list {
        margin: 20px 0 50px
    }
}

.team__list .no-padding {
    padding: 0
}

.team__list .no-padding .team__input-wrapper {
    padding-left: 0;
    width: calc(100% - 70px) !important
}

.team__list li.remove {
    opacity: 0;
    -webkit-transform: translateX(-80%);
    transform: translateX(-80%);
    position: relative;
    height: 0;
    padding: 0 10px;
    overflow: hidden
}

.team__avatar {
    width: 40px;
    height: 40px;
    border-radius: 4px;
    display: inline-block;
    vertical-align: top;
    margin-right: 8px;
    background-color: #f3f4f4;
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: cover;
    font-size: 1.6rem;
    font-weight: 700;
    letter-spacing: .2px;
    text-align: center;
    line-height: 40px
}

@media screen and (min-width:768px) {
    .team__avatar {
        width: 30px;
        height: 30px;
        margin-right: 14px;
        font-size: 1.4rem;
        line-height: 30px
    }
}

.team__avatar.trial-plan {
    background: #68bf65 url(/img/package.1065d663.svg) no-repeat 50%;
    background-size: 19px
}

.team__avatar.personal_2020-plan,
.team__avatar.starter-plan {
    background: #f07320 url(/img/package.1065d663.svg) no-repeat 50%;
    background-size: 19px
}

.team__avatar.pro-plan,
.team__avatar.pro_2020-plan {
    background: #b064bf url(/img/package.1065d663.svg) no-repeat 50%;
    background-size: 19px
}

.team__avatar.team-plan,
.team__avatar.team_2020-plan {
    background: #64b6bf url(/img/package.1065d663.svg) no-repeat 50%;
    background-size: 19px
}

.team__avatar.empty {
    background-image: url(/img/user.be4b8dea.svg);
    background-size: 16px 18px
}

.team__avatar.empty,
.team__avatar.mail-icon {
    background-repeat: no-repeat;
    background-position: 50%
}

.team__avatar.mail-icon {
    background-image: url(/img/ic-mail.bcb4746d.svg);
    background-size: 25px 25px
}

.team__avatar.big {
    width: 60px;
    height: 60px;
    border-radius: 8px;
    line-height: 60px
}

.team__avatar.center {
    display: block;
    margin: 20px auto
}

.team__member {
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 55px);
    position: relative
}

.team__member .project-box__dots {
    top: 4px
}

@media screen and (min-width:768px) {
    .team__member .project-box__dots {
        display: none
    }
}

.team__name {
    font-size: 1.6rem;
    line-height: 1.23;
    letter-spacing: .1px;
    color: #414141;
    display: block;
    font-weight: 400;
    overflow: hidden;
    text-overflow: ellipsis
}

@media screen and (min-width:768px) {
    .team__name {
        display: inline-block;
        line-height: 1.63
    }
}

.team__input-wrapper {
    display: inline-block;
    width: 100%;
    margin-bottom: 20px
}

@media screen and (min-width:768px) {
    .team__input-wrapper {
        margin-right: 20px;
        margin-bottom: 0;
        width: calc(100% - 70px);
        padding-left: 15px
    }
}

.team__invite {
    border: 0;
    border-bottom: 1px dashed #fff;
    background: transparent;
    height: 30px;
    display: inline-block;
    font-size: 1.6rem;
    color: #646464;
    outline: 0;
    width: 100%;
    -webkit-appearance: none
}

.team__invite::-webkit-input-placeholder {
    color: #3b3b3b;
    opacity: .3
}

.team__invite:-moz-placeholder,
.team__invite::-moz-placeholder {
    color: #3b3b3b;
    opacity: .3
}

.team__invite:-ms-input-placeholder {
    color: #3b3b3b;
    opacity: .3
}

.team__invite:focus {
    border-bottom: 1px dashed #aaaab5
}

.team__invite.has-error {
    border-bottom-color: #e7808d
}

.team__invite.has-error+.g__error {
    display: block;
    clear: both
}

.team__email {
    font-size: 14px;
    line-height: 1.43;
    text-align: left;
    margin-top: 15px;
    overflow: hidden;
    text-overflow: ellipsis
}

@media screen and (min-width:768px) {
    .team__email {
        float: right;
        width: 210px;
        margin-top: 0;
        line-height: 1.83
    }
}

@media screen and (min-width:992px) {
    .team__email {
        width: 270px
    }
}

.team__email.btn,
.team__email.method-section-add {
    text-align: center;
    text-transform: inherit;
    font-size: 1.4rem;
    padding: 6px 10px
}

.team__email.send-reminder {
    font-weight: 700;
    color: #646464;
    cursor: pointer
}

.team__menu {
    opacity: 0
}

@media screen and (min-width:768px) {
    .team__menu {
        position: absolute;
        left: 100%;
        padding-left: 5px;
        top: 0;
        bottom: 0;
        width: 180px
    }

    .team__menu button {
        width: 40px;
        height: 100%;
        display: inline-block;
        vertical-align: top;
        border: 0;
        background: transparent;
        text-transform: uppercase;
        font-size: 10px;
        font-weight: 500;
        line-height: 1.5;
        letter-spacing: .8px;
        color: #555;
        text-align: center;
        margin: 0 5px;
        position: relative;
        background-repeat: no-repeat;
        background-position: 50%;
        outline: 0
    }

    .team__menu button.team__trash {
        background-image: url(/img/trash-2.4eef53fa.svg)
    }

    .team__menu button.team__transfer {
        background-image: url(/img/ic-crown.de03ecdc.svg)
    }

    .team__menu button span {
        position: absolute;
        top: calc(100% + 10px);
        left: 50%;
        -webkit-transform: translate(-50%, 15px);
        transform: translate(-50%, 15px);
        -webkit-transition: all .2s ease;
        transition: all .2s ease;
        opacity: 0;
        visibility: hidden
    }

    .team__menu button:hover {
        background-color: #f7f9f9
    }

    .team__menu button:hover span {
        -webkit-transform: translate(-50%);
        transform: translate(-50%);
        opacity: 1;
        visibility: visible
    }
}

@media screen and (min-width:992px) {
    .team__menu button {
        width: 70px
    }
}

.team__overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, .6);
    z-index: 1001;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.team__overlay.js-active {
    opacity: 1;
    visibility: visible
}

@media screen and (min-width:768px) {
    .team__overlay {
        display: none
    }
}

.team__mobile-edit {
    background: #fff;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    display: block;
    z-index: 1002;
    padding: 17px 0 20px;
    opacity: 0;
    visibility: hidden
}

.team__mobile-edit.js-active {
    opacity: 1;
    visibility: visible
}

@media screen and (min-width:768px) {
    .team__mobile-edit {
        display: none
    }
}

.team__mobile-edit-user {
    padding: 0 15px 14px 15px;
    border-bottom: 2px solid #f5f5f5;
    text-align: center
}

.team__mobile-edit-avatar {
    width: 20px;
    height: 20px;
    border-radius: 4px;
    display: inline-block;
    vertical-align: middle;
    margin-top: 0;
    font-size: .9rem;
    line-height: 20px
}

.team__mobile-edit-name {
    font-size: 1.6rem;
    line-height: 1.63;
    letter-spacing: .1px;
    color: #414141;
    display: inline-block;
    vertical-align: middle
}

.team__mobile-edit-buttons {
    border-bottom: 2px solid #f5f5f5;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 15px
}

.team__mobile-edit-buttons button {
    width: 50%;
    min-height: 50vw;
    background-color: #fff;
    border: 0;
    text-align: center;
    font-size: 10px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: .8px;
    text-transform: uppercase;
    outline: 0;
    color: #555
}

.team__mobile-edit-buttons button.team__transfer {
    border-left: 2px solid #f5f5f5
}

.team__mobile-edit-buttons button.team__trash span:before {
    content: "";
    display: block;
    width: 29px;
    height: 32px;
    background: url(/img/trash-2.4eef53fa.svg) no-repeat 0 0;
    background-size: 100% 100%;
    margin: 0 auto 10px
}

.team__mobile-edit-buttons button.team__transfer span:before {
    content: "";
    display: block;
    width: 29px;
    height: 32px;
    background: url(/img/ic-crown.de03ecdc.svg) no-repeat 0 0;
    background-size: 100% 100%;
    margin: 0 auto 10px
}

.team__mobile-edit-close {
    width: calc(100% - 30px);
    margin: 0 15px
}

.team__add-mobile-wrapper {
    background-color: #f8f9fa;
    padding: 20px 17px;
    margin: 0 -15px 20px
}
.size-cover-top {
    height: 17rem !important;/* 45 */
}

.content-no-visible-mobile {
    display: none !important;
}
.content-w100-mobile {
    width: 100% !important;
}

.button-author-desktop {
    display: none !important;
}
.button-author-mobile {
    display: block !important;
}

.mt-sidebar-mobile {
    margin-top: 4rem !important;
}
.mw-sidebar {
    width: 100% !important;
}

@media screen and (min-width:768px) {
    .team__add-mobile-wrapper {
        display: none
    }
    .size-cover-top {
        height: 32rem !important;/*32*/
    }
    .content-no-visible-mobile {
        display: block !important;
    }
    .content-w100-mobile {
        width: 50% !important;
    }
    .button-author-desktop {
        display: block !important;
    }
    .button-author-mobile {
        display: none !important;
    }
    .mw-sidebar {
        width: 260px !important;
    }
    .mt-sidebar-mobile {
        margin-top: 0rem !important;
    }
}

.team__add-mobile {
    width: 100%;
    text-transform: inherit;
    font-size: 1.4rem;
    letter-spacing: .2px;
    color: #414141
}

.team__mobile-add-member {
    background: #fff;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1001;
    padding: 20px 18px;
    text-align: center;
    opacity: 0;
    visibility: hidden
}

.team__mobile-add-member.js-active {
    opacity: 1;
    visibility: visible
}

@media screen and (min-width:768px) {
    .team__mobile-add-member {
        display: none
    }
}

.team__mobile-add-member .avathar {
    width: 102px;
    height: 102px;
    border-radius: 4px;
    margin: 30px auto;
    background: #f3f6f8 url(/img/user2.1cc970e0.svg) no-repeat 50%;
    background-size: 58px 65px
}

.team__mobile-add-member .btn,
.team__mobile-add-member .method-section-add {
    width: 100%;
    display: block;
    margin: 0 0 10px
}

.team__mobile-add-member .btn--orange.method-section-add,
.team__mobile-add-member .btn.btn--orange {
    margin-top: 20px;
    background: #fa8c25;
    border-color: #fa8c25;
    color: #fff
}

.team__mobile-add-member-title {
    font-size: 1.8rem;
    font-weight: 600;
    color: #252729
}

.team__error {
    text-align: center
}

.team__error .g__error {
    font-size: 1.4rem;
    margin-bottom: 20px
}

.team__empty {
    text-align: center;
    max-width: 480px;
    margin: 0 auto
}

.team__role-picker {
    display: inline-block;
    vertical-align: middle;
    line-height: 1.63;
    font-size: 1.4rem;
    color: #252729;
    font-weight: 700;
    cursor: pointer;
    position: relative
}

.team__role-picker:after {
    content: "";
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    border-top: 4px solid #252729;
    display: inline-block;
    vertical-align: middle;
    margin-left: 4px
}

.dropdown {
    opacity: 0;
    visibility: hidden;
    background: #fff;
    -webkit-box-shadow: 0 12px 23px 0 rgba(0, 0, 0, .12);
    box-shadow: 0 12px 23px 0 rgba(0, 0, 0, .12);
    border-radius: 6px;
    border: 1px solid #f2f2f2;
    position: absolute;
    top: 40px;
    padding: 20px 20px 0 20px;
    text-align: left;
    z-index: 100;
    min-width: 90px;
    -webkit-transition: all .25s ease;
    transition: all .25s ease;
    width: 307px;
    right: auto;
    left: 50%;
    -webkit-transform: translate(-50%, 30px);
    transform: translate(-50%, 30px);
    padding: 0;
    z-index: 30
}

.dropdown:before {
    top: -5px;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #fff;
    z-index: 3
}

.dropdown:after,
.dropdown:before {
    content: "";
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.dropdown:after {
    top: -7px;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 6px solid #f2f2f2;
    z-index: 2
}

.dropdown .g-switch {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

@media screen and (max-width:479px) {
    .dropdown {
        width: 290px;
        -webkit-transform: translateX(10px);
        transform: translateX(10px)
    }
}

@media screen and (max-width:767px) {
    .dropdown {
        left: -65px;
        -webkit-transform: translateY(30px);
        transform: translateY(30px)
    }

    .dropdown.is-active {
        -webkit-transform: translate(0);
        transform: translate(0)
    }
}

.dropdown.is-active {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translate(-50%);
    transform: translate(-50%)
}

@media screen and (max-width:479px) {
    .dropdown.is-active {
        width: 290px;
        -webkit-transform: translateX(15px);
        transform: translateX(15px)
    }
}

.dropdown--static {
    position: relative;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
    visibility: visible;
    top: auto;
    left: auto;
    right: auto;
    background: transparent;
    border: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    padding: 0;
    margin: 0
}

.dropdown--static:after,
.dropdown--static:before {
    display: none
}

.dropdown {
    list-style-type: none
}

.dropdown li {
    font-size: 1.6rem;
    line-height: 1.1;
    color: #414141;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    text-transform: none;
    width: 307px;
    text-align: left;
    margin: 0 0 20px;
    width: 100%;
    display: block;
    margin: 0;
    border-bottom: 0;
    padding: 5px;
    position: relative
}

.dropdown li:before {
    content: "";
    position: absolute;
    z-index: 0;
    display: block;
    top: 5px;
    left: 5px;
    right: 5px;
    bottom: 5px;
    border-radius: 6px;
    background-color: #f8f9fa;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.dropdown li.title {
    border-bottom: 1px solid #f2f2f2;
    padding: 15px 10px 10px;
    font-size: 1.6rem;
    color: #414141;
    width: 100%;
    line-height: 26px;
    text-align: center;
    font-weight: 400;
    cursor: auto
}

.dropdown li.title:after,
.dropdown li.title:before {
    display: none
}

.dropdown li.title:hover {
    background: transparent
}

.dropdown li .dropdown-icon {
    position: absolute;
    left: 30px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.dropdown li .dropdown-txt {
    color: #646464;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.43;
    position: relative;
    z-index: 2
}

.dropdown li .dropdown-txt-small {
    color: #aaaab5;
    font-size: 12px;
    line-height: 1.67
}

.dropdown li:not(.title) {
    padding-left: 70px
}

.dropdown li:hover {
    background: transparent
}

.dropdown li:hover:before {
    opacity: 1;
    visibility: visible
}

.dropdown li:active {
    background: transparent
}

.dropdown li:active:before {
    opacity: 1;
    visibility: visible;
    background-color: #f0f2f5
}

.dropdown li:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: #f2f2f2;
    display: block
}

@media screen and (max-width:479px) {
    .dropdown li {
        width: 260px;
        padding-left: 20px
    }
}

.dropdown li:last-of-type {
    margin-bottom: 0
}

.dropdown li:last-of-type:after {
    display: none
}

.dropdown-link {
    font-size: 1rem;
    line-height: 1.5rem;
    color: #8e8e8e;
    padding-left: 20px;
    margin: 5px 0 0 0
}

@media screen and (min-width:768px) {
    .dropdown-link {
        padding-left: 50px
    }
}

.dropdown-txt-small {
    font-size: 1.2rem;
    text-align: center;
    text-transform: none;
    margin: 10px 0 0 0;
    color: #aaaab5
}

.success .dropdown-txt-small {
    color: #68bf65 !important
}

.method-page {
    padding-bottom: 340px
}

.sidebar-page {
    margin-top: -29px;
    margin-bottom: 300px
}

@media screen and (max-width:767px) {
    .sidebar-page {
        margin-top: 0
    }
}

.sidebar-page--no-margin-bottom {
    margin-bottom: 0
}

.sidebar-mounted .sidebar-page {
    margin-left: 150px
}

@media screen and (max-width:991px) {
    .sidebar-mounted .sidebar-page {
        margin-top: 0;
        margin-left: 0
    }
}

.sidebar-margin {
    margin-left: 280px;
    margin-top: -60px
}

@media screen and (max-width:991px) {
    .sidebar-margin {
        margin-left: 0;
        margin-top: 0
    }
}

.methods__show {
    font-size: 1.4rem;
    margin-top: -35px;
    color: #646464;
    position: relative;
    z-index: 10
}

.methods__show-choosed {
    color: #252729;
    font-weight: 700;
    padding: 4px 8px;
    cursor: pointer;
    position: relative;
    display: inline-block;
    border-radius: 2px
}

.methods__show-choosed:active,
.methods__show-choosed:hover {
    background-color: #f3f6f8
}

.methods__show-choosed .mselect {
    display: block !important;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all .25s ease;
    transition: all .25s ease;
    left: 0
}

.methods__show-choosed .mselect.js-active {
    opacity: 1;
    visibility: visible
}

.analytics__method-competitoranalysis-show,
.analytics__method-problemvaluation-show,
.analytics__method-solutionvaluation-show {
    -webkit-user-select: none
}

@media screen and (max-width:767px) {
    .analytics__method-user-edit {
        margin-left: 15px
    }
}

.section__header--padding-right .methods__list-trash:hover,
h3 .methods__list-trash:hover {
    cursor: pointer
}

.section__header--padding-right {
    padding-right: 46px !important
}

.methods__subtitle {
    font-size: 2.3rem;
    letter-spacing: -.1px;
    color: #000;
    font-weight: 400;
    margin: 46px 0 26px;
    border: 0;
    outline: 0;
    padding: 0
}

.methods__subtitle input:not([readonly]),
.methods__subtitle textarea:not([readonly]) {
    border-bottom: 1px dashed #fff;
    -webkit-transition: border-bottom .25s;
    transition: border-bottom .25s
}

.methods__subtitle input:not([readonly]):hover,
.methods__subtitle textarea:not([readonly]):hover {
    cursor: text;
    border-bottom: 1px dashed #8e8e8e
}

.methods__list {
    margin: 10px 0 50px 0;
    padding: 0;
    list-style: none;
    counter-reset: section
}

.methods__list li {
    padding-left: 47px;
    position: relative;
    margin-bottom: 0;
    padding-bottom: 17px;
    padding-top: 17px
}

.methods__list li li {
    list-style-type: disc;
    padding-top: 0;
    margin-bottom: 0
}

.methods__list li.edit-mode {
    cursor: -webkit-grab;
    cursor: grab;
    padding: 15px 15px 10px 62px;
    margin: 0 0 0 -15px
}

.methods__list li.edit-mode.sortable-ghost {
    margin-left: -15px;
    height: 55px;
    min-height: 55px;
    margin-bottom: 10px;
    overflow: hidden;
    background: #dae7ed !important
}

.methods__list li.edit-mode.sortable-ghost .methods__question-edit:before {
    display: none
}

.methods__list li.edit-mode.sortable-drag.sortable-fallback {
    opacity: 1 !important
}

.methods__list li.edit-mode.sortable-drag.sortable-fallback .methods__list-item-inner {
    padding: 15px 15px 10px 62px;
    background: #fff;
    border-radius: 3px;
    -webkit-transform: rotate(-3deg);
    transform: rotate(-3deg);
    -webkit-box-shadow: 0 24px 20px 0 rgba(0, 0, 0, .21);
    box-shadow: 0 24px 20px 0 rgba(0, 0, 0, .21)
}

.methods__list li.edit-mode:hover {
    background: #fff;
    -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08)
}

.methods__list li.edit-mode:hover .methods__list-trash {
    opacity: 1;
    visibility: visible
}

.methods__list li.edit-mode[draggable=true] .methods__list-trash {
    display: none
}

.methods__list li.sortable-ghost {
    background: #dae7ed;
    color: #bac7cd;
    min-height: 70px;
    border-radius: 6px;
    text-indent: -9999px;
    margin: 0
}

.draggables__wrapper {
    min-height: 25px;
    margin-bottom: -25px
}

.methods__list-items-count {
    font-size: 14px;
    color: #646464;
    margin-top: 7px
}

.methods__list-answer {
    margin-right: 60px
}

.methods__list-answer.add-new {
    -webkit-box-ordinal-group: 1000;
    -ms-flex-order: 999;
    order: 999
}

.methods__list-answer.add-new:hover {
    background-color: #f8f9fa;
    -webkit-box-shadow: 0 15px 18px 0 hsla(0, 0%, 64%, .06);
    box-shadow: 0 15px 18px 0 hsla(0, 0%, 64%, .06)
}

.methods__list-answer.add-new:active {
    background-color: #f0f2f5
}

.methods__question,
.methods__question-edit {
    position: relative;
    font-size: 1.8rem;
    font-weight: 600;
    color: #252729;
    margin-bottom: 5px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.methods__question-edit:hover:before,
.methods__question:hover:before {
    background: #7497a3
}

.methods__question-edit[draggable=true]+.methods__list-trash,
.methods__question[draggable=true]+.methods__list-trash {
    display: none
}

.methods__list-item .methods__question,
.methods__list-item .methods__question-edit {
    padding-right: 0 !important
}

.methods__list-item .methods__question .methods__list-answer-submit,
.methods__list-item .methods__question-edit .methods__list-answer-submit {
    right: 30px
}

.methods__question .side-dropdown-menu__btn,
.methods__question-edit .side-dropdown-menu__btn {
    height: 25px
}

.methods__question-edit {
    padding-right: 75px;
    padding-left: 45px;
    margin-left: -45px
}

.analytics__method-userinterview-show .methods__question-edit {
    padding-right: 0
}

.methods__question-edit .methods__question-edit-counter {
    left: 0
}

.methods__question-edit-counter {
    position: absolute;
    top: 0;
    left: -45px
}

.methods__question-edit-counter-body {
    border-radius: 3px;
    width: 25px;
    height: 25px;
    display: block;
    background: #f1f6fa54;
    font-size: 25px;
    font-weight: 700;
    line-height: 1em;
    text-align: left;
    color: #fff;
    -webkit-transition: all .2s;
    transition: all .2s;
    position: relative;
    overflow: hidden
}

.methods__question-edit-counter-body:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: #f1f6fa54;
    opacity: 1;
    -webkit-transition: all .2s;
    transition: all .2s
}

.methods__question-edit-counter-body:after {
    content: "";
    position: absolute;
    top: 50%;
    border: 3px solid transparent;
    border-top-color: #fafafa;
    opacity: 0;
    right: 3px;
    margin-top: -2px;
    -webkit-transition: all .2s;
    transition: all .2s
}

.add-question:hover .methods__question-edit-counter-body,
.methods__question-edit-counter-active .methods__question-edit-counter-body,
.methods__question-edit-counter-hover:hover .methods__question-edit-counter-body,
.methods__question-edit:hover .methods__question-edit-counter-body,
.question-type-picker--active .methods__question-edit-counter-body,
.sortable-drag .methods__question-edit-counter-body {
    width: 34px
}

.add-question:hover .methods__question-edit-counter-body:after,
.methods__question-edit-counter-active .methods__question-edit-counter-body:after,
.methods__question-edit-counter-hover:hover .methods__question-edit-counter-body:after,
.methods__question-edit:hover .methods__question-edit-counter-body:after,
.question-type-picker--active .methods__question-edit-counter-body:after,
.sortable-drag .methods__question-edit-counter-body:after {
    opacity: .3
}

@media screen and (max-width:767px) {
    .methods__question-edit-counter-body {
        width: 34px
    }

    .methods__question-edit-counter-body:after {
        opacity: .3
    }
}

.methods__question-edit-counter-body:hover:before {
    opacity: .9
}

.methods__question-edit-counter-icon,
.question-type-picker-icon {
    font-size: 25px;
    border-radius: 3px;
    position: absolute;
    left: 0;
    top: 0;
    display: inline-block !important
}

.question-type-picker-icon {
    position: static;
    font-size: inherit;
    vertical-align: top;
    width: 25px
}

.question-type-picker-icon--static .methods__question-edit-counter-body {
    width: 25px !important
}

.question-type-picker-icon--static .methods__question-edit-counter-body:before {
    display: none
}

.methods__question-edit-num {
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 3px;
    width: 25px;
    height: 25px;
    display: block;
    background: #abc0c8;
    line-height: 1em;
    text-align: left;
    -webkit-transition: all .2s;
    transition: all .2s;
    font-size: 1rem;
    font-weight: 700;
    line-height: 2.5rem;
    letter-spacing: .6px;
    text-align: center;
    color: #fff
}

.methods__question-edit:hover .methods__question-edit-num,
.methods__question:hover .methods__question-edit-num {
    background-color: #7497a3
}

.methods__question-edit+.methods__list-answer .methods__list-answer-input.answer-new,
.methods__question-edit+.methods__list-answer span.answer-new {
    color: #252729
}

.methods__question-input {
    position: relative;
    font-size: 1.8rem;
    font-weight: 600;
    color: #252729;
    border: 0;
    outline: 0;
    background: transparent;
    width: 100%;
    padding: 0;
    resize: none;
    display: block
}

.methods__question-input::-webkit-input-placeholder {
    color: #b1b1b1;
    opacity: .4
}

.methods__question-input:-moz-placeholder,
.methods__question-input::-moz-placeholder {
    color: #b1b1b1;
    opacity: .4
}

.methods__question-input:-ms-input-placeholder {
    color: #b1b1b1;
    opacity: .4
}

.methods__question-input:focus+.methods__list-answer-submit,
.methods__question-input:focus~.methods__list-answer-library {
    display: block;
    opacity: 1;
    visibility: visible
}

.methods__question-input--new {
    padding-right: 78px
}

.methods__list-answer {
    padding: 16px 75px 16px 15px;
    border-bottom: 1px solid #f5f5f5;
    border-radius: 3px;
    font-size: 1.6rem;
    line-height: 1.5;
    color: #3b3b3b;
    position: relative;
    cursor: pointer;
    margin-left: -15px;
    -webkit-transition: all .6s ease;
    transition: all .6s ease
}

.methods__list-answer .methods__list-answer-avathars {
    opacity: 1
}

.methods__list-answer:last-child {
    border-bottom: 1px solid #fff
}

.methods__list-answer.is-moved,
.methods__list-answer.js-selected,
.methods__list-answer:focus,
.methods__list-answer:hover {
    background: #fff;
    -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08)
}

.methods__list-answer:hover .methods__list-trash {
    opacity: 1;
    visibility: visible
}

.methods__list-answer:hover:hover span.empty {
    opacity: 1
}

.methods__list-answer[draggable=true] .methods__list-trash,
.methods__list-answer[draggable=true] .methods__list-trash.create-page,
.methods__list-answer[draggable=true] .mselect {
    display: none
}

.methods__list-answer.sortable-ghost {
    margin-left: -15px;
    height: 67px;
    min-height: 67px;
    margin-bottom: 10px;
    overflow: hidden;
    border-radius: 3px;
    -webkit-transition: none !important;
    transition: none !important;
    background: #dae7ed !important
}

.methods__list-answer.sortable-ghost .methods__list-answer-inner {
    display: none
}

.methods__list-answer.sortable-drag.sortable-fallback {
    opacity: 1 !important;
    border-bottom: 0;
    -webkit-transition: none;
    transition: none
}

.methods__list-answer.sortable-drag.sortable-fallback .methods__list-answer-inner {
    width: 100%;
    padding: 20px 75px 20px 15px;
    -webkit-box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21);
    box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21);
    background: #fff;
    border-radius: 3px;
    -webkit-transform: rotate(-3deg);
    transform: rotate(-3deg)
}

.methods__list-answer.sortable-drag {
    -webkit-transition: none;
    transition: none
}

.col-xs-12>.methods__list-answer:last-child .methods__list-answer-avathars span:first-child {
    opacity: .2
}

.methods__solution-valuation {
    margin-bottom: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid #f2f2f2
}

.methods__solution-valuation-card {
    border-bottom: 0 !important
}

.methods__solution-valuation .col-xs-12>.methods__list-answer:last-child .methods__list-answer-avathars span:first-child {
    opacity: 1
}

.methods__list-answer-avathars {
    position: absolute;
    right: 16px;
    top: 50%;
    min-width: 37px;
    min-height: 26px
}

.methods__list-answer-avathars span {
    width: 26px;
    height: 26px;
    border-radius: 2px;
    display: inline-block;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: .1px;
    border: 1px solid transparent;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: 1;
    background-size: 100% auto;
    overflow: hidden;
    position: absolute;
    right: 5px;
    top: -13px;
    -webkit-box-shadow: 1px 0 2px rgba(0, 0, 0, .1);
    box-shadow: 1px 0 2px rgba(0, 0, 0, .1)
}

.methods__list-answer-avathars span.empty {
    display: inline-block;
    border: 1px dashed #aaaab5;
    opacity: .1;
    -webkit-box-shadow: 0 0 0 transparent;
    box-shadow: 0 0 0 transparent
}

.methods__list-answer-avathars span.empty:hover {
    opacity: 1
}

.methods__list-answer-avathars span.count {
    background: #f07320;
    color: #fff
}

.methods__list-answer-avathars span:first-child {
    z-index: 1
}

.methods__list-answer-avathars span:nth-child(2) {
    z-index: 2;
    right: 15px
}

.methods__list-answer-avathars span:nth-child(3) {
    z-index: 3;
    right: 25px
}

.methods__list-answer-avathars:after {
    content: "Tag respondent";
    bottom: 42px;
    background: #3d3d3d;
    border-radius: 3px;
    display: block;
    padding: 3px 5px;
    color: #fff;
    font-size: 1rem;
    width: 82px;
    text-align: center;
    z-index: 200
}

.methods__list-answer-avathars:after,
.methods__list-answer-avathars:before {
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.methods__list-answer-avathars:before {
    content: "";
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #3d3d3d;
    bottom: 38px
}

.methods__list-answer-avathars.tooltip-viewable:hover:after,
.methods__list-answer-avathars.tooltip-viewable:hover:before {
    opacity: 1;
    visibility: visible
}

@media screen and (max-width:991px) {
    .methods__list-answer-avathars .mselect {
        right: 0;
        -webkit-transform: none;
        transform: none
    }

    .methods__list-answer-avathars .mselect:before {
        right: 22px;
        left: auto
    }

    .methods__list-answer-avathars .mselect:after {
        right: 18px;
        left: auto
    }

    .methods__list-answer-avathars .mselect.js-active {
        -webkit-transform: translateX(-88%);
        transform: translateX(-88%)
    }
}

.methods__list-answer-input {
    border: 0;
    background: transparent;
    font-size: 1.6rem;
    line-height: 2rem;
    text-align: left;
    padding: 0;
    color: #3b3b3b;
    width: 100%;
    outline: 0;
    resize: none;
    height: auto;
    cursor: pointer
}

.methods__list-answer-input:focus+.methods__list-answer-submit,
.methods__list-answer-input:focus~.methods__list-answer-library {
    opacity: 1;
    visibility: visible
}

.methods__list-answer-input.answer-new {
    color: #aaaab5
}

.methods__list-answer-input.answer-new:active,
.methods__list-answer-input.answer-new:focus,
.methods__list-answer-input.answer-new:hover {
    color: #3b3b3b
}

.methods__list-answer-input::-webkit-input-placeholder {
    color: #b1b1b1
}

.methods__list-answer-input:-moz-placeholder,
.methods__list-answer-input::-moz-placeholder {
    color: #b1b1b1
}

.methods__list-answer-input:-ms-input-placeholder {
    color: #b1b1b1
}

.methods__list-answer-submit {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    right: 52px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    background: #f3f6f8 url(/img/enter.5d6f4370.svg) no-repeat 50%;
    width: 26px;
    height: 26px;
    border-radius: 2px;
    border: 0;
    z-index: 10;
    -webkit-transition: all .4s ease;
    transition: all .4s ease
}

.methods__question-edit .methods__list-answer-submit {
    right: 0
}

.methods__list-answer-library {
    opacity: 0;
    -webkit-transition: all .4s;
    transition: all .4s;
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -11px
}

.add-question:hover .methods__list-answer-library {
    opacity: 1
}

.methods__list-answer-library button {
    font-size: 20px;
    line-height: 1;
    border: 0;
    padding: 0;
    margin: 0;
    background: transparent
}

.methods__list-answer-library button:focus {
    outline: none
}

.methods__add-section {
    height: 40px;
    width: 100%;
    background: transparent;
    border: 0;
    outline: 0;
    position: relative;
    padding: 0
}

.methods__add-section.margin50 {
    margin: 50px auto
}

.methods__add-section:after {
    content: "";
    position: absolute;
    top: 50%;
    display: block;
    height: 1px;
    left: 0;
    right: 0;
    background: #dae1e6
}

.methods__add-section:before {
    content: "+";
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -20px;
    width: 40px;
    height: 40px;
    border: 1px solid #dae1e6;
    background: #fff;
    border-radius: 50%;
    z-index: 2;
    font-size: 1.4rem;
    line-height: 38px;
    text-align: center;
    color: #414141;
    -webkit-transition: all .4s ease;
    transition: all .4s ease
}

.methods__add-section:hover:before {
    border-color: #fa8c25;
    color: #fff;
    background: #fa8c25
}

.methods__sidebar {
    background: #f7f9fa;
    margin: 0 -15px;
    padding: 20px 40px
}

@media screen and (min-width:768px) {
    .methods__sidebar {
        padding: 0;
        min-height: calc(100% + 90px);
        margin: -40px -15px 0 0
    }
}

@media screen and (min-width:992px) {
    .methods__sidebar {
        position: fixed;
        width: 32%;
        height: 85%;
        bottom: 0;
        top: 90px;
        right: 0;
        overflow-y: scroll;
        padding-right: 40px;
        overflow-x: hidden;
        min-height: calc(100% - 60px)
    }
}

@media screen and (min-width:768px) {
    .methods__sidebar-category-fixed {
        padding: 46px 40px
    }
}

.methods__sidebar-title {
    font-size: 2.4rem;
    color: #000;
    position: relative;
    margin-bottom: 21px
}

.methods__sidebar-title:after {
    content: "";
    position: absolute;
    left: -40px;
    right: -40px;
    bottom: -21px;
    height: 1px;
    background: #e8eced
}

.methods__sidebar-category-title {
    font-size: 1.6rem;
    font-weight: 600;
    color: #252729;
    position: relative;
    cursor: pointer;
    border-bottom: 1px solid #e8eced;
    padding: 15px 40px;
    margin: 0 -40px
}

.methods__sidebar-category-title .questions {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    right: 65px;
    top: 50%;
    -webkit-transform: translate(10px, -50%);
    transform: translate(10px, -50%);
    font-size: 1.1rem;
    line-height: 1.36;
    letter-spacing: .8px;
    text-align: right;
    color: #414141;
    text-transform: uppercase;
    -webkit-transition: all .6s ease;
    transition: all .6s ease
}

.methods__sidebar-category-title.js-active .methods__sidebar-category-more {
    border-color: #acafb4
}

.methods__sidebar-category-title.js-active .methods__sidebar-category-more:before {
    -webkit-transform: none;
    transform: none
}

.methods__sidebar-category-title.js-active .questions {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.methods__sidebar-category-title.js-active+.methods__sidebar-category-list {
    display: block
}

.methods__sidebar-category-title:hover .questions {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.methods__sidebar-category-title:hover .methods__sidebar-category-more {
    border-color: #acafb4
}

.methods__sidebar-category-more {
    width: 26px;
    height: 26px;
    border-radius: 3px;
    border: 1px solid #dae1e6;
    float: right;
    background: transparent;
    right: 18px;
    margin-top: -13px
}

.methods__sidebar-category-more,
.methods__sidebar-category-more:before {
    position: absolute;
    top: 50%;
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.methods__sidebar-category-more:before {
    content: "";
    width: 8px;
    height: 4px;
    left: 50%;
    margin: -2px 0 0 -4px;
    background: url(/img/method-sidebar-arrow.be90bcd5.svg) no-repeat 50%;
    background-size: 100% 100%;
    -webkit-transform: scaleY(-1);
    transform: scaleY(-1)
}

.methods__sidebar-category-list {
    margin: 0 0 20px 0;
    padding: 0;
    list-style: none;
    display: none;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.methods__sidebar-category-list:after {
    content: "";
    position: absolute;
    right: -40px;
    left: -40px;
    height: 1px;
    background: #ebeeef;
    display: block;
    bottom: -20px
}

.methods__sidebar-category-list-item {
    font-size: 11px;
    font-weight: 500;
    line-height: 1.36;
    letter-spacing: .8px;
    text-transform: uppercase;
    color: #414141;
    padding: 17px 40px;
    margin: 0 -40px;
    -webkit-transition: all .35s ease;
    transition: all .35s ease;
    list-style: none;
    cursor: -webkit-grab;
    cursor: grab;
    position: relative
}

.methods__sidebar-category-list-item.sortable-fallback {
    opacity: 1 !important
}

.methods__sidebar-category-list-item.sortable-fallback .methods__sidebar-category-list-inner {
    padding: 17px 40px;
    background: #fff;
    border-radius: 3px;
    -webkit-transform: rotate(-3deg);
    transform: rotate(-3deg);
    -webkit-box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21);
    box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21)
}

.methods__sidebar-category-list-item:after {
    content: "";
    position: absolute;
    right: 0;
    left: 40px;
    height: 1px;
    background: #ebeeef;
    display: block;
    bottom: 0
}

.methods__sidebar-category-list-item:last-child:after {
    display: none
}

.methods__sidebar-category-list-item:hover {
    background: #edf1f2
}

.methods__sidebar-category-list-item.sortable-drag {
    -webkit-transition: none;
    transition: none
}

.methods__list-trash {
    width: 42px;
    height: 100%;
    display: inline-block;
    vertical-align: top;
    border: 0;
    background: transparent;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: .8px;
    color: #555;
    text-align: center;
    margin: 0 5px;
    position: absolute;
    right: -40px;
    top: 0;
    outline: 0;
    background: #fff url(/img/archive.f2199a53.svg) no-repeat 50%;
    opacity: 0;
    -webkit-transition: all .5s ease;
    transition: all .5s ease
}

.methods__list-trash span {
    position: absolute;
    top: calc(100% + 10px);
    left: 50%;
    -webkit-transform: translate(-50%, 15px);
    transform: translate(-50%, 15px);
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
    opacity: 0;
    visibility: hidden
}

.methods__list-trash.create-page {
    background-image: url(/img/file-plus.47b2fd26.svg)
}

.methods__list-trash.menu {
    background-image: url(/img/more-vertical.3cc68a7c.svg);
    background-size: 5px 15px
}

.methods__list-trash.menu .project-box__mobile-menu li {
    list-style: none
}

.methods__list-trash.menu .project-box__mobile-menu.js-active {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.methods__list-trash:hover {
    background-color: #f7f9f9
}

.methods__list-trash:hover span {
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    opacity: 1;
    visibility: visible
}

.mselect {
    display: block !important;
    width: 260px;
    background: #fff;
    border-radius: 3px;
    -webkit-box-shadow: 0 15px 18px 0 rgba(0, 0, 0, .06);
    box-shadow: 0 15px 18px 0 rgba(0, 0, 0, .06);
    border: 1px solid hsla(0, 0%, 93%, .62);
    position: absolute;
    left: 50%;
    -webkit-transform: translate(-50%, 20px);
    transform: translate(-50%, 20px);
    top: calc(100% + 10px);
    -webkit-transition: all .25s ease;
    transition: all .25s ease;
    opacity: 0;
    visibility: hidden;
    z-index: 5001
}

.mselect:before {
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 6px solid #fff;
    top: -6px;
    z-index: 3
}

.mselect:after,
.mselect:before {
    content: "";
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.mselect:after {
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid hsla(0, 0%, 93%, .62);
    top: -7px;
    z-index: -1
}

.mselect.js-active {
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    opacity: 1;
    visibility: visible
}

.mselect__list {
    margin: 0;
    padding: 0;
    list-style: none
}

.mselect__list li {
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 1.43;
    color: #444;
    padding: 14px 15px 14px 64px;
    display: block;
    position: relative;
    margin: 0;
    word-break: break-all
}

.mselect__list li:before {
    content: "";
    position: absolute;
    left: 3px;
    top: 3px;
    right: 3px;
    bottom: 3px;
    border-radius: 3px;
    -webkit-transition: all .35s ease;
    transition: all .35s ease;
    background: #fff;
    z-index: -1
}

.mselect__list li.select-all {
    border-bottom: 1px solid #f2f2f2;
    margin-right: 70px
}

.mselect__list li.add-new {
    border-top: 1px solid #f2f2f2
}

.mselect__list li.add-new:before {
    display: none
}

.mselect__list li:hover:before {
    background: #f3f6f8
}

.mselect__list li.js-selected .mselect__check {
    background-color: transparent
}

.mselect__list li.js-selected .mselect__check svg {
    opacity: 1
}

.mselect__list li.js-blank .team__avatar {
    border: 1px dashed #d6d6d6;
    background: transparent
}

.mselect__check {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    margin-top: 2px;
    left: 15px
}

.mselect__check svg {
    fill: #4b5761;
    opacity: .2;
    -webkit-transition: all .2s ease;
    transition: all .2s ease
}

.mselect__settings {
    position: absolute;
    right: -70px;
    top: 0;
    bottom: 0;
    background: transparent;
    padding: 3px;
    border: 0;
    border-left: 1px solid #f2f2f2;
    border-bottom: 1px solid #f2f2f2;
    width: 70px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    border-radius: 0 3px 0 0;
    outline: 0
}

.mselect__settings:before {
    content: "";
    position: absolute;
    left: 3px;
    top: 3px;
    right: 3px;
    bottom: 3px;
    border-radius: 3px
}

.mselect__settings:hover {
    background: #f3f6f8
}

.mselect__avathar,
.mselect__avathar-empty,
.mselect__list .team__avatar {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 12px;
    width: 30px;
    height: 30px;
    border-radius: 4px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: .2px
}

.mselect__avathar-empty {
    background: #f3f6f8 url(/img/user.be4b8dea.svg) no-repeat 50%;
    background-size: 16px 18px
}

.mselect__input {
    position: relative;
    font-size: 1.4rem;
    color: #646464;
    border: 0;
    outline: 0;
    background: transparent;
    width: 100%;
    padding-right: 30px;
    border-bottom: 1px dashed hsla(0, 0%, 59%, .5);
    -webkit-transition: all .35s ease;
    transition: all .35s ease
}

.mselect__input::-webkit-input-placeholder {
    color: #646464;
    opacity: .4
}

.mselect__input:-moz-placeholder,
.mselect__input::-moz-placeholder {
    color: #646464;
    opacity: .4
}

.mselect__input:-ms-input-placeholder {
    color: #646464;
    opacity: .4
}

.mselect__input:focus {
    border-bottom-color: #646464
}

.mselect__submit {
    position: absolute;
    right: 15px;
    top: 13px;
    margin-top: 3px;
    background: url(/img/enter.5d6f4370.svg) no-repeat 50%;
    width: 15px;
    height: 15px;
    border-radius: 2px;
    border: 0;
    z-index: 10;
    -webkit-transition: all .4s ease;
    transition: all .4s ease
}

.editable-span span,
.editable-title span,
.methods__question-edit-text {
    display: none
}

.editable-span,
.editable-title,
.methods__question-edit,
.methods__subtitle-edit-mode {
    position: relative
}

.editable-span input,
.editable-span textarea,
.editable-title input,
.editable-title textarea,
.methods__question-edit input,
.methods__question-edit textarea,
.methods__subtitle-edit-mode input,
.methods__subtitle-edit-mode textarea {
    display: block
}

.editable-span:hover,
.editable-title:hover,
.methods__question-edit:hover,
.methods__subtitle-edit-mode:hover {
    cursor: text
}

.editable-span.js-edited:before,
.editable-title.js-edited:before,
.methods__question-edit.js-edited:before,
.methods__subtitle-edit-mode.js-edited:before {
    background: #f07320
}

.editable-span.js-edited input,
.editable-span.js-edited textarea,
.editable-title.js-edited input,
.editable-title.js-edited textarea,
.methods__question-edit.js-edited input,
.methods__question-edit.js-edited textarea,
.methods__subtitle-edit-mode.js-edited input,
.methods__subtitle-edit-mode.js-edited textarea {
    display: block
}

.editable-span.js-edited h3,
.editable-span.js-edited span,
.editable-title.js-edited h3,
.editable-title.js-edited span,
.methods__question-edit.js-edited h3,
.methods__question-edit.js-edited span,
.methods__subtitle-edit-mode.js-edited h3,
.methods__subtitle-edit-mode.js-edited span {
    display: none
}

.editable-span .methods__subtitle,
.editable-title .methods__subtitle,
.methods__question-edit .methods__subtitle,
.methods__subtitle-edit-mode .methods__subtitle {
    width: 100%
}

.editable-span:hover .methods__list-trash,
.editable-title:hover .methods__list-trash,
.methods__question-edit:hover .methods__list-trash,
.methods__subtitle-edit-mode:hover .methods__list-trash {
    opacity: 1;
    visibility: visible
}

.editable-title input,
.editable-title textarea,
.methods__subtitle-edit-mode input,
.methods__subtitle-edit-mode textarea {
    border: 0;
    background: transparent;
    outline: 0;
    width: 100%;
    height: 1.5em;
    line-height: 1.5;
    padding: 0;
    margin: 0 0 -1px;
    -webkit-appearance: none;
    resize: none;
    border-bottom: 1px dashed #fff;
    -webkit-transition: border-bottom .25s;
    transition: border-bottom .25s
}

.editable-title input::-webkit-input-placeholder,
.editable-title textarea::-webkit-input-placeholder,
.methods__subtitle-edit-mode input::-webkit-input-placeholder,
.methods__subtitle-edit-mode textarea::-webkit-input-placeholder {
    color: #3b3b3b;
    opacity: .3
}

.editable-title input:-moz-placeholder,
.editable-title input::-moz-placeholder,
.editable-title textarea:-moz-placeholder,
.editable-title textarea::-moz-placeholder,
.methods__subtitle-edit-mode input:-moz-placeholder,
.methods__subtitle-edit-mode input::-moz-placeholder,
.methods__subtitle-edit-mode textarea:-moz-placeholder,
.methods__subtitle-edit-mode textarea::-moz-placeholder {
    color: #3b3b3b;
    opacity: .3
}

.editable-title input:-ms-input-placeholder,
.editable-title textarea:-ms-input-placeholder,
.methods__subtitle-edit-mode input:-ms-input-placeholder,
.methods__subtitle-edit-mode textarea:-ms-input-placeholder {
    color: #3b3b3b;
    opacity: .3
}

.editable-title input:focus:not([readonly]),
.editable-title textarea:focus:not([readonly]),
.methods__subtitle-edit-mode input:focus:not([readonly]),
.methods__subtitle-edit-mode textarea:focus:not([readonly]) {
    color: #000;
    border-bottom: 1px dashed #1d1d1d
}

.js-inside-edit input {
    border-bottom: 1px dashed #8e8e8e;
    -webkit-transition: border-bottom .25s;
    transition: border-bottom .25s
}

.js-inside-edit input:focus {
    border-bottom: 1px dashed #1d1d1d
}

.editable-span .underline,
.editable-title .underline {
    border-bottom: 1px dashed transparent;
    -webkit-transition: border-bottom .25s;
    transition: border-bottom .25s
}

.editable-span .underline:hover,
.editable-title .underline:hover {
    border-bottom: 1px dashed #8e8e8e
}

.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.flex.h100 {
    min-height: calc(100vh - 100px);
    -webkit-user-select: none
}

.methods__col-title {
    font-size: 2.4rem;
    color: #000
}

.methods__problem-valuation {
    padding: 0 0 55px
}

.mselect__list .autocomplete .list {
    top: 100%
}

.method__intro-box {
    width: 100%;
    border-radius: 4px;
    position: relative;
    min-height: 100px;
    margin-bottom: 30px;
    overflow: hidden;
    padding: 20px
}

@media screen and (min-width:768px) {
    .method__intro-box {
        padding: 50px
    }
}

.method__intro-box[data-method-color=user-interview] {
    margin-top: 50px
}

.method__intro-box[data-method-color=user-interview] .method__intro-box-img {
    right: 100px;
    bottom: -10px;
    top: auto
}

.method__intro-box[data-method-color=user-interview] .method__intro-box-img img {
    width: 150px;
    height: auto
}

.method__intro-box[data-method-color=stakeholder-interview] {
    margin-top: 50px
}

.method__intro-box[data-method-color=stakeholder-interview] .method__intro-box-img {
    right: 80px;
    bottom: -10px;
    top: auto
}

.method__intro-box[data-method-color=stakeholder-interview] .method__intro-box-img img {
    width: 200px;
    height: auto
}

.method__intro-box[data-method-color=flows-method] {
    margin-top: 50px
}

.method__intro-box[data-method-color=flows-method] .method__intro-box-img {
    right: 80px;
    bottom: -10px;
    top: auto
}

.method__intro-box[data-method-color=flows-method] .method__intro-box-img img {
    width: 200px;
    height: auto
}

.method__intro-box-close {
    position: absolute;
    right: 21px;
    top: 21px;
    background: transparent;
    border: 0;
    padding: 0;
    width: 12px;
    height: 12px;
    outline: 0
}

.method__intro-box-play {
    background: #fff;
    width: 68px;
    height: 68px;
    border-radius: 50%;
    -webkit-box-shadow: 0 23px 24px 0 rgba(0, 0, 0, .2);
    box-shadow: 0 23px 24px 0 rgba(0, 0, 0, .2);
    border: 0;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    outline: 0;
    padding: 0;
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.method__intro-box-play:before {
    content: "";
    display: inline-block;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 17px solid #414141;
    margin-left: 4px
}

.method__intro-box-play:hover {
    -webkit-box-shadow: 0 3px 24px 0 rgba(0, 0, 0, .2);
    box-shadow: 0 3px 24px 0 rgba(0, 0, 0, .2)
}

.method__intro-box-title {
    color: #fff;
    font-size: 2rem;
    line-height: 2.4rem;
    margin: 0;
    font-weight: 400;
    max-width: 300px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    vertical-align: middle;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-left: 45px;
    position: relative;
    z-index: 10
}

.method__intro-box-title span {
    display: block;
    font-size: 1.4rem;
    line-height: 1.43;
    opacity: .7;
    padding-top: 7px
}

.method__intro-box-img {
    position: absolute;
    right: 150px;
    top: -50px;
    bottom: -50px;
    overflow: hidden
}

.method__intro-box-img img {
    display: block;
    top: 0;
    right: 0;
    height: 100%;
    -webkit-transition: all .25s ease;
    transition: all .25s ease
}

@media screen and (max-width:767px) {
    .method__intro-box-img {
        display: none
    }
}

.method-section-wrapper {
    display: block
}

.method-section-wrapper:after,
.method-section-wrapper:before {
    content: "";
    display: table;
    clear: both
}

.section-wrapper {
    display: block
}

.section-wrapper .methods__subtitle-edit-mode .methods__list-trash:hover {
    opacity: 1;
    visibility: visible
}

.section-comp {
    margin-bottom: 60px
}

.analytics__method-own-drag .dragged__item-date+div {
    width: calc(100% - 130px)
}

.analytics__method-own-drag .dragged__item-title {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.method-content {
    padding-bottom: 30px
}

.method-content:after {
    content: "";
    display: table;
    width: 100%
}

.method-content-wrapper {
    max-width: 940px;
    margin: 0 auto
}

.method-section-add-wrapper .method-section-add {
    opacity: 0;
    z-index: 20
}

@media screen and (max-width:767px) {
    .method-section-add-wrapper .method-section-add {
        opacity: 1
    }
}

.method-section-add-wrapper .method-section-add--visible,
.method-section-add-wrapper:hover .method-section-add {
    opacity: 1
}

.method-section-add {
    border-radius: 6px;
    display: block;
    width: 100%;
    background-color: #0a9250;
    position: relative;
    height: 38px;
    border: 0
}

.method-section-add:hover {
    background-color: #0a9250
}

.method-section-add:before {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 1;
    left: 0;
    top: 0;
    background-color: #0a9250;
    line-height: 3.7rem;
    color: #ffffff;
}

.header-wrap {
    height: 30px
}

.inactive_item {
    opacity: 0.3;
}

.header {
    background: #fff;
    -webkit-box-shadow: 0 1px 0 0 rgba(0, 0, 0, .04);
    box-shadow: 0 1px 0 0 rgba(0, 0, 0, .04);
    -webkit-transition: -webkit-box-shadow .3s ease;
    transition: -webkit-box-shadow .3s ease;
    transition: box-shadow .3s ease;
    transition: box-shadow .3s ease, -webkit-box-shadow .3s ease;
    position: fixed;
    right: 0;
    left: 0;
    top: 0;
    z-index: 160
}

.is-library-open .header,
.sidebar-mounted .header {
    -webkit-box-shadow: 0 1px 0 0 transparent;
    box-shadow: 0 1px 0 0 transparent;
    background-color: transparent;
}

.header__center,
.header__left,
.header__right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    pointer-events: auto
}

.header__mobile-title {
    font-size: 1.8rem;
    color: #252729;
    font-weight: 600;
    white-space: nowrap;
    max-width: 200px;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-transform: translateY(-80%);
    transform: translateY(-80%);
    -webkit-transition: all .2s;
    transition: all .2s;
    opacity: 0;
    display: none
}

@media screen and (max-width:767px) {
    .header__mobile-title {
        display: block
    }
}

.header--under-title .header__mobile-title {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1
}

.header__left,
.header__right {
    position: relative;
    width: 50px;
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s
}

@media screen and (min-width:768px) {

    .header__left,
    .header__right {
        width: calc(100% - 18px);
    }
}

@media screen and (min-width:1200px) {

    .header__left,
    .header__right {
        width: calc(100% - 18px)
    }
}

.header__left {
    padding: 0 24px;
    display: block
}

@media screen and (max-width:991px) {
    .header__left {
        padding: 0 15px
    }
}

@media screen and (max-width:767px) {
    .header__left {
        padding: 0 8px
    }
}

.header--empty .header__left {
    width: 279px
}

.header--shared .header__left {
    width: auto
}

.header__right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding-right: 15px
}

@media screen and (max-width:767px) {
    .header__right {
        padding-right: 8px
    }
}

.header .btn,
.header .method-section-add {
    padding: 9px 20px
}

.header .header__close-edit-btn {
    padding: 8px 20px;
    margin: 0 0 0 32px;
    margin-left: 20px
}

@media screen and (max-width:767px) {
    .header .header__close-edit-btn {
        width: 38px;
        height: 38px;
        border-radius: 50%;
        color: transparent;
        padding: 0;
        margin: 0;
        background-image: url(/img/close-white.5382577f.svg);
        background-repeat: no-repeat;
        background-position: 50%
    }

    .header .header__close-edit-btn span {
        color: inherit
    }
}

.header .header__upgrade-btn {
    min-width: 180px
}

@media screen and (max-width:991px) {
    .header .header__upgrade-btn {
        min-width: 140px
    }
}

@media screen and (max-width:767px) {
    .header .header__upgrade-btn {
        display: none
    }
}

.header .container-fluid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 60px;
    position: relative;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-left: 0;
    padding-right: 0
}

.header .container-fluid:after,
.header .container-fluid:before {
    display: none
}

.header--shared .container-fluid,
.header__burger {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.header__burger {
    width: 42px;
    height: 42px;
    border-radius: 4px;
    display: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    font-size: 14px
}

.header__burger:hover {
    background-color: #f8f9fa
}

.header__burger:active {
    background-color: #f0f2f5
}

@media screen and (max-width:991px) {
    .header__burger {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

.header--shared .header__burger {
    display: none
}

@media screen and (max-width:991px) {
    .header .header__logo {
        display: none
    }
}

.header--shared .header__logo,
.header-logo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.header-logo {
    cursor: pointer;
    height: 42px;
    width: auto;
    border-radius: 0px;
    font-size: 2.6rem;
    padding: 8px 12px;
    margin: 0 -12px;
    line-height: 1em;
    background-image: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.header-logo .page-avatar {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.header-logo .page-avatar:after {
    display: none
}

.header-logo__name {
    font-size: 13px;
    font-weight: 600;
    margin-left: 4px;
    margin-top: -3px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: 0.02rem;
}

.header-logo>.header-logo__custom {
    width: 26px;
    height: 26px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.header-logo>.header-logo__custom img {
    height: auto;
    width: auto;
    max-width: 100%;
    max-height: 100%;
    vertical-align: top
}

@media screen and (max-width:767px) {
    .header__project-name--methods {
        display: none
    }
}

.header__user {
    margin-left: auto;
    text-align: right;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media screen and (max-width:767px) {
    .header__user.is-hidden {
        display: none
    }
}

.header__user-image,
.header__user-name {
    display: inline-block;
    vertical-align: middle
}

.header__user-image {
    width: 38px;
    height: 38px;
    border-radius: 4px;
    background: #fbfdfd;
    text-align: center;
    cursor: pointer;
    overflow: hidden;
    line-height: 38px
}
.section_action {
    background-color: #fdfdfd;
}
.section_action:hover {
    background-color: #fcfcfc;
}
.section_action:active {
    background-color: #fbfbfb;
}

.header__user-image img {
    height: 100%
}

.header__user-name {
    margin: 0 0 0 17px;
    color: #252729;
    font-size: 1.4rem;
    font-weight: 700;
    display: inline-block;
    position: relative
}

@media screen and (min-width:480px) {
    .header__user-name {
        cursor: pointer
    }
}

.header__submenu-saved {
    font-size: 1.2rem;
    letter-spacing: .1px;
    color: #414141;
    font-weight: 400;
    position: absolute;
    left: 100%;
    visibility: hidden;
    opacity: 0;
    min-width: 53px;
    width: 120px;
    -webkit-transition: all .35s ease 1s;
    transition: all .35s ease 1s;
    display: inline-block;
    vertical-align: middle;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    margin-left: 15px
}

.header__submenu-saved:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    background: url(/img/save.501dcb93.svg) no-repeat 0 0;
    background-size: 100%;
    margin-right: 4px;
    position: relative;
    top: -2px
}

.header__submenu-saved.saving {
    visibility: visible;
    opacity: 1;
    -webkit-transition-delay: 0s;
    transition-delay: 0s
}

.header__user-register {
    margin: 0 0 0 10px;
    color: #252729;
    font-size: 1.4rem;
    font-weight: 700;
    display: none;
    vertical-align: middle;
    -webkit-transition: color .2s ease;
    transition: color .2s ease;
    cursor: pointer;
    border-radius: 100px;
    background-color: #fff;
    border: 1px solid rgba(8, 54, 87, .15);
    padding: 10px 20px;
    text-align: center;
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

@media screen and (min-width:480px) {
    .header__user-register {
        margin-left: 20px;
        display: inline-block
    }
}

@media screen and (min-width:768px) {
    .header__user-register {
        margin-left: 40px
    }
}

@media screen and (min-width:1200px) {
    .header__user-register {
        min-width: 180px
    }
}

.header__user-register:hover {
    border-color: #f07320;
    color: #f07320
}

.header__user-avathar-menu {
    width: 37px;
    height: 37px;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    margin-left: 12px
}

.header__user-avathar-menu img {
    width: 37px;
    height: 37px
}

.header__user-avathar-menu .project-box__mobile-menu {
    top: 54px
}

.header__user-avathar-menu .project-box__mobile-menu li {
    position: relative;
    padding-right: 30px
}

.header__user-avathar-menu .project-box__mobile-menu li:after {
    content: "";
    position: absolute;
    right: 10px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    display: inline-block;
    background-size: 100% 100%
}

.header__user-avathar-menu .project-box__mobile-menu li.facebook:after {
    background: url(/img/facebook-color.481d74c0.svg) no-repeat 0 0
}

.header__user-avathar-menu .project-box__mobile-menu li.twitter:after {
    background: url(/img/twitter-color.cae88d1f.svg) no-repeat 0 0
}

.header__user-avathar-menu .project-box__mobile-menu li.google:after {
    background: url(/img/google.aab968d3.svg) no-repeat 0 0
}

.header__user-avathar-menu.js-active .project-box__mobile-menu {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.guest-popup {
    text-align: center;
    cursor: auto;
    padding: 30px 40px;
    width: 320px
}

.guest-popup__close {
    position: absolute;
    right: 15px;
    top: 15px;
    padding: 0;
    border: 0;
    background: transparent;
    outline: 0
}

.guest-popup__close:active,
.guest-popup__close:focus {
    outline: 0
}

.guest-popup__close g {
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.guest-popup__close:hover g {
    stroke: #f07320
}

.guest-popup__icon {
    width: 64px;
    height: 69px;
    background: url(/img/ic-sticker-note.3a7ac118.svg) no-repeat 0 0;
    margin: 0 auto
}

.guest-popup__title {
    font-size: 1.8rem;
    font-weight: 600;
    color: #252739;
    line-height: 1.39;
    margin: 15px 0 0 0
}

.guest-popup__desc {
    font-size: 1.4rem;
    line-height: 1.43;
    color: #646464;
    font-weight: 400
}

.sidebar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    bottom: 0;
    /*border-right: 1px solid #e2e6e6;*/
    padding-top: 10px;
    background-color: #ffffff; /*#fafbfd;*/
    z-index: 200;
    -webkit-transition: all .3s !important;
    transition: all .3s !important;
    /*-webkit-backdrop-filter: blur(60px) !important;
    backdrop-filter: blur(60px) !important;
    background-color: rgba(253, 253, 253, 0.7) !important;*/
}

.sidebar__close {
    -webkit-box-shadow: 0 0 34px transparent;
    box-shadow: 0 0 34px transparent;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%)
}
.sidebar__page_close {
    margin-left: 0px !important;
}
.sidebar__wrapper_close {
    padding-left: 16px !important;
}
.sidebar__wide_close {
    padding-left: 0px !important;
}
.sidebar__builder_close {
    margin-left: -52px !important;
}

@media screen and (max-width:991px) {
    .sidebar {
        -webkit-box-shadow: 0 0 34px transparent;
        box-shadow: 0 0 34px transparent;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }

    .sidebar--open {
        -webkit-box-shadow: 0 0 34px rgba(0, 0, 0, .14);
        box-shadow: 0 0 34px rgba(0, 0, 0, .14);
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    .builder-content--editable {
        margin: 0 auto;
    }

    .library {
        -webkit-box-shadow: 0 0 34px transparent;
        box-shadow: 0 0 34px transparent;
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }
    .container {
        width: 750px
    }
}

@media screen and (max-width:1030px) {
    .sidebar {
        -webkit-box-shadow: 0 0 34px transparent;
        box-shadow: 0 0 34px transparent;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }

    .sidebar--open {
        -webkit-box-shadow: 0 0 34px rgba(0, 0, 0, .14);
        box-shadow: 0 0 34px rgba(0, 0, 0, .14);
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    .builder-content--editable {
        margin: 0 auto;
    }

    .library {
        -webkit-box-shadow: 0 0 34px transparent;
        box-shadow: 0 0 34px transparent;
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }
    .container {
        width: 750px
    }
}

@media screen and (max-width:1200px) {
    .library {
        -webkit-box-shadow: 0 0 34px transparent;
        box-shadow: 0 0 34px transparent;
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }
    .md-wrapper, .small-wrapper {
        padding-right: 0px;
    }
    .crono-content-global {
        width: calc(100% - -86px);
    }
}

.sidebar__logo {
    margin-bottom: 16px
}

@media screen and (min-width:992px) {
    .sidebar__logo {
        display: none
    }
}

.sidebar__scroll {
    height: 100%
}

.sidebar__scroll .ps__rail-x,
.sidebar__scroll .ps__rail-y {
    display: none
}

.sidebar__body {
    padding: 0;
    position: relative
}

.sidebar__body .sidebar__foot:before,
.sidebar__body:before {
    position: sticky;
    content: "";
    width: 100%;
    height: 36px;
    pointer-events: none;
    -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, .1);
    box-shadow: 0 0 15px rgba(0, 0, 0, .1);
    margin-left: -20%;
    -webkit-transition: all .2s;
    transition: all .2s;
    display: block
}

.sidebar__body:before {
    top: -36px;
    margin-top: -36px;
    z-index: 10
}

.sidebar__body .sidebar__foot:before {
    margin-top: 0;
    top: 0;
    position: absolute;
    z-index: -1
}

.sidebar__body--scrolledBottom .sidebar__foot:before,
.sidebar__body--scrolledTop:before {
    opacity: 0
}

.sidebar__body-scrollable {
    position: relative;
    padding: 0 15px
}

.sidebar__foot {
    padding: 9px 24px;
    position: sticky;
    margin-left: -24px;
    margin-right: -24px;
    z-index: 12;
    font-size: 1.5rem
}

.sidebar__foot,
.sidebar__foot:after {
    bottom: 0;
    left: 0;
    right: 0;
    /*background-color: #fff*/
}

.sidebar__foot:after {
    content: "";
    position: absolute;
    top: 0;
    z-index: -1
}

.sidebar .content-transition {
    margin-left: -12px;
    padding-left: 12px
}

.sidebar__project-name {
    display: block;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 5px;
    color: #62656a;
    cursor: pointer;
    padding: 8px 12px;
    margin: 0 -12px;
    border-radius: 4px
}

.sidebar__project-name:focus,
.sidebar__project-name:hover {
    text-decoration: none;
    color: #3b3b3b;
    background-color: #f8f9fa
}

.sidebar__project-name:active {
    background-color: #f0f2f5
}

.sidebar__project {
    border-top: 1px solid #f0f2f5;
    padding: 0 24px;
    margin: 0 -24px;
    padding-top: 20px;
    margin-top: 24px
}

.sidebar-menu {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 1.5rem
}

.sidebar-menu li:last-child {
    margin-bottom: 0
}

.sidebar-menu .sortable-fallback {
    opacity: 1 !important
}

.sidebar-dropdown {
    margin: 6px 0
}

.sidebar-dropdown__content {
    padding-left: 29px
}

.sidebar-link {
    color: #222;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 12px 10px;
    margin: 3px -13px;
    -webkit-transition: all .2s;
    transition: all .2s;
    border-radius: 10px;
    text-shadow: 0px -1px 0px #ffffff1f;

    font-size: 1.43rem;
    font-weight: 400;
    letter-spacing: 0.02rem;
    position: relative;
    font-family: "Mona Sans", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-variation-settings: "wdth" 100;
}

.sidebar-link.inner {
    padding-left: 30px;
}

.sidebar-link:focus,
.sidebar-link:hover {
    text-decoration: none;
    color: #222;
    /*background-color: #f3f3f3;*/ /*f8f9fa*/
}

.sidebar-link:active {
    background-color: #f3f3f3
}

.sidebar-link--active {
    background-color: #f6f6f6; /*f4f6fc;*/ /*f4f6fc*/
    color: #222;
    letter-spacing: 0.02rem;
}
.sidebar-link-site--active {
    color: #111;
    letter-spacing: 0.02rem;
    font-weight: 600;
    border-left: 2px solid #444;
}
.sidebar-link .count {
    background-color: #efefefe0;
    position: absolute;
    right: 6px;
    top: 6px;
    font-size: 1.1rem;
    padding-bottom: 5px;
    padding-left: 8px;
    padding-right: 8px;
    padding-top: 4px;
    border-radius: 10px;
    color: #646464;
}
.sidebar-link--active .count {
    background-color: #eceef0;
}

.sidebar-link--ghost {
    color: #9b9b9e;
    font-size: 1.1rem;
    text-transform: uppercase;
    letter-spacing: .03rem;
    padding-top: 8px;
    font-weight: 600;
    padding-bottom: 8px;
    position: relative
}

.sidebar-link--ghost:active,
.sidebar-link--ghost:focus,
.sidebar-link--ghost:hover {
    cursor: default;
    background-color: transparent;
    color: rgba(59, 59, 59, .5)
}

.sidebar-link>.icon,
.sidebar-link>.method-icon,
.sidebar-link>.tag-color-icon {
    display: inline-block;
    font-size: 13px;
    margin-left: 2px;
    margin-right: 12px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    opacity: 1;
    margin-top: -2px;
}

.sidebar-link>.method-icon {
    font-size: 24px
}

.sidebar-link>.tag-color-icon {
    font-size: 8px;
    margin-left: 8px;
    margin-right: 20px
}

.sidebar-link__arrow-icon {
    width: 17px;
    height: 17px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    opacity: .5;
    font-size: 10px;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transform-origin: center;
    transform-origin: center;
    margin-right: 12px
}

.sidebar-link__arrow-icon--active {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
}

.sidebar-link__arrow-icon:hover {
    opacity: .9
}

.sidebar-link__action-icon {
    font-size: 10px;
    position: absolute;
    right: 12px;
    top: 60%;
    margin-top: -8px;
    cursor: pointer
}

.sidebar-link__action-icon .icon {
    vertical-align: top
}

.sidebar-link .sortable-handler {
    position: absolute;
    top: 50%;
    margin-top: -12px;
    left: -24px;
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s
}

.sidebar-link:hover .sortable-handler {
    opacity: 1
}

.projects__wrapper {
    text-align: center
}

.projects__wrapper .project-box {
    text-align: left
}

.projects-grid {
    margin: 0 0 -30px -30px;
    margin-top: 40px
}

.projects-grid__item {
    float: left;
    width: 25%;
    padding: 0 0 30px 30px
}

@media screen and (max-width:1199px) {
    .projects-grid__item {
        width: 33.3333%
    }
}

@media screen and (max-width:991px) {
    .projects-grid__item {
        width: 50%
    }
}

@media screen and (max-width:767px) {
    .projects-grid__item {
        width: 100%
    }
}

@media screen and (max-width:1300px) {
    .col-hidden-4 {
        -webkit-box-shadow: 0 0 34px transparent;
        box-shadow: 0 0 34px transparent;
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
        display: none;
    }
}

.project-loader-box {
    height: 200px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: rgba(239, 243, 244, .5);
    border-radius: 3px
}

.project-box {
    height: 200px;
    width: 262.5px;
    background: #fff;
    border-radius: 3px;
    -webkit-box-shadow: 0 0 0 0 #f3f4f4;
    box-shadow: 0 0 0 0 #f3f4f4;
    display: block;
    vertical-align: top;
    padding: 21px 18px;
    position: relative;
    cursor: pointer
}

@media screen and (max-width:1199px) {
    .project-box {
        width: 100%
    }
}

.project-box .icon-locked {
    display: none
}

.project-box.locked {
    cursor: not-allowed
}

.project-box.locked>* {
    cursor: not-allowed !important
}

.project-box.locked .icon-locked {
    display: inline-block
}

.project-box:active,
.project-box:focus,
.project-box:hover,
.project-box:visited {
    text-decoration: none
}

.project-box:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: block;
    z-index: 0;
    -webkit-transition: -webkit-box-shadow .35s ease;
    transition: -webkit-box-shadow .35s ease;
    transition: box-shadow .35s ease;
    transition: box-shadow .35s ease, -webkit-box-shadow .35s ease
}

.project-box.aos-init,
.project-box:before {
    -webkit-box-shadow: 0 15px 18px 0 #f3f4f4;
    box-shadow: 0 15px 18px 0 #f3f4f4
}

.project-box.aos-init {
    -webkit-transition: all .35s ease .4s;
    transition: all .35s ease .4s
}

.project-box:hover {
    -webkit-transition-delay: 0s !important;
    transition-delay: 0s !important
}

.project-box:hover:before {
    -webkit-box-shadow: 0 15px 35px 0 #e6e8e8;
    box-shadow: 0 15px 35px 0 #e6e8e8
}

.project-box:hover .project-box__shapes:before {
    -webkit-transform: translateY(15px);
    transform: translateY(15px)
}

.project-box:hover .project-box__shapes:after {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px)
}

.project-box:hover .rounded-rectangle:after {
    -webkit-transform: translateY(-15px) rotate(45deg);
    transform: translateY(-15px) rotate(45deg)
}

.project-box:hover .hexagon i {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px)
}

.project-box.new,
.project-box.without-shadow {
    -webkit-box-shadow: none;
    box-shadow: none
}

.project-box.new {
    background: #eef3f4;
    border-radius: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition-delay: 0s !important;
    transition-delay: 0s !important
}

.project-box.new .btn,
.project-box.new .method-section-add {
    -webkit-box-shadow: 0 15px 18px 0 hsla(0, 0%, 64%, .06);
    box-shadow: 0 15px 18px 0 hsla(0, 0%, 64%, .06)
}

.project-box.new:hover {
    background: #d8dee2;
    -webkit-box-shadow: 0 0 0 0 #f3f4f4;
    box-shadow: 0 0 0 0 #f3f4f4
}

.project-box.new:hover .btn,
.project-box.new:hover .method-section-add {
    -webkit-box-shadow: 0 0 28px 0 hsla(0, 0%, 64%, .1);
    box-shadow: 0 0 28px 0 hsla(0, 0%, 64%, .1)
}

.project-box.with-shapes {
    overflow: hidden
}

@media screen and (max-width:767px) {
    .project-box.with-shapes {
        padding-right: 92px
    }

    .project-box.with-shapes br {
        display: none
    }
}

.project-box__dots {
    position: absolute;
    right: 8px;
    top: 8px;
    border: 0;
    padding: 0;
    height: 22px;
    background: transparent;
    display: block;
    padding: 3px;
    cursor: pointer;
    outline: 0
}

.project-box__dots i {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: #ababb6;
    display: block
}

.project-box__dots i:after,
.project-box__dots i:before {
    content: "";
    position: absolute;
    top: 13px;
    left: 3px;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: #ababb6
}

.project-box__dots i:after {
    top: 8px
}

@media screen and (min-width:768px) {
    .project-box__dots {
        top: 0;
        right: 0;
        padding: 45px 12px 20px 30px
    }

    .project-box__dots i {
        top: 50%;
        left: 50%;
        position: absolute
    }

    .project-box__dots i:before {
        top: -6px;
        left: 0
    }

    .project-box__dots i:after {
        top: 6px;
        left: 0
    }
}

.project-box__dots.is-active~.project-box__mobile-menu {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.project-box__mobile-menu {
    border-radius: 3px;
    background-color: #fff;
    -webkit-box-shadow: 0 15px 18px 0 rgba(0, 0, 0, .06);
    box-shadow: 0 15px 18px 0 rgba(0, 0, 0, .06);
    border: 1px solid hsla(0, 0%, 93%, .62);
    padding: 10px 0;
    margin: 0;
    list-style: none;
    position: absolute;
    right: 0;
    top: 40px;
    z-index: 99;
    width: 260px;
    -webkit-transition: all .25s ease;
    transition: all .25s ease;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(15px);
    transform: translateY(15px);
    text-transform: none
}

.project-box__mobile-menu:after {
    border-bottom: 8px solid #fff;
    top: -7px;
    color: #fff
}

.project-box__mobile-menu:after,
.project-box__mobile-menu:before {
    content: "";
    display: block;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    position: absolute;
    right: 3px
}

.project-box__mobile-menu:before {
    border-bottom: 8px solid hsla(0, 0%, 93%, .62);
    top: -8px;
    color: hsla(0, 0%, 93%, .62)
}

.project-box__mobile-menu li {
    font-size: 1.4rem;
    line-height: 1.43;
    text-align: left;
    color: #646464;
    padding: 10px 20px !important;
    -webkit-transition: all .35s ease;
    transition: all .35s ease;
    cursor: pointer;
    margin: 0 !important
}

.project-box__mobile-menu li:hover {
    background-color: #f8f9fa
}

.project-box__mobile-menu li:active {
    background-color: #f0f2f5
}

@media screen and (min-width:768px) {
    .project-box__mobile-menu {
        top: 55px;
        right: 4px;
        width: 217px
    }
}

.project-box__shapes {
    position: absolute;
    bottom: 55px;
    left: 50%;
    width: 100px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

@media screen and (max-width:767px) {
    .project-box__shapes {
        bottom: -10px;
        left: 90%
    }
}

@media screen and (min-width:992px) and (max-width:1199px) {
    .project-box__shapes {
        bottom: 35px
    }
}

.project-box__shapes:before {
    content: "";
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background: #f3f6f8;
    display: block;
    left: 50%;
    -webkit-transition: all .25s ease;
    transition: all .25s ease
}

.project-box__shapes:after {
    -webkit-transition: all .35s ease;
    transition: all .35s ease
}

.project-box__shapes.triangle:before {
    background: #ffe7d6
}

.project-box__shapes.triangle:after {
    content: "";
    position: absolute;
    display: block;
    top: 39px;
    left: 34px;
    border-top: 67px solid transparent;
    border-left: 67px solid #f07320
}

.project-box__shapes.rounded-rectangle:before {
    background: #d1d3ee
}

.project-box__shapes.rounded-rectangle:after {
    content: "";
    position: absolute;
    display: block;
    top: 12px;
    left: -2px;
    width: 58px;
    height: 58px;
    background: #b064bf;
    border-radius: 22px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.project-box__shapes.hexagon:before {
    background: #cae5e8
}

.project-box__shapes.hexagon i {
    width: 72px;
    height: 43px;
    background: #64b6bf;
    position: absolute;
    top: 46px;
    left: 34px;
    -webkit-transition: all .35s ease;
    transition: all .35s ease
}

.project-box__shapes.hexagon i:before {
    top: -20px;
    border-bottom: 20px solid #64b6bf
}

.project-box__shapes.hexagon i:after,
.project-box__shapes.hexagon i:before {
    content: "";
    position: absolute;
    left: 0;
    width: 0;
    height: 0;
    border-left: 36px solid transparent;
    border-right: 36px solid transparent
}

.project-box__shapes.hexagon i:after {
    bottom: -20px;
    border-top: 20px solid #64b6bf
}

.project-box__name {
    font-size: 1.8rem;
    font-weight: 600;
    color: #252729;
    margin: 0;
    padding-right: 15px;
    max-width: 100%;
    overflow: hidden;
    overflow-wrap: break-word;
    word-wrap: break-word
}

.project-box__desc {
    font-size: 1.3rem;
    font-weight: 500;
    color: #8a8a8a;
    margin: 0
}

.project-box__completed {
    font-size: 1.4rem;
    color: #646464;
    position: absolute;
    right: 18px;
    left: 18px;
    bottom: 30px
}

@media screen and (max-width:767px) {
    .project-box__completed {
        bottom: 10px
    }

    .project-box__completed svg {
        top: -25px
    }
}

.project-box__completed .methods__list-answer-avathars {
    bottom: 0;
    right: -5px;
    top: auto;
    margin: 0
}

.project-box__completed .methods__list-answer-avathars span {
    top: 0;
    height: 28px;
    width: 28px;
    font-size: 1.3rem
}

.project-box__completed .methods__list-answer-avathars:after,
.project-box__completed .methods__list-answer-avathars:before {
    display: none
}

.project-box__pie {
    position: absolute;
    right: 53px;
    top: -23px;
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg)
}

.project-box__pie circle {
    stroke-dasharray: 114;
    stroke: #f9dccd;
    stroke-width: 5px
}

.project-box__pie .path-circle,
.project-box__pie circle {
    -webkit-transition: all .35s linear;
    transition: all .35s linear
}

.project-box__pie .path-circle {
    stroke-dashoffset: 114;
    stroke: #f07320
}

@media screen and (max-width:767px) {
    .project-box__pie {
        right: 35px;
        top: -10px
    }
}

.project-titles__name {
    display: inline-block;
    text-overflow: ellipsis;
    word-wrap: break-word;
    overflow: hidden;
    height: 33px;
    white-space: nowrap;
    width: 100%
}

.main__title {
    font-size: 2.6rem;
    color: #000;
    font-weight: 400;
    letter-spacing: -.1px;
    margin: 0 0 50px;
    line-height: 4rem
}

.main__title input {
    height: 49px;
    margin: -5px 0 -4px 0;
    display: inline-block;
    outline: 0;
    border: 0;
    width: 100%;
    background: transparent;
    border-bottom: 1px dashed #8e8e8e;
    -webkit-transition: border-bottom .25s;
    transition: border-bottom .25s
}

.main__title input:focus {
    border-bottom: 1px dashed #1d1d1d
}

.main__drag-wrapper {
    min-height: 250px;
    border: 1px dashed #dae1e6;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    color: #4a4a4a;
    padding: 30px;
    position: relative
}

@media screen and (max-width:767px) {
    .main__drag-wrapper {
        display: none
    }
}

.main__drag-fake-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;
    display: block;
    width: 100%;
    height: 100%
}

.main__drag-fake-wrapper .sortable-ghost {
    min-height: 120px;
    text-indent: -9999px
}

.main__choose-method-mobile {
    height: 100px;
    border-radius: 4px;
    background-color: #fbfdfd;
    border: 1px dashed #dae1e6;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 1.4rem;
    color: #fa8c25;
    font-weight: 600;
    position: relative;
    padding: 20px;
    cursor: pointer
}

.main__choose-method-mobile select {
    position: absolute;
    top: 0;
    cursor: pointer;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    opacity: 0
}

@media screen and (min-width:768px) {
    .main__choose-method-mobile {
        display: none
    }
}

.drag__title {
    font-size: 2.4rem;
    margin: 0;
    text-align: center
}

.drag__desc {
    font-size: 1.4rem;
    line-height: 1.71;
    text-align: center;
    max-width: 310px;
    position: relative;
    z-index: 99
}

.drag__desc a,
.drag__desc span {
    color: #f07320;
    font-weight: 700;
    cursor: pointer
}

.aside__title {
    font-size: 2.4rem;
    color: #4a4a4a;
    font-weight: 400;
    margin: 0 0 8px
}

.aside__subtitle {
    font-size: 1.6rem;
    line-height: 1.63;
    color: #4a4a4a;
    margin: 25px 0 16px
}

.aside__method {
    font-size: 1.1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .8px;
    color: #4a4a4a;
    background: #fff;
    border-radius: 2px;
    cursor: pointer;
    padding: 15px 22px 14px;
    -webkit-box-shadow: 0 10px 18px 0 #f3f4f4;
    box-shadow: 0 10px 18px 0 #f3f4f4;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin: 0 0 8px 0;
    position: relative;
    -webkit-transition: all .35s ease;
    transition: all .35s ease
}

.aside__method:after {
    content: "";
    position: absolute;
    right: 15px;
    top: 50%;
    -webkit-transform: translateY(-50%) scale(0);
    transform: translateY(-50%) scale(0);
    background: #fa8c25;
    border-radius: 50%;
    width: 10px;
    height: 10px
}

.aside__method:hover {
    -webkit-box-shadow: 0 10px 18px 0 #e6e8e8;
    box-shadow: 0 10px 18px 0 #e6e8e8
}

.aside__method.selectable:after {
    -webkit-animation: methodDot .8s ease;
    animation: methodDot .8s ease
}

.aside__method.add-new:before {
    content: "";
    width: 8px;
    height: 8px;
    background: url(/img/icon-plus.f39cdcc3.svg) no-repeat 0 0;
    background-size: 100% 100%;
    display: inline-block;
    margin-right: 17px
}

.aside__method.sortable-fallback {
    opacity: 1;
    display: block;
    -webkit-transition: none !important;
    transition: none !important;
    left: auto;
    right: auto
}

.aside__method.disabled,
.aside__method[draggable=false] {
    opacity: .2;
    -webkit-box-shadow: none;
    box-shadow: none;
    cursor: auto
}

@-webkit-keyframes methodDot {
    0% {
        -webkit-transform: translateY(-50%) scale(0);
        transform: translateY(-50%) scale(0)
    }

    50% {
        -webkit-transform: translateY(-50%) scale(1);
        transform: translateY(-50%) scale(1)
    }

    to {
        -webkit-transform: translateY(-50%) scale(0);
        transform: translateY(-50%) scale(0)
    }
}

@keyframes methodDot {
    0% {
        -webkit-transform: translateY(-50%) scale(0);
        transform: translateY(-50%) scale(0)
    }

    50% {
        -webkit-transform: translateY(-50%) scale(1);
        transform: translateY(-50%) scale(1)
    }

    to {
        -webkit-transform: translateY(-50%) scale(0);
        transform: translateY(-50%) scale(0)
    }
}

.method-box__link:active,
.method-box__link:hover,
.method-box__link:visited {
    text-decoration: none
}

.dragged {
    margin: 0;
    padding: 0;
    list-style: none
}

@media screen and (max-width:767px) {
    .dragged .dragged__item {
        position: relative
    }

    .dragged .dragged__item .dragged__item-date {
        border-right: 0
    }

    .dragged .dragged__item .dragged__item-dots {
        position: absolute;
        right: 8px;
        top: 8px;
        border: 0;
        padding: 0;
        height: 22px;
        background: transparent;
        display: block;
        padding: 3px;
        cursor: pointer;
        outline: 0
    }

    .dragged .dragged__item .dragged__item-dots i {
        width: 3px;
        height: 3px;
        border-radius: 50%;
        background: #fff;
        display: block
    }

    .dragged .dragged__item .dragged__item-dots i:after,
    .dragged .dragged__item .dragged__item-dots i:before {
        content: "";
        position: absolute;
        top: 15px;
        left: 3px;
        width: 3px;
        height: 3px;
        border-radius: 50%;
        background: #fff
    }

    .dragged .dragged__item .dragged__item-dots i:after {
        top: 5px
    }

    .dragged .dragged__item .dragged__item-dots.is-active~.project-box__mobile-menu {
        opacity: 1;
        visibility: visible;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@media screen and (min-width:768px) {
    .dragged .dragged__item {
        cursor: move;
        cursor: grab;
        cursor: -webkit-grab
    }

    .dragged .dragged__item .dragged__item-dots {
        display: none
    }
}

.dragged .dragged__item .dragged__item-date {
    cursor: pointer
}

.dragged .dragged__item .dragged__item-date span {
    position: relative
}

.dragged .dragged__item .dragged__item-date span:after {
    content: "";
    position: absolute;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid #fff;
    right: -13px;
    top: -8px
}

@media screen and (min-width:768px) {
    .dragged .dragged__item .dragged__item-date span:after {
        right: -15px;
        top: -8px
    }
}

.dragged.final,
.dragged.final .dragged__item-date {
    cursor: pointer
}

.dragged.final .dragged__item-date span:after {
    display: none
}

.dragged.final .dragged__item {
    cursor: pointer
}

.dragged.final .cursor .dragged__item {
    cursor: move;
    cursor: grab;
    cursor: -webkit-grab
}

.dragged .aside__method {
    background: #dae7ed !important;
    opacity: 1;
    color: #bac7cd;
    min-height: 121px;
    border-radius: 4px
}

.dragged .aside__method>* {
    visibility: hidden;
    opacity: 0
}

.dragged .aside__method.sortable-ghost {
    background: #e9e9e9 !important
}

.dragged__parent.sortable-ghost {
    text-indent: -9999px;
    height: 121px;
    margin-bottom: 10px;
    font-size: 0;
    overflow: hidden;
    background: #e9e9e9;
    border-radius: 4px
}

.dragged__parent.sortable-ghost>* {
    opacity: 0;
    visibility: hidden
}

@-webkit-keyframes ghost {
    0% {
        -webkit-transform: scale(.9);
        transform: scale(.9);
        opacity: 0
    }

    to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes ghost {
    0% {
        -webkit-transform: scale(.9);
        transform: scale(.9);
        opacity: 0
    }

    to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.dragged__parent.sortable-fallback {
    opacity: 1 !important
}

.dragged__parent.sortable-fallback .dragged__item {
    -webkit-transform: rotate(-6deg);
    transform: rotate(-6deg);
    -webkit-box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21);
    box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21)
}

.dragged__item {
    width: 100%;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-transition: all .35s ease;
    transition: all .35s ease;
    -webkit-transition: background .3s ease;
    transition: background .3s ease;
    position: relative
}

.dragged__item[data-calendar-opened] {
    z-index: 10
}

.dragged__item[draggable=true]>* {
    opacity: 1
}

.dragged__item[draggable=true] .dragged__mobile-calendar,
.dragged__item[draggable=true] .project-box__mobile-menu {
    display: none
}

.dragged__item[draggable=true] .vdp-datepicker__calendar {
    position: absolute;
    z-index: 9999
}

.dragged__item.sortable-ghost {
    background: #dae7ed !important;
    color: #bac7cd
}

.dragged__item.sortable-ghost>* {
    visibility: hidden;
    opacity: 0
}

.dragged__item.js-empty .dragged__item-img {
    opacity: .35
}

.dragged__item:hover .dragged__item-remove {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 2
}

.dragged__item:hover .dragged__item-img img {
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.dragged__item.calendar-open .vdp-datepicker__calendar {
    -webkit-transform: translateX(0);
    transform: translateX(0)
}

.dragged__mobile-calendar {
    display: block;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 60px;
    height: 100%;
    z-index: 100
}

.dragged__mobile-calendar:active,
.dragged__mobile-calendar:focus,
.dragged__mobile-calendar:hover {
    opacity: 0
}

@media screen and (min-width:768px) {
    .dragged__mobile-calendar {
        display: none
    }
}

.dragged__item-datepicker {
    position: absolute
}

.dragged__item-datepicker-input {
    display: none
}

.vdp-datepicker {
    position: absolute;
    left: -68px;
    top: 40px;
    z-index: 11
}

.vdp-datepicker__calendar {
    position: absolute;
    left: 120px;
    top: 50px;
    -webkit-transform: translateX(-15px);
    transform: translateX(-15px);
    -webkit-transition: all .35s ease;
    transition: all .35s ease;
    background: #fff;
    border: 0;
    border-radius: 6px;
    -webkit-box-shadow: 0 0 18px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 0 18px 0 rgba(0, 0, 0, .1);
    width: 388px;
    min-height: 324px;
    padding: 15px
}

.vdp-datepicker__calendar .cell {
    color: #646464 !important;
    font-size: 1.4rem !important;
    border-radius: 50% !important;
    height: auto !important;
    position: relative !important
}

.vdp-datepicker__calendar .cell:not(.day-header):before {
    content: "";
    width: 40px;
    height: 40px;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    border-radius: 50%;
    z-index: -1
}

.vdp-datepicker__calendar .cell:hover {
    border-color: transparent !important;
    background: transparent !important
}

.vdp-datepicker__calendar .cell:hover:before {
    background: hsla(0, 0%, 39%, .1)
}

.vdp-datepicker__calendar .cell.selected {
    color: #fff !important;
    background: #f07320 !important
}

.vdp-datepicker__calendar .cell.selected:before {
    background-color: #f07320 !important
}

.vdp-datepicker__calendar .cell.day-header {
    font-size: 1.4rem !important;
    opacity: .65 !important;
    color: #646464 !important
}

.vdp-datepicker__calendar header {
    font-size: 0 !important
}

.vdp-datepicker__calendar header .next,
.vdp-datepicker__calendar header .prev {
    float: none !important;
    border-radius: 50%;
    position: relative;
    width: 30px !important
}

.vdp-datepicker__calendar header .next:before,
.vdp-datepicker__calendar header .prev:before {
    content: "";
    width: 22px;
    height: 22px;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    background: #f7f8fc;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
    border-radius: 50%;
    z-index: -1;
    border: 0 !important
}

.vdp-datepicker__calendar header .next:after,
.vdp-datepicker__calendar header .prev:after {
    content: "";
    width: 8px;
    height: 11px;
    background: url(/img/calendar-arrow.494234c5.svg) no-repeat 0 0;
    background-size: 100% 100%;
    border: 0 !important;
    margin: 0 !important
}

.vdp-datepicker__calendar header .next:hover,
.vdp-datepicker__calendar header .prev:hover {
    background: transparent !important
}

.vdp-datepicker__calendar header .next:hover:before,
.vdp-datepicker__calendar header .prev:hover:before {
    background: #f3f4f4
}

.vdp-datepicker__calendar header .prev {
    margin-left: 15px !important;
    margin-right: 0
}

.vdp-datepicker__calendar header .next {
    -webkit-transform: scaleX(-1) !important;
    transform: scaleX(-1) !important
}

.vdp-datepicker__calendar header .up {
    color: #6b7897 !important;
    font-size: 1.5rem !important;
    float: left !important;
    text-align: left !important
}

.vdp-datepicker__calendar header .up:hover {
    background: transparent !important;
    color: #f07320
}

.vdp-datepicker__calendar header .next:not(.disabled):hover,
.vdp-datepicker__calendar header .prev:not(.disabled):hover,
.vdp-datepicker__calendar header .up:not(.disabled):hover {
    background: transparent !important
}

.vdp-datepicker__calendar .cell:not(.blank):not(.disabled).day:hover,
.vdp-datepicker__calendar .cell:not(.blank):not(.disabled).month:hover,
.vdp-datepicker__calendar .cell:not(.blank):not(.disabled).year:hover {
    border-color: transparent !important
}

.vdp-datepicker__calendar .cell.selected,
.vdp-datepicker__calendar .cell.selected.highlighted,
.vdp-datepicker__calendar .cell.selected:hover {
    background: transparent !important
}

.method-box__link:active,
.method-box__link:focus {
    text-decoration: none;
    outline: 0
}

.method-box__link:active .dragged__item-title,
.method-box__link:focus .dragged__item-title {
    color: #fff;
    text-decoration: none
}

.dragged__item-remove {
    background: url(/img/delete-circle.ca4e124f.svg) no-repeat right 0;
    background-size: 31px 31px;
    width: 61px;
    height: 31px;
    position: absolute;
    padding-left: 30px;
    right: -40px;
    top: 50%;
    display: block;
    -webkit-transform: translateY(-20%);
    transform: translateY(-20%);
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    border: 0;
    opacity: 0;
    visibility: hidden;
    outline: 0
}

@media screen and (max-width:767px) {
    .dragged__item-remove {
        display: none
    }
}

@media screen and (min-width:992px) {
    .dragged__item-remove {
        right: -53px
    }
}

.edit-finished {
    width: 100%;
    max-width: 730px;
    margin: 0 auto;
    padding: 0 15px;
    display: block;
    margin-bottom: 60px
}

@media screen and (max-width:767px) {
    .edit-finished {
        padding: 0 5px
    }
}

.edit-finished__title {
    font-size: 2.5rem;
    color: #1d1d1d;
    font-weight: 400;
    margin: 24px 0 36px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.edit-finished__title .btn,
.edit-finished__title .method-section-add {
    vertical-align: middle;
    display: block;
    position: relative;
    padding: 8px 35px
}

@media screen and (max-width:767px) {
    .edit-finished__title {
        padding-right: 70px;
        position: relative
    }

    .edit-finished__title .share__icon {
        position: absolute;
        right: 0;
        top: 7px;
        margin-top: 0
    }

    .edit-finished__title .share__icon.edit {
        right: 40px
    }

    .edit-finished__title .share__info {
        width: 280px;
        right: 20px
    }

    .edit-finished__title .share__info.is-active {
        width: 248px
    }

    .edit-finished__title .share__info.is-active p {
        width: 100%
    }
}

@media screen and (min-width:768px) {
    .edit-finished__title {
        font-size: 3.4rem
    }

    .edit-finished__title .btn,
    .edit-finished__title .method-section-add {
        display: inline-block;
        margin-left: 20px;
        top: -5px
    }
}

.edit-finished__title.js-shared {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.edit-finished__title .main__title {
    width: 100%;
    margin-bottom: 20px
}

.edit-finished__title .main__title input {
    border-bottom: 1px dashed #fff;
    -webkit-transition: border-bottom .25s;
    transition: border-bottom .25s
}

.edit-finished__title .main__title input:hover {
    border-bottom: 1px dashed #8e8e8e
}

.edit-finished__title .main__title input:focus {
    border-bottom: 1px dashed #1d1d1d
}

.method__edit-sections {
    -webkit-user-select: none
}

@media screen and (min-width:768px) {
    .method__edit-sections {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: stretch;
        -ms-flex-align: stretch;
        align-items: stretch
    }
}

.method__edit-sections .dragged.hasmethod {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative
}

.method__edit-sections .main__title input {
    display: inline-block;
    outline: 0;
    border: 0;
    width: 100%;
    background: transparent;
    border-bottom: 1px dashed #8e8e8e;
    -webkit-transition: border-bottom .25s;
    transition: border-bottom .25s
}

.method__edit-sections .main__title input:focus {
    border-bottom: 1px dashed #1d1d1d
}

.share__icon {
    width: 22px;
    height: 22px;
    display: inline-block;
    vertical-align: middle;
    border: 0;
    background: transparent;
    font-size: 1rem;
    letter-spacing: .8px;
    color: #555;
    text-transform: uppercase;
    padding: 24px 0 0 0;
    float: right;
    position: relative;
    margin-left: 25px;
    margin-top: 23px;
    outline: 0;
    stroke-width: 1px
}

.share__icon span.share__btn-text {
    opacity: 0;
    position: absolute;
    bottom: -18px;
    left: 50%;
    -webkit-transform: translate(-50%, 10px);
    transform: translate(-50%, 10px);
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.share__icon:hover span.share__btn-text {
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    opacity: 1
}

.share__icon.remove {
    background: url(/img/trash3.3017128a.svg) no-repeat 50%;
    background-size: 100% 100%
}

.share__icon.edit {
    background: url(/img/edit.07fa5c57.svg) no-repeat 50%;
    background-size: 100% 100%
}

.share__icon.question {
    background: url(/img/question.32d95b17.svg) no-repeat 50%;
    background-size: 100% 100%
}

.share__info {
    opacity: 0;
    visibility: hidden;
    background: #fff;
    -webkit-box-shadow: 0 12px 23px 0 rgba(0, 0, 0, .12);
    box-shadow: 0 12px 23px 0 rgba(0, 0, 0, .12);
    border-radius: 6px;
    border: 1px solid #f2f2f2;
    position: absolute;
    top: 40px;
    right: 50%;
    padding: 20px;
    -webkit-transform: translate(50%, 10px);
    transform: translate(50%, 10px);
    text-align: left;
    z-index: 100;
    min-width: 90px;
    -webkit-transition: all .25s ease;
    transition: all .25s ease
}

.share__info .g-switch {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

@media screen and (max-width:479px) {
    .share__info {
        width: 290px;
        -webkit-transform: translateX(10px);
        transform: translateX(10px)
    }
}

@media screen and (max-width:1199px) {
    .share__info {
        right: 0;
        -webkit-transform: translateX(30px);
        transform: translateX(30px)
    }
}

.share__info.is-active {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translate(50%);
    transform: translate(50%)
}

@media screen and (max-width:1199px) {
    .share__info.is-active {
        -webkit-transform: translate(30px);
        transform: translate(30px)
    }
}

@media screen and (max-width:479px) {
    .share__info.is-active {
        width: 290px;
        -webkit-transform: translateX(15px);
        transform: translateX(15px)
    }
}

.share__info-txt {
    font-size: 1.6rem;
    line-height: 1.63;
    color: #414141;
    text-transform: none;
    width: 307px;
    text-align: left;
    position: relative;
    padding-left: 50px;
    padding-bottom: 20px;
    margin: 0 0 20px
}

.share__info-txt:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: -20px;
    right: -20px;
    background: #f2f2f2;
    height: 1px;
    display: block
}

@media screen and (max-width:479px) {
    .share__info-txt {
        width: 260px;
        padding-left: 20px
    }
}

.share__info-txt.success:before {
    content: "";
    position: absolute;
    background: url(/img/check-circle.5c9c2fbc.svg) no-repeat 0 0;
    width: 21px;
    height: 20px;
    background-size: 100% 100%;
    left: 15px;
    top: 4px
}

@media screen and (max-width:479px) {
    .share__info-txt.success:before {
        left: -8px
    }
}

.share__info-link {
    font-size: 1rem;
    line-height: 1.5rem;
    color: #8e8e8e;
    padding-left: 20px;
    margin: 5px 0 0 0
}

@media screen and (min-width:768px) {
    .share__info-link {
        padding-left: 50px
    }
}

.share__info-txt-small {
    font-size: 1.2rem;
    text-align: center;
    text-transform: none;
    margin: 10px 0 0 0
}

.medium-editor-toolbar {
    background-color: unset !important;
    background: unset !important;
    border: unset !important;
    border-radius: unset !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    margin-top: 40px
}

@media screen and (max-width:767px) {
    .medium-editor-toolbar {
        left: 15px !important;
        right: 15px !important
    }

    .medium-editor-toolbar li {
        background: -webkit-gradient(linear, left top, left bottom, from(#242424), to(rgba(36, 36, 36, .75)));
        background: linear-gradient(180deg, #242424, rgba(36, 36, 36, .75));
        border: 1px solid #000;
        -webkit-box-shadow: 0 0 3px #000;
        box-shadow: 0 0 3px #000
    }

    .medium-editor-toolbar li:first-child {
        border-radius: 5px 0 0 5px
    }

    .medium-editor-toolbar li:last-child {
        border-radius: 0 5px 5px 0
    }
}

.empty-img {
    margin-top: 40px;
    max-width: 100%
}

.empty-text {
    font-size: 2.6rem;
    letter-spacing: -.1px;
    color: #000;
    margin: 30px 0 20px
}

.empty-desc {
    font-size: 1.6rem;
    line-height: 1.5;
    color: #3b3b3b;
    margin: -15px 0 20px
}

.animation {
    margin-top: -39px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: calc(100vh - 40px);
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
    overflow: hidden
}

.animation>div:not(.editmode__bar) {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
    min-height: 100%
}

.animation>div {
    min-width: 100%
}

.animation .percentage {
    position: absolute;
    top: 0;
    height: 5px;
    background: #aaaab5;
    left: 0;
    width: 0;
    -webkit-transition: .3s ease;
    transition: .3s ease
}

.animation-end {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    min-height: 100vh
}

.animation-end .back {
    cursor: pointer;
    font-weight: 600;
    margin-top: 5px
}

@media only screen and (max-width:767px) {
    .edit-finished__title {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding-right: 0
    }

    .edit-finished__title .buttons__share {
        padding-top: 0
    }

    .edit-finished__title .btn,
    .edit-finished__title .method-section-add {
        padding: 8px 11px
    }
}

.new-project__subtitle {
    font-size: 1.4rem;
    color: #646464;
    text-align: center;
    line-height: 1.43;
    margin: 35px 0 0 0
}

@media screen and (max-width:767px) {
    .new-project__subtitle {
        margin-top: 0
    }
}

@media screen and (min-width:992px) {
    .new-project__subtitle {
        margin: 65px 0 0 0
    }
}

.new-project__title {
    font-size: 2.5rem;
    line-height: 3rem;
    text-align: center;
    color: #1d1d1d;
    font-weight: 400;
    margin: 40px 0 30px
}

@media screen and (min-width:768px) {
    .new-project__title {
        font-size: 3.4rem;
        line-height: 4rem
    }

    .new-project__title.new {
        font-size: 2.6rem;
        line-height: -.1px;
        margin-bottom: 44px
    }
}

.new-project__title.new {
    color: #000
}

.new-project__select {
    font-size: 1.4rem;
    color: #4a4a4a;
    text-align: center;
    margin: 34px 0 0
}

.new-project__select a {
    color: #f07320;
    font-weight: 700;
    position: relative
}

.new-project__select a:before {
    position: absolute;
    content: "";
    width: 0;
    right: 0;
    left: auto;
    bottom: -3px;
    height: 2px;
    background: #f07320;
    display: block;
    -webkit-transition: all .2s ease;
    transition: all .2s ease
}

.new-project__select a:hover {
    text-decoration: none
}

.new-project__select a:hover:before {
    right: auto;
    left: 0;
    width: 100%
}

.new-project__title-edit {
    max-width: 661px;
    margin: 0 auto;
    text-align: center
}

.new-project__title-edit input {
    text-align: center
}

.new-project__title-edit span {
    width: 100%
}

.new-project__name {
    text-transform: upperase;
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 1.36;
    letter-spacing: .8px;
    color: #86909a
}

.new-project__count {
    font-size: 11px;
    text-transform: uppercase;
    color: #aaaab5;
    margin-bottom: 0;
    letter-spacing: .88px
}

.new-project__preview {
    position: absolute;
    right: 11px;
    top: 8px
}

.new-project__preview-btn {
    background-color: #f8f9fa;
    border-radius: 4px;
    font-size: 14px;
    padding: 5px 15px;
    font-weight: 700;
    color: #252729;
    display: block;
    cursor: pointer;
    -webkit-transition: all .2s;
    transition: all .2s
}

.new-project__preview-btn:focus,
.new-project__preview-btn:hover {
    text-decoration: none;
    background-color: #f0f2f5
}

.new-project__preview-btn:active {
    background-color: #dfe2e8
}

.new-project__tip-wrapper {
    text-align: center;
    max-width: 300px;
    font-size: 1.6rem;
    line-height: 1.5;
    color: #3b3b3b;
    margin: 0 auto
}

.new-project__tip-wrapper p {
    margin: 12px 0 0
}

.new-projects__wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 60px 0
}

@media screen and (max-width:767px) {
    .new-projects__wrapper {
        display: block
    }
}

.new-project__box {
    width: 100%;
    height: 258px;
    background: #fff;
    border-radius: 3px;
    -webkit-box-shadow: 0 37px 74px 0 rgba(0, 0, 0, .06);
    box-shadow: 0 37px 74px 0 rgba(0, 0, 0, .06);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    vertical-align: middle;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato;
    font-size: 2rem;
    color: #000;
    margin: 15px 15px 46px;
    padding: 15px 30px;
    cursor: pointer;
    -webkit-transition: .6s ease;
    transition: .6s ease;
    position: relative
}

@media screen and (max-width:767px) {
    .new-project__box {
        margin: 16px 0
    }
}

.new-project__box img {
    height: 90px;
    margin-bottom: 30px
}

.new-project__box p {
    padding: 0
}

.new-project__box:hover {
    -webkit-box-shadow: 0 23px 90px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 23px 90px 0 rgba(0, 0, 0, .1)
}

.tip {
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: #fff;
    border-radius: 30px;
    background: #4b5761;
    padding: 2px 12px;
    display: inline-block;
    text-align: center
}

@media screen and (min-width:768px) {
    .method__edit-sections .col-main .tip2 .tip-tooltip {
        left: 130%
    }

    .method__edit-sections .col-aside .tip-tooltip {
        left: -40%
    }
}

.new-project__back-btn {
    display: block;
    max-width: 260px;
    margin: 0 auto;
    margin-bottom: 60px
}

@media screen and (max-width:767px) {
    .new-project__back-btn {
        max-width: none
    }
}

.archive-container {
    max-width: 678px;
    margin: 0 auto
}

.archive-list {
    list-style: none;
    padding: 0;
    margin: 0
}

.archive-list__item {
    border-bottom: 1px solid rgba(88, 88, 88, .06)
}

.archive-list__item .base-card,
.archive-list__item .base-card__container,
.archive-list__item .method-item,
.archive-list__item .person-list-item,
.archive-list__item .tag-listed {
    border: 0 !important;
    cursor: default !important;
    background: transparent !important
}

.archive-period-heading {
    font-size: 18px;
    font-weight: 600;
    margin: 46px 0 16px
}

.archive-item,
.archive-question {
    padding: 14px 0
}

.archive-item__method,
.archive-question__method {
    display: block;
    font-size: 10px;
    color: #aaaab5;
    text-transform: uppercase;
    letter-spacing: .86px;
    margin-bottom: 6px;
    line-height: 1
}

.archive-item__body,
.archive-question__body {
    font-size: 16px;
    padding-left: 59px;
    position: relative;
    min-height: 36px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.archive-item__body,
.archive-item__icon,
.archive-question__body,
.archive-question__icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.archive-item__icon,
.archive-question__icon {
    width: 36px;
    height: 36px;
    position: absolute;
    left: 0;
    top: 0;
    line-height: 36px;
    text-align: center;
    font-size: 22px;
    color: #fff;
    font-weight: 700;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 3px
}

.archive-item__icon--image,
.archive-question__icon--image {
    background-color: #e6edf0
}

.archive-item__icon--empty,
.archive-question__icon--empty {
    background-color: #f8f8f8
}

.archive-item__icon .tag-colour,
.archive-question__icon .tag-colour {
    width: 24px;
    height: 24px
}

.archive-item__icon img,
.archive-question__icon img {
    width: 100%;
    height: 100%;
    border-radius: 3px;
    -o-object-fit: contain;
    object-fit: contain
}

.archive-item__foot,
.archive-question__foot {
    width: 114px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    color: #7e868d;
    font-size: 14px;
    text-align: right
}

.archive-item--method .archive-item__body,
.archive-item--method .archive-question__body,
.archive-question--method .archive-item__body,
.archive-question--method .archive-question__body {
    font-size: 20px
}

.archive-phase,
.archive-section {
    position: relative;
    padding-top: 10px
}

.archive-phase:after,
.archive-section:after {
    content: "";
    height: 61px;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    background: -webkit-gradient(linear, left top, left bottom, from(hsla(0, 0%, 100%, 0)), color-stop(80%, #fff));
    background: linear-gradient(180deg, hsla(0, 0%, 100%, 0), #fff 80%)
}

.archive-phase .archive-question,
.archive-section .archive-question {
    padding-top: 2px
}

.archive-phase__body,
.archive-section__body {
    height: 60px;
    overflow: hidden
}

.autocomplete .input {
    position: relative;
    height: 300px
}

.autocomplete input {
    width: 100%
}

.autocomplete.show .list {
    display: block
}

.autocomplete .list {
    width: 260px;
    display: none;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    border: 1px solid hsla(0, 0%, 93%, .62);
    border-radius: 3px;
    position: absolute;
    overflow: auto;
    list-style-type: none;
    z-index: 1000;
    background: #fff;
    padding: 8px;
    max-height: 309px;
    -webkit-box-shadow: 0 15px 18px 0 rgba(0, 0, 0, .06);
    box-shadow: 0 15px 18px 0 rgba(0, 0, 0, .06);
    margin: 0;
    margin-top: 10px;
    top: 100%
}

.autocomplete .list__item {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background: #fff;
    margin: 0;
    padding: 8px 12px;
    cursor: pointer;
    position: relative;
    font-size: 1.4rem;
    color: #646464
}

.autocomplete .list__item:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    background: #f8f9fa;
    border-radius: 3px;
    border: 0;
    z-index: -1;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.autocomplete .list__item.highlighted {
    background: none !important
}

.autocomplete .list__item.highlighted:before {
    opacity: 1;
    visibility: visible
}

.autocomplete .list__item:hover {
    background: none !important
}

.autocomplete .list__item:hover:before {
    opacity: 1;
    visibility: visible
}

.persona__row {
    position: relative;
    margin-bottom: 50px;
    -webkit-user-select: none
}

.persona__row .methods__list-trash.global {
    right: 10px;
    height: 60px;
    z-index: 20
}

.persona__row:hover .methods__list-trash.global {
    opacity: 1;
    visibility: visible
}

.persona__row .persona__tester-column .mselect__list li.add-new {
    padding-left: 40px;
    padding-right: 0
}

.persona__row .persona__tester-column .mselect__list li.add-new .team__avatar {
    left: 0
}

.persona__row .persona__tester-column .mselect__list li {
    padding-left: 44px;
    word-break: break-all
}

.persona__row .persona__tester-column .mselect__list li .js-show {
    cursor: pointer;
    opacity: 1;
    visibility: visible;
    display: block;
    width: 30px;
    right: -30px
}

.persona__row .persona__tester-column .mselect__list li:not(.add-new):before {
    display: none
}

.persona__row .persona__tester-column .mselect__list .team__avatar {
    left: 0
}

.persona__row .persona__tester-column .mselect__list .team__avatar:hover:before {
    display: none
}

.persona__row .persona__tester-column .mselect__list .autocomplete .list {
    overflow: initial;
    top: 50px;
    left: -40px;
    right: 0;
    width: auto;
    padding: 5px 0
}

.persona__row .persona__tester-column .mselect__list .autocomplete .list:before {
    content: "";
    display: block;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #fff;
    position: absolute;
    top: -6px;
    left: 50%;
    margin-left: -3px;
    z-index: 2
}

.persona__row .persona__tester-column .mselect__list .autocomplete .list:after {
    content: "";
    display: block;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #dbdbdb;
    position: absolute;
    top: -7px;
    left: 50%;
    margin-left: -4px;
    z-index: 1
}

.persona__row .persona__tester-column .mselect__list .autocomplete .list li {
    padding: 15px 5px 15px 50px;
    border-bottom: 0
}

.persona__row .persona__tester-column .mselect__list .autocomplete .list li .team__avatar {
    left: 8px
}

.persona__title {
    font-size: 1.8rem;
    letter-spacing: -.1px;
    color: #000;
    margin: 0;
    font-weight: 600;
    margin-bottom: 30px
}

@media screen and (min-width:768px) {
    .persona__title {
        font-size: 2.6rem;
        font-weight: 400
    }
}

.persona__title input:not([readonly]) {
    border-bottom: 1px dashed #fff;
    -webkit-transition: border-bottom .25s;
    transition: border-bottom .25s
}

.persona__title input:not([readonly]):hover {
    border-bottom: 1px dashed #8e8e8e
}

.persona__title input:not([readonly]):focus {
    border-bottom: 1px dashed #1d1d1d
}

.persona__subtitle {
    font-size: 2.4rem;
    margin: 0 0 20px;
    color: #000;
    line-height: 1
}

.persona__subtitle.mb40 {
    margin-bottom: 40px
}

.persona__subtitle input {
    border-bottom: 1px dashed #fff;
    -webkit-transition: border-bottom .25s;
    transition: border-bottom .25s
}

.persona__subtitle input:hover {
    border-bottom: 1px dashed #8e8e8e
}

.persona__subtitle input:focus {
    border-bottom: 1px dashed #1d1d1d
}

.persona__settings {
    background: transparent;
    padding: 0;
    border: 0;
    width: 25px;
    float: right;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 0 3px 0 0;
    outline: 0
}

.persona__settings,
.persona__settings svg g {
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.persona__settings:hover svg g {
    stroke: #f07320
}

.notifications {
    position: fixed;
    left: 15px;
    right: 15px;
    top: 15px;
    z-index: 9999
}

@media screen and (min-width:768px) {
    .notifications {
        top: auto;
        bottom: 40px;
        left: 40px
    }
}

.notification {
    background: #282b35;
    font-size: 1.4rem;
    line-height: 1.5;
    color: #fff;
    border-radius: 8px;
    margin-top: 20px;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media screen and (min-width:768px) {
    .notification {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        vertical-align: top;
        max-width: 582px
    }
}

.notification.success {
    background: #85ea9f
}

.notification.error {
    background: #ff4e4e;
    color: #fff
}

.notification.warning {
    background: #fffa6d
}

.notification.loading .base-spinner {
    margin: 15px 0;
    margin-left: 18px;
    padding: 0
}

.notification__body {
    padding: 8px 16px;
    width: 100%
}

.notification__footer {
    padding: 8px;
    padding-left: 13px;
    white-space: nowrap
}

.notification__action,
.notification__close {
    height: 28px;
    border-radius: 6px;
    display: inline-block;
    background-color: transparent;
    vertical-align: middle;
    font-size: 1.4rem;
    padding: 0 9px;
    line-height: 28px;
    cursor: pointer;
    -webkit-transition: all .55s ease;
    transition: all .55s ease
}

.notification__action:hover,
.notification__close:hover {
    background-color: #181b22
}

.notification__close {
    width: 28px;
    background-image: url(/img/close-white.5382577f.svg);
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: 14px 14px;
    padding: 0;
    border: 0;
    outline: 0;
    margin-left: 4px
}

.notification-enter-active {
    -webkit-transition: opacity .5s 1s, -webkit-transform .5s;
    transition: opacity .5s 1s, -webkit-transform .5s;
    transition: transform .5s, opacity .5s 1s;
    transition: transform .5s, opacity .5s 1s, -webkit-transform .5s
}

.notification-leave-active {
    -webkit-transition: opacity .5s, -webkit-transform 1s;
    transition: opacity .5s, -webkit-transform 1s;
    transition: opacity .5s, transform 1s;
    transition: opacity .5s, transform 1s, -webkit-transform 1s
}

.notification-enter,
.notification-leave-to {
    opacity: 0
}

.notification-move {
    -webkit-transition: -webkit-transform 1s;
    transition: -webkit-transform 1s;
    transition: transform 1s;
    transition: transform 1s, -webkit-transform 1s
}

.connection-notification {
    background-color: hsla(0, 0%, 100%, .78);
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 200;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    font-size: 16px;
    color: #3b3b3b
}

.connection-notification__icon {
    background-color: #e5411d;
    border-radius: 8px;
    width: 40px;
    height: 40px;
    font-size: 24px;
    padding: 8px;
    margin-top: 20px;
    color: #fff
}

.connection-notification__box {
    background-color: #fff;
    border-radius: 8px;
    -webkit-box-shadow: 0 14px 74px 1px rgba(0, 0, 0, .11);
    box-shadow: 0 14px 74px 1px rgba(0, 0, 0, .11);
    width: 100%;
    max-width: 361px;
    padding: 16px
}

.connection-notification__heading {
    font-size: 20px;
    margin-top: 19px;
    margin-bottom: 8px
}

.connection-notification__text {
    margin-bottom: 34px
}

.modal__login {
    top: -20px
}

.modal-body {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 0;
    z-index: 999;
    -webkit-transition: opacity 366ms, height 0ms;
    transition: opacity 366ms, height 0ms;
    -webkit-transition-delay: 0ms, 366ms;
    transition-delay: 0ms, 366ms;
    -webkit-transition-timing-function: cubic-bezier(.22, .61, .36, 1);
    transition-timing-function: cubic-bezier(.22, .61, .36, 1);
    overflow: hidden
}

.modal-body .base-spinner.fullHeight {
    position: absolute;
    height: 100%;
    left: 0;
    width: 100%;
    top: 0;
    padding: 0
}

.modal.js-show .modal-body {
    height: 100%;
    -webkit-transition-delay: 0ms;
    transition-delay: 0ms
}

.modal.modal-leave-active .modal-body {
    height: 0;
    -webkit-transition: opacity 366ms, height 0ms;
    transition: opacity 366ms, height 0ms;
    -webkit-transition-delay: 0ms, 366ms;
    transition-delay: 0ms, 366ms
}

.modal-scroll {
    width: 100%;
    height: 100%;
    overflow: hidden;
    padding: 0 50px;
    text-align: center
}

.modal-scroll:before {
    content: "";
    min-height: 100%;
    display: inline-block;
    vertical-align: middle
}

@media screen and (max-width:1199px) {
    .modal-scroll {
        padding: 0 20px
    }
}

@media screen and (max-width:991px) {
    .modal-scroll {
        padding: 0
    }
}

.modal-close {
    position: absolute;
    font-size: 16px;
    right: 24px;
    top: 24px;
    cursor: pointer
}

.modal-open .modal-scroll {
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch
}

.modal-wrapper {
    display: inline-block;
    width: 100%;
    vertical-align: middle;
    opacity: 0;
    -webkit-transform: scale(.98);
    transform: scale(.98);
    -webkit-transition: all 366ms;
    transition: all 366ms;
    -webkit-transition-timing-function: cubic-bezier(.22, .61, .36, 1);
    transition-timing-function: cubic-bezier(.22, .61, .36, 1);
    margin: 50px auto;
    text-align: left
}

.modal.js-show .modal-wrapper {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.modal.modal-leave-active .modal-wrapper {
    opacity: 0;
    -webkit-transform: scale(.98);
    transform: scale(.98)
}

.modal-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 0;
    background: #000;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition: opacity 366ms, height 0ms;
    transition: opacity 366ms, height 0ms;
    -webkit-transition-delay: 0ms, 366ms;
    transition-delay: 0ms, 366ms;
    opacity: 0;
    -webkit-transition-timing-function: cubic-bezier(.22, .61, .36, 1);
    transition-timing-function: cubic-bezier(.22, .61, .36, 1);
    z-index: 990
}

.modal.js-show .modal-backdrop {
    height: 100%;
    -webkit-transition-delay: 0ms;
    transition-delay: 0ms;
    opacity: .5
}

.modal.modal-leave-active .modal-backdrop {
    -webkit-transition: opacity 366ms, height 0ms;
    transition: opacity 366ms, height 0ms;
    -webkit-transition-delay: 0ms, 366ms;
    transition-delay: 0ms, 366ms;
    opacity: 0;
    height: 0
}

.modal__wrapper {
    background: #fff;
    margin: 50px auto;
    padding: 58px 80px 102px;
    max-width: 560px;
    position: relative;
    border-radius: 3px
}

.modal__wrapper.small {
    padding: 20px
}

@media screen and (max-width:479px) {
    .modal__wrapper {
        min-height: 100%;
        margin: 0 auto;
        padding: 58px 40px 102px
    }
}

@media screen and (min-width:768px) {
    .modal__wrapper.small {
        padding: 30px 40px
    }

    .modal__login.small-bottom .modal__wrapper {
        padding-bottom: 50px
    }
}

.modal__logo {
    width: 65px;
    height: 59px;
    display: block;
    margin: 0 auto 35px;
    background: url(/img/logotype.5171ac32.svg) no-repeat 0 0;
    background-size: 100% 100%
}

.modal__title {
    font-size: 2rem;
    color: #000;
    margin: 20px 0 23px;
    text-align: center
}

.modal__title.mt0 {
    margin-top: 0
}

.modal__desc {
    line-height: 1.43;
    text-align: center;
    max-width: 272px;
    margin: -15px auto 20px
}

.modal__desc b {
    color: #4e4e4e
}

.modal__desc.big {
    font-size: 1.6rem;
    line-height: 2.4rem;
    max-width: 320px
}

.modal__btn {
    width: 100%;
    height: 60px;
    border-radius: 30px;
    border: 0;
    margin: 10px 0;
    padding: 0 30px 0 74px;
    text-align: left;
    font-size: 1.3rem;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    border: 1px solid #d9d9d9;
    background: #fff;
    position: relative;
    outline: 0
}

.modal__btn:active,
.modal__btn:focus {
    outline: 0
}

@media screen and (min-width:768px) {
    .modal__btn {
        font-size: 1.6rem
    }
}

.modal__btn:hover {
    background-color: #f07320;
    border-color: #f07320
}

.modal__btn svg {
    position: absolute;
    left: 22px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.modal__submit {
    background: #fa8c25
}

.modal__submit.small {
    max-width: 272px;
    padding: 10px 15px;
    margin: 0 auto
}

.modal__submit {
    display: block;
    width: 100%;
    background: #059fa3;
    padding: 16px 15px;
    text-align: center;
    border-radius: 30px;
    color: #fff;
    font-size: 1.4rem;
    font-weight: 700;
    margin-top: 30px
}

.modal__submit.btn--outline {
    background: #fff;
    color: #414141;
    font-weight: 400;
    text-transform: none
}

.modal__submit.btn--outline:hover {
    color: #059fa3;
    text-decoration: none
}

.modal__btn--twitter {
    background: #00aaec url(/img/twitter.83ceec1b.svg) no-repeat 22px 17px;
    background-size: 31px 26px;
    border: 1px solid #00aaec;
    color: #fff
}

.modal__btn--twitter:hover {
    background-color: #0492c8
}

.modal__btn--facebook {
    background: #4460a0 url(/img/facebook.0a14f4df.svg) no-repeat 22px 16px;
    background-size: 28px 28px;
    border: 1px solid #4460a0;
    color: #fff
}

.modal__btn--facebook:hover {
    background-color: #304d91
}

.modal__btn--google {
    background: #fff url(/img/google.aab968d3.svg) no-repeat 22px 16px;
    background-size: 24px 25px;
    border: 1px solid #d9d9d9
}

.modal__btn--google:hover {
    background-color: #d8d8d8;
    border-color: #d9d9d9
}

.modal__btn--email g {
    stroke: #d9d9d9
}

.modal__btn--email:hover {
    color: #fff
}

.modal__btn--email:hover g {
    stroke: #fff
}

.modal__avatar-name,
.modal__footer {
    font-size: 1.4rem;
    line-height: 1.43;
    color: #646464;
    text-align: center
}

.modal__footer {
    margin: 22px 0 20px 0
}

.modal__close-x {
    border: 0;
    background: transparent;
    padding: 0;
    margin: 0;
    width: 12px;
    height: 12px;
    position: absolute;
    right: 39px;
    top: 42px;
    outline: 0
}

.modal__close-x svg {
    width: 12px;
    display: block;
    fill: #4b4b4b;
    stroke: #4b4b4b;
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.modal__close-x:hover svg {
    stroke: #037d81
}

@media screen and (max-width:767px) {
    .modal__close-x {
        display: none
    }
}

.modal__close-bottom {
    display: inline-block;
    margin: 0 auto;
    min-width: 130px
}

@media screen and (min-width:768px) {
    .modal__close-bottom {
        display: none
    }
}

.modal__body {
    min-height: 263px
}

@media screen and (min-width:992px) {
    .modal__body {
        padding: 0 60px
    }
}

@media screen and (min-width:768px) {
    .modal__body {
        padding: 0 30px
    }
}

.modal__main-img {
    margin: 0 auto 30px;
    display: block
}

.modal__arrow-back {
    display: inline-block;
    vertical-align: middle;
    border: 0;
    background: none;
    outline: 0;
    padding: 0;
    -webkit-transform: translate(-64px, -32px);
    transform: translate(-64px, -32px)
}

.modal__arrow-back svg {
    fill: #000;
    -webkit-transition: all .35s ease;
    transition: all .35s ease
}

.modal__arrow-back:hover svg {
    fill: #037d81
}

.modal__desc {
    font-size: 1.4rem;
    line-height: 2rem;
    color: #646464
}

.modal__desc b {
    font-weight: 600;
    color: #171717
}

.modal__input-title {
    font-size: 1.8rem;
    line-height: 2.5rem;
    font-weight: 600;
    color: #252729;
    margin-top: 25px;
    margin-bottom: 5px
}

.modal__input-wrapper {
    position: relative
}

.modal__input {
    padding: 0 30px 0 0;
    border: 0;
    background-image: -webkit-gradient(linear, right top, left top, color-stop(30%, #8e8e8e), color-stop(0, hsla(0, 0%, 100%, 0)));
    background-image: linear-gradient(270deg, #8e8e8e 30%, hsla(0, 0%, 100%, 0) 0);
    background-position: bottom;
    background-size: 5px 1px;
    background-repeat: repeat-x;
    display: block;
    font-size: 1.6rem;
    padding: 7px 0;
    width: 100%;
    margin: 10px 0;
    outline: 0;
    -webkit-transition: all .3s ease;
    transition: all .3s ease
}

.modal__input::-webkit-input-placeholder {
    opacity: .3
}

.modal__input:-moz-placeholder,
.modal__input::-moz-placeholder {
    opacity: .3
}

.modal__input:-ms-input-placeholder {
    opacity: .3
}

.modal__input:focus {
    background-image: -webkit-gradient(linear, right top, left top, color-stop(30%, #1d1d1d), color-stop(0, hsla(0, 0%, 100%, 0)));
    background-image: linear-gradient(270deg, #1d1d1d 30%, hsla(0, 0%, 100%, 0) 0)
}

.modal__input-icon {
    position: absolute;
    width: 25px;
    height: 25px;
    background: #68bf65 url(/img/check-white.f66c6586.svg) no-repeat 50%;
    border-radius: 50%;
    right: 0;
    top: 5px
}

.modal__input-desc {
    font-size: 1.4rem;
    color: #646464;
    margin-bottom: 40px
}

.modal__input-desc.error {
    color: #d0021b
}

.modal__magic-link {
    margin: 0 auto;
    display: block
}

.modal__magic-link~.btn,
.modal__magic-link~.method-section-add {
    margin-top: 50px
}

.modal__reset-pass {
    font-size: 1.4rem;
    line-height: 1.9rem;
    color: #252729;
    margin: 30px 0 20px;
    display: block;
    padding-top: 30px
}

.modal__reset-pass,
.modal__reset-send-me {
    letter-spacing: .2px;
    text-align: center;
    font-weight: 700;
    cursor: pointer
}

.modal__reset-send-me {
    background: #f8f9fa;
    margin: 0 -20px -40px;
    padding: 15px 20px;
    font-size: 14px;
    border-radius: 0 0 6px 6px
}

.modal__reset-send-me img {
    width: 65px;
    display: inline-block;
    margin-right: 10px;
    position: relative;
    top: -3px
}

@media screen and (min-width:768px) {
    .modal__reset-send-me {
        margin: 0 -110px -105px
    }
}

.modal__body-avatar-success {
    width: 186px;
    height: 214px;
    margin: 0 auto;
    position: relative;
    -webkit-transform: translateX(25px);
    transform: translateX(25px)
}

.modal__body-avatar-success img {
    width: 186px;
    position: absolute;
    top: 0;
    left: 0
}

.modal__body-avatar-success img+img {
    z-index: 21
}

.modal__body-avatar-success .team__avatar {
    z-index: 20;
    position: relative;
    top: 118px;
    margin-left: 43px
}

.shake {
    -webkit-animation: shake .4s linear 1;
    animation: shake .4s linear 1
}

@keyframes shake {
    0% {
        -webkit-transform: translate(30px);
        transform: translate(30px)
    }

    20% {
        -webkit-transform: translate(-30px);
        transform: translate(-30px)
    }

    40% {
        -webkit-transform: translate(15px);
        transform: translate(15px)
    }

    60% {
        -webkit-transform: translate(-15px);
        transform: translate(-15px)
    }

    80% {
        -webkit-transform: translate(8px);
        transform: translate(8px)
    }

    to {
        -webkit-transform: translate(0);
        transform: translate(0)
    }
}

@-webkit-keyframes shake {
    0% {
        -webkit-transform: translate(30px)
    }

    20% {
        -webkit-transform: translate(-30px)
    }

    40% {
        -webkit-transform: translate(15px)
    }

    60% {
        -webkit-transform: translate(-15px)
    }

    80% {
        -webkit-transform: translate(8px)
    }

    to {
        -webkit-transform: translate(0)
    }
}

@media only screen and (max-width:767px) {
    .modal__arrow-back {
        -webkit-transform: translateY(-20px);
        transform: translateY(-20px)
    }
}

.blink {
    -webkit-animation: blink 1s linear 1;
    animation: blink 1s linear 1
}

@-webkit-keyframes blink {
    0% {
        background-color: transparent
    }

    30% {
        background-color: #b6d8fc
    }

    to {
        background-color: transparent
    }
}

@keyframes blink {
    0% {
        background-color: transparent
    }

    30% {
        background-color: #b6d8fc
    }

    to {
        background-color: transparent
    }
}

.process-images {
    margin: 0 auto;
    padding: 47px 0 0 0;
    text-align: center
}

.process-images__column {
    width: 220px;
    display: block;
    text-align: left;
    margin: 0 auto 40px
}

.process-images__column img {
    position: relative
}

@media screen and (min-width:768px) {
    .process-images__column {
        display: inline-block;
        vertical-align: bottom;
        width: 210px
    }
}

@media screen and (min-width:992px) {
    .process-images__column {
        width: 220px
    }
}

.process-images__column:first-child img {
    left: -28px;
    top: -10px
}

.process-images__column:nth-child(2) img {
    right: -20px
}

@media screen and (min-width:768px) {
    .process-images__column:nth-child(2) {
        margin-right: 58px
    }
}

.process-images__column-name {
    font-size: 1.6rem;
    line-height: 1.5;
    color: #3a3a3a;
    margin: 20px 0 0 0
}

.process-images__column-title {
    font-size: 1.8rem;
    color: #252729;
    font-weight: 600;
    margin: 0
}

.fade-enter-active,
.fade-leave-active {
    -webkit-transition: opacity .15s;
    transition: opacity .15s
}

.fade-enter,
.fade-leave-to {
    opacity: 0
}

.fade-scale-enter-active,
.fade-scale-leave-active {
    -webkit-transition: opacity 366ms, -webkit-transform 366ms;
    transition: opacity 366ms, -webkit-transform 366ms;
    transition: opacity 366ms, transform 366ms;
    transition: opacity 366ms, transform 366ms, -webkit-transform 366ms
}

.fade-scale-enter,
.fade-scale-leave-to {
    -webkit-transform: scale(.98);
    transform: scale(.98);
    opacity: 0
}

.fader-enter-active {
    -webkit-transition: all .17s ease-in;
    transition: all .17s ease-in
}

.fader-leave-active {
    -webkit-transition: all .14s ease-in-out;
    transition: all .14s ease-in-out
}

.fader-enter,
.fader-leave-to {
    opacity: 0;
    -webkit-transform: translateY(12px);
    transform: translateY(12px)
}

.modal-fade-enter-active,
.modal-fade-leave-active {
    -webkit-transition-duration: .2s;
    transition-duration: .2s;
    -webkit-transition-property: opacity;
    transition-property: opacity;
    -webkit-transition-timing-function: cubic-bezier(.22, .61, .36, 1);
    transition-timing-function: cubic-bezier(.22, .61, .36, 1)
}

.modal-fade-enter,
.modal-fade-leave-to {
    opacity: 0
}

.slide-down-enter-active,
.slide-down-leave-active,
.slide-up-enter-active,
.slide-up-leave-active {
    -webkit-transition-duration: .3s;
    transition-duration: .3s;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition-timing-function: cubic-bezier(.55, 0, .1, 1);
    transition-timing-function: cubic-bezier(.55, 0, .1, 1)
}

.slide-down-enter,
.slide-down-leave-active,
.slide-up-enter,
.slide-up-leave-active {
    opacity: 0;
    -webkit-transform: translateY(10px);
    transform: translateY(10px)
}

.enter-list-enter-active,
.enter-list-leave-active,
.full-list-enter-active,
.full-list-leave-active {
    -webkit-transition: max-height .3s, opacity .3s;
    transition: max-height .3s, opacity .3s;
    max-height: 200px;
    opacity: 1
}

.enter-list-enter,
.enter-list-leave-to,
.full-list-enter,
.full-list-leave-to {
    opacity: 0;
    overflow: hidden;
    max-height: 0
}

.flip-list-move,
.full-list-move {
    -webkit-transition: -webkit-transform .2s;
    transition: -webkit-transform .2s;
    transition: transform .2s;
    transition: transform .2s, -webkit-transform .2s
}

.enter-list-tall-enter-active,
.enter-list-tall-leave-active {
    -webkit-transition: max-height .3s, opacity .3s;
    transition: max-height .3s, opacity .3s;
    max-height: 1000px;
    opacity: 1
}

.enter-list-tall-enter,
.enter-list-tall-leave-to {
    opacity: 0;
    overflow: hidden;
    max-height: 0
}

.project-shrink-enter-active {
    -webkit-transition: all .3s;
    transition: all .3s;
    overflow: hidden
}

.project-shrink-enter {
    width: 0;
    opacity: 0
}

.project-shrink-enter-to {
    width: 25%;
    opacity: 1
}

.project-shrink-leave-active {
    -webkit-transition: all .3s;
    transition: all .3s;
    overflow: hidden
}

.project-shrink-leave-to {
    width: 0;
    opacity: 0
}

.swipe-bottom-enter-active {
    -webkit-transition: all .3s;
    transition: all .3s
}

.swipe-bottom-enter {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%)
}

.swipe-bottom-enter-to {
    -webkit-transform: translate(0);
    transform: translate(0)
}

.swipe-bottom-leave-active {
    -webkit-transition: all .3s;
    transition: all .3s
}

.swipe-bottom-leave {
    -webkit-transform: translate(0);
    transform: translate(0)
}

.swipe-bottom-leave-to {
    -webkit-transform: translateY(100%);
    transform: translateY(100%)
}

.show-bottom-enter-active {
    -webkit-transition: all .8s;
    transition: all .8s
}

.show-bottom-enter {
    -webkit-transform: translateY(100%);
    transform: translateY(100%)
}

.show-bottom-enter-to {
    -webkit-transform: translate(0);
    transform: translate(0)
}

.show-bottom-leave-active {
    -webkit-transition: all .8s;
    transition: all .8s
}

.show-bottom-leave {
    -webkit-transform: translate(0);
    transform: translate(0)
}

.show-bottom-leave-to {
    -webkit-transform: translateY(100%);
    transform: translateY(100%)
}

.swipe-right-enter-active {
    -webkit-transition: all .3s;
    transition: all .3s
}

.swipe-right-enter {
    -webkit-transform: translate(-100%);
    transform: translate(-100%)
}

.swipe-right-enter-to {
    -webkit-transform: translate(0);
    transform: translate(0)
}

.swipe-right-leave-active {
    -webkit-transition: all .3s;
    transition: all .3s
}

.swipe-right-leave {
    -webkit-transform: translate(0);
    transform: translate(0)
}

.swipe-right-leave-to {
    -webkit-transform: translate(-100%);
    transform: translate(-100%)
}

.swipe-left-enter-active {
    -webkit-transition: all .3s;
    transition: all .3s
}

.swipe-left-enter {
    -webkit-transform: translate(100%);
    transform: translate(100%)
}

.swipe-left-enter-to {
    -webkit-transform: translate(0);
    transform: translate(0)
}

.swipe-left-leave-active {
    -webkit-transition: all .3s;
    transition: all .3s
}

.swipe-left-leave {
    -webkit-transform: translate(0);
    transform: translate(0)
}

.swipe-left-leave-to {
    -webkit-transform: translate(100%);
    transform: translate(100%)
}

.swipe-fade-left-enter-active {
    -webkit-transition: all .15s;
    transition: all .15s
}

.swipe-fade-left-enter {
    -webkit-transform: translate(20%);
    transform: translate(20%);
    opacity: 0
}

.swipe-fade-left-enter-to {
    -webkit-transform: translate(0);
    transform: translate(0);
    opacity: 1
}

.swipe-fade-left-leave-active {
    -webkit-transition: all .15s;
    transition: all .15s;
    opacity: 1
}

.swipe-fade-left-leave {
    -webkit-transform: translate(0);
    transform: translate(0);
    opacity: 1
}

.swipe-fade-left-leave-to {
    -webkit-transform: translate(-20%);
    transform: translate(-20%);
    opacity: 0
}

.content-transition,
.content-transition-child {
    -webkit-transition: height .2s, opacity .2s;
    transition: height .2s, opacity .2s;
    -webkit-transition-timing-function: ease-in-out;
    transition-timing-function: ease-in-out
}

.content-transition--optimized,
.content-transition-child--optimized {
    -webkit-transition: height .4s;
    transition: height .4s
}

.content-transition-child:after,
.content-transition-child:before,
.content-transition:after,
.content-transition:before {
    content: "";
    width: 100%;
    display: table
}

.ct-optimized-enter-active,
.ct-optimized-leave-active {
    -webkit-transition: height .4s;
    transition: height .4s
}

.route-fade-enter-active {
    -webkit-transition: opacity .25s;
    transition: opacity .25s
}

.route-fade-leave-active {
    -webkit-transition: opacity .15s;
    transition: opacity .15s
}

.route-fade-enter,
.route-fade-leave-to {
    opacity: 0
}

.enter-list-wait-enter-active,
.enter-list-wait-leave-active {
    -webkit-transition-property: max-height, opacity;
    transition-property: max-height, opacity;
    -webkit-transition-duration: .2s, .2s;
    transition-duration: .2s, .2s;
    -webkit-transition-delay: .2s, .4s;
    transition-delay: .2s, .4s;
    max-height: 64px;
    opacity: 1
}

.enter-list-wait-leave-active {
    -webkit-transition-delay: .2s, 0ms;
    transition-delay: .2s, 0ms
}

.enter-list-wait-enter,
.enter-list-wait-leave-to {
    opacity: 0;
    overflow: hidden;
    max-height: 0
}

body[data-route=method-page],
body[data-route=method],
body[data-route=project-team],
body[data-route=settings] {
    background: #eceef0; /*#fefefe*/
}
.body-white {
    background: #ffffff !important;
}

.settings__list {
    margin: 5px 0 40px;
    padding: 0;
    list-style: none
}

.settings__list li {
    border-bottom: 1px solid #f2f2f2;
    padding: 15px 0;
    font-size: 1.6rem;
    line-height: 1.5;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.settings__list li .team__avatar {
    vertical-align: middle;
    position: relative;
    top: -1px
}

.settings__list li .btn,
.settings__list li .method-section-add {
    font-size: 1.4rem;
    text-transform: none;
    min-width: 171px;
    padding: 8px 30px
}

.settings__list li .credit-card-avatar {
    background-color: #68bf65;
    background-image: url(/img/credit-card-back.c1bd7f0a.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 22px 16px
}

.settings__list .social-icon {
    width: 28px;
    height: 28px;
    margin-right: 19px;
    display: inline-block;
    vertical-align: middle;
    background-repeat: no-repeat;
    background-position: 50%
}

.settings__list .social-icon.facebook {
    background-image: url(/img/facebook-gray.8d5f4607.svg);
    background-size: 28px 28px
}

.settings__list .social-icon.facebook.is-active {
    background-image: url(/img/facebook-color.481d74c0.svg)
}

.settings__list .social-icon.twitter {
    background-image: url(/img/twitter-gray.9c2f6810.svg);
    background-size: 30px 25px
}

.settings__list .social-icon.twitter.is-active {
    background-image: url(/img/twitter-color.cae88d1f.svg)
}

.settings__list .social-icon.google {
    background-image: url(/img/google-gray.8cc1b2cd.svg);
    background-size: 24px 25px
}

.settings__list .social-icon.google.is-active {
    background-image: url(/img/google.aab968d3.svg)
}

.settings__list-right {
    font-size: 1.4rem
}

.settings__list-right .remove {
    font-weight: 700
}

.plan__tabs {
    display: block;
    margin-bottom: 25px
}

.plan__title {
    text-align: center;
    font-weight: 300;
    font-size: 2.8rem;
    line-height: 3.2rem;
    letter-spacing: -.1px;
    color: #000;
    padding: 0 0 40px;
    margin: 0
}

@media screen and (min-width:768px) {
    .plan__title {
        font-size: 3.5rem;
        line-height: 4.2rem
    }
}

.plan__tab {
    text-transform: uppercase;
    font-size: 1.1rem;
    letter-spacing: .8px;
    color: rgba(65, 65, 65, .5);
    padding: 7px 22px;
    border-radius: 15px;
    margin: 0 5px 15px;
    border: 1px solid #fff;
    cursor: pointer
}

.plan__tab.is-active {
    color: #68bf65;
    border-color: #68bf65
}

.plan__item {
    width: 288px;
    min-height: 368px;
    border-radius: 6px;
    border: 1px solid #e6edf0;
    margin: 15px 12px;
    display: inline-block;
    vertical-align: top
}

@media screen and (max-width:767px) {
    .plan__item {
        margin: 12px 0;
        min-height: auto
    }
}

.plan__item-head {
    text-align: center;
    padding: 32px 30px 46px;
    border-bottom: 1px solid #e6edf0;
    overflow: hidden;
    position: relative
}

@media screen and (max-width:767px) {
    .plan__item-head {
        padding: 25px 30px
    }
}

.plan__item-head-popular {
    background: #3ab1ca;
    text-transform: uppercase;
    color: #fff;
    font-size: 1.2rem;
    padding: 5px 40px;
    text-align: center;
    position: absolute;
    min-width: 150px;
    right: -35px;
    top: 25px;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg)
}

.plan__item-head-name {
    font-size: 4.2rem;
    color: #000;
    font-weight: 300;
    letter-spacing: -.2px;
    margin: 0
}

.plan__item-head-price {
    font-size: 4.2rem;
    line-height: 3.7rem;
    letter-spacing: .3px;
    color: #4b5761;
    font-weight: 100;
    margin: 4px 0 10px
}

.plan__item-head-price small {
    font-size: 25px
}

.plan__item-head-save {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .4px;
    color: #68bf65;
    margin: 0
}

@media screen and (max-width:767px) {
    .plan__item-head-save {
        display: none
    }
}

.plan__item-footer {
    padding: 20px 24px 19px
}

.plan__item-footer ul {
    margin: 0 0 20px 11px;
    padding: 0;
    list-style: none
}

.plan__item-footer ul li {
    font-size: 1.4rem;
    line-height: 1.43;
    color: #4b5761;
    position: relative;
    padding-left: 35px;
    margin-bottom: 6px;
    text-align: left
}

.plan__item-footer ul li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 3px;
    width: 16px;
    height: 11px;
    background: url(/img/plan-check.f85cff24.svg) no-repeat 0 0
}

.plan__btn {
    background: #3ab1ca;
    font-size: 1.4rem;
    font-weight: 700;
    color: #fff;
    border-radius: 6px;
    width: 100%;
    outline: 0;
    border: 0;
    padding: 10px 15px;
    -webkit-transition: .3s ease;
    transition: .3s ease
}

.plan__btn:hover {
    background: #2c90a5
}

.plan__btn.selected {
    padding: 0 15px;
    background: #fff;
    color: #646464;
    font-weight: 400
}

.plan__btn.selected b {
    display: block;
    color: #252729;
    -webkit-transition: .3s ease;
    transition: .3s ease
}

.plan__btn.selected:hover b {
    color: red
}

.plan__happy {
    margin-top: 116px
}

@media screen and (max-width:767px) {
    .plan__happy {
        margin-top: 40px
    }
}

.plan__testimonials {
    margin: 0 auto 92px;
    padding: 0;
    list-style: none;
    max-width: 560px;
    text-align: center
}

.plan__testimonials-desc {
    font-size: 3.5rem;
    line-height: 4rem;
    font-weight: 300;
    text-align: center;
    color: #071021
}

.plan__testimonials-desc:before {
    left: -15px
}

.plan__testimonials-desc:after,
.plan__testimonials-desc:before {
    content: "";
    display: inline-block;
    width: 14px;
    height: 10px;
    background: url(/img/format-quote.afd933a7.svg) no-repeat 0 0;
    position: relative;
    top: -15px
}

.plan__testimonials-desc:after {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    right: -20px
}

@media screen and (max-width:767px) {
    .plan__testimonials-desc {
        font-size: 2.8rem;
        line-height: 3.2rem
    }
}

.plan__testimonials-user {
    font-size: 1.6rem;
    font-weight: 400;
    color: #8a8a8a
}

.plan__testimonials-user b {
    color: #3ab1ca;
    font-weight: 400
}

.plan__testimonials-user-image {
    width: 37px;
    height: 37px;
    background: url(/img/avatar@2x.e2ea70a2.png) no-repeat 0 0;
    background-size: 37px 37px;
    border-radius: 50%;
    display: inline-block;
    vertical-align: middle;
    margin-right: 25px
}

.plan__teams {
    text-align: center;
    padding-bottom: 40px
}

.plan__teams img {
    margin: 0 20px 25px
}

@media screen and (min-width:768px) {
    .plan__teams img {
        margin: 0 35px 20px
    }
}

[data-braintree-id=methods-label] {
    display: none
}

.modal-payment .modal__wrapper {
    max-width: 691px;
    padding: 52px 0
}

.modal-payment .modal__title {
    margin: 0;
    font-size: 2rem;
    font-weight: 500
}

.modal-payment .base-spinner {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: hsla(0, 0%, 100%, .8)
}

.payment__secure {
    font-size: 1.2rem;
    color: #68bf65;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
    margin-bottom: 24px
}

.payment__secure .icon-locked-green {
    margin-right: 13px
}

.payment__form {
    font-size: 1.6rem
}

.payment__form input {
    width: 100%;
    border: 0;
    outline: 0;
    font-size: 1.6rem;
    line-height: 1.5;
    color: #111;
    background-color: transparent
}

.payment__form input::-webkit-input-placeholder {
    color: #d0d0d0
}

.payment__form input:-moz-placeholder,
.payment__form input::-moz-placeholder {
    color: #d0d0d0
}

.payment__form input:-ms-input-placeholder {
    color: #d0d0d0
}

.payment__form .btn,
.payment__form .method-section-add {
    max-width: 330px;
    margin: 23px auto 6px
}

.payment__form .btn[disabled],
.payment__form .method-section-add[disabled] {
    background: #aaaab5;
    opacity: 1
}

.payment__form-content {
    margin-bottom: 39px
}

.payment__form-row {
    border-bottom: 1px solid #f2f2f2;
    -webkit-transition: all .2s;
    transition: all .2s;
    position: relative
}

.payment__form-row.is-invalid {
    background: #fbf0f0;
    border-bottom-color: #f7e6e6
}

.payment__form-col {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-height: 55px;
    max-width: 530px;
    margin: 0 auto;
    padding: 10px 20px
}

.payment__form-label {
    width: 188px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    font-size: 1.6rem
}

.payment__form-label+div {
    width: 100%
}

.payment__form-field-error {
    color: #d0021b;
    font-size: 1.4rem;
    display: block;
    margin-top: 2px;
    margin-bottom: 0
}

.payment__invoice-checkbox {
    margin-top: 25px;
    margin-bottom: 25px;
    min-height: 0;
    padding-top: 0;
    padding-bottom: 0
}

.payment__btn {
    background: #059fa3;
    font-size: 1.6rem;
    font-weight: 700;
    color: #fff;
    border-radius: 6px;
    width: 100%;
    outline: 0;
    border: 0;
    padding: 16px 15px;
    -webkit-transition: .3s ease;
    transition: .3s ease;
    line-height: 1.2;
    margin-bottom: 6px;
    margin-top: 23px
}

.payment__btn:hover {
    background: #036f72
}

.payment__btn.selected {
    padding: 0 15px;
    background: #fff;
    color: #646464;
    font-weight: 400
}

.payment__btn.selected b {
    display: block;
    color: #252729;
    -webkit-transition: .3s ease;
    transition: .3s ease
}

.payment__btn.selected:hover b {
    color: red
}

.braintree-hf {
    height: 26px;
    width: 100%
}

.payment__form-terms {
    font-size: 1.4rem;
    color: #646464;
    text-align: center;
    display: block;
    margin-top: 6px;
    margin-bottom: 0;
    line-height: 1.5
}

.payment__form-terms.error {
    color: #d0021b
}

.payment__form-terms a {
    color: inherit;
    text-decoration: none
}

.payment__form-terms--info {
    margin: 33px 0 23px;
    font-size: 1.6rem
}

.payment__success {
    margin: 60px auto 80px
}

.payment__box {
    background-color: #f3f6f8;
    border-radius: 10px;
    width: 100%;
    padding: 25px;
    text-align: center
}

.payment__box h3 {
    margin: 0;
    font-size: 1.6rem
}

.payment__box span {
    font-size: 1.3rem
}

.modal-done {
    max-width: 333px;
    margin: 0 auto
}

.modal-done__icon {
    width: 149px;
    height: 149px;
    margin: 0 auto;
    display: block
}

.modal-done__title {
    font-size: 2.6rem;
    font-weight: 400;
    text-align: center;
    margin-bottom: 18px;
    margin-top: 56px
}

.modal-done .dl-info {
    margin-bottom: 24px
}

.modal-done__btn {
    margin-top: 40px;
    margin-bottom: 0
}

.filter {
    font-size: 1.4rem;
    color: #646464;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.filter__name {
    margin-right: 3px
}

.filter__value-text {
    max-width: 100px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: inline-block;
    vertical-align: top
}

.filter__value {
    color: #252729;
    font-weight: 400;
    padding: 8px 12px;
    cursor: pointer;
    display: inline-block;
    font-size: 1.1rem;
    border-radius: 5px;
    padding-right: 22px;
    -webkit-transition: all .15s;
    transition: all .15s;
    position: relative;
    background-color: #f8f9fa
}

.filter__item {
    color: #fafafa;
    font-weight: 400;
    padding: 10px 15px;
    cursor: pointer;
    display: inline-block;
    font-size: 1.1rem;
    border-radius: 7px;
    -webkit-transition: all .15s;
    transition: all .15s;
    position: relative;
    background-color: #d60017; /*f3f4f5*/
}

.filter__value:before {
    content: "";
    position: absolute;
    right: 8px;
    top: 50%;
    border: 4px solid transparent;
    border-top-color: #000;
    border-bottom: 0;
    opacity: .5;
    margin-top: -2px;
    background-color: #f8f9fa
}

.filter__value:hover {
    background-color: #f8f9fa
}

.filter__value:active {
    background-color: #f0f2f5
}

.filter__value--open:before {
    -webkit-transform: scaleY(-1);
    transform: scaleY(-1)
}

.filter__item.pro {
    background-color: #e3ecf4;
}

.clear-input,
.person-list-item__new-input {
    color: #646464;
    border: 0;
    outline: 0;
    background: transparent
}

.clear-input::-webkit-input-placeholder,
.person-list-item__new-input::-webkit-input-placeholder {
    color: #646464;
    opacity: .4
}

.clear-input:-moz-placeholder,
.clear-input::-moz-placeholder,
.person-list-item__new-input:-moz-placeholder,
.person-list-item__new-input::-moz-placeholder {
    color: #646464;
    opacity: .4
}

.clear-input:-ms-input-placeholder,
.person-list-item__new-input:-ms-input-placeholder {
    color: #646464;
    opacity: .4
}

.input--light,
.titleinput__input {
    position: relative;
    font-size: 1.4rem;
    color: #646464;
    border: 0;
    outline: 0;
    background: transparent;
    width: 100%;
    border-bottom: 0px dashed hsla(0, 0%, 59%, .5);
    -webkit-transition: all .35s ease;
    transition: all .35s ease;
    height: 46px;
    border-radius: 0
}

.input--light::-webkit-input-placeholder,
.titleinput__input::-webkit-input-placeholder {
    color: #646464;
    opacity: .4
}

.input--light:-moz-placeholder,
.input--light::-moz-placeholder,
.titleinput__input:-moz-placeholder,
.titleinput__input::-moz-placeholder {
    color: #646464;
    opacity: .4
}

.input--light:-ms-input-placeholder,
.titleinput__input:-ms-input-placeholder {
    color: #646464;
    opacity: .4
}

.input--light:focus,
.titleinput__input:focus {
    border-bottom-color: #646464
}

.error.titleinput__input,
.input--light.error {
    border-color: #d0021b;
    color: #d0021b
}

.input--light[readonly],
.titleinput__input[readonly] {
    border-bottom: 0
}

.input--new-light {
    position: relative;
    font-size: 1.6rem;
    color: #3b3b3b;
    border: 0;
    outline: 0;
    background: #f8f9fa;
    width: 100%;
    border: 1px solid #f8f9fa;
    -webkit-transition: all .35s ease;
    transition: all .35s ease;
    height: 52px;
    border-radius: 6px;
    padding: 0 30px
}

.input--new-light::-webkit-input-placeholder {
    color: #646464;
    opacity: .4
}

.input--new-light:-moz-placeholder,
.input--new-light::-moz-placeholder {
    color: #646464;
    opacity: .4
}

.input--new-light:-ms-input-placeholder {
    color: #646464;
    opacity: .4
}

.input--new-light:focus {
    border-color: #dfe2e8
}

.input--new-light.error {
    border-color: #d0021b;
    color: #d0021b
}

.input--regular {
    font-size: 1.6rem
}

.input--center {
    text-align: center
}

.input--error {
    border-color: #e5411d
}

.base-checkbox {
    display: inline-block;
    cursor: pointer;
    vertical-align: top
}

.base-checkbox .icon {
    display: none
}

.base-checkbox--locked {
    cursor: default
}

.base-checkbox--switch {
    width: 51px;
    height: 31px;
    border-radius: 50px;
    background-color: #f0f2f5;
    position: relative;
    -webkit-transition: all .2s;
    transition: all .2s
}

.base-checkbox--switch:hover {
    background-color: #dfe2e8
}

.base-checkbox--switch:active {
    background-color: #abc0c8
}

.base-checkbox--switch:after {
    content: "";
    width: 25px;
    height: 25px;
    -webkit-transition: all .2s;
    transition: all .2s;
    left: 3px;
    top: 3px;
    background-color: #fff;
    border-radius: 50%;
    position: absolute
}

.base-checkbox--switch.base-checkbox--checked {
    background-color: #059fa3
}

.base-checkbox--switch.base-checkbox--checked:hover {
    background-color: #037d81
}

.base-checkbox--switch.base-checkbox--checked:active {
    background-color: #005e64
}

.base-checkbox--switch.base-checkbox--checked:after {
    -webkit-transform: translateX(20px);
    transform: translateX(20px)
}

.base-checkbox--switch.base-checkbox--locked,
.base-checkbox--switch.base-checkbox--locked:active,
.base-checkbox--switch.base-checkbox--locked:hover {
    background-color: #abc0c8
}

.base-checkbox--switch--sm {
    width: 44px;
    height: 27px
}

.base-checkbox--switch--sm:after {
    width: 21px;
    height: 21px
}

.base-checkbox--switch--sm.base-checkbox--checked:after {
    -webkit-transform: translateX(17px);
    transform: translateX(17px)
}

.base-checkbox--switch--xs {
    width: 38px;
    height: 24px
}

.base-checkbox--switch--xs:after {
    width: 20px;
    height: 20px;
    left: 2px;
    top: 2px
}

.base-checkbox--switch--xs.base-checkbox--checked:after {
    -webkit-transform: translateX(14px);
    transform: translateX(14px)
}

.base-checkbox--switch--green {
    background-color: #b2b2b2
}

.base-checkbox--switch--green.base-checkbox--checked {
    background-color: #02c31f
}

.base-checkbox--medium {
    width: 25px;
    height: 25px;
    border-radius: 3px;
    border: 1px solid #86909a;
    display: inline-block;
    position: relative;
    -webkit-transition: all .2s;
    transition: all .2s
}

.base-checkbox--medium:hover {
    background-color: #f8f9fa
}

.base-checkbox--medium:active {
    background-color: #f0f2f5
}

.base-checkbox--medium .icon {
    position: absolute;
    font-size: 14px;
    height: 10px;
    left: 5px;
    top: 6px;
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s;
    display: block
}

.base-checkbox--medium.base-checkbox--checked {
    background-color: #059fa3;
    border-color: #059fa3
}

.base-checkbox--medium.base-checkbox--checked:hover {
    background-color: #037d81;
    border-color: #037d81
}

.base-checkbox--medium.base-checkbox--checked:active {
    background-color: #005e64;
    border-color: #005e64
}

.base-checkbox--medium.base-checkbox--checked .icon {
    opacity: 1
}

.survey-input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0;
    border: 0;
    font-family: inherit;
    font-size: inherit;
    color: inherit;
    width: 100%;
    margin: 0;
    vertical-align: top
}

.survey-input:focus {
    outline: none
}

.survey-input--gray {
    background-color: #f8f9fa;
    height: 52px;
    border-radius: 4px;
    font-size: 18px;
    padding: 0 20px
}

.base-input {
    position: relative
}

.base-input__valid {
    position: absolute;
    right: 8px;
    top: 50%;
    margin-top: -13px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background-color: #67bf64;
    -webkit-transition: all .15s ease-in-out;
    transition: all .15s ease-in-out;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 14px;
    color: #fff;
    pointer-events: none
}

.base-input__valid--invalid {
    opacity: 0;
    -webkit-transform: scale(.7);
    transform: scale(.7)
}

.base-input-2 {
    border: 0;
    background: transparent;
    text-align: left;
    color: #3b3b3b;
    width: 100%;
    outline: 0
}

.base-input-2::-webkit-input-placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-input-2::-moz-placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-input-2:-ms-input-placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-input-2::-ms-input-placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-input-2::placeholder {
    opacity: .4;
    color: #3b3b3b
}

.base-input-2--textarea {
    resize: none;
    padding: 0
}

.checkbox {
    position: absolute;
    left: -9999px
}

.checkbox+label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-height: 27px;
    overflow: hidden;
    position: relative;
    cursor: pointer;
    padding-left: 50px
}

.checkbox+label:after,
.checkbox+label:before {
    position: absolute;
    content: ""
}

.checkbox+label:before {
    width: 27px;
    height: 27px;
    border-radius: 7px;
    border: 1px solid #ccc;
    left: 0;
    top: 0
}

.checkbox+label:after {
    width: 17px;
    height: 17px;
    border-radius: 2px;
    background: #007b83;
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s;
    -webkit-transform: scale(.8);
    transform: scale(.8);
    left: 5px;
    top: 5px
}

.checkbox:checked+label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

@-webkit-keyframes card-dragging-anim {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
        box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08)
    }

    to {
        -webkit-transform: rotate(-2deg);
        transform: rotate(-2deg);
        -webkit-box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21);
        box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21)
    }
}

@keyframes card-dragging-anim {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
        box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08)
    }

    to {
        -webkit-transform: rotate(-2deg);
        transform: rotate(-2deg);
        -webkit-box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21);
        box-shadow: 0 24px 28px 0 rgba(0, 0, 0, .21)
    }
}

.base-card {
    border-bottom: 1px solid #f0f2f5;
    margin-left: -15px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    position: relative
}

.base-card--active {
    z-index: 950
}

.base-card--dragging {
    opacity: 1 !important;
    border: 0
}

.base-card--option {
    border: 0;
    border: 1px solid #f0f2f5;
    border-radius: 6px;
    margin-bottom: 8px;
    margin-left: 0
}

.base-card__dropdown-positioner {
    height: 52px;
    margin-bottom: -52px
}

.base-card__container {
    border-radius: 3px;
    color: #3b3b3b;
    cursor: pointer;
    font-size: 1.6rem;
    padding: 6px 6px 6px 15px;
    -webkit-transition: -webkit-box-shadow .15s;
    transition: -webkit-box-shadow .15s;
    transition: box-shadow .15s;
    transition: box-shadow .15s, -webkit-box-shadow .15s;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    position: relative
}

.base-card--active .base-card__container,
.base-card--dragging .base-card__container,
.base-card:hover .base-card__container {
    background: #fff;
    -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08)
}

.base-card--option:hover .base-card__container,
.base-card--sentence:hover .base-card__container {
    background: transparent;
    -webkit-box-shadow: none;
    box-shadow: none
}

.base-card--option .base-card__container {
    -webkit-transition: background-color .15s;
    transition: background-color .15s
}

.base-card--option .base-card__container:focus {
    background-color: #f8f9fa;
    outline: none
}

.base-card--option:hover .base-card__container {
    background-color: #f8f9fa
}

.base-card--option:active .base-card__container {
    background-color: #f0f2f5
}

.base-card--dragging .base-card__container {
    -webkit-animation: card-dragging-anim .3s;
    animation: card-dragging-anim .3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both
}

.base-card--ghost .base-card__container {
    -webkit-transition: none !important;
    transition: none !important;
    background: #f8f9fa !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

.base-card--ghost .base-card__container:after,
.base-card--ghost .base-card__container:before {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 1px;
    background: #fff
}

.base-card--ghost .base-card__container:before {
    top: -1px
}

.base-card--ghost .base-card__container:after {
    bottom: -1px
}

.base-card--ghost .base-card__container>* {
    -webkit-transition: none;
    transition: none;
    opacity: 0 !important
}

.base-card--disabled .base-card__container {
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

.base-card__body {
    width: 100%
}

.base-card--canedit .base-card__body {
    width: calc(100% - 49px)
}

.base-card__breadcrumbs {
    text-transform: uppercase;
    list-style: none;
    padding: 0;
    margin: 0;
    color: rgba(59, 59, 59, .5);
    font-size: 1rem;
    margin-bottom: 4px;
    margin-top: 7px;
    letter-spacing: .86px;
    white-space: nowrap;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.base-card__breadcrumbs>li {
    display: inline-block;
    margin: 0;
    padding: 0;
    overflow: hidden;
    text-overflow: ellipsis
}

.base-card__breadcrumbs>li:first-child {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    max-width: 30%
}

.base-card__breadcrumbs>li:before {
    content: "/";
    margin: 0 14px
}

.base-card__breadcrumbs>li:first-child:before {
    display: none
}

.base-card__input {
    display: block;
    border: 0;
    background: transparent;
    font-size: 1.6rem;
    line-height: 2rem;
    text-align: left;
    padding: 0;
    color: #7497a3;
    width: 100%;
    outline: 0;
    resize: none;
    height: auto;
    cursor: pointer;
    pointer-events: none;
    line-height: 1.6;
    margin: 5px 0
}

.base-card--editting .base-card__input {
    pointer-events: auto;
    cursor: auto
}

.base-card__indicators {
    margin-top: 2px
}

.base-card__indicators,
.base-card__indicators div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.base-card__indicators div {
    -webkit-box-align: center;
    -ms-flex-align: center;
    margin-right: 8px;
    min-height: 20px;
    align-items: center;
    font-size: 1.2rem
}

.base-card__indicators div span {
    margin-left: 2px
}

.base-card__foot {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative
}

.base-card__tags {
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.base-card--empty-tags .base-card__tags {
    opacity: 0
}

.base-card--active .base-card__tags,
.base-card--dragging .base-card__tags,
.base-card:hover .base-card__tags {
    opacity: 1
}

.base-card__edit-wrap {
    height: 100%;
    margin-left: -25px;
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    background-color: #fff
}

.base-card__edit-wrap:after {
    content: "";
    position: absolute;
    right: 100%;
    top: 0;
    bottom: 0;
    width: 30px;
    pointer-events: none;
    background: -webkit-gradient(linear, left top, right top, from(hsla(0, 0%, 100%, 0)), to(#fff));
    background: linear-gradient(90deg, hsla(0, 0%, 100%, 0), #fff)
}

.base-card--active .base-card__edit-wrap,
.base-card--dragging .base-card__edit-wrap,
.base-card:hover .base-card__edit-wrap {
    opacity: 1
}

.base-card--editting .base-card__edit-wrap,
.base-card--editting:hover .base-card__edit-wrap {
    opacity: 0;
    pointer-events: none
}

.base-card__edit {
    width: 36px;
    height: 36px;
    border-radius: 3px;
    font-size: 1.8rem;
    padding: 8px 9px;
    background-color: #fff;
    display: inline-block;
    vertical-align: top;
    line-height: 1px;
    -webkit-transition: all .2s;
    transition: all .2s
}

.base-card__edit:hover {
    background-color: #f8f9fa
}

.base-card__edit:active {
    background-color: #f0f2f5
}

@media screen and (max-width:767px) {
    .base-card__edit {
        display: none
    }
}

.base-card__edit-icon,
.base-card__expand-icon {
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s
}

.base-card--active .base-card__edit-icon,
.base-card--active .base-card__expand-icon,
.base-card--dragging .base-card__edit-icon,
.base-card--dragging .base-card__expand-icon,
.base-card:hover .base-card__edit-icon,
.base-card:hover .base-card__expand-icon {
    opacity: .7
}

.base-card--editting .base-card__edit-icon,
.base-card--editting .base-card__expand-icon,
.base-card--editting:hover .base-card__edit-icon,
.base-card--editting:hover .base-card__expand-icon {
    opacity: 0
}

.base-card__expand-icon {
    width: 20px;
    height: 19px;
    vertical-align: top
}

.base-card__enter-archive {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background-color: #fff;
    font-size: 12px;
    color: #858585;
    padding-right: 15px
}

.base-card__enter-archive,
.base-card__enter-archive-icon {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 3px
}

.base-card__enter-archive-icon {
    margin-left: 15px;
    background-color: #f3f6f8;
    width: 25px;
    height: 25px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.base-card__enter-archive-icon svg {
    width: 18px;
    height: 15px
}

.base-card__sentence {
    margin: 5px 0
}

.base-card__option {
    position: relative;
    min-height: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 7px 0;
    padding-left: 38px;
    font-size: 16px;
    counter-increment: surveyCard
}

.base-card__option:before {
    content: counter(surveyCard, upper-alpha);
    position: absolute;
    background-color: #f8f9fa;
    width: 26px;
    height: 26px;
    left: 0;
    top: 50%;
    margin-top: -13px;
    border-radius: 3px;
    text-align: center;
    line-height: 26px;
    font-size: 12px;
    color: rgba(65, 65, 65, .5);
    -webkit-transition: all .2s;
    transition: all .2s
}

.base-card--selected .base-card__option:before {
    background-color: #059fa3;
    color: #fff
}

.base-card__option--check:before {
    content: "";
    background-repeat: no-repeat;
    background-position: 50%;
    border: 1px solid #86909a;
    background-color: #fff
}

.base-card--selected .base-card__option--check:before {
    background-color: #059fa3;
    background-image: url(/img/check-white.f66c6586.svg);
    border-color: #059fa3
}

.grid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    list-style: none;
    padding: 0;
    margin: 0 0 -17px -20px
}

.grid--middle {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.grid--between {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.grid--big-gutter {
    margin: 0 0 -84px -84px
}

.grid--big-gutter>.grid-col {
    padding: 0 0 84px 84px
}

.grid--large-horizontal-gutter {
    margin: 0 0 -46px -250px
}

.grid--large-horizontal-gutter>.grid-col {
    padding: 0 0 46px 250px
}

.grid--section {
    margin: 0 0 -140px -140px
}

@media screen and (max-width:767px) {
    .grid--section {
        margin: 0 0 -26px -26px
    }
}

.grid--section>.grid-col {
    padding: 0 0 140px 140px
}

@media screen and (max-width:767px) {
    .grid--section>.grid-col {
        padding: 0 0 26px 26px
    }
}

.grid-col {
    min-height: 1px;
    padding: 0 0 0px 20px;
    margin-top: 4px;
}

.grid-col--1 {
    width: 8.33333%
}

.grid-col--2 {
    width: 16.66667%
}

.grid-col--3 {
    width: 25%
}

.grid-col--4 {
    width: 33.33333%
}

.grid-col--5 {
    width: 41.66667%
}

.grid-col--6 {
    width: 50%
}

.grid-col--7 {
    width: 58.33333%
}

.grid-col--8 {
    width: 66.66667%
}

.grid-col--9 {
    width: 75%
}

.grid-col--10 {
    width: 83.33333%
}

.grid-col--11 {
    width: 91.66667%
}

.grid-col--12 {
    width: 100%
}

@media screen and (max-width:767px) {
    .grid-col--xs-1 {
        width: 8.33333%
    }

    .grid-col--xs-2 {
        width: 16.66667%
    }

    .grid-col--xs-3 {
        width: 25%
    }

    .grid-col--xs-4 {
        width: 33.33333%
    }

    .grid-col--xs-5 {
        width: 41.66667%
    }

    .grid-col--xs-6 {
        width: 50%
    }

    .grid-col--xs-7 {
        width: 58.33333%
    }

    .grid-col--xs-8 {
        width: 66.66667%
    }

    .grid-col--xs-9 {
        width: 75%
    }

    .grid-col--xs-10 {
        width: 83.33333%
    }

    .grid-col--xs-11 {
        width: 91.66667%
    }

    .grid-col--xs-12 {
        width: 100%
    }
}

.color-picker {
    font-size: 1.6rem
}

.color-picker__title {
    font-size: 1.4rem;
    text-align: center;
    display: block;
    color: #646464;
    margin-bottom: 19px
}

.color-picker__button {
    width: 32px;
    height: 32px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 0;
    border-radius: 50%;
    padding: 0;
    margin: 0;
    background-color: #5323b1;
    display: inline-block;
    vertical-align: top;
    position: relative;
    overflow: hidden;
    -webkit-transition: all .15s;
    transition: all .15s
}

.color-picker__button:active {
    -webkit-transform: scale(.9);
    transform: scale(.9)
}

.color-picker__button:focus {
    outline: none
}

.color-picker__button:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .3);
    opacity: 0;
    -webkit-transition: opacity .2s, background-color .2s;
    transition: opacity .2s, background-color .2s;
    background-image: url(/img/chevron-down.156dd86b.svg);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 10px 7px
}

.color-picker__button:hover:after {
    opacity: 1
}

.color-picker__button--open:after {
    background-color: transparent;
    opacity: 1;
    -webkit-transform: scaleY(-1);
    transform: scaleY(-1)
}

.color-picker__button--open:hover:after {
    background-color: rgba(0, 0, 0, .3)
}

.color-picker__tooltip {
    width: 251px
}

.color-picker__section {
    padding: 14px;
    border-bottom: 1px solid #f2f2f2
}

.color-picker__section:last-child {
    border-bottom: 0
}

.color-picker__active-color {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background-color: #000;
    display: inline-block;
    vertical-align: top;
    -webkit-transition: all .1s;
    transition: all .1s;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-right: 25px
}

.color-picker__input {
    width: 100%;
    color: #646464;
    font-size: 1.4rem;
    border: 0;
    border-bottom: 1px dashed #aaaab5;
    padding: 7px 0;
    padding-left: 14px
}

.color-picker__input:hover {
    border-bottom: 1px dashed #8e8e8e
}

.color-picker__input:focus {
    outline: none;
    border-bottom: 1px dashed #1d1d1d
}

.color-picker__input-wrap {
    position: relative
}

.color-picker__input-wrap:before {
    position: absolute;
    left: 0;
    content: "#";
    color: #646464;
    font-size: 1.4rem;
    line-height: 1.4rem;
    margin-top: -.7rem;
    top: 50%
}

.color-picker__input-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.color-picker__actions {
    list-style: none;
    text-align: center;
    font-size: 1.4rem;
    padding: 0;
    margin: 0
}

.color-picker__actions a {
    color: #646464;
    cursor: pointer
}

.color-picker__actions a:hover {
    color: #059fa3;
    text-decoration: none
}

.multiselect-list {
    padding: 0;
    margin: 0;
    list-style: none
}

.multiselect-list a {
    color: #252729;
    font-size: 1.4rem;
    font-weight: 400;
    padding: 8px 8px 8px 40px;
    border-radius: 3px;
    display: block;
    cursor: pointer;
    position: relative
}

.multiselect-list a:after {
    content: "";
    position: absolute;
    width: 12px;
    height: 12px;
    left: 14px;
    top: 50%;
    margin-top: -6px;
    background-image: url(/img/tick.b5b3eefe.svg);
    background-repeat: no-repeat;
    background-position: 50%;
    opacity: 0
}

.multiselect-list a:hover {
    text-decoration: none;
    background: #f8f9fa
}

.multiselect-list a.is-active {
    background: #f8f9fa
}

.multiselect-list a.is-active:after {
    opacity: 1
}

.date-picker {
    width: 547px;
    max-width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.date-picker__presets {
    width: 174px;
    padding: 8px;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.date-picker__picker {
    width: 100%;
    padding-right: 14px;
    padding-left: 6px
}

.dp__menu,
.dp_main {
    width: 100%
}

.dp__menu {
    border: 0 !important;
    font-size: 13px
}

.dp__calendar_header {
    width: 100%
}

.dp__calendar_header_item {
    width: 100%;
    font-size: 12px;
    font-weight: 400
}

.dp__calendar_header_separator {
    display: none
}

.dp__calendar,
.dp__calendar_item,
.dp__calendar_row,
.dp__cell_inner {
    width: 100%
}

.dp__active_date,
.dp__range_end,
.dp__range_start {
    background-color: #007b83
}

.dp__today {
    border-color: #007b83
}

.swatches-picker {
    font-size: 1.6rem
}

.swatches-picker__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    list-style: none;
    padding: 0;
    margin: -12px 0 0 -12px
}

.swatches-picker__item {
    padding: 12px 0 0 12px !important;
    list-style-type: none !important
}

.swatches-picker__swatch {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 0;
    display: inline-block;
    vertical-align: top;
    overflow: hidden;
    position: relative;
    -webkit-transition: all .15s;
    transition: all .15s;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.swatches-picker__swatch:active {
    -webkit-transform: scale(.9);
    transform: scale(.9)
}

.swatches-picker__swatch:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-image: url(/img/check-light.39f7e6e9.svg);
    background-repeat: no-repeat;
    background-position: 50%;
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s
}

.swatches-picker__swatch:focus {
    outline: none
}

.swatches-picker__swatch--selected:after {
    opacity: 1
}

.swatches-picker--squared .swatches-picker__list {
    margin: -8px 0 0 -8px
}

.swatches-picker--squared .swatches-picker__item {
    padding: 8px 0 0 8px !important
}

.swatches-picker--squared .swatches-picker__swatch {
    width: 25px;
    height: 25px;
    border-radius: 3px
}

.swatches-picker--squared .swatches-picker__swatch:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s
}

.swatches-picker--squared .swatches-picker__swatch:hover:before {
    opacity: .15
}

.dropdown-menu {
    padding: 6px;
    list-style: none;
    margin: 0;
    font-size: 1.4rem;
    border-radius: 4px;
    color: #646464;
    text-transform: none;
    text-align: left;
    letter-spacing: 0
}

.dropdown-menu__item {
    margin: 0;
    padding: 0;
    display: block
}

.dropdown-menu__item:first-child .dropdown-menu__spacer,
.dropdown-menu__item:last-child .dropdown-menu__spacer {
    display: none
}

.dropdown-menu__method-item-icon {
    font-size: 24px;
    vertical-align: middle;
    margin-right: 10px;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.dropdown-menu__link-info {
    font-size: 12px;
    color: #6f7380
}

.dropdown-menu__link {
    color: inherit;
    padding: 8px;
    border-radius: 4px;
    cursor: pointer;
    -webkit-transition: all .2s;
    transition: all .2s;
    position: relative;
    min-height: 36px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.dropdown-menu__link,
.dropdown-menu__link .dropdown-menu__link-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.dropdown-menu__link .dropdown-menu__link-box-icon {
    font-size: 16px;
    margin-right: 5px
}

.dropdown-menu__link--sub {
    padding-right: 32px
}

.dropdown-menu__link--active,
.dropdown-menu__link:hover {
    background-color: #f8f9fa;
    color: #252729
}

.dropdown-menu__link--active {
    font-weight: 600
}

.dropdown-menu__link--selected {
    background-color: #f8f9fa;
    color: #252729
}

.dropdown-menu__link:hover {
    text-decoration: none
}

.dropdown-menu__link:active {
    background-color: #f0f2f5
}

.dropdown-menu__link--disabled,
.dropdown-menu__link--disabled:active,
.dropdown-menu__link--disabled:hover {
    background-color: transparent;
    color: inherit;
    cursor: default
}

.dropdown-menu__link--warn {
    color: #d0021b;
    font-weight: 600
}

.dropdown-menu__link--light {
    opacity: .5
}

.dropdown-menu__link--add {
    background-color: #f8f9fa;
    height: 36px;
    margin-top: 8px;
    background-image: url(/img/plus-small.68273311.svg);
    background-repeat: no-repeat;
    background-position: 50%
}

.dropdown-menu__link--add:hover {
    background-color: #f0f2f5
}

.dropdown-menu__link--add:active {
    background-color: #dfe2e8
}

.dropdown-menu__link--box-icon,
.dropdown-menu__link--box-icon-small {
    position: relative;
    padding-left: 52px;
    font-weight: 700;
    font-size: 1.4rem;
    padding-top: 16px;
    padding-bottom: 16px;
    color: #3b3b3b
}

.dropdown-menu__link--box-icon .dropdown-menu__link-box-icon,
.dropdown-menu__link--box-icon-small .dropdown-menu__link-box-icon {
    position: absolute;
    left: 8px;
    font-size: 36px;
    top: 50%;
    margin-top: -18px;
    background-color: #f8f9fa;
    -webkit-transition: all .2s;
    transition: all .2s
}

.dropdown-menu__link--box-icon-small:hover .dropdown-menu__link-box-icon,
.dropdown-menu__link--box-icon:hover .dropdown-menu__link-box-icon {
    background-color: #f0f2f5
}

.dropdown-menu__link--box-icon-small:active .dropdown-menu__link-box-icon,
.dropdown-menu__link--box-icon:active .dropdown-menu__link-box-icon {
    background-color: #dfe2e8
}

.dropdown-menu__link--box-icon .dropdown-menu__link-desc,
.dropdown-menu__link--box-icon-small .dropdown-menu__link-desc {
    font-size: 1.2rem;
    color: rgba(59, 59, 59, .5);
    font-weight: 400
}

.dropdown-menu__link--box-icon-small {
    padding-left: 42px;
    padding-top: 8px;
    padding-bottom: 8px
}

.dropdown-menu__link--box-icon-small .dropdown-menu__link-box-icon {
    font-size: 24px;
    margin-top: -12px
}

.dropdown-menu__link-ico {
    font-size: 16px;
    vertical-align: middle;
    margin-right: 5px
}

.dropdown-menu__link-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.dropdown-menu__link-check {
    margin-left: 10px;
    font-size: 12px;
    margin-right: 4px;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.dropdown-menu__sub--left {
    left: auto;
    right: 100%;
    margin-right: 8px;
    margin-left: 0
}

.dropdown-menu__link-icon {
    font-size: 10px;
    position: absolute;
    right: 8px;
    top: 50%;
    margin-top: -5px;
    line-height: 1
}

.dropdown-menu__sub {
    position: absolute;
    left: 100%;
    top: 0;
    border-radius: 3px;
    -webkit-box-shadow: 0 15px 18px 0 rgba(0, 0, 0, .06);
    box-shadow: 0 15px 18px 0 rgba(0, 0, 0, .06);
    border: 1px solid hsla(0, 0%, 93%, .62);
    background-color: #fff;
    color: #3b3b3b;
    margin-left: 8px
}

.dropdown-menu__sub-title {
    font-size: 16px;
    text-align: center;
    margin: 10px 0
}

.dropdown-menu__spacer {
    display: block;
    margin: 5px -4px;
    border-top: 1px solid #eee
}

.dropdown-menu--dark {
    min-width: 130px;
    border: 0;
    color: #fff
}

.dropdown-menu--dark .dropdown-menu__link:hover {
    color: inherit;
    text-decoration: none;
    background-color: #000
}

.dropdown-menu-btn {
    font-size: 1.4rem;
    font-weight: 700;
    padding: 4px 8px;
    display: block;
    padding-right: 22px;
    position: relative;
    border: 1px solid transparent;
    -webkit-transition: all .2s;
    transition: all .2s;
    border-radius: 4px;
    color: #3b3b3b
}

.dropdown-menu-btn .icon {
    font-size: 6px;
    right: 10px;
    top: 50%;
    margin-top: -3px;
    position: absolute;
    opacity: .5
}

.dropdown-menu-btn:hover {
    border-color: #f8f9fa;
    background-color: #f8f9fa
}

.dropdown-menu-btn:active {
    border-color: #f0f2f5;
    background-color: #f0f2f5
}

.dropdown-menu-header {
    font-size: 1.6rem;
    padding: 14px 24px;
    text-align: center;
    position: relative
}

.dropdown-menu-header__back {
    width: 24px;
    height: 24px;
    border-radius: 4px;
    font-size: 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    top: 50%;
    left: 0;
    margin-top: -12px;
    cursor: pointer
}

.dropdown-menu-header__back:hover {
    background-color: #f8f9fa
}

.search-input {
    position: relative;
    border-radius: 4px;
    background-color: #f8f8f8
}

.search-input,
.search-input__icon {
    -webkit-transition: all .2s;
    transition: all .2s
}

.search-input__icon {
    position: absolute;
    left: 10px;
    width: 16px;
    height: 16px;
    top: 50%;
    margin-top: -8px;
    pointer-events: none;
    opacity: 0
}

.search-input--focus .search-input__icon,
.search-input--searching .search-input__icon {
    opacity: 1
}

.search-input__placeholder {
    position: absolute;
    left: 50%;
    top: 0;
    line-height: 40px;
    color: #646464;
    opacity: .5;
    white-space: nowrap;
    pointer-events: none;
    -webkit-transition: all .2s;
    transition: all .2s
}

.search-input__placeholder:after {
    -webkit-transition: all .2s;
    transition: all .2s;
    content: attr(data-placeholder);
    position: relative;
    left: -50%
}

.search-input--focus .search-input__placeholder {
    left: 40px
}

.search-input--focus .search-input__placeholder:after {
    left: 0
}

.search-input--searching .search-input__placeholder {
    opacity: 0
}

.search-input__input {
    width: 100%;
    border: 0;
    background-color: transparent;
    height: 40px;
    position: relative;
    padding-right: 10px;
    padding-left: 40px
}

.search-input__input:focus {
    outline: none
}

.dropdown-confirm {
    text-align: center;
    color: #3b3b3b
}

.dropdown-confirm__title {
    font-size: 18px;
    margin: 20px 0 10px
}

.dropdown-confirm__desc {
    margin: 10px 0 23px;
    font-size: 14px
}

.dropdown-confirm__input {
    height: 40px;
    padding: 0 8px;
    font-size: 16px
}

.dropdown-confirm .btn,
.dropdown-confirm .method-section-add {
    margin-top: 8px;
    font-size: 16px
}

.person-list-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 16px;
    cursor: pointer;
    color: #4b5761;
    font-size: 1.4rem;
    border-bottom: 1px solid #f2f2f2;
    text-decoration: none;
    margin-left: -16px;
    -webkit-transition: all .2s;
    transition: all .2s
}

.person-list-item:focus,
.person-list-item:hover {
    background-color: #f8f9fa;
    text-decoration: none;
    color: #4b5761
}

.person-list-item__avatar {
    width: 52px;
    height: 52px;
    border-radius: 4px;
    background-color: #e6edf0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-right: 24px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    overflow: hidden
}

.person-list-item__avatar .icon--user-default {
    font-size: 24px;
    background-color: #e6edf0;
    position: relative
}

.person-list-item__avatar .competitor-analysis-competitor-list-item-placeholder {
    position: relative
}

.person-list-item__avatar .base-spinner {
    padding: 0;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -10px 0 0 -10px
}

.person-list-item__avatar-img {
    background-size: cover;
    width: 100%;
    height: 100%;
    border-radius: 4px
}

.person-list-item__body {
    width: 100%
}

.person-list-item__name {
    font-size: 1.8rem;
    color: #252729;
    display: block;
    margin-bottom: 5px
}

.person-list-item__desc {
    display: block;
    margin-top: 5px
}

.person-list-item__new-input {
    font-size: 1.8rem;
    font-weight: 600;
    width: 100%;
    color: #252729;
    font-weight: 400
}

.person-list-item__submit-button {
    outline: none;
    margin-right: 25px;
    opacity: 0
}

.person-list-item--active .person-list-item__submit-button {
    opacity: 1
}

.person-list-item--add {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 0
}

.person-list-item--add .person-list-item__avatar {
    border-radius: 4px;
    width: 52px;
    height: 52px;
    border-radius: 3px;
    margin-right: 25px;
    background-color: #f8f9fa;
    position: relative;
    -webkit-transition: background .3s ease;
    transition: background .3s ease
}

.person-list-item--add .person-list-item__avatar:before {
    content: "";
    width: 32px;
    height: 32px;
    background-color: #edf0f2;
    border-radius: 50%;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -16px;
    margin-left: -16px;
    -webkit-transition: background .3s ease;
    transition: background .3s ease
}

.person-list-item--add.person-list-item--active .person-list-item__avatar,
.person-list-item--add.person-list-item:focus-within .person-list-item__avatar,
.person-list-item--add.person-list-item:hover .person-list-item__avatar {
    background-color: #f2f4f6
}

.person-list-item--add.person-list-item--active .person-list-item__avatar:before,
.person-list-item--add.person-list-item:focus-within .person-list-item__avatar:before,
.person-list-item--add.person-list-item:hover .person-list-item__avatar:before {
    background-color: #e7ebee
}

.person-list-item--active {
    background-color: #f8f9fa
}

.method-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #969696;
    font-size: 1.6rem;
    padding: 20px 16px;
    margin-left: -16px;
    border-bottom: 1px solid #f4f4f4;
    -webkit-transition: all .2s;
    transition: all .2s
}

@media screen and (max-width:767px) {
    .method-item {
        padding: 14px 16px;
        margin: 0 -16px;
        border-bottom: 0
    }
}

.method-item__icon {
    width: 64px;
    height: 64px;
    border-radius: 4px;
    margin-right: 32px;
    font-size: 64px;
    line-height: 1
}

@media screen and (max-width:767px) {
    .method-item__icon {
        width: 48px;
        height: 48px;
        font-size: 48px;
        margin-right: 16px
    }
}

.method-item__name {
    font-size: 2rem;
    color: #000
}

@media screen and (max-width:767px) {
    .method-item__name {
        font-size: 1.6rem
    }
}

.method-item__count {
    margin: 0
}

@media screen and (max-width:767px) {
    .method-item__count {
        font-size: 1.4rem
    }
}

.method-item--new {
    border-bottom: 0
}

.method-item--new:hover .method-item__icon {
    background-color: #f0f2f5
}

.method-item--new:active .method-item__icon {
    background-color: #dfe2e8
}

.method-item--new .method-item__icon {
    background-color: #f8f9fa;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition: all .2s;
    transition: all .2s
}

.method-item--new .method-item__icon .icon {
    font-size: 16px
}

.side-dropdown-menu--open .method-item,
.side-dropdown-menu:hover .method-item {
    background-color: #f8f9fa
}

.side-dropdown-menu:active .method-item {
    background-color: #f0f2f5
}

.method__wrapper .sortable-handler {
    position: absolute;
    top: 50%;
    margin-top: -12px;
    left: -40px;
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s
}

.method__wrapper:hover .sortable-handler {
    opacity: 1
}

.side-dropdown-menu {
    position: relative;
    min-height: 34px
}

.side-dropdown-menu__content {
    margin-right: 16px
}

.side-dropdown-menu--empty .side-dropdown-menu__content {
    margin-right: 0
}

.side-dropdown-menu__menu {
    width: 34px;
    height: 34px;
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -17px
}

.side-dropdown-menu__menu .tooltip__trigger {
    height: 100%
}

.side-dropdown-menu__btn {
    width: 100%;
    height: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-right: 0;
    font-size: 1.4rem;
    color: #aaaab5;
    -webkit-transition: opacity .2s;
    transition: opacity .2s;
    opacity: 0
}

.side-dropdown-menu--open .side-dropdown-menu__btn,
.side-dropdown-menu:hover .side-dropdown-menu__btn {
    opacity: 1
}

.side-dropdown-menu--interview .side-dropdown-menu__menu {
    width: 48px
}

.side-dropdown-menu--interview .side-dropdown-menu__btn {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.side-dropdown-menu--outside {
    display: block;
    position: relative
}

@media screen and (max-width:991px) {
    .side-dropdown-menu--outside {
        padding-right: 34px
    }
}

.side-dropdown-menu--outside .side-dropdown-menu__menu {
    width: 32px;
    margin-right: -32px;
    margin-top: 0;
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    border-radius: 3px;
    -webkit-transition: all .2s;
    transition: all .2s
}

@media screen and (max-width:991px) {
    .side-dropdown-menu--outside .side-dropdown-menu__menu {
        margin-right: 0
    }
}

.side-dropdown-menu--outside .side-dropdown-menu__menu:hover {
    background-color: #f8f9fa
}

.side-dropdown-menu--outside .side-dropdown-menu__menu:active {
    background-color: #f0f2f5
}

.side-dropdown-menu--outside .side-dropdown-menu__menu .tooltip__trigger {
    height: 100%
}

.side-dropdown-menu--outside .side-dropdown-menu__menu .side-dropdown-menu__btn {
    height: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-right: 0
}

.side-dropdown-menu--outside.side-dropdown-menu--open .side-dropdown-menu__menu {
    background-color: #f8f9fa
}

.side-dropdown-menu--outside.side-dropdown-menu--open .side-dropdown-menu__menu:active {
    background-color: #f0f2f5
}

.side-dropdown-menu--outside .side-dropdown-menu__content {
    width: 100%
}

.side-dropdown-menu--top {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.side-dropdown-menu--top .side-dropdown-menu__menu {
    top: 0;
    margin-top: 0
}

.side-dropdown-menu--middle .side-dropdown-menu__menu {
    top: 50%;
    margin-top: -16px
}

.side-dropdown-menu--outside-middle .side-dropdown-menu__menu {
    width: 32px;
    margin-right: -32px
}

.side-dropdown-menu--outside-middle .side-dropdown-menu__content {
    width: 100%
}

.titleinput {
    position: relative
}

.titleinput,
.titleinput__body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.titleinput__body {
    width: 100%;
    font-size: 1.6rem;
    color: #4a4a4a
}

.titleinput__enter {
    position: absolute;
    right: 0;
    top: 50%;
    width: 26px;
    height: 26px;
    background-color: #edf0f2;
    border-radius: 3px;
    margin-top: -13px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 14px
}

.titleinput__enter .icon {
    height: 11px
}

.titleinput__enter:hover {
    background-color: #e6edf0
}

.titleinput__enter:active {
    background-color: #cddde5
}

.titleinput__no-edit {
    padding: .25em 0;
    width: 100%;
    display: block;
    border-bottom: 1px solid transparent
}

.titleinput__select {
    position: relative;
    padding-right: 36px
}

.titleinput__select:before {
    content: "";
    position: absolute;
    width: 26px;
    height: 26px;
    right: 0;
    top: 50%;
    margin-top: -13px;
    -webkit-transition: all .2s;
    transition: all .2s;
    border-radius: 5px
}

.titleinput__select:after {
    content: "";
    border: 4px solid transparent;
    border-bottom: 0;
    border-top-color: #86909a;
    position: absolute;
    right: 9px;
    top: 50%;
    margin-top: -2px
}

.titleinput__select:hover:before {
    background-color: #e6edf0
}

.titleinput__select:active:before {
    background-color: #cddde5
}

.titleinput__input {
    border-color: transparent;
    font-size: inherit;
    font-weight: 600;
    height: auto;
    padding: .25em 0;
    color: inherit;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato, Helvetica, Tahoma, Arial, sans-serif;
    text-align: inherit;
    width: 100%;
    letter-spacing: inherit;
    text-transform: inherit;
    resize: none;
    -webkit-transition-property: border-color, color;
    transition-property: border-color, color;
    -webkit-transition-duration: .35s;
    transition-duration: .35s
}

.titleinput__input:hover {
    border-color: hsla(0, 0%, 59%, .5)
}

.titleinput__input:focus {
    border-color: #646464
}

.titleinput textarea.titleinput__input {
    height: 2em
}

.titleinput__color-picker {
    margin-right: 20px;
    margin-left: -52px
}

@media screen and (max-width:991px) {
    .titleinput__color-picker {
        margin-left: 0;
        margin-right: 16px
    }
}

.titleinput__icons,
.titleinput__icons .titled-icon,
.titleinput__icons .tooltip__trigger {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.titleinput__icons .titled-icon,
.titleinput__icons .tooltip__trigger {
    height: 30px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.titleinput__icons .titled-icon .icon,
.titleinput__icons .tooltip__trigger .icon {
    font-size: 2.1rem
}

.titleinput__icons .titled-icon .icon--more-vertical,
.titleinput__icons .tooltip__trigger .icon--more-vertical {
    font-size: 1.4rem
}

.titleinput__icons .titled-icon .icon--book-open,
.titleinput__icons .tooltip__trigger .icon--book-open {
    font-size: 2rem
}

.titleinput__icons .switch {
    font-size: 16px;
    white-space: nowrap
}

.titleinput__icons .view-only .tooltip__trigger {
    height: auto
}

.titleinput__icon {
    margin-left: 20px
}

@media screen and (max-width:767px) {
    .titleinput__icon {
        margin-left: 10px
    }
}

.titleinput__icon-trigger {
    font-size: 2.2rem;
    line-height: 1;
    cursor: pointer
}

.titleinput--centered .titleinput__body {
    text-align: center
}

.titleinput--project-title {
    margin: 10px 0 3px
}

@media screen and (max-width:767px) {
    .titleinput--project-title {
        margin-top: 46px;
        margin-bottom: 30px
    }
}

.titleinput--project-title .titleinput__body {
    font-family: "IBM Plex Serif";
    color: #111111;
    font-weight: 500;
    font-size: 2.5rem
}

@media screen and (max-width:767px) {
    .titleinput--project-title .titleinput__body {
        font-size: 2.4rem
    }
}

.titleinput--report-title {
    margin: 24px 0;
    margin-top: 0
}

.titleinput--report-title .titleinput__body {
    font-family: "IBM Plex Serif";
    color: #1e1e1e;
    font-weight: 400;
    font-size: 3.4rem
}

@media screen and (max-width:767px) {
    .titleinput--report-title .titleinput__body {
        font-size: 2.4rem
    }
}

.titleinput--report-hero-name {
    margin-bottom: 85px;
    margin-top: 0
}

.titleinput--report-hero-name .titleinput__body {
    font-family: "IBM Plex Serif";
    color: #1e1e1e;
    font-weight: 400;
    font-size: 3.4rem
}

@media screen and (max-width:767px) {
    .titleinput--report-hero-name .titleinput__body {
        font-size: 2.4rem
    }
}

.titleinput--report-hero-title {
    margin: 24px 0;
    margin-top: 0
}

.titleinput--report-hero-title .titleinput__body {
    font-family: "IBM Plex Serif";
    color: #1e1e1e;
    font-weight: 300;
    font-size: 6.4rem
}

@media screen and (max-width:767px) {
    .titleinput--report-hero-title .titleinput__body {
        font-size: 2.4rem
    }
}

.titleinput--phase-title {
    margin: 10px 0
}

.titleinput--section-title .titleinput__body {
    font-size: 2.3rem;
    letter-spacing: -.1px;
    color: #000;
    font-weight: 400
}

.titleinput--md {
    margin-bottom: 50px
}

.titleinput--md .titleinput__body {
    font-size: 1.8rem;
    font-weight: 600;
    color: #252729
}

.titleinput--lmd .titleinput__body,
.titleinput--xmd .titleinput__body {
    font-size: 2rem;
    font-weight: 600;
    color: #252729
}

.titleinput--lg .titleinput__body {
    font-size: 2.4rem;
    font-weight: 500;
    color: #252729
}

.titleinput--tiny {
    margin-bottom: 0;
    margin-top: 0
}

.titleinput--tiny .titleinput__body {
    font-size: 11px;
    color: #aaaab5;
    text-transform: uppercase;
    letter-spacing: .92px;
    text-align: inherit
}

.titleinput--dotted .titleinput__input {
    border-color: #aaaab5
}

.titleinput--dotted .titleinput__input:hover {
    border-color: hsla(0, 0%, 59%, .5)
}

.titleinput--dotted .titleinput__input:focus {
    border-color: #646464
}

.titleinput--dotted .titleinput__input,
.titleinput--dotted .titleinput__no-edit {
    padding: .6em 0
}

.titleinput--clear .titleinput__input,
.titleinput--clear .titleinput__input:focus,
.titleinput--clear .titleinput__input:hover {
    border-color: transparent
}

.titleinput--no-margin-bottom {
    margin-bottom: 0
}

.titleinput--library-section .titleinput__body {
    font-size: 1.8rem;
    font-weight: 400;
    color: #252729
}

.dropdown-counter {
    width: 44px;
    border-radius: 5px;
    padding: 5px 8px;
    font-size: 12px;
    position: relative;
    cursor: pointer;
    -webkit-transition: all .2s;
    transition: all .2s
}

.dropdown-counter:after {
    content: "";
    border: 4px solid transparent;
    border-bottom: 0;
    border-top-color: #86909a;
    position: absolute;
    right: 8px;
    top: 50%;
    margin-top: -2px
}

.dropdown-counter--active:after {
    -webkit-transform: scaleY(-1);
    transform: scaleY(-1)
}

.box-alert {
    padding: 16px;
    font-size: 14px;
    color: #646464;
    max-width: 260px;
    text-align: center;
    position: relative
}

.box-alert__title {
    font-size: 16px;
    color: #414141;
    margin-top: 8px
}

.box-alert__desc {
    margin: 16px 0
}

.box-alert__close {
    position: absolute;
    right: 5px;
    top: 5px;
    font-size: 14px;
    border: 0;
    border-radius: 0;
    background: transparent;
    padding: 8px;
    -webkit-transform: scale(.85);
    transform: scale(.85)
}

.box-alert .btn,
.box-alert .method-section-add {
    margin-bottom: 8px
}

.box-alert .btn:last-child,
.box-alert .method-section-add:last-child {
    margin-bottom: 0
}

.pricing-table {
    padding: 60px 36px 90px;
    background-color: #fafafa;
    text-align: center;
    position: relative;
    color: #212528
}

@media screen and (max-width:767px) {
    .pricing-table {
        padding-top: 32px;
        padding-left: 24px;
        padding-right: 24px;
        padding-bottom: 37px
    }
}

.pricing-table--featured {
    background: #fff
}

.pricing-table--featured:before {
    content: "";
    position: absolute;
    z-index: -1;
    -webkit-box-shadow: 0 0 45px rgba(0, 0, 0, .1);
    box-shadow: 0 0 45px rgba(0, 0, 0, .1);
    width: 100%;
    top: 0;
    left: 0;
    height: 70%
}

.pricing-table__name,
.pricing-table__price {
    font-family: "IBM Plex Serif", serif;
    display: block;
    margin: 0;
    font-weight: 400;
    color: #212528
}

.pricing-table__price {
    font-size: 88px;
    margin-top: 17px;
    position: relative;
    display: inline-block;
    font-weight: 300
}

@media screen and (max-width:767px) {
    .pricing-table__price {
        font-size: 68px;
        margin-top: 9px
    }
}

.pricing-table__price:after {
    content: attr(data-yearly-price)
}

.is-monthly-pricing .pricing-table__price:after {
    content: attr(data-monthly-price)
}

.pricing-table__price sup {
    position: absolute;
    right: 100%;
    top: .43em;
    font-size: .409em;
    line-height: inherit;
    vertical-align: baseline
}

.pricing-table__period,
.pricing-table__users {
    display: block
}

.pricing-table__users {
    margin: 22px 0 34px
}

@media screen and (max-width:767px) {
    .pricing-table__users {
        margin-top: 14px;
        margin-bottom: 20px
    }
}

.pricing-table--featured .pricing-table__users {
    font-weight: 700
}

.pricing-table__features {
    list-style: none;
    padding: 0;
    margin: 0;
    margin-top: 58px
}

@media screen and (max-width:767px) {
    .pricing-table__features {
        margin-top: 22px
    }
}

.pricing-table__features>li {
    margin-top: 17px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.pricing-table__features>li .icon {
    margin-right: 10px;
    font-size: 20px
}

.pricing-table__info {
    background-color: #edf0f2;
    font-size: 14px;
    color: rgba(0,0,0, .61);
    padding: 10px 50px;
    text-align: center;
    margin-bottom: 8px;
    margin-top: -23px
}

.section {
    background-size: cover;
    background-position: 50%
}

.section__container {
    margin-top: 90px;
    margin-bottom: 90px
}

@media screen and (max-width:767px) {
    .section__container {
        margin-top: 32px;
        margin-bottom: 32px
    }
}

.section__body-col {
    width: 42%;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1
}

@media screen and (max-width:767px) {
    .section__body-col {
        width: 100%;
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
        text-align: center
    }
}

.section__aside-col {
    width: 58%;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2
}

@media screen and (max-width:767px) {
    .section__aside-col {
        width: 100%;
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1
    }
}

.section__aside-image img {
    width: 100%;
    height: auto;
    vertical-align: top
}

@media screen and (min-width:768px) {
    .section--reverse .section__body-col {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2
    }

    .section--reverse .section__aside-col {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1
    }

    .section--bottom-aside {
        overflow: hidden
    }

    .section--bottom-aside .section__aside-image {
        -webkit-box-shadow: 0 55px 124px 0 rgba(42, 47, 56, .1);
        box-shadow: 0 55px 124px 0 rgba(42, 47, 56, .1);
        margin-bottom: -90px
    }
}

@media screen and (max-width:767px) {
    .section--bottom-aside .section__body-col {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1
    }

    .section--bottom-aside .section__aside-col {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2
    }
}

.section--hero {
    text-align: center
}

@media screen and (max-width:767px) {

    .section--align-left-mobile,
    .section--align-left-mobile .section__body-col {
        text-align: left
    }
}

.section--testimonials {
    text-align: center;
    margin-bottom: 245px
}

@media screen and (max-width:767px) {
    .section--testimonials {
        margin-bottom: 65px
    }
}

.section--md-spacing .section__container {
    margin-top: 216px;
    margin-bottom: 216px
}

@media screen and (max-width:767px) {
    .section--md-spacing .section__container {
        margin-top: 65px;
        margin-bottom: 65px
    }
}

.section--explore {
    text-align: center;
    background-color: #fafafa
}

.section--explore .section__container {
    margin-top: 164px;
    margin-bottom: 228px
}

@media screen and (max-width:767px) {
    .section--explore .section__container {
        margin-top: 40px;
        margin-bottom: 100px
    }

    .section--analyze .section__container {
        margin-bottom: 100px
    }
}

.section--inspire {
    text-align: center;
    background-color: #fafafa
}

.section--inspire .section__container {
    margin-top: 84px;
    margin-bottom: 133px
}

@media screen and (max-width:767px) {
    .section--inspire .section__container {
        margin-top: 40px;
        margin-bottom: 40px
    }
}

.section--inspire .section__heading {
    max-width: 530px;
    margin-left: auto;
    margin-right: auto
}

@media screen and (max-width:767px) {
    .section--inspire .section__heading {
        max-width: 260px
    }
}

.section--light {
    background-color: #fafafa
}

.section--no-space-bottom .section__container {
    margin-bottom: 0
}

@media screen and (max-width:767px) {
    .section--no-space-bottom .section__container {
        margin-bottom: 0
    }
}

.section--no-space-top .section__container {
    margin-top: 0
}

@media screen and (max-width:767px) {
    .section--no-space-top .section__container {
        margin-top: 0
    }
}

.section--space-bottom-sm .section__container {
    margin-bottom: 35px
}

@media screen and (max-width:767px) {
    .section--space-bottom-sm .section__container {
        margin-bottom: 20px
    }
}

.section--space-bottom-smd .section__container {
    margin-bottom: 75px
}

@media screen and (max-width:767px) {
    .section--space-bottom-smd .section__container {
        margin-bottom: 32px
    }
}

.section--cover-photo {
    padding-bottom: 46%
}

.section--cover-photo .section__container {
    display: none
}

.hero-screen {
    width: 834px;
    max-width: 100%;
    position: relative;
    margin: 52px auto
}

@media screen and (max-width:767px) {
    .hero-screen {
        margin: 21px auto
    }
}

.hero-screen:before {
    content: "";
    width: 100%;
    height: 40%;
    position: absolute;
    left: 0;
    top: 10%;
    right: 0;
    -webkit-box-shadow: 0 0 70px rgba(0, 0, 0, .1);
    box-shadow: 0 0 70px rgba(0, 0, 0, .1)
}

.hero-screen__img {
    position: relative;
    max-width: 100%;
    height: auto;
    vertical-align: top
}

.analyze-tags-image {
    position: relative;
    width: 702px;
    margin: 0 auto
}

@media screen and (max-width:767px) {
    .analyze-tags-image {
        width: 380px;
        max-width: 100%;
        margin-bottom: 13px
    }
}

.analyze-tags-image:before {
    content: "";
    padding-bottom: 86.111%;
    display: block
}

.analyze-tags-image__errors {
    position: absolute;
    width: 66.09%;
    height: auto;
    left: 0;
    top: 0
}

.analyze-tags-image__list {
    width: 84.12%;
    height: auto;
    position: absolute;
    left: 26.41%;
    top: 14%
}

.customize-design-image {
    width: 653px;
    background: #fafafa;
    position: relative;
    margin: 0 auto
}

@media screen and (max-width:767px) {
    .customize-design-image {
        width: 380px;
        max-width: 100%;
        margin-bottom: 13px
    }
}

.customize-design-image:before {
    content: "";
    display: block;
    padding-bottom: 70.903%
}

.customize-design-image__methods {
    width: 52.22%;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.customize-design-image__method {
    width: 100%;
    display: block;
    position: relative;
    margin-bottom: -2%
}

.customize-design-image__method>img {
    width: 100%;
    height: auto
}

.customize-design-image__method-empty {
    width: 100%;
    margin-left: 2.4%;
    margin-top: 3%;
    margin-bottom: 2%
}

.customize-design-image__method-empty>img {
    width: 95.307%;
    height: auto
}

.customize-design-image__method-icon {
    width: 9.384%;
    left: 5.865%;
    top: 25.714%;
    position: absolute
}

.customize-design-image__hand {
    width: 224.655%;
    height: auto;
    position: absolute;
    top: 5.972%;
    left: 61.562%
}

.testimonial {
    text-align: center;
    max-width: 630px;
    margin: 15px auto
}

.testimonial__body {
    font-family: "IBM Plex Serif", serif;
    font-size: 35px;
    color: #212528;
    margin: 0
}

@media screen and (max-width:767px) {
    .testimonial__body {
        font-size: 20px
    }
}

.testimonial__footer {
    margin-top: 22px
}

.testimonial__footer cite {
    color: #212528;
    font-style: normal
}

.testimonial__author {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.testimonial--small {
    text-align: left;
    padding-left: 63px;
    position: relative;
    max-width: none
}

.testimonial--small .testimonial__body {
    font-size: 18px
}

.testimonial--small .testimonial__avatar {
    position: absolute;
    left: 0;
    top: 0
}

.testimonial--small .testimonial__footer {
    margin-top: 10px
}

.author {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.author__avatar {
    margin-right: 25px
}

.heading {
    font-family: "IBM Plex Serif", serif;
    color: #212528;
    font-weight: 400
}

.heading--section {
    font-size: 32px;
    margin: 15px auto;
    line-height: 1.44
}

@media screen and (max-width:767px) {
    .heading--section {
        line-height: 1.6;
        font-size: 20px;
        max-width: 260px;
        margin-bottom: 22px;
        margin-top: 12px;
        margin-left: auto;
        margin-right: auto;
        text-align: center
    }
}

.heading--section:first-child {
    margin-top: 0
}

.heading--hero {
    font-size: 52px;
    margin: .269em auto;
    text-align: center;
    max-width: 800px
}

@media screen and (max-width:767px) {
    .heading--hero {
        font-size: 36px;
        max-width: 260px
    }
}

.heading--hero-sm {
    font-size: 44px;
    margin: .269em auto;
    text-align: center;
    max-width: 800px
}

@media screen and (max-width:767px) {
    .heading--hero-sm {
        font-size: 32px;
        max-width: 260px
    }
}

.heading--hero-xs {
    font-size: 35px;
    margin: .269em auto;
    text-align: center;
    max-width: 800px
}

@media screen and (max-width:767px) {
    .heading--hero-xs {
        font-size: 28px;
        max-width: 260px
    }
}

.heading--learn-article {
    font-size: 52px;
    margin: .8em auto .269em;
    text-align: center;
    font-weight: 500
}

@media screen and (max-width:767px) {
    .heading--learn-article {
        font-size: 36px;
        max-width: 260px
    }
}

.heading--paragraph {
    font-size: 16px;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato, sans-serif
}

.heading--center {
    text-align: center
}

.heading--sans {
    font-family: 'Plus Jakarta Sans', 'Inter', Lato, sans-serif
}

.heading--level-3 {
    font-size: 24px;
    margin: 1.5em 0 .66em
}

.heading--level-4 {
    font-size: 20px;
    color: #252729;
    line-height: 25px
}

.heading--level-5 {
    font-size: 18px;
    color: #252729;
    line-height: 25px
}

.heading--sm {
    font-size: 20px;
    line-height: 28px;
    margin: 1.75em 0 .75em
}

.heading--no-margin-top {
    margin-top: 0
}

.heading--margin-bottom-sm {
    margin-bottom: 1em
}

.heading--margin-bottom-lg {
    margin-bottom: 4em
}

@media screen and (max-width:767px) {
    .heading--margin-bottom-lg {
        margin-bottom: 1.28em
    }
}

.heading--margin-bottom-xs {
    margin-bottom: 10px
}

@media screen and (max-width:767px) {
    .heading--align-left-mobile {
        text-align: left;
        max-width: none
    }

    .heading--full-width-mobile {
        max-width: none
    }
}

.heading[data-counter] {
    position: relative
}

@media screen and (max-width:767px) {
    .heading[data-counter] {
        padding-left: 50px
    }
}

.heading[data-counter]:after {
    content: attr(data-counter);
    position: absolute;
    left: -65px;
    top: 50%;
    margin-top: -20px;
    width: 40px;
    height: 40px;
    background: #9ea7b0;
    border-radius: 50%;
    font-size: 16px;
    font-weight: 900;
    text-align: center;
    line-height: 40px;
    color: #fff
}

@media screen and (max-width:767px) {
    .heading[data-counter]:after {
        left: 0;
        width: 32px;
        height: 32px;
        margin-top: -16px;
        font-size: 14px;
        line-height: 32px
    }
}

.p {
    line-height: 1.56;
    margin-left: auto;
    margin-right: auto
}

.p--center {
    text-align: center
}

.p--nl {
    font-size: 16px
}

.p--md {
    font-size: 20px;
    line-height: 34px;
    font-weight: 300;
    color: #333;
    margin-top: 0
}

.p--lg {
    font-size: 26px;
    line-height: 36px
}

@media screen and (max-width:767px) {
    .p--lg {
        font-size: 20px;
        line-height: 31px
    }
}

.p--light {
    font-weight: 300
}

.p--narrow {
    max-width: 560px
}

.p--narrow-sm {
    max-width: 490px
}

.p--narrow-md {
    max-width: 670px
}

.p--narrow-lg {
    max-width: 740px
}

.p--margin-top-smd {
    margin-top: 46px
}

.p--margin-bottom-md {
    margin-bottom: 56px
}

.p--no-margin-bottom {
    margin-bottom: 0
}

.p--no-margin-top {
    margin-top: 0
}

.p--no-margin {
    margin-top: 0;
    margin-bottom: 0
}

.highlighted {
    padding: 4px 9px;
    border-radius: 5px;
    background-color: rgba(5, 159, 163, .1);
    display: inline-block;
    margin: -4px 8px
}

.fsize-normal {
    font-size: 16px
}

.lheight-normal {
    line-height: normal
}

.t-disabled {
    opacity: .5
}

.tcolor--subtitle {
    color: #3b3b3b
}

.tcolor-primary {
    color: #007b83
}

.switch {
    position: relative;
    display: inline-block
}

.switch input {
    position: absolute;
    left: -9999px;
    top: 0;
    opacity: 0;
    visibility: hidden
}

.switch label {
    padding-left: 58px;
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    vertical-align: top;
    min-height: 26px;
    cursor: pointer
}

.switch label:before {
    left: 0;
    top: 0;
    width: 41px;
    height: 26px;
    background: #f8f9fa
}

.switch label:after,
.switch label:before {
    content: "";
    position: absolute;
    border-radius: 100px;
    -webkit-transition: all .2s;
    transition: all .2s
}

.switch label:after {
    left: 2px;
    top: 2px;
    width: 22px;
    height: 22px;
    background: #fff;
    -webkit-box-shadow: 0 3px 6px 0 rgba(0, 0, 0, .19), 0 2px 2px 0 rgba(0, 0, 0, .02), 0 2px 1px 0 rgba(0, 0, 0, .05);
    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, .19), 0 2px 2px 0 rgba(0, 0, 0, .02), 0 2px 1px 0 rgba(0, 0, 0, .05);
    border: .5px solid rgba(0, 0, 0, .1)
}

.switch input:checked+label:before {
    background-color: #059fa3
}

.switch input:checked+label:hover:before {
    background-color: #004157
}

.switch input:checked+label:after {
    -webkit-transform: translateX(15px);
    transform: translateX(15px)
}

.switch--right label {
    padding-left: 0;
    padding-right: 58px
}

.switch--right label:before {
    right: 0;
    left: auto
}

.switch--right label:after {
    right: 17px;
    left: auto
}

.price-period-switch {
    margin: 47px auto;
    text-align: center;
    font-size: 18px;
    color: #41484f;
    line-height: 1.3
}

@media screen and (max-width:767px) {
    .price-period-switch {
        font-size: 16px;
        margin: 32px auto
    }
}

.base-search {
    position: relative
}

.base-search__input {
    background-color: transparent;/*e6edf0*/
    -webkit-box-shadow: 0;
    box-shadow: 0;
    border-radius:7px;
    width: 100%;
    font-size: 13px;
    color: #4c4c4c;
    padding: 7px 22px;
    padding-left: 5px;
    border: 1px solid transparent
}

.base-search__input:focus {
    border: 1px solid #d6dde1;
    outline: none
}

.base-search__ico {
    position: absolute;
    left: 9px;
    top: 50%;
    font-size: 14px;
    line-height: 1;
    margin-top: -10px;
    opacity: 0.66;
}

.enter-input {
    position: relative
}

.enter-input-icon {
    width: 26px;
    height: 26px;
    top: 50%;
    margin-top: -13px;
    right: 0;
    position: absolute;
    background-color: #f3f6f8;
    border-radius: 2px;
    background-image: url(/img/enter-alt.f23fa680.svg)
}

@-webkit-keyframes wysiwyg-tag-pop {
    0% {
        background-color: #f8f9fa
    }

    20% {
        background-color: #dfe2e8
    }

    to {
        background-color: #f8f9fa
    }
}

@keyframes wysiwyg-tag-pop {
    0% {
        background-color: #f8f9fa
    }

    20% {
        background-color: #dfe2e8
    }

    to {
        background-color: #f8f9fa
    }
}

.ql-clipboard {
    display: none
}

.wysiwyg {
    position: relative;
    padding: 5px 0;
    cursor: text
}

.wysiwyg:focus {
    outline: none
}

.w-space-write {
    padding-top: 7px;
    padding-bottom: 7px;
}

.wysiwyg__editor {
    position: relative
}

.wysiwyg__editor .ql-editor:focus {
    outline: none
}

.wysiwyg__editor .ql-editor p {
    margin: 0
}

.wysiwyg__editor .ql-editor a {
    cursor: pointer
}

.wysiwyg--empty .wysiwyg__editor:before,
.wysiwyg__editor:empty:before {
    content: attr(placeholder);
    color: rgba(85, 85, 85, .5);
    cursor: text;
    opacity: 1;
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none
}

.wysiwyg__editable {
    padding: 3px 0;
    cursor: text
}

.wysiwyg__editable:focus {
    outline: none
}

.wysiwyg__editable:empty:before {
    content: attr(placeholder);
    color: rgba(85, 85, 85, .5);
    cursor: text;
    opacity: 1
}

.wysiwyg__editable>:first-child {
    margin-top: 0
}

.wysiwyg__editable>:last-child {
    margin-bottom: 0
}

.wysiwyg__content {
    padding: 10px 0;
    min-height: 0 !important
}

.wysiwyg__content>:first-child {
    margin-top: 0
}

.wysiwyg__content>:last-child {
    margin-bottom: 0
}

.wysiwyg .ql-editor.ql-blank:before {
    color: rgba(85, 85, 85, .5);
    cursor: text;
    opacity: 1;
    font-style: normal
}

.wysiwyg .ql-tooltip-tags {
    z-index: 15
}

.wysiwyg__tag-popup {
    color: #fff;
    background-color: #65c061;
    border-radius: 3px;
    padding: 4px 8px;
    font-size: 14px
}

.wysiwyg__tag-popup-arrow {
    position: absolute;
    border: 4px solid transparent;
    left: 50%;
    top: 100%;
    margin-left: -4px
}

.wysiwyg .editor-content,
.wysiwyg .ql-editor {
    line-height: 1.625;
    font-size: 1.2rem;
    max-width: 100%
}

.wysiwyg .editor-content h1,
.wysiwyg .ql-editor h1 {
    font-size: 24px;
    font-weight: 600
}

.wysiwyg .editor-content h2,
.wysiwyg .ql-editor h2 {
    font-size: 20px;
    font-weight: 600
}

.wysiwyg .editor-content p,
.wysiwyg .ql-editor p {
    -webkit-transition: all .24s;
    transition: all .24s
}

.wysiwyg .editor-content ol,
.wysiwyg .editor-content ul,
.wysiwyg .ql-editor ol,
.wysiwyg .ql-editor ul {
    margin: 1em 0;
    padding-left: 0
}

.wysiwyg .editor-content ol>li,
.wysiwyg .editor-content ul>li,
.wysiwyg .ql-editor ol>li,
.wysiwyg .ql-editor ul>li {
    margin: .5em 0
}

.wysiwyg .editor-content ul,
.wysiwyg .ql-editor ul {
    padding-left: 25px
}

.wysiwyg__tags {
    line-height: 26px;
    white-space: nowrap;
    position: absolute;
    top: 3px;
    left: 100%;
    margin-left: 30px
}

.wysiwyg__tags-item {
    left: 0;
    white-space: nowrap;
    font-size: 14px;
    color: #292929;
    font-weight: 400;
    line-height: 25px;
    padding: 0 12px;
    border-radius: 4px;
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    margin-right: 2px;
    padding-left: 34px;
    position: relative;
    background: #f8f9fa;
    margin-bottom: 1px;
    position: absolute;
    left: 100%;
    top: 0;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
    opacity: 0
}

.wysiwyg__tags-item--mounted {
    -webkit-transition: left .2s, top .2s, background .2s, opacity .2s, -webkit-transform .2s;
    transition: left .2s, top .2s, background .2s, opacity .2s, -webkit-transform .2s;
    transition: left .2s, top .2s, background .2s, opacity .2s, transform .2s;
    transition: left .2s, top .2s, background .2s, opacity .2s, transform .2s, -webkit-transform .2s;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1
}

.wysiwyg__tags-item--pop {
    -webkit-animation: wysiwyg-tag-pop .6s 1;
    animation: wysiwyg-tag-pop .6s 1
}

.wysiwyg__tags-item:focus,
.wysiwyg__tags-item:hover {
    text-decoration: none;
    color: #292929;
    background: #f0f2f5
}

.wysiwyg__tags-item:active {
    background: #dfe2e8;
    text-decoration: none
}

.wysiwyg__tags-item-ico {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    margin-top: -6px;
    left: 11px
}

.wysiwyg__tags-group {
    top: 0;
    left: 0;
    position: absolute;
    width: 100%
}

.wysiwyg__tags-group .tags-avatars__list {
    height: 24px;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding: 0
}

.wysiwyg__tags-group .tags-avatars__list:active,
.wysiwyg__tags-group .tags-avatars__list:hover {
    background-color: transparent
}

tag {
    padding: 2px 0;
    -webkit-transition: background .2s, background-color .2s;
    transition: background .2s, background-color .2s;
    border-bottom: 1px solid transparent;
    cursor: pointer
}

.wysiwyg-tooltip {
    position: absolute;
    left: 0;
    top: 0
}

.wysiwyg-tooltip__menu {
    height: 100%;
    background-color: #fff;
    -webkit-box-shadow: 0 3px 20px rgba(0, 0, 0, .1);
    box-shadow: 0 3px 20px rgba(0, 0, 0, .1);
    border-radius: 100px;
    height: 40px;
    position: absolute;
    bottom: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.wysiwyg-tooltip__menu:before {
    content: "";
    position: absolute;
    left: 50%;
    top: 100%;
    border: 5px solid transparent;
    border-top-color: #fff;
    margin-left: -5px
}

.wysiwyg-tooltip__item {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 12px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 40px;
    cursor: pointer;
    -webkit-transition: all .2s;
    transition: all .2s
}

.wysiwyg-tooltip__item:hover {
    opacity: .6
}

.ql-bubble .ql-tooltip.ql-editing .ql-tooltip-editor {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor {
    position: absolute;
    right: 0;
    top: 0;
    left: 0;
    bottom: 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-left: 15px;
    padding-right: 8px;
    font-size: 14px
}

.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor a:after,
.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor a:before {
    display: none
}

.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__clear,
.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__edit,
.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__save {
    margin-left: 2px;
    color: #fff;
    padding: 5px 8px;
    border-radius: 4px;
    -webkit-transition: all .2s;
    transition: all .2s
}

.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__clear:hover,
.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__edit:hover,
.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__save:hover {
    background-color: #11141c
}

.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__clear:active,
.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__edit:active,
.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__save:active {
    background-color: #363b4b
}

.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__clear,
.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__edit,
.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__save,
.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__text {
    position: static;
    display: block;
    font-size: 14px
}

.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__clear:before,
.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__edit:before,
.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__save:before,
.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__text:before {
    position: static;
    visibility: visible;
    white-space: nowrap;
    padding: 0;
    margin: 0;
    background-color: transparent;
    display: inline !important;
    color: inherit;
    font-size: 14px
}

.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor input[type=text] {
    position: relative;
    padding: 10px;
    font-size: 14px
}

.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__text:before {
    content: "Enter link:"
}

.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__edit:before {
    content: "";
    display: block !important;
    width: 20px;
    height: 20px;
    background-image: url(/img/outline-edit.83002fdc.svg);
    -webkit-transform: none;
    transform: none;
    border-radius: 0
}

.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__clear:before {
    content: "";
    display: block !important;
    width: 20px;
    height: 20px;
    background-image: url(/img/outline-trash.474beb2d.svg);
    -webkit-transform: none;
    transform: none;
    border-radius: 0
}

.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__save:before {
    content: ""
}

.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__sample {
    width: 100%;
    display: block;
    position: static;
    padding-left: 10px;
    color: #fff;
    cursor: pointer;
    white-space: nowrap !important;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 5px 7px;
    border-radius: 4px;
    margin-left: -7px;
    font-weight: 700;
    -webkit-transition: all .2s;
    transition: all .2s
}

.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__sample:before {
    display: inline !important;
    position: static;
    border-radius: 0;
    visibility: visible;
    background: transparent;
    font-size: inherit;
    padding: 0;
    margin: 0;
    font-weight: 400;
    color: #d6d6d6;
    content: "Visit URL: "
}

.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__sample:hover {
    background-color: #11141c
}

.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__sample:active {
    background-color: #363b4b
}

.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor--preview .ql-tooltip-editor__text,
.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__clear,
.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__edit,
.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor__sample {
    display: none
}

.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor--preview .ql-tooltip-editor__clear,
.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor--preview .ql-tooltip-editor__edit,
.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor--preview .ql-tooltip-editor__sample {
    display: inline-block
}

.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor--preview .ql-tooltip-editor__input,
.wysiwyg .ql-bubble .ql-tooltip .ql-tooltip-editor--preview .ql-tooltip-editor__save {
    display: none
}

.ql-bubble .ql-tooltip {
    background-color: #282b35;
    border-radius: 4px
}

.ql-bubble .ql-tooltip:not(.ql-flip) .ql-tooltip-arrow {
    border-bottom-color: #282b35
}

.ql-container.ql-bubble:not(.ql-disabled) a:before {
    background-color: #282b35
}

.ql-container.ql-bubble:not(.ql-disabled) a:after {
    border-top-color: #282b35
}

.ql-tooltip-tags {
    background-color: #fff;
    pointer-events: none;
    color: #252729;
    opacity: 0;
    -webkit-transition: opacity .2s, -webkit-transform .2s;
    transition: opacity .2s, -webkit-transform .2s;
    transition: opacity .2s, transform .2s;
    transition: opacity .2s, transform .2s, -webkit-transform .2s;
    -webkit-transition-delay: 0ms, 0ms;
    transition-delay: 0ms, 0ms;
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
    -webkit-box-shadow: 0 0 40px rgba(0, 0, 0, .1);
    box-shadow: 0 0 40px rgba(0, 0, 0, .1);
    border-radius: 3px;
    position: absolute;
    left: 84px;
    top: 0
}

.ql-tooltip-tags .tags-selector__input-container {
    margin-top: 0
}

.ql-transition-disabled .ql-tooltip-tags {
    -webkit-transition: 0ms;
    transition: 0ms
}

.ql-bubble .ql-tooltip.ql-tags-open:not(.ql-flip) .ql-tooltip-arrow {
    border-bottom-color: #fff
}

.ql-tags-open .ql-tooltip-tags {
    pointer-events: auto;
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.ql-hidden .ql-tooltip-tags {
    pointer-events: none
}

.quill-editor {
    position: relative
}

.quill-editor__clone {
    position: absolute;
    left: 0;
    top: 0;
    color: transparent;
    width: 100%;
    white-space: pre-wrap;
    word-wrap: break-word
}

.quill-editor__clone * {
    color: transparent !important
}

.quill-editor__clone :first-child {
    margin-top: 0
}

.ql-image-overlay:hover .ql-image-remove-btn {
    opacity: 1
}

.ql-image-remove-btn {
    -webkit-transition: all .2s;
    transition: all .2s;
    opacity: 0;
    position: absolute;
    right: 10px;
    top: 10px;
    cursor: pointer
}

.ql-tags-btn {
    position: absolute;
    right: 100%;
    margin-right: 5px;
    width: 99px;
    background-color: #282b35;
    top: 0;
    height: 100%;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    line-height: 40px;
    color: #dbdbdb;
    background-image: url(/img/search-white.c5fd6bd3.svg);
    background-repeat: no-repeat;
    background-position: 10px 13px;
    padding-left: 33px
}

.ql-editing .ql-tags-btn {
    display: none
}

.ql-bubble .ql-tooltip {
    background-color: transparent;
    pointer-events: none
}

.ql-toolbar {
    margin-left: 104px;
    background-color: #282b35;
    border-radius: 4px;
    position: absolute;
    left: 0;
    top: 0;
    height: 40px;
    -webkit-transition: opacity .2s, -webkit-transform .2s;
    transition: opacity .2s, -webkit-transform .2s;
    transition: opacity .2s, transform .2s;
    transition: opacity .2s, transform .2s, -webkit-transform .2s;
    pointer-events: auto
}

.ql-transition-disabled .ql-toolbar {
    -webkit-transition: 0ms;
    transition: 0ms
}

.ql-tags-open .ql-toolbar {
    opacity: 0;
    pointer-events: none;
    -webkit-transform: translateY(10px);
    transform: translateY(10px)
}

.ql-editing .ql-toolbar {
    display: none
}

.ql-tooltip-editor {
    background-color: #282b35;
    border-radius: 4px;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 40px;
    pointer-events: auto
}

.ql-bubble .ql-tooltip {
    -webkit-transition: opacity .2s, -webkit-transform .2s;
    transition: opacity .2s, -webkit-transform .2s;
    transition: transform .2s, opacity .2s;
    transition: transform .2s, opacity .2s, -webkit-transform .2s
}

.ql-bubble .ql-tooltip.ql-hidden {
    display: block;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
    opacity: 0
}

.ql-bubble .ql-tooltip.ql-hidden .ql-toolbar {
    pointer-events: none
}

.ql-tooltip {
    width: 428px;
    height: 40px
}

.ql-tooltip.ql-tags-open {
    width: 428px;
    height: 169px
}

.ql-tooltip-arrow {
    z-index: 10
}

.ql-selection-preview {
    position: relative
}

.ql-selection-preview>div {
    background-color: #b6d8fc;
    position: absolute;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    padding-bottom: 7px;
    margin-top: -3px
}

body .editor-content ul>li[data-checked],
body .quillWrapper .ql-editor ul>li[data-checked] {
    pointer-events: none
}

body .editor-content ul>li[data-checked]:before,
body .quillWrapper .ql-editor ul>li[data-checked]:before {
    width: 20px;
    height: 20px;
    border: 1px solid #86909a;
    display: inline-block;
    border-radius: 3px;
    padding: 0;
    content: "";
    margin-right: .3em;
    vertical-align: top;
    margin-top: .2em;
    cursor: pointer;
    pointer-events: all;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

body .editor-content ul>li[data-checked=true]:before,
body .quillWrapper .ql-editor ul>li[data-checked=true]:before {
    content: "";
    background-color: #0a9fa3;
    border-color: #0a9fa3;
    background-image: url(/img/check-light.39f7e6e9.svg);
    background-position: 50%;
    background-repeat: no-repeat
}

.editor-content li.ql-indent-1:not(.ql-direction-rtl),
.ql-container .ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
    padding-left: 2.5em
}

.editor-content li.ql-indent-2:not(.ql-direction-rtl),
.ql-container .ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
    padding-left: 3.5em
}

.editor-content li.ql-indent-3:not(.ql-direction-rtl),
.ql-container .ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
    padding-left: 4.5em
}

.editor-content li.ql-indent-4:not(.ql-direction-rtl),
.ql-container .ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
    padding-left: 5.5em
}

.editor-content li.ql-indent-5:not(.ql-direction-rtl),
.ql-container .ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
    padding-left: 6.5em
}

.editor-content li.ql-indent-6:not(.ql-direction-rtl),
.ql-container .ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
    padding-left: 7.5em
}

.editor-content li.ql-indent-7:not(.ql-direction-rtl),
.ql-container .ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
    padding-left: 8.5em
}

.editor-content li.ql-indent-8:not(.ql-direction-rtl),
.ql-container .ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
    padding-left: 9.5em
}

.ql-container.ql-bubble:not(.ql-disabled) a:before {
    z-index: 180
}

.ql-container {
    font-family: inherit !important
}

.micro-project {
    padding: 25px;
    font-size: 12px;
    color: #646464;
    width: 220px
}

.micro-project__name {
    font-size: 18px;
    font-weight: 600;
    color: #252729;
    display: block;
    margin-bottom: 14px;
    margin-top: 8px
}

.micro-project__phases {
    list-style: none;
    padding: 0
}

.micro-project__phase {
    margin-top: 15px
}

.micro-project__phase-name {
    font-size: 9px;
    color: #aaaab5;
    text-transform: uppercase;
    letter-spacing: .88px
}

.micro-project__methods {
    list-style: none;
    padding: 0
}

.micro-project__method {
    position: relative;
    padding-left: 28px;
    min-height: 18px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 8px 0
}

.micro-project__method .method-icon {
    position: absolute;
    left: 0;
    top: 0;
    font-size: 18px
}

.stacked-avatars {
    line-height: 1;
    padding-left: 1em;
    position: relative
}

.stacked-avatars .avatar {
    margin-left: calc(-1em + 2px)
}

.counted-icon {
    font-size: 36px;
    width: 1em;
    height: 1em;
    border-radius: 3px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition: all .2s;
    transition: all .2s
}

.counted-icon:hover,
.counted-icon:hover .counted-icon__count {
    background-color: #f8f9fa
}

.counted-icon:active,
.counted-icon:active .counted-icon__count {
    background-color: #f0f2f5
}

.counted-icon__ico {
    font-size: .6666em
}

.counted-icon__ico--plus {
    font-size: .61111111111em
}

.counted-icon__count {
    border-radius: 4px;
    background-color: #fff;
    width: 16px;
    height: 16px;
    position: absolute;
    line-height: 15px;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    color: #3b3b3b;
    right: 0;
    bottom: 5%
}

.card-button,
.counted-icon__count {
    -webkit-transition: all .2s;
    transition: all .2s
}

.card-button {
    padding: 25px;
    border-radius: 12px;
    -webkit-box-shadow: 0 12px 23px rgba(0, 0, 0, .08);
    box-shadow: 0 12px 23px rgba(0, 0, 0, .08);
    border: 1px solid #fff;
    cursor: pointer
}

.card-button:active {
    background-color: #f0f2f5;
    border: 1px solid #f0f2f5
}

.card-button:hover {
    -webkit-box-shadow: 0 12px 23px rgba(0, 0, 0, .13);
    box-shadow: 0 12px 23px rgba(0, 0, 0, .13)
}

.card-button--checked {
    border: 1px solid #7497a3
}

.card-button--checked:active {
    background-color: #f0f2f5;
    border: 1px solid #7497a3
}

.card-button__ico {
    font-size: 30px;
    line-height: .5;
    margin-bottom: 43px
}

.card-button__title {
    color: #3b3b3b;
    font-size: 2rem;
    font-weight: 600
}

.card-button__desc {
    color: rgba(59, 59, 59, .5);
    font-size: 1.4rem
}

.headline {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 32px 0 18px
}

.headline__title {
    font-size: 2rem;
    font-weight: 600;
    margin: 0
}

.builder-page,
.builder-page-link:hover {
    text-decoration: none
}

.builder-page {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 14px 8px;
    -webkit-transition: all .2s;
    transition: all .2s;
    cursor: pointer;
    position: relative
}

.builder-page .enter-input-icon {
    right: 8px
}

.builder-page:hover {
    background-color: #f8f9fa;
    text-decoration: none
}

.builder-page:active {
    background-color: #f0f2f5
}

.builder-page__body {
    margin-left: 24px
}

.builder-page__avatar {
    font-size: 44px
}

.builder-page__input {
    border: 0;
    background: transparent;
    text-align: left;
    color: #3b3b3b;
    width: 100%;
    outline: 0;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.39
}

.builder-page__input::-webkit-input-placeholder {
    color: #d0d0d0
}

.builder-page__input::-moz-placeholder {
    color: #d0d0d0
}

.builder-page__input:-ms-input-placeholder {
    color: #d0d0d0
}

.builder-page__input::-ms-input-placeholder {
    color: #d0d0d0
}

.builder-page__input::placeholder {
    color: #d0d0d0
}

.builder-page__name {
    font-size: 18px;
    display: block;
    font-weight: 600;
    color: #212528
}

.builder-page__desc {
    font-size: 1.4rem;
    color: #747474
}

.page-avatar {
    width: 1em;
    height: 1em;
    line-height: .5;
    position: relative
}

.page-avatar:after {
    height: 100%;
    width: 100%;
    border-radius: .18em;
    position: absolute;
    left: 0;
    top: 0;
    border: 1px solid rgba(0, 0, 0, .1);
    content: ""
}

.page-avatar__icon {
    width: 100%;
    height: 100%;
    border-radius: .18em;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: #f8f9fa;
    color: #fff
}

.page-avatar__empty-icon {
    width: 60%;
    height: 60%;
    border-radius: 50%;
    background-color: #f0f2f5
}

.page-avatar__img {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.page-avatar img {
    vertical-align: top;
    height: 100%;
    width: 100%;
    border-radius: .18em;
    -o-object-fit: contain;
    object-fit: contain
}

.avatars-chart {
    position: relative
}

.sortable-drag .avatars-chart__x-label,
.sortable-drag .avatars-chart__y-label {
    opacity: 0
}

.avatars-chart__x-label {
    padding: 10px 0
}

.avatars-chart__x-label,
.avatars-chart__y-label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.avatars-chart__y-label {
    position: absolute;
    left: 100%;
    top: 0;
    height: 100%;
    margin-left: 14px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.avatars-chart__y-label .avatars-chart__label-input {
    text-align: center
}

.avatars-chart__y-label .avatars-chart__label-input--main {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    margin-left: -100px
}

.avatars-chart__y-label .avatars-chart__label-input--edge:first-child,
.avatars-chart__y-label .avatars-chart__label-input--edge:last-child {
    text-align: left
}

.avatars-chart__label-input {
    border: 0;
    padding: 0;
    margin: 0;
    font-size: 14px;
    text-align: center;
    background: transparent;
    border-bottom: 1px dashed transparent;
    -webkit-transition: all .2s;
    transition: all .2s
}

.avatars-chart__label-input:focus,
.avatars-chart__label-input:hover {
    outline: none;
    border-bottom: 1px dashed hsla(0, 0%, 59%, .5)
}

.avatars-chart__label-input--main {
    width: 200px
}

.avatars-chart__label-input--edge {
    font-size: 10px;
    opacity: .6;
    width: 80px
}

.avatars-chart__label-input--edge:first-child {
    text-align: left
}

.avatars-chart__label-input--edge:last-child {
    text-align: right
}

.avatars-chart__body {
    position: relative
}

.avatars-chart__canvas {
    width: 100%;
    padding-bottom: 50%;
    position: relative;
    background-color: #f8f9fa
}

.avatars-chart__plane {
    position: absolute;
    left: 25px;
    right: 25px;
    top: 25px;
    bottom: 25px
}

.avatars-chart__axis {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0
}

.avatars-chart__axis:after,
.avatars-chart__axis:before {
    content: "";
    background-color: #e9e9e9;
    position: absolute
}

.avatars-chart__axis:before {
    left: 50%;
    top: 0;
    height: 100%;
    width: 1px
}

.avatars-chart__axis:after {
    left: 0;
    top: 50%;
    width: 100%;
    height: 1px
}

.avatars-chart__avatar {
    position: absolute;
    left: 50%;
    top: 50%;
    font-size: 42px;
    margin: -25px 0 0 -25px;
    border: 4px solid #fff;
    border-radius: .23em;
    display: inline-block;
    -webkit-box-shadow: 0 11px 35px 0 rgba(19, 38, 69, .12), 0 0 4px 0 rgba(0, 0, 0, .03);
    box-shadow: 0 11px 35px 0 rgba(19, 38, 69, .12), 0 0 4px 0 rgba(0, 0, 0, .03);
    background-color: #fff;
    cursor: -webkit-grab;
    cursor: grab
}

.avatars-chart__avatar:hover {
    z-index: 10000 !important
}

.avatars-chart .avatars-chart__info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 1.6rem;
    text-align: center
}

.avatars-chart-plane-enter-active,
.avatars-chart-plane-leave-active {
    -webkit-transition: all .3s;
    transition: all .3s
}

.avatars-chart-plane-enter,
.avatars-chart-plane-leave-to {
    left: 50%;
    top: 50%;
    right: 50%;
    bottom: 50%;
    opacity: 0
}

.avatars-chart-plane-enter-to,
.avatars-chart-plane-leave {
    left: 25px;
    right: 25px;
    top: 25px;
    bottom: 25px;
    opacity: 1
}

.page-avatar-picker__section {
    width: 251px;
    padding: 14px;
    font-size: 1.6rem;
    border-bottom: 1px solid #f2f2f2
}

.page-avatar-picker__section:last-child {
    border-bottom: 0
}

.page-avatar-picker__uploader {
    height: 188px
}

.avatar-dropdown {
    position: relative
}

.avatar-dropdown__icon {
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .7);
    top: 0;
    left: 0;
    border-radius: .18em;
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s;
    position: absolute;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.avatar-dropdown__icon svg {
    width: 14px;
    height: 14px
}

.avatar-dropdown:hover .avatar-dropdown__icon {
    opacity: 1
}

.avatar-dropdown--open .avatar-dropdown__icon svg {
    -webkit-transform: scaleY(-1);
    transform: scaleY(-1)
}

.icons-picker {
    font-size: 1.6rem
}

.icons-picker__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    list-style: none;
    padding: 0;
    margin: -12px 0 0 -12px
}

.icons-picker__item {
    padding: 12px 0 0 12px !important;
    list-style-type: none !important
}

.icons-picker__icon {
    width: 46px;
    height: 46px;
    font-size: 46px;
    border-radius: 3px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 0;
    display: inline-block;
    vertical-align: top;
    overflow: hidden;
    position: relative;
    -webkit-transition: all .15s;
    transition: all .15s;
    -webkit-transform: scale(1);
    transform: scale(1);
    padding: 0;
    color: #fff
}

.icons-picker__icon .icon {
    vertical-align: top
}

.icons-picker__icon:active {
    -webkit-transform: scale(.9);
    transform: scale(.9)
}

.icons-picker__icon:focus {
    outline: none
}

.method-item-icon {
    width: 1em;
    height: 1em;
    border-radius: .12em;
    line-height: 1;
    display: inline-block;
    background-color: #f8f9fa
}

.method-item-icon .icon {
    vertical-align: top;
    width: 100%;
    height: 100%
}

.color-input {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.color-input__color {
    width: 25px;
    height: 25px;
    border-radius: 3px;
    margin-right: 8px;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.color-input__wrap {
    position: relative;
    width: 100%
}

.color-input__wrap:before {
    position: absolute;
    left: 10px;
    content: "#";
    color: #646464;
    font-size: 1.4rem;
    line-height: 1.4rem;
    margin-top: -.7rem;
    top: 50%
}

.color-input__input {
    width: 100%;
    color: #646464;
    font-size: 1.4rem;
    border: 0;
    padding: 0;
    padding-left: 24px;
    background-color: #f8f9fa;
    border-radius: 3px;
    height: 32px
}

.color-input__input:focus {
    outline: none
}

.table {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 1.6rem
}

.table--expand {
    margin: 0 -8px
}

.table-item {
    margin: 0;
    list-style: none;
    border-bottom: 1px solid #f0f2f5;
    padding: 0
}

.table-item:last-child {
    border-bottom: 0
}

.table-icon-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-height: 58px;
    padding: 8px 0
}

.table-icon-item__icon {
    font-size: 32px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-right: 18px;
    line-height: .5
}

.table-icon-item__body {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.table-icon-item__desc {
    color: rgba(59, 59, 59, .5);
    width: 50%
}

.table-icon-item__desc--right {
    text-align: right
}

.table-icon-item__title {
    width: 50%
}

.table-icon-item__options {
    margin-left: 18px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 14px;
    width: 20%;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.table-icon-item__options>.btn,
.table-icon-item__options>.method-section-add {
    min-width: 140px
}

.table-icon-item__options>.base-checkbox {
    margin-left: 15px
}

.table-icon-item__btn {
    min-width: 140px
}

.table-icon-item__dropdown-text {
    font-size: 1.4rem;
    font-weight: 700;
    padding: 4px 8px;
    display: block;
    padding-right: 22px
}

.table-icon-item-error {
    font-size: 12px;
    color: #e5411d;
    margin-left: 50px;
    margin-top: 5px
}

.insights-container {
    max-width: 655px;
    margin: 0 auto
}

.insight-items-list {
    margin: 0 -8px
}

.insight-items-list .insight-item {
    margin-bottom: 16px
}

.insight-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding: 8px;
    cursor: pointer;
    border-radius: 4px;
    -webkit-transition: all .2s;
    transition: all .2s
}

.insight-item:hover {
    -webkit-box-shadow: 0 7px 27px rgba(0, 0, 0, .08);
    box-shadow: 0 7px 27px rgba(0, 0, 0, .08)
}

.insight-item__image {
    width: 211px;
    height: 135px;
    border-radius: 6px;
    -o-object-fit: cover;
    object-fit: cover;
    background-color: #dfe2e8;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    overflow: hidden
}

.insight-item__body {
    margin-left: 32px;
    width: 100%
}

.insight-item__title {
    margin: 9px 0;
    font-size: 16px;
    font-weight: 400
}

.insight-item__foot,
.insight-item__tags {
    font-size: 14px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.insight-item__tags {
    color: #646464;
    margin-left: -12px
}

.insight-item__date {
    color: #aaaab5;
    margin-bottom: 8px;
    font-size: 14px;
    display: block
}

.insight-item__date span:before {
    content: "•";
    margin: 0 10px
}

.insight-item__more-tags {
    margin-left: 8px
}

.insight-type-badge {
    font-weight: 700;
    font-size: 12px;
    line-height: 20px;
    letter-spacing: 167%;
    text-transform: uppercase;
    color: #fff;
    padding: 3px 11px;
    border-radius: 200px;
    background-color: #7497a3;
    display: inline-block
}

.wide-menu {
    border-bottom: 1px solid transparent;
    margin-bottom: 0px;
    padding-bottom: 12px;
    padding-left: 233px;
    padding-right: 288px;
}

.wide-menu .tag-filters {
    margin-bottom: 17px
}

.highlights-modal-wrapper,
.method-modal-wrapper {
    padding: 0;
    max-width: 1149px;
    min-height: 670px;
    position: relative
}

.highlights-modal-wrapper>.base-spinner,
.method-modal-wrapper>.base-spinner {
    position: absolute;
    left: 50%;
    top: 50%
}

.method-modal-image-uploader {
    height: 171px;
    margin: 24px 0
}

.method-modal-description {
    margin-top: 8px
}

.method-modal-grid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    min-height: 670px
}

.method-modal-grid__main {
    width: 100%
}

.method-modal-grid__body {
    max-width: 648px;
    padding: 0 35px;
    margin: 48px auto
}

.method-modal-grid__body--wide {
    max-width: none
}

.method-modal-grid__sidebar {
    width: 320px;
    background-color: #f8f9fa;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.method-modal-breadcrumbs {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 16px;
    color: #62656a
}

.method-modal-breadcrumbs li {
    display: inline-block
}

.method-modal-breadcrumbs li:after {
    content: "/";
    margin: 0 8px;
    opacity: .2
}

.method-modal-breadcrumbs li:last-child:after {
    display: none
}

.method-modal-breadcrumbs a {
    color: inherit;
    text-decoration: none;
    display: inline-block;
    padding: 4px 8px;
    border-radius: 6px;
    -webkit-transition: all .3s;
    transition: all .3s;
    cursor: pointer
}

.method-modal-breadcrumbs a:hover {
    background-color: #f8f9fa
}

.method-modal-breadcrumbs a:active {
    background-color: #f0f2f5
}

.method-modal-sidebar-section {
    margin: 32px 32px;
    font-size: 14px
}

.method-modal-sidebar-section__title {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 12px
}

.sidebar-dl {
    font-size: 1.4rem;
    color: #646464;
    text-align: right
}

.sidebar-dl dt {
    float: left;
    clear: left;
    text-align: left
}

.sidebar-dl dd {
    margin-bottom: 10px
}

.sidebar-dl dd:last-child {
    margin-bottom: 0
}

.method-modal-section {
    margin-top: 32px
}

.method-modal-section__title {
    font-size: 18px
}

.method-modal-add {
    padding: 10px 0;
    background-color: #f8f9fa;
    text-align: center;
    border-radius: 4px;
    cursor: pointer;
    -webkit-transition: all .2s;
    transition: all .2s
}

.method-modal-add .btn,
.method-modal-add .method-section-add {
    -webkit-box-shadow: 0 2px 14px rgba(0, 0, 0, .08), 0 30px 154px rgba(0, 0, 0, .11);
    box-shadow: 0 2px 14px rgba(0, 0, 0, .08), 0 30px 154px rgba(0, 0, 0, .11)
}

.method-modal-add:hover {
    background-color: #f0f2f5
}

.method-modal-add:hover .btn,
.method-modal-add:hover .method-section-add {
    background-color: #f8f9fa;
    border-color: #f8f9fa
}

.method-modal-add:active {
    background-color: #dfe2e8
}

.method-modal-foot-btn {
    padding: 10px 0;
    background-color: #f8f9fa;
    text-align: center
}

.method-modal-foot-btn .btn,
.method-modal-foot-btn .method-section-add {
    min-width: 260px
}

.side-lay {
    width: 100%;
    position: relative;
    overflow: hidden
}

.side-lay__main {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: calc(100vh - 60px);
    -webkit-transition: all .5s cubic-bezier(.77, 0, .175, 1);
    transition: all .5s cubic-bezier(.77, 0, .175, 1)
}

.side-lay__body {
    width: 100%;
    min-height: 450px;
    -webkit-transition: min-height .2s;
    transition: min-height .2s
}

.side-lay__aside {
    position: fixed;
    right: 0;
    top: 0;
    height: 100%;
    width: 55%;
    background-color: #f5f5f5;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: all .5s cubic-bezier(.77, 0, .175, 1);
    transition: all .5s cubic-bezier(.77, 0, .175, 1);
    display: none
}

@media screen and (min-width:992px) {
    .side-lay__aside {
        display: block
    }

    .side-lay--open .side-lay__main {
        margin-right: 55%
    }

    .side-lay--open .side-lay__aside {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

.onb-container {
    width: 100%;
    max-width: 340px;
    margin: 0 auto
}

.onb-container .content-transition {
    overflow: visible;
    margin-left: -50px;
    margin-right: -50px;
    padding-left: 50px;
    padding-right: 50px
}

.onb-avatar-wrap {
    font-size: 60px;
    text-align: center;
    line-height: 1
}

.onb-step {
    font-size: 1.4rem;
    color: #646464
}

.onb-step:after,
.onb-step:before {
    content: "";
    display: table;
    width: 100%
}

.onb-form {
    margin: 20px 0 8px
}

.onb-email,
.onb-heading {
    text-align: center
}

.onb-heading {
    font-size: 2rem;
    font-weight: 500;
    margin: 20px auto 4px;
    color: #000
}

.onb-subtitle {
    text-align: center;
    margin: 4px 0
}

.onb-login-header {
    margin-bottom: 40px
}

.onb-google-btn {
    padding-bottom: 12px
}

.onb-magic-link-btn {
    padding-top: 12px
}

.onb-methods-selector {
    margin: 30px 0 35px
}

.onb-button-wrap {
    padding-bottom: 12px
}

.avatar {
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: #e6edf0;
    border-radius: .12em;
    vertical-align: top;
    line-height: 1;
    position: relative;
    overflow: hidden;
    -webkit-transition: background-color .3s;
    transition: background-color .3s
}

.avatar__content {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: .406em;
    font-weight: 700
}

.avatar__content .icon {
    color: #a7b5c0
}

.avatar__content img,
.p-creator {
    width: 100%;
    height: 100%
}

.p-creator {
    font-size: .82vw;
    overflow: hidden;
    background-image: url(/img/abstract-bg.f88420b2.svg);
    background-size: cover;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.p-creator__window {
    width: 42.4em;
    background-color: #fff;
    height: 33.1em;
    border-radius: .6em;
    position: relative;
    -webkit-box-shadow: 0 2.2em 7.4em 0 rgba(0, 0, 0, .2);
    box-shadow: 0 2.2em 7.4em 0 rgba(0, 0, 0, .2);
    -webkit-transition: height .4s, margin .4s;
    transition: height .4s, margin .4s;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -16.55em 0 0 -21.2em
}

.p-creator__logotype {
    position: absolute;
    top: .8em;
    left: 1em;
    font-size: 1.6em;
    color: #f67222
}

.p-creator__avatar {
    font-size: 1.8em;
    position: absolute;
    right: 1em;
    top: .8em
}

.p-creator__placeholder-dot {
    width: 13.6em;
    height: 13.6em;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -6.8em;
    margin-left: -6.8em;
    border-radius: 50%;
    background-color: #f4f4f4;
    -webkit-transition: opacity .4s, -webkit-transform .4s;
    transition: opacity .4s, -webkit-transform .4s;
    transition: opacity .4s, transform .4s;
    transition: opacity .4s, transform .4s, -webkit-transform .4s;
    opacity: 0
}

.p-creator__project-name {
    font-family: "IBM Plex Serif";
    font-size: 2.4em;
    color: #3b3b3b;
    left: 1.9583em;
    top: 3em;
    max-width: 90%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.p-creator__phase-name,
.p-creator__project-name {
    -webkit-transition: all .4s;
    transition: all .4s;
    position: absolute
}

.p-creator__phase-name {
    color: #646464;
    padding-top: 1.2em;
    display: block;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    left: 4.7em;
    top: 0;
    right: 4.7em
}

.p-creator__phase-name span {
    font-size: 1.4em
}

.p-creator__item {
    position: absolute;
    left: 4.7em;
    top: 0;
    width: 33em;
    padding-left: 3.9em;
    margin-bottom: .3em;
    -webkit-transition: -webkit-transform .4s;
    transition: -webkit-transform .4s;
    transition: transform .4s;
    transition: transform .4s, -webkit-transform .4s;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0
}

.p-creator__item--discover .p-creator__item-icon {
    background-color: #192262;
    color: #fff
}

.p-creator__item--analyze .p-creator__item-icon {
    background-color: #194962;
    color: #fff
}

.p-creator__item--prototype .p-creator__item-icon {
    background-color: #4f1962;
    color: #fff
}

.p-creator__item-name {
    font-size: 1.2em;
    -webkit-transition: all 1s;
    transition: all 1s;
    position: relative;
    color: #646464;
    -webkit-transform: translateX(2em);
    transform: translateX(2em);
    display: inline-block;
    vertical-align: top;
    line-height: 1.2em;
    margin: .7em 0
}

.p-creator__item-name:after {
    content: "";
    width: 100%;
    height: 100%;
    background-color: #f6f8f9;
    top: 0
}

.p-creator__item-icon,
.p-creator__item-name:after {
    position: absolute;
    left: 0;
    -webkit-transition: all .4s;
    transition: all .4s
}

.p-creator__item-icon {
    width: 2.6em;
    height: 2.6em;
    border-radius: .8em;
    background-color: #d7edf0;
    top: 50%;
    margin-top: -1.3em;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0
}

.p-creator__item-icon .icon {
    font-size: 2.6em;
    margin: -.5em 0 0 -.5em
}

.p-creator__item-icon .icon,
.p-creator__item-phase-name {
    opacity: 0;
    -webkit-transition: all .4s;
    transition: all .4s;
    position: absolute;
    left: 50%;
    top: 50%
}

.p-creator__item-phase-name {
    line-height: 1em;
    width: 6em;
    height: 1em;
    font-size: 1.75em;
    text-align: center;
    font-weight: 600;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.p-creator__hand-1 {
    width: 71.9em;
    height: 37.5em;
    left: 29.5em;
    top: -20em;
    -webkit-transform: translateX(30em) translateY(-10em);
    transform: translateX(30em) translateY(-10em)
}

.p-creator__hand-1,
.p-creator__hand-2 {
    position: absolute;
    -webkit-transition: -webkit-transform .4s;
    transition: -webkit-transform .4s;
    transition: transform .4s;
    transition: transform .4s, -webkit-transform .4s
}

.p-creator__hand-2 {
    width: 39em;
    height: 31.9em;
    right: -29.5em;
    top: 24em;
    -webkit-transform: translateX(30em) translateY(30em);
    transform: translateX(30em) translateY(30em)
}

.p-creator__hand-3 {
    width: 25.1em;
    height: 31.4em;
    position: absolute;
    -webkit-transition: -webkit-transform .4s;
    transition: -webkit-transform .4s;
    transition: transform .4s;
    transition: transform .4s, -webkit-transform .4s;
    left: -12.5em;
    top: 10em;
    -webkit-transform: translateX(-30em) translateY(20em);
    transform: translateX(-30em) translateY(20em)
}

.p-creator__team {
    opacity: 0;
    position: absolute;
    left: 4.7em;
    top: 9.3em;
    -webkit-transition: all .4s;
    transition: all .4s
}

.p-creator__team .avatar {
    font-size: 2.8em;
    margin-right: .2857em
}

.p-creator--step-about .p-creator__placeholder-dot,
.p-creator--step-name .p-creator__placeholder-dot {
    opacity: 1
}

.p-creator--step-about .p-creator__project-name,
.p-creator--step-name .p-creator__project-name {
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) scale(1);
    transform: translate(-50%, -50%) scale(1);
    font-size: 3.6em
}

.p-creator--step-about.p-creator--has-name .p-creator__placeholder-dot,
.p-creator--step-name.p-creator--has-name .p-creator__placeholder-dot {
    opacity: 0;
    -webkit-transform: scale(.7);
    transform: scale(.7)
}

.p-creator--step-about.p-creator--has-name .p-creator__project-name,
.p-creator--step-name.p-creator--has-name .p-creator__project-name {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) scale(1);
    transform: translate(-50%, -50%) scale(1)
}

.p-creator--step-about .p-creator__item,
.p-creator--step-about .p-creator__item-name,
.p-creator--step-about .p-creator__phase-name,
.p-creator--step-name .p-creator__item,
.p-creator--step-name .p-creator__item-name,
.p-creator--step-name .p-creator__phase-name {
    opacity: 0
}

.p-creator--step-about .p-creator__item--first .p-creator__item-icon,
.p-creator--step-name .p-creator__item--first .p-creator__item-icon {
    width: 11.3em;
    height: 11.3em;
    border-radius: 50%
}

.p-creator--step-about .p-creator__item--first .p-creator__item-icon .icon,
.p-creator--step-name .p-creator__item--first .p-creator__item-icon .icon {
    opacity: 0
}

.p-creator--step-about .p-creator__item--discover,
.p-creator--step-name .p-creator__item--discover {
    -webkit-transform: translateX(52.5em) translateY(-11.1em) scale(.51);
    transform: translateX(52.5em) translateY(-11.1em) scale(.51)
}

.p-creator--step-about .p-creator__item--analyze,
.p-creator--step-name .p-creator__item--analyze {
    -webkit-transform: translateX(-33em) translateY(35.6em);
    transform: translateX(-33em) translateY(35.6em)
}

.p-creator--step-about .p-creator__item--prototype,
.p-creator--step-name .p-creator__item--prototype {
    -webkit-transform: translateX(56.7em) translateY(55.7em) scale(.61);
    transform: translateX(56.7em) translateY(55.7em) scale(.61)
}

.p-creator--step-about .p-creator__item--discover {
    -webkit-transform: translateX(22.5em) translateY(-1.1em) scale(.51);
    transform: translateX(22.5em) translateY(-1.1em) scale(.51)
}

.p-creator--step-about .p-creator__item--analyze {
    -webkit-transform: translateX(-3em) translateY(15.6em);
    transform: translateX(-3em) translateY(15.6em)
}

.p-creator--step-about .p-creator__item--prototype {
    -webkit-transform: translateX(26.7em) translateY(25.7em) scale(.61);
    transform: translateX(26.7em) translateY(25.7em) scale(.61)
}

.p-creator--step-about .p-creator__hand-1,
.p-creator--step-about .p-creator__hand-2,
.p-creator--step-about .p-creator__hand-3 {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1
}

.p-creator--step-about .p-creator__item--first {
    opacity: 1
}

.p-creator--step-process .p-creator__project-name {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) scale(1);
    transform: translate(-50%, -50%) scale(1);
    left: 50%;
    top: 3.4em
}

.p-creator--step-process .p-creator__item,
.p-creator--step-process .p-creator__item-name,
.p-creator--step-process .p-creator__phase-name {
    opacity: 0
}

.p-creator--step-process .p-creator__item--first {
    opacity: 1
}

.p-creator--step-process .p-creator__item--first .p-creator__item-icon {
    width: 33.3333%;
    height: 4.3em
}

.p-creator--step-process .p-creator__item--first .p-creator__item-icon .icon {
    opacity: 0
}

.p-creator--step-process .p-creator__item-phase-name {
    opacity: 1
}

.p-creator--step-process .p-creator__item--discover,
.p-creator--step-process .p-creator__phase-name--discover {
    -webkit-transform: translateX(0) translateY(12.1em);
    transform: translateX(0) translateY(12.1em)
}

.p-creator--step-process .p-creator__item--analyze,
.p-creator--step-process .p-creator__phase-name--analyze {
    -webkit-transform: translateX(33.3333%) translateY(16.4em);
    transform: translateX(33.3333%) translateY(16.4em)
}

.p-creator--step-process .p-creator__item--prototype,
.p-creator--step-process .p-creator__phase-name--prototype {
    -webkit-transform: translateX(66.6666%) translateY(20.7em);
    transform: translateX(66.6666%) translateY(20.7em)
}

.p-creator--step-analyze .p-creator__hand-1,
.p-creator--step-analyze .p-creator__hand-2,
.p-creator--step-analyze .p-creator__hand-3,
.p-creator--step-discover .p-creator__hand-1,
.p-creator--step-discover .p-creator__hand-2,
.p-creator--step-discover .p-creator__hand-3,
.p-creator--step-prototype .p-creator__hand-1,
.p-creator--step-prototype .p-creator__hand-2,
.p-creator--step-prototype .p-creator__hand-3,
.p-creator--step-team .p-creator__hand-1,
.p-creator--step-team .p-creator__hand-2,
.p-creator--step-team .p-creator__hand-3 {
    display: none
}

.p-creator--step-analyze .p-creator__window,
.p-creator--step-discover .p-creator__window,
.p-creator--step-prototype .p-creator__window,
.p-creator--step-team .p-creator__window {
    height: 53.3em;
    overflow: hidden;
    margin-top: -26.65em
}

.p-creator--step-analyze .p-creator__item,
.p-creator--step-discover .p-creator__item,
.p-creator--step-prototype .p-creator__item,
.p-creator--step-team .p-creator__item {
    opacity: 0
}

.p-creator--step-analyze .p-creator__item-icon .icon,
.p-creator--step-analyze .p-creator__item[data-enabled=true],
.p-creator--step-discover .p-creator__item-icon .icon,
.p-creator--step-discover .p-creator__item[data-enabled=true],
.p-creator--step-prototype .p-creator__item-icon .icon,
.p-creator--step-prototype .p-creator__item[data-enabled=true],
.p-creator--step-team .p-creator__item-icon .icon,
.p-creator--step-team .p-creator__item[data-enabled=true] {
    opacity: 1
}

.p-creator--step-analyze .p-creator__item-name,
.p-creator--step-discover .p-creator__item-name,
.p-creator--step-prototype .p-creator__item-name,
.p-creator--step-team .p-creator__item-name {
    -webkit-transform: translateX(0);
    transform: translateX(0)
}

.p-creator--step-analyze .p-creator__item--analyze .p-creator__item-name:after,
.p-creator--step-analyze .p-creator__item--discover .p-creator__item-name:after,
.p-creator--step-discover .p-creator__item--discover .p-creator__item-name:after,
.p-creator--step-prototype .p-creator__item--analyze .p-creator__item-name:after,
.p-creator--step-prototype .p-creator__item--discover .p-creator__item-name:after,
.p-creator--step-prototype .p-creator__item--prototype .p-creator__item-name:after,
.p-creator--step-team .p-creator__item--analyze .p-creator__item-name:after,
.p-creator--step-team .p-creator__item--discover .p-creator__item-name:after,
.p-creator--step-team .p-creator__item--prototype .p-creator__item-name:after {
    opacity: 0
}

.p-creator--step-team .p-creator__project-name {
    top: 2.2916em
}

.p-creator--step-team .p-creator__team {
    opacity: 1
}

.onb-method-switcher {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 9px 0;
    line-height: 32px;
    cursor: pointer;
    position: relative
}

.onb-method-switcher,
.onb-method-switcher__info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.onb-method-switcher__info {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background-color: #edf0f2;
    position: absolute;
    left: 100%;
    margin-left: 16px;
    top: 50%;
    margin-top: -12px;
    font-size: 10px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #acaeaf
}

.onb-method-ico {
    display: inline-block;
    vertical-align: top;
    width: 32px;
    height: 32px;
    border-radius: 9px;
    background-color: #d7edf0;
    margin-right: 12px
}

.onb-method-ico .icon {
    font-size: 32px;
    vertical-align: top
}

.onb-method-ico--discover {
    background-color: #192262;
    color: #fff
}

.onb-method-ico--analyze {
    background-color: #194962;
    color: #fff
}

.onb-method-ico--prototype {
    background-color: #4f1962;
    color: #fff
}

.onb-member-input {
    margin-bottom: 12px
}

.onb-process-phase {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #646464;
    font-size: 1.8rem;
    margin-bottom: 10px
}

.onb-process-phase__name {
    display: inline-block;
    background-color: #192262;
    color: #fff;
    font-weight: 600;
    text-align: center;
    line-height: 43px;
    width: 116px;
    margin-right: 18px;
    border-radius: 4px
}

.onb-process-phase--analyze .onb-process-phase__name {
    background-color: #194962
}

.onb-process-phase--prototype .onb-process-phase__name {
    background-color: #4f1962
}

.onb-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 59px;
    padding: 6px 23px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: 1.4rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    z-index: 100;
    -webkit-transition: all .5s cubic-bezier(.77, 0, .175, 1);
    transition: all .5s cubic-bezier(.77, 0, .175, 1)
}

@media screen and (min-width:992px) {
    .onb-header--editor {
        right: 55%
    }
}

.onb-header__logo {
    font-size: 3.2rem;
    cursor: pointer
}

.onb-header__middle {
    width: 328px
}

.onb-header__side {
    color: #646464;
    font-size: 1.6rem
}

.onb-header__side .avatar {
    font-size: 32px
}

.onb-header__side .team__avatar {
    margin-right: 0
}

.onb-header--editor+.side-lay .side-lay__body {
    min-height: 0
}

.onb-logo-uploader {
    margin: 32px 0
}

.onb-input {
    margin: 8px 0
}

.survey-header {
    position: fixed;
    height: 60px;
    -webkit-box-shadow: 0 1px 0 0 rgba(0, 0, 0, .04);
    box-shadow: 0 1px 0 0 rgba(0, 0, 0, .04);
    background-color: #fff;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0 23px;
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
    -webkit-transition: all .2s;
    transition: all .2s
}

.survey-header .icon--logotype {
    font-size: 32px
}

.survey-header .g-progressbar {
    width: auto
}

.survey-header--show {
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.survey-header__side {
    width: 100px
}

.survey-header__side:last-child {
    text-align: right
}

.survey-header .small-wrapper {
    width: 100%
}

.survey-saving {
    font-size: 16px;
    color: #3b3b3b
}

.survey-screen {
    counter-reset: question
}

.survey-screen .builder-content {
    min-height: 0
}

.survey-screen .builder-section--survey-type {
    counter-increment: question
}

.survey-screen .builder-section--survey-type .builder-section__title:after {
    content: counter(question);
    position: absolute;
    left: 0;
    background-color: #abc0c8;
    width: 25px;
    height: 25px;
    border-radius: 3px;
    line-height: 25px;
    text-align: center;
    font-weight: 700;
    color: #fff;
    top: 4px
}

.survey-screen .builder-section--survey-type.builder-section--survey-invalid .builder-section__title:after {
    background-color: #e8746d
}

.survey-screen .builder-section--survey-type.builder-section--survey-invalid .builder-section__title:before {
    content: "Required question";
    position: absolute;
    right: 100%;
    height: 25px;
    white-space: nowrap;
    line-height: 25px;
    background-color: #e8746d;
    text-align: center;
    font-weight: 700;
    color: #fff;
    top: 4px;
    text-transform: uppercase;
    border-radius: 3px;
    margin-right: 6px;
    padding: 0 6px
}

.survey-container {
    width: 100%;
    max-width: 597px;
    margin: 0 auto
}

.survey-container--name {
    max-width: 330px
}

.survey-btn-set {
    margin-top: 10px
}

.survey-btn-set .btn,
.survey-btn-set .method-section-add {
    margin-right: 14px
}

.survey-btn-set .btn:last-child,
.survey-btn-set .method-section-add:last-child {
    margin-right: 0
}

.survey-content {
    padding-top: 60px;
    padding-bottom: 10vh
}

.survey-content tag {
    background-color: transparent !important;
    border: 0 !important;
    cursor: inherit !important
}

.survey-wrapper {
    width: 100%;
    max-width: 592px;
    margin: 0 auto
}

.survey-name {
    margin-bottom: 10px;
    margin-top: 69px
}

.survey-name,
.survey-name input {
    text-align: center
}

.survey-name-logo {
    font-size: 69px;
    text-align: center;
    line-height: 1;
    display: block
}

.survey-name-desc {
    font-size: 1.6rem;
    color: #646464;
    text-align: center;
    max-width: 400px;
    margin: 40px auto 20px;
    line-height: 2rem
}

.survey-name-desc strong {
    color: #171717
}

.survey-continue .btn,
.survey-continue .method-section-add {
    width: 100%;
    max-width: 330px;
    margin-top: 77px
}

.survey-step {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100vh;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.survey-step__body {
    width: 100%
}

.project-report-public .header {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
    -webkit-transition: -webkit-transform .2s;
    transition: -webkit-transform .2s;
    transition: transform .2s;
    transition: transform .2s, -webkit-transform .2s
}

.project-report-public.report-header-visible .header {
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.report-container {
    max-width: 1134px;
    margin: 0 auto;
    padding: 0 45px;
    position: relative
}

.report-container--public {
    max-width: none;
    padding: 0
}

.report-container--public .report-block-container {
    max-width: 1010px;
    padding: 0 45px;
    margin: 0 auto
}

@media screen and (max-width:767px) {
    .report-container--public .report-block-container {
        padding: 0 20px
    }

    .report-container--public .report-block {
        margin: 0
    }
}

.report-container .base-uploader__image {
    max-width: 100% !important;
    max-height: none !important
}

.report-container .builder-content {
    min-height: 0
}

.report-container--public .rblock {
    padding-left: 0;
    padding-right: 0
}

.report-nav {
    display: block;
    border-bottom: 1px solid #f2f2f2;
    text-align: center;
    color: #9ea7b0;
    font-size: 14px;
    text-transform: uppercase;
    position: sticky;
    top: 59px;
    background-color: #fff;
    z-index: 170;
    white-space: nowrap;
    margin: 0 auto;
    letter-spacing: .6px
}

.report-nav .report-block-container {
    max-width: none
}

.report-nav__menu {
    list-style: none;
    padding: 0;
    margin: 0
}

.report-nav__menu>li {
    display: inline-block
}

.report-nav__menu>li a {
    color: inherit;
    display: inline-block;
    border-bottom: 2px solid transparent;
    padding: 15px 16px;
    cursor: pointer
}

.report-nav__menu>li a:hover {
    text-decoration: none;
    color: #000
}

.report-nav__menu>li a:focus {
    text-decoration: none
}

.report-nav__menu>li a.is-active {
    color: #000;
    border-color: #000
}

.report-nav__count {
    background-color: #f6f6f6;
    border-radius: 4px;
    padding: 2px 6px;
    margin-left: 4px
}

.report-nav__more {
    padding-left: 15px
}

.report-nav__more-link {
    color: inherit;
    display: inline-block;
    border-bottom: 2px solid transparent;
    padding: 15px 16px;
    cursor: pointer
}

.report-nav__more-link:hover {
    text-decoration: none;
    color: #000
}

.report-nav__more-link:focus {
    text-decoration: none
}

.report-nav__more-link .icon {
    font-size: 12px;
    margin-right: 4px;
    margin-bottom: 1px
}

.report-nav .dropdown-menu__item {
    display: block
}

.report-nav .dropdown-menu__link {
    display: block;
    padding: 12px 16px;
    border-radius: 0;
    -webkit-transition: color .2s, background .2s;
    transition: color .2s, background .2s;
    border: 0
}

.report-nav .dropdown-menu__link.is-active {
    border-left: 2px solid #000;
    padding-left: 19px;
    margin-left: -5px
}

.report-block {
    border-radius: 6px;
    -webkit-box-shadow: 0 11px 35px 0 rgba(0, 0, 0, .04), 0 0 4px 0 rgba(0, 0, 0, .03);
    box-shadow: 0 11px 35px 0 rgba(0, 0, 0, .04), 0 0 4px 0 rgba(0, 0, 0, .03);
    position: relative;
    min-height: 87px;
    background-color: #fff;
    overflow: hidden;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    margin: 16px 0
}

.report-block__body {
    margin: 80px 85px
}

.report-block--public {
    margin: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 0;
    border-radius: 0;
    border-top: 1px solid #f2f2f2
}

.report-block--public.report-block--CompetitorAnalysis,
.report-block--public.report-block--CompetitorAnalysis+.report-block,
.report-block--public.report-block--FlowsMethod,
.report-block--public.report-block--FlowsMethod+.report-block,
.report-block--public.report-block--InteractivePrototype,
.report-block--public.report-block--InteractivePrototype+.report-block,
.report-block--public:first-child,
.report-nav+.report-block--public {
    border-top: 0
}

@media screen and (max-width:767px) {
    .report-block {
        margin: 0 -45px
    }
}

.report-block__id-anchor {
    position: absolute;
    top: -103px
}

.report-block__content {
    overflow: hidden
}

.report-block__tooltip {
    position: absolute;
    right: 22px;
    top: 24px
}

.report-block:hover .report-block__tooltip {
    opacity: 1
}

.report-block .report-block--public .report-block__tooltip {
    display: none
}

.report-block--empty .report-block__tooltip {
    opacity: 1
}

.report-block__hidden-name {
    position: absolute;
    left: 36px;
    top: 28px;
    line-height: 33px;
    font-size: 24px;
    font-family: "IBM Plex Serif";
    font-weight: 500
}

.report-tooltip {
    height: 42px;
    border-radius: 4px;
    background-color: #171717;
    font-size: 16px;
    color: #fff;
    overflow: hidden
}

.report-tooltip,
.report-tooltip__section {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.report-tooltip__section {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-right: 1px solid hsla(0, 0%, 59%, .2);
    padding: 0 8px
}

.report-tooltip__section:last-child {
    border-right: 0
}

.report-tooltip__button {
    padding: 0 15px;
    font-size: 20px;
    cursor: pointer;
    -webkit-transition: all .2s;
    transition: all .2s;
    color: inherit
}

.report-tooltip__button:hover {
    background-color: #262626;
    color: inherit;
    text-decoration: none
}

.report-tooltip__button strong {
    font-weight: 400;
    font-size: 14px;
    vertical-align: middle;
    margin-left: 16px
}

.report-tooltip__label {
    display: inline-block;
    margin-right: 10px
}

.report-tooltip--light {
    background-color: #f8f9fa;
    color: #646464
}

.report-tooltip--light .report-tooltip__button:hover {
    background-color: #f2f4f6
}

.report-tooltip--light .report-tooltip__button:hover svg {
    color: #646464
}

.report-subtitle {
    font-size: 1.2rem;
    color: rgba(59, 59, 59, .5);
    text-transform: uppercase;
    margin-top: 24px
}

.rblock {
    padding: 0 88px;
    min-height: 87px;
    font-size: 16px;
    color: #414141;
    padding-bottom: 7%;
    padding-top: 7%
}

@media screen and (max-width:767px) {
    .rblock {
        padding: 50px 45px
    }
}

.rblock__header {
    margin-bottom: 7%;
    text-align: center
}

.rblock .titleinput--rblock-title .titleinput__body {
    font-family: "IBM Plex Serif";
    color: #071021;
    font-size: 24px;
    font-weight: 500;
    margin: 0;
    margin-bottom: 5px;
    margin-top: -.25em
}

.rblock .base-card:last-child {
    border-bottom: 0
}

.rblock-project {
    padding: 13.1%
}

.rblock-project__header {
    text-align: center;
    margin-bottom: 55px
}

.rblock-project .rblock-project__icon {
    font-size: 58px
}

.rblock-project .rblock-project__icon .base-uploader {
    margin: 0 auto;
    width: 58px;
    height: 58px;
    font-size: 16px
}

.rblock-project .rblock-project__icon .base-uploader__image {
    max-width: 100% !important;
    max-height: 100% !important
}

.rblock-project .rblock-project__icon .base-uploader__container {
    background-color: transparent
}

.rblock-project .rblock-project__icon .base-uploader__background--empty:before {
    content: "";
    position: absolute;
    background-image: url(/img/logotype.5171ac32.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 50%;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: .25
}

.rblock-project .titleinput__input {
    padding: 0
}

.rblock-project .titleinput--rblock-project-subtitle .titleinput__body,
.rblock-project .titleinput--rblock-project-title .titleinput__body {
    font-family: "IBM Plex Serif";
    color: #071021
}

.rblock-project .titleinput--rblock-project-title .titleinput__body {
    font-weight: 500;
    font-size: 34px;
    margin-bottom: 4px
}

.rblock-project .titleinput--rblock-project-subtitle .titleinput__body {
    font-weight: 300;
    font-size: 24px;
    margin-top: -5px
}

.rblock-project__props {
    list-style: none;
    padding: 0;
    margin-top: 13px;
    font-size: 12px
}

.rblock-project__props .titleinput--rblock-project-prop .titleinput__body {
    color: #86909a;
    text-transform: uppercase;
    letter-spacing: 1.03px;
    font-size: 12px
}

.rblock-project__props>li {
    display: inline-block;
    vertical-align: top;
    text-align: center
}

.rblock-project__props>li .titleinput {
    display: inline-block;
    vertical-align: middle
}

.rblock-project__props>li:first-child {
    text-align: right
}

.rblock-project__props>li:last-child {
    text-align: left
}

.rblock-project__props>li:after {
    content: "";
    display: inline-block;
    width: 4px;
    height: 4px;
    background-color: #d8d8d8;
    border-radius: 50%;
    margin: 0 10px;
    vertical-align: middle
}

.rblock-project__props>li:last-child:after {
    display: none
}

.rblock-stat-counters {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.rblock-stat-counters>li {
    width: 100%;
    max-width: 223px;
    border-left: 1px solid hsla(0, 0%, 59%, .2);
    text-align: center;
    text-transform: uppercase;
    color: #979797;
    font-size: 12px;
    letter-spacing: 1.03px
}

.rblock-stat-counters>li:first-child {
    border-left: 0
}

.rblock-stat-counters strong {
    font-family: "IBM Plex Serif";
    font-size: 32px;
    text-transform: none;
    line-height: 28px;
    color: #333;
    font-weight: 300;
    margin-bottom: 16px;
    display: block
}

.rblock-phases-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -40px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.rblock-phases-list--single {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.rblock-phases-list--single .rblock-phases-list__phase {
    width: 100%;
    max-width: 647px
}

.rblock-phases-list--double .rblock-phases-list__phase {
    width: 50%;
    max-width: 435px
}

.rblock-phases-list__phase {
    width: 33.3333%;
    padding-left: 40px;
    max-width: 270px
}

@media screen and (max-width:991px) {
    .rblock-phases-list__phase {
        width: 50%
    }
}

@media screen and (max-width:767px) {
    .rblock-phases-list__phase {
        width: 100%;
        max-width: none
    }
}

.rblock-phases-list__name {
    display: block;
    font-size: 18px;
    color: #1e2125;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-weight: 600
}

.rblock-phases-list__name .rblock-badge {
    margin-right: 11px
}

.rblock-phases-list__num {
    display: block;
    color: rgba(30, 33, 37, .5);
    margin-bottom: 4px
}

.rblock-phases-list__methods {
    list-style: none;
    padding: 0;
    margin-top: 9px
}

.rblock-phases-list__method {
    padding: 12px;
    margin: 0 -12px;
    border-bottom: 1px solid hsla(0, 0%, 90%, .5)
}

.rblock-phases-list__method:last-child {
    border-bottom: 0
}

.rblock-problems-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -40px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.rblock-problems-list__problem {
    width: 33.3333%;
    padding-left: 40px;
    max-width: 300px
}

@media screen and (max-width:991px) {
    .rblock-problems-list__problem {
        width: 50%
    }
}

@media screen and (max-width:767px) {
    .rblock-problems-list__problem {
        width: 100%;
        max-width: none
    }
}

.rblock-method {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.rblock-method .method-icon {
    font-size: 32px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-right: 17px
}

.rblock-persona {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: -80px;
    margin-bottom: 7%
}

@media screen and (max-width:767px) {
    .rblock-persona {
        display: block;
        margin-left: 0
    }
}

.rblock-persona:last-child {
    margin-bottom: 0
}

.rblock-persona__avatar {
    width: 50%;
    margin-left: 80px;
    position: relative;
    overflow: hidden;
    -webkit-box-shadow: 0 33px 43px 0 rgba(0, 0, 0, .06);
    box-shadow: 0 33px 43px 0 rgba(0, 0, 0, .06);
    background-color: #fafbfc;
    border-radius: 4px;
    background-image: url(/img/user-default.2e66d553.svg);
    background-size: 40% 40%;
    background-position: 50%;
    background-repeat: no-repeat
}

.rblock-persona__avatar:after {
    content: "";
    width: 100%;
    padding-bottom: 100%;
    display: block
}

@media screen and (max-width:767px) {
    .rblock-persona__avatar {
        width: 100%;
        margin-left: 0;
        margin-bottom: 30px
    }
}

.rblock-persona__avatar img {
    width: 100%;
    height: 100%;
    border-radius: 4px;
    position: absolute;
    left: 0;
    top: 0;
    -o-object-fit: cover;
    object-fit: cover
}

.rblock-persona__body {
    width: 50%;
    padding-left: 80px;
    max-width: 460px
}

@media screen and (max-width:767px) {
    .rblock-persona__body {
        width: 100%;
        padding-left: 0
    }
}

.rblock-persona__body img {
    left: 50%
}

.rblock-persona__name {
    font-size: 20px;
    color: #1e1e1e;
    font-weight: 500;
    display: block;
    margin-bottom: 22px;
    position: relative;
    padding-right: 30px
}

.rblock-persona__name .rblock-share-icon {
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -10px
}

.rblock-persona__section {
    margin-bottom: 40px
}

.rblock-persona__section:last-child {
    margin-bottom: 0
}

.rblock-static-slider {
    height: 10px;
    background: #e6edf0;
    border-radius: 100px;
    display: block
}

.rblock-static-slider span {
    height: 100%;
    border-radius: 100px;
    display: block
}

.rblock-definitions {
    display: block;
    margin-bottom: -8px
}

.rblock-definitions dt {
    float: left;
    color: rgba(59, 59, 59, .6);
    width: 85px;
    margin-right: 20px;
    clear: left;
    margin-bottom: 8px
}

.rblock-definitions dd {
    margin: 0;
    width: calc(100% - 105px);
    float: left;
    margin-bottom: 8px
}

.rblock-sliders {
    list-style: none;
    padding: 0;
    margin: 0
}

.rblock-sliders__item {
    margin-bottom: 14px
}

.rblock-sliders__item:last-child {
    margin-bottom: 0
}

.rblock-sliders__name {
    display: block;
    margin-bottom: 6px
}

.rblock-competitor-analysis,
.rblock-flows,
.rblock-interactive-prototype {
    background-color: #fcfcfc
}

.competitor-chart .competitor-analysis-competitor-list-item-placeholder,
.rblock-avatar {
    border: 5px solid #fff;
    border-radius: 7px;
    display: inline-block;
    width: 50px;
    height: 50px;
    -webkit-box-shadow: 0 11px 35px 0 rgba(19, 38, 69, .12), 0 0 4px 0 rgba(0, 0, 0, .03);
    box-shadow: 0 11px 35px 0 rgba(19, 38, 69, .12), 0 0 4px 0 rgba(0, 0, 0, .03);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #fff
}

.competitor-chart .competitor-analysis-competitor-list-item-placeholder img,
.rblock-avatar img {
    width: 100%;
    height: 100%;
    vertical-align: top;
    -o-object-fit: contain;
    object-fit: contain;
    border-radius: 4px
}

.rblock-avatar__color {
    width: 100%;
    height: 100%;
    border-radius: 4px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.rblock-avatar__color:before {
    height: 29px;
    width: 29px;
    background-color: rgba(0, 0, 0, .1);
    border-radius: 50%;
    display: inline-block;
    content: ""
}

.rblock-competitor-inlist {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 18px;
    font-weight: 600;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    padding: 7px 0;
    padding-right: 47px;
    padding-left: 17px;
    color: inherit;
    text-decoration: none;
    border-radius: 4px;
    -webkit-transition: all .2s;
    transition: all .2s
}

.rblock-competitor-inlist:hover {
    color: inherit;
    text-decoration: none;
    background-color: #f8f9fa
}

.competitor-chart .rblock-competitor-inlist .competitor-analysis-competitor-list-item-placeholder,
.rblock-competitor-inlist .competitor-chart .competitor-analysis-competitor-list-item-placeholder,
.rblock-competitor-inlist .rblock-avatar {
    margin-right: 18px;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.rblock-competitor-inlist .rblock-share-icon {
    position: absolute;
    right: 17px;
    top: 50%;
    margin-top: -10px
}

.rblock-competitors-list {
    list-style: none;
    padding: 0
}

.rblock-competitors-list__item {
    border-bottom: 1px solid #f2f2f2;
    margin: 0 -17px
}

.rblock-competitors-list__item:last-child {
    border-bottom: 0
}

.rblock-competitor-analysis-lay {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

@media screen and (max-width:767px) {
    .rblock-competitor-analysis-lay {
        display: block
    }
}

.rblock-competitor-analysis-lay__list {
    width: 40%
}

@media screen and (max-width:767px) {
    .rblock-competitor-analysis-lay__list {
        width: 100%
    }
}

.rblock-competitor-analysis-lay__graph {
    width: 60%;
    margin-left: 64px
}

@media screen and (max-width:767px) {
    .rblock-competitor-analysis-lay__graph {
        width: 100%;
        padding-left: 0
    }
}

.rblock-competitor-analysis-lay__graph .competitor-chart {
    margin-top: 0
}

.rblock-competitor-analysis-lay__graph .competitor-chart__title {
    display: none
}

.rblock-competitor-analysis-lay__graph .competitor-chart__container {
    padding-bottom: 56.6%;
    height: auto
}

.competitor-chart .competitor-analysis-competitor-list-item-placeholder__container {
    height: 100%
}

.rblock-badge {
    width: 20px;
    height: 20px;
    border-radius: 4px;
    display: inline-block;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    color: #fff;
    font-weight: 700
}

.rblock-problem {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-bottom: 42px
}

@media screen and (max-width:767px) {
    .rblock-problem {
        display: block
    }
}

.rblock-problem:last-child {
    margin-bottom: 0
}

.rblock-problem__content {
    width: 54%
}

@media screen and (max-width:767px) {
    .rblock-problem__content {
        width: 100%
    }
}

.rblock-problem .rblock-problem__thumbnail {
    width: 46%;
    padding-left: 60px
}

@media screen and (max-width:767px) {
    .rblock-problem .rblock-problem__thumbnail {
        width: 100%;
        padding-left: 0
    }
}

.rblock-problem .rblock-problem__thumbnail .base-uploader__container {
    width: 100%;
    height: auto;
    border-radius: 4px;
    background-color: #fafbfc
}

.rblock-problem .rblock-problem__thumbnail .base-uploader__background {
    position: relative;
    border-radius: 4px
}

.rblock-problem .rblock-problem__thumbnail .base-uploader__background:before {
    content: "";
    width: 100%;
    padding-bottom: 148%;
    display: block
}

.rblock-problem .rblock-problem__thumbnail .base-uploader__background img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 4px
}

.rblock-problem .rblock-problem__thumbnail .base-uploader__background .base-uploader__ico {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.rblock-problem .rblock-problem__thumbnail .base-uploader__background .base-uploader__remove {
    z-index: 10
}

.rblock-list-item-title {
    margin-bottom: 34px
}

.rblock-list-item-title small {
    color: #86909a;
    font-size: 12px;
    display: block;
    margin-bottom: 10px;
    letter-spacing: .9px;
    text-transform: uppercase
}

.rblock-list-item-title strong {
    font-family: "IBM Plex Serif";
    display: block;
    font-size: 20px;
    color: #1e1e1e;
    font-weight: 500
}

.rblock-flows-list {
    margin-bottom: 24px
}

.rblock-flows-list:last-child {
    margin-bottom: 0
}

.rblock-flows-list__name {
    font-weight: 600;
    font-size: 16px;
    display: block;
    margin-bottom: 10px
}

.rblock-flows-list__list {
    list-style: none;
    padding: 0;
    margin: 0
}

.rblock-flow-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 25px;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    font-size: 16px;
    padding: 12px 0
}

.rblock-flow-item__index {
    width: 25px;
    height: 25px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin-right: 11px;
    display: inline-block;
    background-color: #abc0c8;
    border-radius: 3px;
    line-height: 25px;
    text-align: center;
    font-size: 10px;
    font-weight: 700;
    color: #fff;
    margin-top: -1px
}

.rblock-prototype {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.rblock-prototype__content {
    width: 50%;
    padding-right: 40px
}

.rblock-prototype .rblock-prototype__thumbnail {
    width: 50%
}

.rblock-prototype .rblock-prototype__thumbnail .base-uploader__container {
    width: 100%;
    height: 495px
}

.rblock-empty-image {
    background-color: #fafbfc;
    border-radius: 4px;
    display: block
}

.rblock-empty-image:after {
    content: "";
    display: block;
    padding-bottom: 120%
}

.rblock-image {
    text-align: center;
    background-color: #edf0f2;
    border-radius: 4px
}

.rblock-image img {
    width: 100%;
    max-height: 420px;
    height: auto;
    -o-object-fit: cover;
    object-fit: cover
}

.rblock-share-icon {
    font-size: 20px;
    line-height: 20px;
    color: #4b5761;
    -webkit-transition: all .2s;
    transition: all .2s
}

.rblock-light-title {
    display: block;
    color: rgba(30, 33, 37, .5);
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: .9px;
    font-size: 12px
}

.report-insight {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 418px
}

.report-insight__body {
    width: 60%;
    padding-right: 105px;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.report-insight__body--full {
    width: 100%;
    padding-right: 0
}

.report-insight__body .addon-summary__item input:first-child {
    width: 40% !important;
    color: rgba(59, 59, 59, .5)
}

.report-insight__desc {
    font-size: 1.6rem
}

.report-insight__aside {
    width: 40%;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    text-align: center
}

.report-insight__aside--bottom {
    -ms-flex-item-align: end;
    align-self: flex-end
}

.report-insight__image {
    max-width: 100%;
    height: auto;
    vertical-align: top;
    margin-bottom: -80px
}

.report-insight__logo {
    margin: 0 !important;
    font-size: 32px
}

.report-insight__uploader {
    height: 320px
}

.report-insight__quotes {
    margin-top: 35px
}

.report-insight__tags {
    font-size: 14px;
    margin-top: 9px
}

.report-foot-inputs {
    list-style: none;
    padding: 0;
    margin: 0;
    margin-top: 168px
}

.report-foot-inputs,
.report-foot-inputs li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.report-foot-inputs li {
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0
}

.report-foot-inputs li:after {
    content: "";
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background-color: #dfe2e8;
    display: block;
    margin: 0 16px
}

.report-foot-inputs li:last-child:after {
    display: none
}

.report-foot-inputs input {
    width: 160px;
    font-size: 1.2rem;
    height: 22px
}

.prompt {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1000
}

.prompt__bg {
    top: 0;
    height: 100%;
    background-color: #000;
    opacity: .6
}

.prompt__bg,
.prompt__body {
    position: absolute;
    left: 0;
    width: 100%
}

.prompt__body {
    bottom: 0;
    background-color: #fff;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    padding-left: 9px;
    padding-right: 9px
}

.prompt__body,
.prompt__body .dropdown-menu {
    font-size: 16px;
    text-align: center
}

.prompt__header {
    padding: 14px 0;
    position: relative
}

.prompt__close {
    position: absolute;
    right: 0;
    top: 50%;
    width: 20px;
    height: 20px;
    margin: 0;
    margin-top: -10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: transparent;
    border: 0;
    padding: 0;
    font-size: 14px;
    line-height: 1
}

.workspace-container {
    max-width: 730px;
    margin: 0 auto;
    padding: 0 15px;
    margin-bottom: 400px;
    margin-top: 54px
}

.workspace-container--full {
    width: 100%;
    max-width: none;
    margin-bottom: 0
}

.workspace-container--wide {
    max-width: 935px
}

.workspace-project,
.workspace-project__body {
    -webkit-transition: all .2s;
    transition: all .2s
}

.workspace-project__body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 1.6rem;
    cursor: pointer;
    color: inherit;
    padding: 14px 8px;
    position: relative
}

.workspace-project__body:focus,
.workspace-project__body:hover {
    text-decoration: none;
    color: inherit;
    background-color: #f8f9fa
}

.workspace-project__body:active {
    background-color: #f0f2f5
}

@media screen and (max-width:767px) {
    .workspace-project__body {
        padding-left: 64px;
        display: block;
        padding-top: 20px
    }
}

.workspace-project__icon {
    font-size: 36px;
    line-height: .5;
    margin-right: 20px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-transition: all .2s;
    transition: all .2s
}

@media screen and (max-width:767px) {
    .workspace-project__icon {
        position: absolute;
        left: 8px;
        top: 15px
    }
}

.workspace-project__name {
    width: 100%;
    font-size: 1.8rem;
    font-weight: 500
}

.workspace-project__avatars {
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    min-width: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.workspace-project__avatars:after,
.workspace-project__avatars:before {
    display: none
}

@media screen and (max-width:767px) {
    .workspace-project__avatars {
        display: inline-block;
        vertical-align: middle;
        margin-top: 8px
    }
}

.workspace-project__meta {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    color: rgba(59, 59, 59, .5);
    width: 110px;
    text-align: right
}

@media screen and (max-width:767px) {
    .workspace-project__meta {
        display: inline-block;
        vertical-align: middle;
        margin-top: 8px;
        margin-left: 17px;
        text-align: left;
        width: auto
    }
}

.workspace-project__action {
    margin-left: 40px
}

.workspace-project__action a {
    color: inherit
}

.workspace-project__action a:hover {
    text-decoration: none;
    color: #059fa3
}

@media screen and (max-width:767px) {
    .workspace-project__action {
        display: none
    }
}

.workspace-project--new .workspace-project__icon .icon {
    background-color: #f8f9fa
}

.workspace-project--new .workspace-project__icon .icon svg {
    width: 10px;
    height: 10px
}

.workspace-project--new:hover .workspace-project__icon .icon {
    background-color: #f0f2f5
}

.workspace-project--new:active .workspace-project__icon .icon {
    background-color: #dfe2e8
}

.workspace-section {
    margin: 40px 0
}

.empty-info {
    text-align: center;
    max-width: 280px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 80px auto
}

.empty-info__icon {
    font-size: 152px;
    margin-bottom: 25px
}

.empty-info__heading {
    display: block;
    font-size: 26px;
    color: #3b3b3b;
    font-weight: 400;
    margin-bottom: 35px
}

.empty-list {
    height: 165px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 16px;
    color: #3b3b3b;
    background-color: #f8f9fa;
    border-radius: 11px;
    text-align: center
}

.tutorial-backdrop {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-color: rgba(0, 0, 0, .3);
    z-index: 8900000000
}

.tutorial-prompt {
    position: fixed;
    left: 25px;
    bottom: 30px;
    background-color: #fff;
    border-radius: 4px;
    width: 400px;
    z-index: 9000000000;
    -webkit-box-shadow: 0 0 154px 0 rgba(0, 0, 0, .11), 0 0 14px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 0 154px 0 rgba(0, 0, 0, .11), 0 0 14px 0 rgba(0, 0, 0, .08)
}

@media screen and (max-width:767px) {
    .tutorial-prompt {
        width: auto;
        left: 0;
        bottom: 0;
        right: 0;
        border-radius: 0
    }
}

.tutorial-step {
    font-size: 16px;
    overflow: hidden
}

.tutorial-step__img {
    background-color: #192262;
    height: 0;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    -webkit-transition: all .35s;
    transition: all .35s
}

.tutorial-step--welcome .tutorial-step__img {
    height: 219px
}

.tutorial-step__body {
    margin: 22px 25px
}

.tutorial-step__text {
    min-height: 118px
}

.tutorial-step__heading {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.4;
    display: block;
    margin-bottom: 5px
}

.tutorial-step__btns {
    margin: 22px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.tutorial-step__btns .btn,
.tutorial-step__btns .method-section-add {
    width: 40%;
    padding-left: 10px;
    padding-right: 10px
}

.tutorial-step__btns .btn--primary {
    width: 60%;
    margin-left: 20px
}

.tutorial-step--welcome .tutorial-dots {
    width: 0;
    opacity: 0
}

@-webkit-keyframes highlight-animation {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(10, 159, 163, .4), 0 0 0 3px #0a9fa3;
        box-shadow: 0 0 0 0 rgba(10, 159, 163, .4), 0 0 0 3px #0a9fa3
    }

    to {
        -webkit-box-shadow: 0 0 0 30px rgba(10, 159, 163, 0), 0 0 0 3px #0a9fa3;
        box-shadow: 0 0 0 30px rgba(10, 159, 163, 0), 0 0 0 3px #0a9fa3
    }
}

@keyframes highlight-animation {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(10, 159, 163, .4), 0 0 0 3px #0a9fa3;
        box-shadow: 0 0 0 0 rgba(10, 159, 163, .4), 0 0 0 3px #0a9fa3
    }

    to {
        -webkit-box-shadow: 0 0 0 30px rgba(10, 159, 163, 0), 0 0 0 3px #0a9fa3;
        box-shadow: 0 0 0 30px rgba(10, 159, 163, 0), 0 0 0 3px #0a9fa3
    }
}

.tutorial-highlighted-element {
    position: relative
}

.tutorial-highlighted-element:before {
    content: "";
    -webkit-box-shadow: 0 0 0 4px #0a9fa3;
    box-shadow: 0 0 0 4px #0a9fa3;
    border-radius: 1px;
    position: absolute;
    left: -6px;
    top: -6px;
    right: -6px;
    bottom: -6px;
    -webkit-animation: highlight-animation 1.2s cubic-bezier(0, 0, .3, .91) infinite;
    animation: highlight-animation 1.2s cubic-bezier(0, 0, .3, .91) infinite
}

.tutorial-dots {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    overflow: hidden;
    opacity: 1
}

.tutorial-dots,
.tutorial-dots__dot {
    -webkit-transition: all .2s;
    transition: all .2s
}

.tutorial-dots__dot {
    width: 8px;
    height: 8px;
    margin-right: 8px;
    border-radius: 50%;
    background-color: #e6edf0
}

.tutorial-dots__dot--active {
    background-color: #059fa3
}

.analytics__method-custommethod-show {
    padding-bottom: 0
}

body {
    counter-reset: list
}

.builder--selecting * {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.builder-title {
    position: relative
}

.builder-title__avatar {
    position: absolute;
    margin-right: 22px;
    right: 100%;
    top: 50%;
    margin-top: -22px;
    font-size: 44px
}

.builder-title .titleinput {
    margin-top: 0
}

.builder-title-wrap {
    margin-top: 54px
}

.builder-breadcrumbs {
    font-size: 14px;
    padding: 4px 8px 4px 29px;
    color: #62656a;
    display: inline-block;
    border-radius: 4px;
    -webkit-transition: all .2s;
    transition: all .2s;
    position: relative;
    line-height: 20px
}

.builder-breadcrumbs:focus,
.builder-breadcrumbs:hover {
    color: #62656a;
    text-decoration: none;
    background-color: #f8f9fa
}

.builder-breadcrumbs:active {
    text-decoration: none;
    background-color: #f0f2f5
}

.builder-breadcrumbs .icon {
    position: absolute;
    left: 9px;
    top: 50%;
    font-size: 14px;
    margin-top: -4px
}

#app .builder-list-preloading {
    display: none;
    z-index: 150;
    background-color: #fff;
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 280px;
    height: 100% !important;
    padding-top: 60px
}

#app .builder--preloading .builder-list-preloading {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.builder-content {
    position: relative;
    margin-left: -72px
}

@media screen and (max-width:991px) {
    .builder-content--editable {
        margin-left: 0;
        margin: 0 auto;
    }
}

.builder-content--report .section-wrap--not-paragraph+.section-wrap--not-paragraph {
    margin-top: 0
}

@-webkit-keyframes builder-section-fade-in {
    0% {
        background-color: #b6d8fc
    }

    to {
        background-color: transparent
    }
}

@keyframes builder-section-fade-in {
    0% {
        background-color: #b6d8fc
    }

    to {
        background-color: transparent
    }
}

.builder-section {
    border-radius: 0;
    position: relative
}

.builder-section--selected {
    background-color: #b6d8fc
}

.builder-section--selected .ql-tooltip {
    display: none;
    pointer-events: none
}

.builder-section[data-animation=true] {
    -webkit-animation: builder-section-fade-in 1s 1;
    animation: builder-section-fade-in 1s 1
}

.builder-section--image,
.builder-section--paragraph {
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0
}

.builder-section--image {
    padding-top: 15px;
    padding-bottom: 15px
}

.builder-section--image .base-uploader__background {
    min-height: 100px
}

.builder-section--image .base-uploader__image {
    max-height: 388px !important
}

.builder-section__title {
    position: relative
}

.builder-section__title .question-type-picker {
    position: absolute;
    left: 0;
    top: 4px
}

.builder-section__title .sortable-handler {
    position: absolute;
    left: -24px;
    top: 4px;
    opacity: 0;
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

@media screen and (max-width:767px) {
    .builder-section__title .sortable-handler {
        opacity: 1
    }
}

.builder-section__title .titleinput {
    margin-bottom: 0;
    margin-left: 47px
}

.builder-section:hover .builder-section__title .sortable-handler,
.section-wrap.sortable-selected .builder-section .side-dropdown-menu__btn,
.section-wrap.sortable-selected--first .builder-section__title .sortable-handler {
    opacity: 1
}

.builder-section__content {
    margin-left: 6px;
    margin-top: 8px !important;
    position: relative
}

.padding-image-note {
    padding-right: 108px !important;
    min-height: 76px !important;
}

.builder-section__aside {
    margin-top: -48px;
    float: right
}

.a-sheet {
    background-color: #ffffff !important;
    font-family: 'IA-Font-Regular';
    padding-top: 67px;
    padding-left: 67px;
    padding-right: 67px;
    padding-bottom: 67px;
    min-height: 1022px;
    max-width: 960px;
    box-shadow: 0px 1px 4px 0px rgb(159 159 159 / 6%);
    -webkit-box-shadow: 0px 1px 4px 0px rgb(159 159 159 / 6%);
    -moz-box-shadow: 0px 1px 4px 0px rgba(159, 159, 159, 0.06);
}

.small-wrapper.full {
    margin: 0 auto;
    /*max-width: 842px;*/
}

.builder-section--embed .builder-section__content,
.builder-section--image .builder-section__content,
.builder-section--paragraph .builder-section__content {
    margin-top: 0
}

.builder-section .sortable-cards {
    margin-top: -11px
}

.builder-add-section {
    margin: -20px auto;
    position: relative;
    margin-left: -47px;
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s
}

.builder-add-section--adding,
.builder-add-section--adding .builder-add-section__picker,
.builder-add-section:hover {
    opacity: 1
}

.builder-add-section__btn-wrap {
    width: 40px;
    margin: 0 auto
}

.builder-add-section__btn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 0;
    display: block;
    background-color: #f3f6f8;
    -webkit-transition: all .2s;
    transition: all .2s;
    opacity: 0;
    margin: 0 auto;
    font-size: 16px
}

.builder-add-section__btn:hover {
    background-color: #e6edf0
}

.builder-add-section__btn:focus {
    outline: none
}

.builder-add-section__btn span.icon {
    display: inline-block !important
}

.builder-add-section__picker {
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s
}

.builder-add-section:hover .builder-add-section__picker {
    opacity: 1
}

.addon-gallery {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: -22px 0 0 -22px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.addon-gallery.sortable-wrap:after,
.addon-gallery.sortable-wrap:before {
    display: none
}

.addon-gallery__item {
    width: calc(50% - 22px);
    padding: 22px 0 0 22px
}

.addon-gallery__item--placeholder {
    -webkit-box-ordinal-group: 10000;
    -ms-flex-order: 9999;
    order: 9999
}

.addon-gallery__item-placeholder {
    background-color: #f8f9fa;
    padding-bottom: 100%
}

.addon-gallery__item .base-uploader {
    position: relative
}

.addon-gallery__item .base-uploader:before {
    content: "";
    display: block;
    padding-bottom: 100%
}

.addon-gallery__item .base-uploader .base-uploader__container {
    position: absolute;
    left: 0;
    top: 0
}

.addon-gallery__item .base-uploader__background:before {
    content: "";
    padding-bottom: 77.6%
}

.addon-gallery__item--new {
    -webkit-box-ordinal-group: 1000;
    -ms-flex-order: 999;
    order: 999
}

.builder-section:hover .builder-paragraph__drag {
    opacity: 1
}

.builder-paragraph {
    position: relative
}

.builder-paragraph--type-bullet-list {
    padding-left: 25px
}

.builder-paragraph--type-bullet-list:before {
    content: "•";
    font-size: 16px;
    color: inherit;
    position: absolute;
    left: 4px;
    top: 5px
}

.builder-paragraph--type-number-list {
    padding-left: 25px
}

.builder-paragraph--type-number-list .builder-paragraph__counter {
    font-size: 16px;
    color: inherit;
    position: absolute;
    left: 4px;
    top: 5px
}

.builder-paragraph--type-headline-1 .wysiwyg {
    font-size: 26px;
    font-weight: 700
}

.builder-paragraph--type-headline-2 .wysiwyg {
    font-size: 22px;
    font-weight: 700
}

.builder-paragraph__drag,
.builder-paragraph__picker,
.builder-paragraph__type-drag {
    position: absolute;
    left: -31px;
    top: 0px;
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s
}
.builder-paragraph__drag__visible {
    position: absolute;
    left: -47px;
    top: 3px;
    opacity: 1;
    -webkit-transition: all .2s;
    transition: all .2s
}

.builder-paragraph__drag,
.builder-paragraph__type-drag {
    width: 25px;
    height: 25px;
    border-radius: 3px;
    /*background-color: #fff;*/
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: move
}

@media screen and (max-width:767px) {

    .builder-paragraph__drag,
    .builder-paragraph__type-drag {
        opacity: 1
    }
}

.builder-paragraph__drag:hover,
.builder-paragraph__type-drag:hover {
    background-color: #f8f9fa
}

.builder-paragraph__drag:active,
.builder-paragraph__type-drag:active {
    background-color: #edf0f2
}

.sortable-selected .builder-paragraph__drag,
.sortable-selected .builder-paragraph__type-drag {
    opacity: 0
}

.sortable-selected--first .builder-paragraph__drag,
.sortable-selected--first .builder-paragraph__type-drag {
    opacity: 1
}

.builder-paragraph__type-drag {
    left: -72px
}

.builder-paragraph .wysiwyg--empty .wysiwyg__editor:before {
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s
}

.section-wrap--paragraph:last-child .builder-paragraph .wysiwyg--empty .wysiwyg__editor:before {
    opacity: 1
}

.builder-content--editable .section-wrap--paragraph:last-child .builder-paragraph .editor-content:empty:before {
    color: rgba(85, 85, 85, .5);
    cursor: text;
    opacity: 1;
    font-style: normal;
    content: "Type here..."
}

.builder-empty .builder-paragraph .wysiwyg--empty .wysiwyg__editor:before,
.builder-empty .builder-paragraph__picker,
.builder-paragraph--focus .builder-paragraph__drag,
.builder-paragraph--focus .builder-paragraph__picker,
.builder-paragraph--focus .builder-paragraph__type-drag,
.builder-paragraph--focus .wysiwyg--empty .wysiwyg__editor:before,
.builder-paragraph--open .builder-paragraph__drag,
.builder-paragraph--open .builder-paragraph__picker,
.builder-paragraph--open .builder-paragraph__type-drag,
.builder-paragraph--open .wysiwyg--empty .wysiwyg__editor:before,
.builder-paragraph:hover .builder-paragraph__drag,
.builder-paragraph:hover .builder-paragraph__picker,
.builder-paragraph:hover .builder-paragraph__type-drag,
.builder-section:hover .builder-paragraph__drag,
.builder-section:hover .builder-paragraph__type-drag,
.section-wrap--paragraph:last-child .builder-paragraph__picker {
    opacity: 1
}

.builder-paragraph .editor-content {
    min-height: 26px !important
}

.addon-summary {
    font-size: 16px;
    margin-top: -11px;
    margin-right: -14px;
    margin-left: -15px
}

.addon-summary__item {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 16px;
    border-bottom: 1px solid #f2f2f2;
    padding: 11px 0;
    padding-left: 15px
}

.addon-summary__name,
.addon-summary__value {
    color: #3b3b3b
}

.addon-summary .enter-input {
    width: 100%
}

.addon-summary input {
    text-overflow: ellipsis
}

.addon-image__drag,
.addon-image__type-drag {
    position: absolute;
    left: -47px;
    top: 3px;
    width: 25px;
    height: 25px;
    border-radius: 3px;
    background-color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: move;
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s
}

@media screen and (max-width:767px) {

    .addon-image__drag,
    .addon-image__type-drag {
        opacity: 1
    }
}

.addon-image__drag:hover,
.addon-image__type-drag:hover {
    background-color: #f8f9fa
}

.addon-image__drag:active,
.addon-image__type-drag:active {
    background-color: #edf0f2
}

.sortable-selected .addon-image__drag,
.sortable-selected .addon-image__type-drag {
    opacity: 0
}

.addon-image--focus .addon-image__drag,
.addon-image:hover .addon-image__drag,
.builder-section:hover .addon-image__drag,
.sortable-selected--first .addon-image__drag,
.sortable-selected--first .addon-image__type-drag {
    opacity: 1
}

.addon-charts {
    font-size: 16px;
    margin-right: -14px;
    margin-top: -11px;
    margin-left: -15px
}

.addon-charts__item {
    color: inherit;
    font-size: 16px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    padding-bottom: 5px;
    padding-left: 15px;
    padding-right: 26px;
    position: relative
}

.addon-charts__item input {
    color: inherit;
    overflow: hidden;
    text-overflow: ellipsis
}

.addon-charts__input {
    padding-top: 5px;
    color: inherit;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-size: 16px
}

.addon-charts__slider {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 5px
}

.addon-charts__slider .tooltip__trigger {
    width: 14px;
    text-align: right;
    padding-right: 0;
    font-size: 1.4rem;
    margin-left: 10px
}

.addon-charts__slider .color-picker .tooltip__trigger {
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s
}

.side-dropdown-menu__content:hover .addon-charts__slider .color-picker .tooltip__trigger {
    opacity: 1;
}

.addon-charts__slider-static {
    display: block;
    background-color: #e2e2e2;
    border-radius: 10px;
    width: 100%;
    margin: 4px 0
}

.addon-charts__slider-static div {
    height: 10px;
    border-radius: 10px
}

.addon-charts__more {
    width: 14px;
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -16px
}

.addon-charts__more-icon {
    width: 100%;
    height: 32px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding-right: 3px;
    font-size: 1.4rem;
    color: #aaaab5;
    -webkit-transition: opacity .2s;
    transition: opacity .2s;
    opacity: 0
}

.addon-charts:hover .addon-charts__more-icon {
    opacity: 1
}

.builder-draggable-field {
    position: relative;
    padding-left: 32px;
    margin-left: -32px
}

.builder-draggable-field__drag {
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -12px;
    width: 25px;
    height: 25px;
    border-radius: 3px;
    background-color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: move;
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s;
    font-size: 10px
}

@media screen and (max-width:767px) {
    .builder-draggable-field__drag {
        opacity: 1
    }
}

.builder-draggable-field__drag:hover {
    background-color: #f8f9fa
}

.builder-draggable-field__drag:active {
    background-color: #edf0f2
}

.builder-draggable-field--focus .builder-draggable-field__drag,
.builder-draggable-field:hover .builder-draggable-field__drag {
    opacity: 1
}

.builder-new-input {
    padding: 9px 15px;
    border-radius: 4px;
    -webkit-transition: all .2s;
    transition: all .2s
}

.builder-new-input .enter-input {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.builder-new-input input,
.builder-new-input textarea {
    min-height: 30px;
    width: 100%;
    padding: 4px 0 !important;
    height: 30px
}

.builder-new-input--active,
.builder-new-input:hover {
    background-color: #f8f9fa
}

.builder-new-input .base-checkbox {
    margin-right: 15px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    opacity: .3
}

.addon-checklist {
    font-size: 16px;
    margin-top: -5px;
    margin-right: -14px;
    margin-left: -15px
}

.addon-checklist__item {
    font-size: 16px;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    min-height: 30px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid #f2f2f2;
    padding: 11px 0;
    padding-left: 56px
}

.addon-checklist__item .base-checkbox {
    position: absolute;
    left: 15px;
    top: 13px
}

.addon-checklist__item input,
.addon-checklist__item textarea {
    padding: 4px 0 !important;
    min-height: 30px;
    height: 30px
}

.builder-multitag {
    position: absolute;
    left: 0;
    top: 0;
    width: 260px;
    left: 50%;
    margin-left: -130px;
    background-color: #fff;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 40px rgba(0, 0, 0, .1);
    box-shadow: 0 0 40px rgba(0, 0, 0, .1);
    margin-top: 10px
}

.builder-multitag .tags-selector__input-container {
    margin-top: 0
}

.addon-embed {
    border: 2px solid transparent;
    margin: -2px
}

.addon-embed:focus {
    outline: none;
    border-color: #059fa3
}

.addon-embed__iframe {
    border: 0;
    width: 100%;
    height: 400px;
    border: 1px solid rgba(0, 0, 0, .05)
}

.addon-embed iframe {
    display: block;
    vertical-align: top
}

.sortable-handler {
    width: 24px;
    height: 24px;
    border-radius: 3px;
    font-size: 10px;
    padding: 7px;
    cursor: move;
    /*background-color: #fff;*/
    -ms-touch-action: none;
    touch-action: none
}

.sortable-handler .icon {
    vertical-align: top
}

.sortable-handler:hover {
    background-color: transparent
}

.builder-columns-selector {
    position: absolute;
    left: 100%;
    margin-left: 30px;
    top: -25px;
    width: 100px;
    font-size: 14px
}

.wy-toolbar {
    position: absolute;
    top: 0;
    left: 0;
    display: none
}

.wy-toolbar--show {
    display: block
}

.wy-toolbar__bar {
    position: absolute;
    height: 40px;
    top: 10px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.wy-toolbar__bar,
.wy-toolbar__bar-section {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.wy-toolbar__bar-section {
    background-color: #282b35;
    border-radius: 8px;
    color: #fff;
    padding: 0 5px;
    margin-left: 5px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.wy-toolbar__bar-section:first-child {
    margin-left: 0
}

.wy-toolbar__separator {
    height: 24px;
    width: 1px;
    display: block;
    background-color: #414551;
    margin: 0 5px
}

.wy-toolbar__ico {
    width: 30px;
    height: 30px;
    margin: 5px 0;
    background-color: transparent;
    border: 0;
    border-radius: 4px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    font-size: 30px
}

.wy-toolbar__ico .icon {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    opacity: .75
}

.wy-toolbar__ico.is-active .icon {
    opacity: 1
}

.wy-toolbar__ico--text {
    width: auto;
    white-space: nowrap;
    padding: 0 17px;
    font-size: 14px
}

.wy-toolbar__ico:hover {
    background-color: #191b23
}

.wy-toolbar__ico:active {
    background-color: #363b4b
}

.wy-toolbar__tags {
    height: auto;
    border-radius: 3px;
    background: #fff;
    -webkit-box-shadow: 0 14px 24px rgba(0, 0, 0, .07), 0 15px 78px rgba(0, 0, 0, .06);
    box-shadow: 0 14px 24px rgba(0, 0, 0, .07), 0 15px 78px rgba(0, 0, 0, .06)
}

.wy-toolbar__input {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    white-space: nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 14px;
    padding-left: 11px
}

.wy-toolbar__input input {
    background-color: transparent;
    border: 0;
    margin-left: 6px
}

.wy-toolbar__input input:focus {
    outline: none
}

.library {
    position: fixed;
    right: 0;
    top: 0;
    height: 100%;
    background-color: #ffffff; /*#f6f6f6;*/
    z-index: 200;
    width: 350px;
    padding-right: 5px;
    padding-left: 5px;
    /*border-left: 1px solid #e2e6e6;*/
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-transition-duration: .4s !important;
    transition-duration: .4s !important;
    
}

@media screen and (max-width:991px) {
    .library {
        width: 420px
    }
}

@media screen and (max-width:767px) {
    .library {
        width: 100%
    }
}

.calendar {
    width: auto;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato, Helvetica, Tahoma, Arial, sans-serif !important;
}
.calendar .mdc-button__label {
    font-size: 1.2rem !important;
    font-weight: 100 !important;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato, Helvetica, Tahoma, Arial, sans-serif !important;
    position: absolute !important;
    left: 12px;
}
.mat-calendar-controls .mat-mdc-icon-button.mat-mdc-button-base {
    width: 30px !important;
    height: 30px !important;
    padding: 19px !important;
}
.mat-calendar-controls {
    margin: 5% calc(4.7142857143% - 16px) !important;
}
.calendar .mat-mdc-icon-button{
    --mat-mdc-button-persistent-ripple-color: #f7f7f7 !important;
    --mat-mdc-button-ripple-color: #f7f7f7 !important;
}
.mat-calendar-table-header, .mat-calendar-body-label {
    color: rgba(0,0,0,.48) !important;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato, Helvetica, Tahoma, Arial, sans-serif !important;
    font-weight: 100 !important;
    font-size: 1.15rem !important;
    text-shadow: 0px 1px 0px #ffffff63;
    color: #858585 !important;
}
.mat-calendar-table-header th {
    color: #606266 !important;
    font-family: 'Plus Jakarta Sans', 'Inter', Lato, Helvetica, Tahoma, Arial, sans-serif !important;
    font-weight: 100 !important;
    text-shadow: 0px 1px 0px #ffffff63;
    font-size: 9px !important;
}
.mat-calendar-body-cell-content{
    background: transparent !important;
} 
.mat-calendar-body-cell-content:hover{
    background: #eceef0 !important;
    color: #333 !important;
}
.mat-calendar-body-cell-content {
    font-family: 'Plus Jakarta Sans', 'Inter', Lato, Helvetica, Tahoma, Arial, sans-serif !important;
    color: #606266 !important;
    font-size: 1.2rem !important;
    text-shadow: 0px 1px 0px #ffffff63;
}
.mat-calendar-table-header-divider::after {
    background: rgb(0 0 0 / 2%) !important;
}
.mat-calendar-body-selected {
    background-color: #eceef0 !important;
    color: #333 !important;
}
.mat-calendar-body-today:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {
    border-color: #eceef0 !important
}
.mat-calendar-body-today.mat-calendar-body-selected { 
    box-shadow: inset 0 0 0 0px #fff !important;
}
.mat-calendar-body-today:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical) {
    border-color: #eceef0 !important
}
.mat-calendar {
    background-color: transparent !important;
    border-radius: 8px !important;
    margin-top: 0px !important;
}
.mat-calendar-previous-button {
    position: absolute !important;
}
.mat-calendar-arrow {
    display: none !important;
}
.mat-calendar-period-button {
    position: absolute !important;
    width: 100% !important;
    margin: 0 auto !important;
    height: 43px !important;
}
.mat-calendar-period-button:hover {
    background-color: transparent !important;
}
.mat-calendar-content {
    margin-top: 12px !important;
    border-bottom: 1px solid transparent !important;
    padding: 0 3px 8px 3px !important;
}
.mdc-button__label span {
    font-size: 1.5rem !important;
    font-family: 'Mona Sans', 'Plus Jakarta Sans', 'Inter', Lato, Helvetica, Tahoma, Arial, sans-serif !important; 
    font-weight: 300;
    color: #d60017;
}
.mat-mdc-button, .mat-mdc-outlined-button {
    --mat-mdc-button-persistent-ripple-color: #0000 !important;
    --mat-mdc-button-ripple-color: rgb(0 0 0 / 0%) !important;
}
.mat-calendar-header {
    margin-top: -15px !important;
}
.mat-calendar-body-cell-content {
    font-size: 1.03rem !important;
    font-weight: 400 !important;
}
.mat-calendar-previous-button::after, .mat-calendar-next-button::after {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
    content: "";
    margin: 16px !important;
    border: 0 solid currentColor;
    border-top-width: 2px;
}
.mat-calendar-previous-button::after, .mat-calendar-next-button::after {
    border-top-width: 1px !important;
}
.mat-calendar-previous-button::after {
    border-left-width: 1px !important;
}
.mat-calendar-next-button::after {
    border-right-width: 1px !important;
}
.mat-calendar-previous-button {
    opacity: 0.6 !important;
    right: 36px;
}
.mat-calendar-next-button {
    opacity: 0.6 !important;
}
.o-switch {
    border-radius: 5px;
    float: left;
    margin-left: 0px;
    height: 36px;
}
.o-switch-last {
    border-radius: 5px;
    float: left;
    margin-left: 13px;
    height: 36px;
}
.o-switch_text {
    font-family: 'Mona Sans', Arial, Helvetica, sans-serif;
    font-size: 1.3rem;
    font-weight: 400;
    letter-spacing: 0.03rem;
    width: 100%;
    text-align: center;
    color: #555;
    text-shadow: 0px 1px 0px #ffffff;
    margin-top: -1px; pointer-events: none;
}
.o-switch.o-switch_active .o-switch_text {
    color: #121212;
}
.o-switch-last.o-switch_active .o-switch_text {
    color: #121212;
}
.o-switch_active {
    background-color: #fff;
    box-shadow: 1px 1px 2px 0px rgba(159, 159, 159, 0.43);
    -webkit-box-shadow: 1px 1px 2px 0px rgba(159, 159, 159, 0.43);
    -moz-box-shadow: 1px 1px 2px 0px rgba(159, 159, 159, 0.43);
}

/* switch secundary */
.o-switch-secundary {
    border-radius: 7px;
    float: left;
    margin-left: 0px;
    height: 34px;
}
.o-switch-last-secundary {
    border-radius: 7px;
    float: left;
    margin-left: 13.5px;
    height: 34px;
}
.o-switch_text-secundary {
    font-size: 1.13rem;
    font-weight: 400;
    letter-spacing: 0.02rem;
    width: 100%;
    text-align: center;
    color: #757575;
    text-shadow: 0px 1px 0px #ffffff;
    margin-top: -1px; 
    /*pointer-events: none;*/
}
.o-switch-secundary.o-switch_active-secundary .o-switch_text-secundary {
    color: #121212;
}
.o-switch-last-secundary.o-switch_active-secundary .o-switch_text-secundary {
    color: #121212;
}
.o-switch_active-secundary {
    background-color: #f3f4f5;
    height: 34px;
    border-radius: 7px;
}

/* - */

.content_pinned .selected {
   /* -webkit-box-shadow:inset 0px 0px 0px 2px #0a925075;
    -moz-box-shadow:inset 0px 0px 0px 2px #0a925075;
    box-shadow:inset 0px 0px 0px 2px #0a925075;*/
    background-color: #f5f5f5 !important; /*fbd161*/
}
.cps:hover {
    background-color: #f7f7f7 !important;
}

.pinned {
    position: relative;
    width: 100%;
    height: 124px;
    background-color: #ffffffeb;
    border-radius: 3px;
    width: calc(100% - 18px);
    margin-left: 18px;
    cursor: pointer;
    overflow: hidden;
    padding: 1px;
}
.pinned.shadow {
    box-shadow: 0px 0px 0px 1px rgb(174 174 174 / 16%);
    -webkit-box-shadow: 0px 0px 0px 1px rgb(174 174 174 / 16%);
    -moz-box-shadow: 0px 0px 0px 1px rgb(174 174 174 / 16%);
}
.pinned.selected {
    -webkit-box-shadow:inset 0px 0px 0px 2px #0a925075;
    -moz-box-shadow:inset 0px 0px 0px 2px #0a925075;
    box-shadow:inset 0px 0px 0px 2px #0a925075;
    background-color: #71a1b0;
}
.pinned__blank {
    width: 100%;
    height: 5px;
}
.pinned .text {
    position: absolute;
    padding: 13px;
    padding-left: 13px;
    padding-right: 20px;
    font-weight: 400;
    text-align: left;
    top: 0;
    left: 0;
    color: #a6a6a6;
    font-size: 0.89rem;
    letter-spacing: 0.02rem;
}
.pinned.selected .text {
    color: #fffffff0;
}
.pinned .box {
    position: absolute; 
    width: 100%; 
    height: 100%; 
    border-radius: 4px; 
    opacity: 1; 
    display: block;
    background-color: #ffffff;
}
.pinned .users {
    position: absolute;
    padding: 0px;
    padding-left: 13px;
    padding-right: 0px;
    font-weight: 400;
    text-align: left;
    bottom: 0;
    left: 0;
    color: #a6a6a6;
    font-size: 0.8rem;
    letter-spacing: 0.02rem;
    height: 30px;
    width: 100%;
    bottom: 5px;
}
.pinned .users .description {
    font-size: 0.76rem;
    float: right;
    margin-left: 0px;
    margin-right: 13px;
    color: #fff;
    letter-spacing: 0.06rem;
    font-weight: 300;
    margin-top: 4px;
    /*background-color: #d60017;
    border-radius: 50%;*/
    opacity: 0.1;
}
.pinned.selected .users {
    color: #fffffff0;
}
.pinned .users .avatar0 {
    width: 18px;
    height: 18px;
    margin-top: 6px; 
    border-radius: 50%; 
    overflow: hidden;
    position: absolute;
    border: 2px solid #fff;
    opacity: 0.3;
    box-shadow: 1px 1px 1px 0px rgb(159 159 159 / 23%);
    -webkit-box-shadow: 1px 1px 1px 0px rgb(159 159 159 / 23%);
    -moz-box-shadow: 1px 1px 1px 0px rgba(159, 159, 159, 0.23);
}
.pinned .users .avatar1 {
    width: 18px;
    height: 18px;
    margin-top: 6px; 
    border-radius: 50%; 
    overflow: hidden; 
    position: absolute;
    margin-left: 13px;
    border: 2px solid #fff;
    opacity: 0.3;
    box-shadow: 1px 1px 1px 0px rgb(159 159 159 / 23%);
    -webkit-box-shadow: 1px 1px 1px 0px rgb(159 159 159 / 23%);
    -moz-box-shadow: 1px 1px 1px 0px rgba(159, 159, 159, 0.23);
}
.pinned .users .avatar2 {
    width: 18px;
    height: 18px;
    margin-top: 6px; 
    border-radius: 50%; 
    overflow: hidden; 
    position: absolute;
    margin-left: 26px;
    border: 2px solid #fff;
    opacity: 0.3;
    box-shadow: 1px 1px 1px 0px rgb(159 159 159 / 23%);
    -webkit-box-shadow: 1px 1px 1px 0px rgb(159 159 159 / 23%);
    -moz-box-shadow: 1px 1px 1px 0px rgba(159, 159, 159, 0.23);
}

.pinned.selected .left {
    background-color: #ffffff45;
    width: 3px;
    height: 81px;
    position: absolute; 
    left: 13px;
    top: 13px;
    border-radius: 3px;
}
.unselectable {
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
 }

 .pin-button {
    padding-left: 8px;
    padding-right: 15px;
    width: 100%;
    background-color: #f0f0f0a3;
    height: 35px;
    letter-spacing: 0.02rem;
    border-radius: 5px;
    border: 1px dotted transparent;
 }
 .pin-button.selected {
    background-color: #0a92500d;
    border: 1px dotted #0a92505e;
 }
 .pin-button .circle {
    width: 21px;
    height: 21px;
    background-color: #e1e1e15c;
    border-radius: 50%;
    margin-top: 0px;
 }
 .pin-button.selected .circle {
    background-color: #ffffff69;
 }
 .pin-button .titleinput__spin {
    font-size: 1.13rem;
    color: #4e4e4e;
    font-weight: 400;
 }
 .pin-button.selected .titleinput__spin {
    color: #085d34;
 }
 .pin-button.disabled {
    pointer-events: none;
    opacity: 0.6;
 }
 .pin-action {
    background-color: #ededed63 !important;
    border: 1px solid #ffffff66 !important;
    cursor: default !important;
 }
 .pin-action.active {
    
 }

 /* link button */
 


.sidebar__body-scrollable::-webkit-scrollbar{
    display: none;
}
.sidebar__body-scrollable {
    scrollbar-width: none;
}
.sidebar__body-scrollable {
    -ms-overflow-style: none;
}

.library__body-scrollable::-webkit-scrollbar{
    display: none;
}
.library__body-scrollable {
    scrollbar-width: none;
}
.library__body-scrollable {
    -ms-overflow-style: none;
}

.s-item {
    position: relative;
    width: 100%; 
    height: 68px;
    border-radius: 6px;
    width: calc(100% + 25px);
    margin-left: -13px;
    font-size: 1.14rem;
    padding-left: 27px;
    padding-top: 4px;
    padding-bottom: 45px;
    cursor: pointer;
    letter-spacing: 0.01rem;
    font-weight: 400;
    color: #5e5e5e;;
}
.s-item .title {
    color: #333; 
    display: block;
    font-weight: 600;
    padding-bottom: 4px;
}
.s-item.selected .title {
    color: #0a9250;
}
.s-item.selected .text {
    color: #242424;
}
.s-item .type {
    padding: 1px;
    padding-right: 1px;
    padding-left: 1px;
    border-radius: 4px;
    font-size: 0.9rem;
    border: 1px solid #807f7f;
    padding-left: 2px;
    padding-right: 2px;
    color: #333;
    opacity: 0.28;
}
.s-item.selected .type {
    /*border: 1px solid #0a9250;
    color: #0a9250;*/
}
.s-item__blank{
    width: 100%;
    height: 10px;
    border-top: 0px dotted #eaeaea;
}
.note-class {
    padding-top: 0px;
    margin-bottom: 0px;
    margin-right: 0px;
    padding-bottom: 0px;
    /*box-shadow: 0px 1px 4px 0px rgb(159 159 159 / 6%);
    -webkit-box-shadow: 0px 1px 4px 0px rgb(159 159 159 / 6%);
    -moz-box-shadow: 0px 1px 4px 0px rgba(159, 159, 159, 0.06);*/
}
.note-class:last-child {
    padding-top: 0px;
    margin-bottom: 0px;
    margin-right: 0px;
    padding-bottom: 0px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    /*box-shadow: 0px 1px 4px 0px rgb(159 159 159 / 6%);
    -webkit-box-shadow: 0px 1px 4px 0px rgb(159 159 159 / 6%);
    -moz-box-shadow: 0px 1px 4px 0px rgba(159, 159, 159, 0.06);*/
}
.note-class:hover {
    background-color: #f3f3f3;
}

.note-class .music-action-hover{
    display: none;
}
.note-class:hover .music-action-hover{
    display: block;
}
.note-class:hover .index_num_hover{
    opacity: 0;
}
.note-class:hover .cover-play{
    opacity: 0.7;
}
.note-class-selected .music-action-hover{
    display: block;
}
.note-class-selected .index_num_hover {
    opacity: 0;
}


.pl-actions-fun .music-action-hover{
    display: none;
}
.pl-actions-fun:hover .music-action-hover{
    display: block;
}
.pl-actions-fun:hover .index_num_hover{
    opacity: 0;
}
.pl-actions-fun:hover .cover-play{
    opacity: 0.7;
}
.pl-actions-fun.selected .music-action-hover{
    display: block;
}
.pl-actions-fun.selected .index_num_hover {
    opacity: 0;
}



.track-lockup__play-button-wrapper .music-action-hover{
    display: none;
}
.track-lockup__play-button-wrapper:hover .music-action-hover{
    display: block;
}
.track-lockup__play-button-wrapper:hover .cover-play{
    opacity: 0.7;
}
.song-class-selected .music-action-hover{
    display: block;
}


.note-class-selected {
   /* -webkit-box-shadow:inset 0px 0px 0px 2px #0a925036;
    -moz-box-shadow:inset 0px 0px 0px 2px #0a925036;
    box-shadow:inset 0px 0px 0px 2px #0a925036;*/
    background-color: #d60017 !important; /*d60017*/
    color: #ffffff;
    border-bottom: 1px solid transparent !important;
}
.note-class-selected:hover {
    /* -webkit-box-shadow:inset 0px 0px 0px 2px #0a925036;
     -moz-box-shadow:inset 0px 0px 0px 2px #0a925036;
     box-shadow:inset 0px 0px 0px 2px #0a925036;*/
     background-color: #d60017;
     color: #ffffff;
     border-bottom: 1px solid transparent !important;
 }
 .note-class-selected .cover-play {
    opacity: 0.6;
 }
 
.switch-color-pinned {
    background-color: #5fb7f654 !important;
}

.library__scroll {
    height: 100%
}

.library__header {
    padding: 17px 32px 24px;
    position: sticky;
    z-index: 200
}

.library__body .sortable-target {
    background-color: #abc0c8
}

.library .titleinput__icon--more .tooltip__trigger {
    width: 26px;
    height: 26px;
    border-radius: 5px;
    text-align: center;
    -webkit-transition: all .2s;
    transition: all .2s
}

.library .titleinput__icon--more .tooltip__trigger:hover {
    background-color: #e6edf0
}

.library .titleinput__icon--more .tooltip__trigger:active {
    background-color: #cddde5
}

.library-title {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: 16px;
    color: #86909a
}

.library-title,
.library-title__close {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.library-title__close {
    cursor: pointer;
    width: 26px;
    height: 26px;
    border-radius: 5px;
    text-align: center;
    -webkit-transition: all .2s;
    transition: all .2s;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.library-title__close:hover {
    background-color: #e6edf0
}

.library-title__close:active {
    background-color: #cddde5
}

.library-title__close .icon {
    height: auto;
    width: auto;
    line-height: 2px
}

.library-name {
    margin: 10px 0 15px
}

.library-section {
    border-bottom: 1px solid rgba(0, 0, 0, .04);
    -webkit-transition: border 50ms;
    transition: border 50ms;
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

.library-section--open,
.library-section--search {
    border-bottom-color: transparent;
    -webkit-transition-delay: 0ms;
    transition-delay: 0ms
}

.library-section--dragging .drag-source {
    display: none !important
}

.library-section--dragoutside .drag-source {
    display: block !important;
    opacity: .5 !important
}

.library-section--dragoutside .library-section__item {
    opacity: 1;
    -webkit-transform: none !important;
    transform: none !important;
    -webkit-transition: none !important;
    transition: none !important
}

.library-section--dragoutside .drag-ghost {
    display: none !important
}

.library-section__header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 15px 17px;
    -webkit-transition: all .2s;
    transition: all .2s;
    cursor: pointer;
    position: relative
}

.library-section__header:hover {
    background-color: #e6edf0
}

.library-section__header:active {
    background-color: #cddde5
}

.sortable-clone .library-section__header {
    background-color: transparent
}

.library-section__header.sortable-target-active {
    background-color: #abc0c8
}

.library-section__header .titleinput {
    width: 100%;
    margin-right: 12px
}

.library-section__header .dropdown-counter {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0
}

.library-section__header:hover .dropdown-counter {
    background-color: #cddde5
}

.library-section__header:active .dropdown-counter {
    background-color: #b6cbd3
}

.library-section__header .titleinput__icon .tooltip__trigger {
    -webkit-transition: all .2s;
    transition: all .2s
}

.library-section__header .titleinput__icon .tooltip:not(.tooltip--visible) .tooltip__trigger {
    opacity: 0
}

.library-section--editting .library-section__header {
    background-color: #e6edf0
}

.library-section--editting .library-section__header .dropdown-counter {
    background-color: #cddde5
}

.library-section--open .library-section__header {
    background-color: transparent
}

.library-section--open .library-section__header:hover .dropdown-counter {
    background-color: #e6edf0
}

.library-section:hover .library-section__header .titleinput__icon .tooltip:not(.tooltip--visible) .tooltip__trigger {
    opacity: 1
}

.library-section--search .library-section__header:hover {
    background: transparent;
    cursor: default
}

.library-section__drag {
    background-color: transparent;
    left: 4px;
    top: 50%;
    position: absolute;
    margin-top: -12px;
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s
}

.library-section:hover .library-section__drag {
    opacity: 1
}

.library-section__saerch-title {
    font-size: 18px;
    font-weight: 600;
    display: block
}

.library-section__body {
    padding: 0 32px;
    padding-left: 4px
}

.library-section .v-leave-active {
    display: none !important
}

.library-section .methods__question,
.library-section .methods__question-edit {
    font-size: 1.4rem;
    font-weight: 400
}

.library-section>.content-transition {
    -webkit-transition: all .2s;
    transition: all .2s
}

.library-section>.content-transition--visible {
    margin-top: -10px
}

.library-section-add {
    margin: 24px 32px
}

.library-section-add .method-section-add {
    background-color: transparent;
    color: #fff;
}

.library-section-add .method-section-add:hover {
    background-color: #184ab7;
    color: #fff;
}
.library-section-add .method-section-add:active {
    background-color: #184ab7;;
    color: #fff;
}

.library-item {
    font-size: 14px;
    position: relative;
    padding: 8px 0;
    padding-left: 28px;
    -webkit-transition: background-color .2s, -webkit-box-shadow .2s;
    transition: background-color .2s, -webkit-box-shadow .2s;
    transition: background-color .2s, box-shadow .2s;
    transition: background-color .2s, box-shadow .2s, -webkit-box-shadow .2s;
    border-radius: 3px;
    cursor: move
}

.library-item:hover {
    background-color: #fff;
    -webkit-box-shadow: 0 2px 10px 0 rgba(54, 90, 102, .08);
    box-shadow: 0 2px 10px 0 rgba(54, 90, 102, .08)
}

.library-item__drag {
    position: absolute;
    left: 0;
    background-color: transparent;
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s
}

.library-item:hover .library-item__drag {
    opacity: 1
}

.sidebar-page {
    -webkit-transition: margin .4s;
    transition: margin .4s
}

.is-library-open .sidebar-page {
    margin-top: 0;
    margin-right: 535px;
    margin-left: 0 !important
}

@media screen and (max-width:991px) {
    .is-library-open .sidebar-page {
        margin-right: 420px
    }
}

@media screen and (max-width:767px) {
    .is-library-open .sidebar-page {
        margin-top: 0;
        margin-right: 0;
        margin-left: 0
    }
}

.sidebar {
    -webkit-transition: -webkit-transform .4s;
    transition: -webkit-transform .4s;
    transition: transform .4s;
    transition: transform .4s, -webkit-transform .4s
}

.is-library-open .header {
    background-color: #fff
}

.library-open {
    -webkit-transform: translateX(0px);
    transform: translateX(0px)
}
.is-library-open .sidebar {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%)
}

.library-new-item {
    padding: 6px 0;
    margin: 4px 0;
    padding-left: 28px
}

.library-question {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 14px
}

.library-question__picker {
    display: inline-block;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    margin-right: 14px
}

.library-question .titleinput,
.library-question__input {
    position: relative;
    font-size: inherit;
    color: #252729;
    border: 0;
    outline: 0;
    background: transparent;
    width: 100%;
    padding: 0;
    resize: none;
    display: block
}

.library-question .titleinput::-webkit-input-placeholder,
.library-question__input::-webkit-input-placeholder {
    color: rgba(37, 39, 41, .5)
}

.library-question .titleinput:-moz-placeholder,
.library-question .titleinput::-moz-placeholder,
.library-question__input:-moz-placeholder,
.library-question__input::-moz-placeholder {
    color: rgba(37, 39, 41, .5)
}

.library-question .titleinput:-ms-input-placeholder,
.library-question__input:-ms-input-placeholder {
    color: rgba(37, 39, 41, .5)
}

.library-question .titleinput--new,
.library-question__input--new {
    padding-right: 60px
}

.library-question .titleinput__body {
    font-size: inherit
}

.library-empty {
    text-align: center;
    margin-top: 190px
}

.library-empty__title {
    font-size: 24px;
    font-weight: 500;
    color: #000;
    margin-bottom: 28px
}

.library-empty .btn,
.library-empty .method-section-add {
    width: 100%;
    max-width: 270px
}

.library-no-results {
    text-align: center;
    margin-top: 100px;
    color: #646464;
    font-size: 14px
}

.library-no-results .icon {
    font-size: 150px;
    display: block;
    margin: 0 auto;
    margin-bottom: 20px
}

.tags-container {
    max-width: 678px;
    margin: 0 auto
}

.tags-header-lay {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.tags-header-lay,
.tags-header-lay__body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tags-header-lay__body {
    width: 100%
}

.tags-header-lay__input {
    border: 0;
    padding: 0;
    font-size: inherit;
    border-bottom: 1px dashed #fff;
    width: 100%;
    font-size: 34px
}

.tags-header-lay__input:hover {
    border-bottom: 1px dashed #8e8e8e
}

.tags-header-lay__input:focus {
    outline: none;
    border-bottom: 1px dashed #1d1d1d
}

.tags-header-lay__footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.tags-header-lay__footer .share__icon {
    margin-top: 0
}

.tags-header {
    font-family: inherit;
    font-size: 3.4rem;
    font-weight: 500;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%
}

@media screen and (max-width:991px) {
    .tags-header {
        font-size: 2rem
    }
}

.tags-header__editable {
    border: 0;
    padding: 0;
    font-size: inherit;
    border-bottom: 1px dashed #fff;
    width: 100%
}

.tags-header__editable:hover {
    border-bottom: 1px dashed #8e8e8e
}

.tags-header__editable:focus {
    outline: none;
    border-bottom: 1px dashed #1d1d1d
}

.tags-list {
    list-style: none;
    padding: 0;
    margin: 0
}

.tags-list__item {
    border-bottom: 1px solid hsla(0, 0%, 94%, .5);
    list-style: none
}

.tag-colour {
    width: 1em;
    height: 1em;
    display: inline-block;
    border-radius: 50%;
    background: #f6f8f9;
    color: #3b3b3b;
    text-align: center
}

.tag-colour .icon {
    font-size: .5em;
    margin: .5em;
    vertical-align: top
}

.tag-listed {
    width: 100%;
    font-size: 1.6rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 3px;
    cursor: pointer;
    padding: 0 10px 0 12px;
    min-height: 50px;
    -webkit-transition: all .2s;
    transition: all .2s
}

.tag-listed,
.tag-listed:focus,
.tag-listed:hover {
    color: #171717;
    text-decoration: none
}

.tag-listed:hover {
    background-color: #fff;
    -webkit-box-shadow: 0 7px 27px rgba(0, 0, 0, .08);
    box-shadow: 0 7px 27px rgba(0, 0, 0, .08)
}

.tag-listed__name {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600
}

.tag-listed__body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 40%;
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.tag-listed__foot {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding-left: 20px
}

.tag-listed__colour {
    margin-right: 15px;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.tag-listed__bar {
    width: 60%;
    padding-left: 20px;
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.tag-listed__count {
    font-size: 14px;
    color: #6f7380;
    margin-left: auto
}

.tag-listed--new {
    font-size: 18px
}

.tag-listed--aside {
    font-size: 1.4rem;
    font-weight: 400;
    border-bottom: 0;
    min-height: 36px
}

.tag-listed--aside .tag-listed__body {
    max-width: calc(100% - 30px)
}

.tag-listed--aside .tag-count {
    font-size: 1rem;
    background-color: transparent;
    width: auto;
    height: auto
}

.tag-listed--active {
    background-color: #f2f2f2;
    font-weight: 600
}

.tag-count-bar span {
    display: block;
    height: 31px;
    border-radius: 8px;
    color: #fff;
    line-height: 31px;
    padding: 0 10px;
    font-size: 14px;
    font-weight: 700;
    -webkit-transition: all .2s;
    transition: all .2s
}

@-webkit-keyframes tag-layout-fade-in {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
        opacity: 0
    }

    to {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1
    }
}

@keyframes tag-layout-fade-in {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
        opacity: 0
    }

    to {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1
    }
}

.tag-layout:before {
    content: "";
    display: table;
    width: 100%
}

.tag-layout__aside {
    width: 248px;
    float: left;
    padding-top: 60px;
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh
}

@media screen and (max-width:991px) {
    .tag-layout__aside {
        display: none
    }
}

.tag-layout__aside .container {
    padding-top: 42px !important
}

.tag-layout__aside-scrollable {
    height: 100%
}

.tag-layout__aside-content {
    -webkit-animation: tag-layout-fade-in .5s;
    animation: tag-layout-fade-in .5s
}

.tag-layout__content {
    margin-left: 248px
}

@media screen and (max-width:991px) {
    .tag-layout__content {
        margin-left: 0
    }
}

.tag-layout__container {
    width: 678px
}

.tag-filters {
    margin-bottom: 29px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.tag-filters>.filter {
    margin-right: 6px;
    margin-top: 5px;
}

.tag-filters>.filter:last-child {
    margin-right: 16px
}

.tag-header-picker {
    margin-right: 20px;
    margin-left: -52px
}

@media screen and (max-width:991px) {
    .tag-header-picker {
        margin-left: 0;
        margin-right: 16px
    }
}

.tag-sec-heading {
    font-size: 1.8rem;
    margin: 0;
    font-weight: 600
}

.tag-filtered-heading {
    margin-top: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 10px
}

.tag-items-list {
    list-style: none;
    padding: 0;
    margin: 0
}

.tag-items-list>li {
    border-bottom: 1px solid rgba(88, 88, 88, .06)
}

.tag-items-list>li:last-child {
    border-bottom: 0
}

.tag-item {
    font-size: 1.6rem;
    color: #3b3b3b;
    padding: 20px 0;
    padding-right: 60px;
    cursor: pointer;
    position: relative;
    -webkit-transition: all .2s;
    transition: all .2s
}

.tag-item__breadcrumbs {
    text-transform: uppercase;
    list-style: none;
    padding: 0;
    margin: 0;
    color: #aaaab5;
    font-size: 1rem;
    margin-bottom: 4px
}

.tag-item__breadcrumbs>li {
    display: inline-block
}

.tag-item__breadcrumbs>li:after {
    content: "/";
    margin: 0 14px
}

.tag-item__breadcrumbs>li:last-child:after {
    display: none
}

.tag-item__content {
    margin: 0
}

.tag-item .tags-avatars {
    right: 0
}

.tag-aside-heading {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: 1.2rem;
    text-transform: uppercase;
    color: #adadad;
    letter-spacing: .9px;
    margin-bottom: 7px
}

.tag-add-button {
    cursor: pointer;
    width: 22px;
    height: 22px;
    border-radius: 3px;
    -webkit-transition: all .2s;
    transition: all .2s
}

.tag-add-button:hover {
    background-color: #e8e8e8
}

.tags-header-share {
    padding-right: 16px
}

.tag-empty {
    text-align: center;
    font-size: 1.4rem;
    color: #646464;
    margin: 85px auto;
    max-width: 400px
}

.tag-empty__body {
    margin-top: 20px
}

.tag-empty__heading {
    display: block;
    font-size: 1.8rem;
    color: #000;
    font-weight: 400;
    margin-top: 35px;
    margin-bottom: 10px
}

.tag-empty__btn {
    margin-top: 17px
}

.header-dropdown-icon {
    font-size: 14px;
    color: #aaaab5;
    cursor: pointer;
    line-height: 1;
    margin-left: 10px;
    padding: 12px
}

.header-dropdown-icon .icon {
    vertical-align: top
}

.tag-modal-wrapper {
    max-width: 1150px;
    min-height: 670px
}

.tag-title {
    margin: 0
}

.tag-description {
    margin-bottom: 24px
}

.tag-badge {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 3px 12px;
    color: #646464
}

.tag-badge .tag-colour {
    margin-right: 10px;
    font-size: 8px
}

.tags-badges-list {
    margin-left: -12px;
    margin-right: -12px
}

.highlights-container {
    max-width: 1100px;
    margin: 0 auto
}

.highlights-list {
    margin-bottom: 300px;
    margin-top: 15px
}

.highlights-list>ul {
    list-style: none;
    padding: 0;
    margin: 0
}

.highlights-list>ul>li {
    border-bottom: 1px solid #f2f2f2
}

.highlights-list>ul>li:last-child {
    border: 0
}

.highlights-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    margin-left: -25px;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    padding: 16px 0
}

.highlights-item--selectable {
    cursor: pointer;
    -webkit-transition: all .2s;
    transition: all .2s
}

.highlights-item--selectable:hover {
    background-color: #f8f9fa
}

.highlights-item--selectable:active {
    background-color: #f0f2f5
}

.highlights-item--selected {
    background-color: #f8f9fa
}

.highlights-item--filters {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.highlights-item--open .highlight-tag-edit,
.highlights-item:hover .highlight-tag-edit {
    opacity: 1
}

.highlights-item__col {
    width: 35%;
    padding-left: 25px;
    position: relative;
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 1;
    flex-shrink: 1;
    min-height: 36px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.highlights-item__col--check {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 50px;
    margin-right: 20px
}

.highlights-item__col--tags {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    width: 24%
}

.highlights-item__col--name {
    font-size: 16px;
    width: 60%
}

.highlights-item__col--th {
    font-size: 14px;
    color: #565966
}

.highlights-item__col--method {
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 24%
}

.highlights-item__col-body {
    width: 100%
}

.highlights-item__method {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.highlights-item__method .method-icon {
    margin-right: 10px;
    font-size: 24px
}

.highlights-search {
    max-width: 100%;
    width: 336px;
    position: relative
}

.highlights-search input {
    width: 100%;
    border: 0;
    background-color: #f0f2f5;
    height: 40px;
    position: relative;
    padding-right: 10px;
    padding-left: 40px;
    border-radius: 4px;
    font-size: 16px
}

.highlights-search input:focus {
    outline: none
}

.highlights-search .icon {
    font-size: 24px;
    position: absolute;
    left: 8px;
    top: 8px
}

.highlight-tag-edit {
    position: absolute;
    right: 0;
    top: 0;
    opacity: 0;
    -webkit-box-shadow: 0 4px 28px rgba(0, 0, 0, .1);
    box-shadow: 0 4px 28px rgba(0, 0, 0, .1)
}

.highlight-tag-edit,
.highlight-tag-edit__btn {
    border-radius: 4px;
    -webkit-transition: all .2s;
    transition: all .2s
}

.highlight-tag-edit__btn {
    width: 36px;
    height: 36px;
    font-size: 18px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #fff;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.highlight-tag-edit__btn:hover {
    background-color: #f8f9fa
}

.highlight-tag-edit__btn:active {
    background-color: #f0f2f5
}

.highlights-modal-grid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.highlights-modal-grid__header {
    padding: 0 80px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin: 14px 0
}

.highlights-modal-grid__body {
    padding: 0 80px
}

.highlights-modal-grid__body .highlights-list>ul {
    height: calc(100vh - 373px);
    min-height: 438px;
    overflow: auto
}

.highlights-modal-grid__foot {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-box-shadow: 0 -15px 18px hsla(0, 0%, 64%, .2);
    box-shadow: 0 -15px 18px hsla(0, 0%, 64%, .2);
    position: relative
}

.highlights-modal-grid .highlights-list {
    margin-bottom: 0
}

.tag-selector {
    width: 260px;
    color: #646464;
    font-size: 14px
}

.tag-selector__body {
    margin: 11px
}

.tag-selector__title {
    font-size: 16px;
    color: #414141;
    text-align: center;
    margin: 13px 0
}

.tag-selector__search {
    position: relative;
    border-radius: 4px;
    background-color: #f8f9fa;
    margin: 0 -6px 4px
}

.tag-selector__icon,
.tag-selector__search {
    -webkit-transition: all .2s;
    transition: all .2s
}

.tag-selector__icon {
    position: absolute;
    left: 10px;
    width: 16px;
    height: 16px;
    top: 50%;
    margin-top: -8px;
    pointer-events: none;
    opacity: 0
}

.tag-selector--search-focus .tag-selector__icon,
.tag-selector--searching .tag-selector__icon {
    opacity: 1
}

.tag-selector__placeholder {
    position: absolute;
    left: 50%;
    top: 0;
    line-height: 40px;
    color: #646464;
    opacity: .5;
    white-space: nowrap;
    pointer-events: none;
    -webkit-transition: all .2s;
    transition: all .2s
}

.tag-selector__placeholder:after {
    -webkit-transition: all .2s;
    transition: all .2s;
    content: attr(data-placeholder);
    position: relative;
    left: -50%
}

.tag-selector--search-focus .tag-selector__placeholder {
    left: 40px
}

.tag-selector--search-focus .tag-selector__placeholder:after {
    left: 0
}

.tag-selector--searching .tag-selector__placeholder {
    opacity: 0
}

.tag-selector__search-input {
    width: 100%;
    border: 0;
    background-color: transparent;
    height: 40px;
    position: relative;
    padding-right: 10px;
    padding-left: 40px
}

.tag-selector__search-input:focus {
    outline: none
}

.tag-selector__scroll {
    margin: 0 -11px;
    padding: 0 5px
}

.tag-selector__list {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 14px;
    max-height: 420px
}

.tag-selector__item {
    padding: 6px;
    border-radius: 3px;
    -webkit-transition: all .2s;
    transition: all .2s;
    min-height: 36px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    position: relative;
    width: 100%
}

.tag-selector__item:hover {
    background-color: #f8f9fa
}

.tag-selector__item:active {
    background-color: #f0f2f5
}

.tag-selector__item--more {
    cursor: default;
    opacity: .7
}

.tag-selector__item--more:hover {
    background-color: transparent
}

.tag-selector__item--selected {
    color: #252729;
    font-weight: 600
}

.tag-selector__item--selected .tag-selector__item-ico {
    opacity: 1
}

.tag-selector__item--active {
    background-color: #f8f9fa
}

.tag-selector__item--tags .tag-selector__item-body {
    padding-left: 24px
}

.tag-selector__item--tags .tag-selector__ico {
    left: 8px;
    font-size: 8px;
    margin: -4px 0 0 -4px
}

.tag-selector__item--action {
    color: #252729;
    font-weight: 600
}

.tag-selector__item--action .tag-selector__item-ico {
    opacity: 1
}

.tag-selector__item--action .tag-selector__ico {
    width: 14px;
    height: 10px;
    left: 8px;
    margin: -5px 0 0 -7px
}

.tag-selector__ico {
    position: absolute;
    left: 12px;
    top: 50%;
    font-size: 24px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    margin: -12px 0 0 -12px
}

.tag-selector__item-body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-right: 38px;
    padding-left: 34px;
    width: 100%;
    position: relative
}

.tag-selector__item-body--full {
    padding-right: 0
}

.tag-selector__item-name {
    width: 100%;
    max-width: calc(100% - 34px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.tag-selector__item-ico {
    position: absolute;
    width: 14px;
    height: 10px;
    right: 8px;
    top: 50%;
    margin-top: -5px;
    opacity: 0;
    -webkit-transition: all .2s;
    transition: all .2s
}

.tag-selector__new {
    margin: 0 -6px;
    border-radius: 3px;
    margin-top: 4px;
    color: #252729;
    font-weight: 600;
    padding: 6px;
    padding-left: 40px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    position: relative
}

.tag-selector__new--focus {
    background-color: #f8f9fa
}

.tag-selector__new .icon {
    position: absolute;
    font-size: 14px;
    margin-top: -7px;
    left: 11px;
    top: 50%
}

.tag-selector .vb-dragger {
    right: 2px
}

.tag-selector .vb-dragger-styler {
    right: -1px;
    width: 4px;
    opacity: .3;
    border-radius: 20px;
    background-color: #555;
    height: 100%
}

.search-highlight {
    background-color: #f0f2f5;
    border-radius: 3px
}

.responders-dropdown-list .tooltip__tip-position {
    -webkit-transform: none !important;
    transform: none !important;
    left: -8px !important;
    top: -8px !important;
    right: -8px !important
}

.responders-dropdown-list .tag-selector__search {
    position: relative;
    z-index: 1000;
    margin: 0;
    background-color: #f0f2f5
}

.responders-dropdown-list .tooltip__tip {
    padding-top: 44px
}

.responders-dropdown-list .tag-selector {
    width: auto;
    padding: 0 8px
}

.responders-dropdown-list .tag-selector__scroll {
    padding: 0
}

.help-banner-wrap {
    padding-bottom: 40px
}

.help-banner {
    border-radius: 16px;
    color: #fff;
    background-color: #34134e;
    padding: 30px 46px;
    font-size: 16px;
    position: relative;
    min-height: 189px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.help-banner__body {
    max-width: 360px
}

.help-banner__title {
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 6px
}

.help-banner__close {
    position: absolute;
    right: 24px;
    top: 18px;
    cursor: pointer
}

.help-banner__close:hover {
    opacity: .5
}

.help-banner__img {
    position: absolute;
    bottom: 0;
    right: 70px
}

.help-banner--projects {
    background-color: #34134e
}

.help-banner--tags {
    background-color: #131351
}

.help-banner--highlights {
    background-color: #05495f
}

.help-banner--insights {
    background-color: #400d4c
}

.help-banner .btn,
.help-banner .method-section-add {
    margin-top: 13px
}

@-webkit-keyframes sortable-clone-anim {
    0% {
        background-color: hsla(0, 0%, 100%, 0);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-box-shadow: 0 7px 27px 0 transparent;
        box-shadow: 0 7px 27px 0 transparent
    }

    to {
        background-color: #fff;
        -webkit-transform: rotate(-1deg);
        transform: rotate(-1deg);
        -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
        box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08)
    }
}

@keyframes sortable-clone-anim {
    0% {
        background-color: hsla(0, 0%, 100%, 0);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-box-shadow: 0 7px 27px 0 transparent;
        box-shadow: 0 7px 27px 0 transparent
    }

    to {
        background-color: #fff;
        -webkit-transform: rotate(-1deg);
        transform: rotate(-1deg);
        -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
        box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08)
    }
}

@-webkit-keyframes sortable-clone-anim-end {
    0% {
        background-color: #fff;
        -webkit-transform: rotate(-1deg);
        transform: rotate(-1deg);
        -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
        box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08)
    }

    to {
        background-color: #fff;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-box-shadow: 0 7px 27px 0 transparent;
        box-shadow: 0 7px 27px 0 transparent
    }
}

@keyframes sortable-clone-anim-end {
    0% {
        background-color: #fff;
        -webkit-transform: rotate(-1deg);
        transform: rotate(-1deg);
        -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
        box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08)
    }

    to {
        background-color: #fff;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-box-shadow: 0 7px 27px 0 transparent;
        box-shadow: 0 7px 27px 0 transparent
    }
}

.sortable-wrap {
    position: relative
}

.sortable-wrap:after,
.sortable-wrap:before {
    content: "";
    display: table;
    width: 100%
}

.sortable-wrap--animated {
    -webkit-transition: padding-bottom .3s;
    transition: padding-bottom .3s
}

.sortable-item--animated {
    -webkit-transition: margin .3s, height .3s, opacity .3s;
    transition: margin .3s, height .3s, opacity .3s
}

.sortable-clone {
    background-color: #fff;
    z-index: 99999;
    position: fixed;
    left: 0;
    top: 0;
    -webkit-box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 7px 27px 0 rgba(0, 0, 0, .08);
    border-radius: 10px;
    overflow: hidden;
    -webkit-animation: sortable-clone-anim .3s;
    animation: sortable-clone-anim .3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-transition: height .3s;
    transition: height .3s
}

.sortable-clone--end {
    -webkit-animation: sortable-clone-anim-end .3s;
    animation: sortable-clone-anim-end .3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-transition: left .3s, top .3s, height .3s, width .3s;
    transition: left .3s, top .3s, height .3s, width .3s
}

.sortable-selected {
    background-color: #b6d8fc
}

.sortable-cloned {
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s
}

@-webkit-keyframes sortable-target-anim {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes sortable-target-anim {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.sortable-target {
    background-color: #dce7ec;
    border-radius: 10px;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    -webkit-transition: height .3s, -webkit-transform .3s;
    transition: height .3s, -webkit-transform .3s;
    transition: transform .3s, height .3s;
    transition: transform .3s, height .3s, -webkit-transform .3s;
    -webkit-animation: sortable-target-anim .3s;
    animation: sortable-target-anim .3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    z-index: -1
}

.sortable-counter {
    position: absolute;
    right: 20px;
    bottom: 12px;
    font-size: 16px;
    font-weight: 600;
    padding: 8px 19px;
    border-radius: 100px;
    background-color: #7497a3;
    color: #fff
}

.sortable-dragging {
    opacity: .5
}

@media print {
    * {
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact
    }

    @page {
        size: 288mm 162mm;
        margin: 0
    }

    .sidebar-page {
        margin: 0 !important
    }

    #fc_frame,
    .builder-title-wrap,
    .drop-last,
    .header-wrap,
    .hide-print,
    .notifications,
    .report-block__tooltip,
    .titleinput__icons {
        display: none !important
    }

    .container,
    .lg-wrapper {
        width: auto;
        max-width: none;
        margin: 0;
        padding: 0
    }

    .builder-content {
        margin: 0
    }

    .report-block {
        width: 100%;
        -webkit-box-shadow: none;
        box-shadow: none;
        border: 0;
        margin: 0;
        padding: 15mm 0;
        min-height: 100vh;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-column-break-inside: avoid;
        -moz-column-break-inside: avoid;
        break-inside: avoid
    }

    .report-block>.content-transition {
        width: 100%
    }

    .report-block__body {
        margin: 0 15mm
    }

    .builder-section__content,
    .section-wrap--not-paragraph+.section-wrap--not-paragraph {
        margin: 0 !important
    }

    .input--light,
    .titleinput__input {
        border-bottom: 0
    }

    .report-insight {
        min-height: calc(100vh - 30mm)
    }

    .counted-column-list>li {
        page-break-inside: avoid;
        -webkit-column-break-inside: avoid;
        -moz-column-break-inside: avoid;
        break-inside: avoid;
        overflow: auto
    }
}

.crono-paragraph-bold {
    font-weight: 700;
}
.crono-paragraph-bold-format-selected {
    background-color: #f3f4f5;
}

/* animation pulse */
.animation-pulse{
	animation:pulse 2s infinite}
	@keyframes pulse{0%{transform:scale(1);box-shadow:0 0 0 0 #0071e366}50%{transform:scale(1);box-shadow:0 0 0 8px rgba(42,62,62,0)}to{transform:scale(1)}}
	
	.after\:pointer-events-none:after{content:var(--tw-content);pointer-events:none}.after\:absolute:after{content:var(--tw-content);position:absolute}
	.after\:inset-0:after{content:var(--tw-content);top:0;right:0;bottom:0;left:0}.after\:box-border:after{content:var(--tw-content);box-sizing:border-box}
	.after\:rounded-md:after{content:var(--tw-content);border-radius:.175rem}.after\:shadow-custom:after{content:var(--tw-content);}

    .pin-pulse{
        animation:pulse 3s infinite}
        @keyframes pulse{0%{transform:scale(1);box-shadow:0 0 0 0 #0071e366}50%{transform:scale(1);box-shadow:0 0 0 12px rgba(42,62,62,0)}to{transform:scale(1)}}
        
        .after\:pointer-events-none:after{content:var(--tw-content);pointer-events:none}.after\:absolute:after{content:var(--tw-content);position:absolute}
        .after\:inset-0:after{content:var(--tw-content);top:0;right:0;bottom:0;left:0}.after\:box-border:after{content:var(--tw-content);box-sizing:border-box}
        .after\:rounded-md:after{content:var(--tw-content);border-radius:.175rem}.after\:shadow-custom:after{content:var(--tw-content);}

.bg-green-600 {
    --tw-bg-opacity: 1;
    background-color: rgb(22 163 74/var(--tw-bg-opacity));
}
.rounded-full {
    border-radius: 9999px;
}
.justify-center {
    justify-content: center;
}
.items-center {
    align-items: center;
}
.w-1\.5 {
    width: 0rem;
}
.h-1\.5 {
    height: 1.54rem;
}
.flex {
    display: flex;
}

.label-crono {
    width: 100%;
    font-size: 1.1rem;
}
.input-crono {
    width: 100%;
    height: 3.5rem;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding-left: 12px;
    padding-right: 12px;
}
.form-crono {
    height: auto;
    width: 100%;
    padding: 30px;
}
.crono-add-payment {
    background-color: #fff0f0 !important; 
}
.crono-add-payment:hover {
    background-color: #fff0f0 !important; 
    border: 1px solid #ffe2e5 !important;
}
.crono-add-payment:active {
    background-color: #fff0f0 !important; 
    border: 1px solid #ffe2e5 !important;
    opacity: 0.8 !important;
}
.crono-disabled-button {
    opacity: 0.2 !important;
}
.crono-item-option {
    text-align: left; 
    height: auto; 
    min-height: 40px; 
    line-height: 3.5; 
    padding-left: 0px; 
    padding-right: 0px;
    color: #121212 !important;
    letter-spacing: 0.03rem;
    cursor: pointer;
}
.crono-payment-menu-open {
    background-color: #00000026 !important;
}
.libre-barcode-39-regular {
    font-family: "Libre Barcode 39", system-ui;
    font-weight: 400;
    font-style: normal;
}

.co_box_item:first-child {
    border-top: 1px solid #d4d4d4;
    border-left: 1px solid #d4d4d4;
    border-right: 1px solid #d4d4d4;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
}
.co_box_item:last-child {
    border-bottom: 1px solid #d4d4d4;
    border-left: 1px solid #d4d4d4;
    border-right: 1px solid #d4d4d4;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
}


/* player media */
.component-audio-master {
    margin-top: 10px;
}
.component-audio-master .wrapper {
    width: 100% !important;
    border-radius: 9px !important;
    height: auto !important;
    display: block !important;
    overflow: auto !important;
}
.component-audio-master .wrapper .cover img {
    max-width: 100% !important;
    border-radius: 9px !important;
    max-height: 100% !important;
    margin-left: 0px !important;
    width: 100% !important;
}

.component-audio-master .wrapper .container {
    position: absolute !important;
    bottom: 0px !important;
    background-color: #ffffffb8 !important;
    width: calc(100% - 0px) !important;
    height: 76px !important;
    border-bottom-left-radius: 6px !important;
    border-bottom-right-radius: 6px !important;
}
.component-audio-master .wrapper .container .controls {
    position: absolute !important;
    top: -2px !important;
    border-radius: 40px;
    width: calc(100% - 10px) !important;
    justify-content: flex-end !important;
    height: 32px;
    margin: 0 auto;
    padding-right: 25px;
}
.component-audio-master .wrapper .container .controls svg {
    width: 12px !important;
    height: 12px !important;
    margin: 10px 9px !important;
}

.component-audio-master .wrapper .container .details {
    margin-top: 52px !important;
}
.component-audio-master .wrapper .container .details .time-line {
    display: none !important;
}
.component-audio-master .wrapper .container .details .slidecontainer {
    margin-top: 0px !important;
}
.component-audio-master .wrapper .container .details .title {
    position: absolute !important;
    margin-top: -46px !important;
    margin-left: 11px !important;
    font-size: 1.1rem !important;
    z-index: 1;
}
.component-audio-master .wrapper .container .controls .volume-container {
    position: absolute !important;
    margin-top: 0px !important;
    margin-right: 20px;
}
.component-audio-master .wrapper .container .controls .volume-container .volume-control {
    position: absolute !important;
    margin-top: 46px;
    margin-left: -18px !important;
    z-index: 1 !important;
}
.component-audio-master .wrapper .container .details .slidecontainer .slider {
   width: 67% !important;
   margin-left: -11px;
}
.component-audio-master .wrapper .container .controls svg:first-child {
    position: absolute !important;
    left: 1px;
    margin-top: 45px !important;
}

#myRange {
    -webkit-appearance: auto !important;
}
#volumeRange {
    -webkit-appearance: auto !important;
}
svg {
    pointer-events: all;
}

/* BOTTOM */

.bottom-design {
    position: fixed;
    bottom: 0px;
    left: 0px;
    height: 7rem;
    width: calc(100% - 0px);
}
.bottom-design .wrapper {
    border-radius: 0px !important;
}
.bottom-design .cover {
    position: absolute;
    height: 5.5rem;
    width: 5.5rem;
    z-index: 1;
    left: 1rem;
    top: 0.5rem;
}
.bottom-design .wrapper .container .controls {
    justify-content: center !important;
    margin-top: 36px !important;
    padding-right: 0px !important;
}
.bottom-design .wrapper .container .volume-container {
    right: 12rem !important;
    bottom: 7.8rem !important;
}
.bottom-design .wrapper .container .volume-container .volume-control {
    left: 49px !important;
    display: block !important;
    transform: none !important;
    margin-top: 99px !important;
}
.bottom-design .wrapper .container {
    bottom: 0px !important;
    width: calc(100% - 0px) !important;
    border-top: 1px solid #eee !important;
    box-shadow: 0px -1px #ffffff9e;
    -webkit-backdrop-filter: blur(60px) !important;
    backdrop-filter: blur(60px) !important;
    background-color: rgba(253, 253, 253, 0.7) !important;
}
.bottom-design .wrapper .container .details {
    margin-top: 17px !important;
}
.bottom-design .wrapper .container .details .title {
    color: rgba(48, 48, 48, 0.98);
    margin-left: 7.5rem !important;
    font-weight: 500 !important;
    font-family: Roboto, sans-serif !important;
    font-size: 1.3rem !important;
    margin-top: -34px !important;
}
.bottom-design .wrapper .container .details .slidecontainer .slider {
    width: 35% !important;
}
.bottom-design .wrapper .container .details .slidecontainer .time-line {
    display: flex !important;
    width: 35% !important;
    font-family: monospace;
    font-size: 1.2rem;
    color: #bbb !important;
}

/* END BOTTOM*/


/* TOP */

.top-design {
    position: fixed;
    bottom: 0px;
    left: 0px;
    height: 7rem;
    width: calc(100% - 0px);
}
.top-design .wrapper {
    border-radius: 0px !important;
}
.top-design .cover {
    position: absolute;
    height: 2rem;
    width: 2rem;
    z-index: 1;
    left: 1rem;
    top: 0.5rem;
}
.top-design .component-audio-master .wrapper .cover img {
    max-width: 100% !important;
    border-radius: 7px !important;
    max-height: 100% !important;
    margin-left: 0px !important;
    width: 100% !important;
}

.top-design .component-audio-master .wrapper .container {
    position: absolute !important;
    bottom: 0px !important;
    background-color: #ffffffb8 !important;
    width: calc(100% - 0px) !important;
    height: 31px !important;
    border-bottom-left-radius: 6px !important;
    border-bottom-right-radius: 6px !important;
}

.top-design .wrapper .container .controls {
    justify-content: center !important;
    margin-top: 36px !important;
    padding-right: 0px !important;
}
.top-design .wrapper .container .volume-container {
    right: 12rem !important;
    bottom: 7.8rem !important;
}
.top-design .wrapper .container .volume-container .volume-control {
    left: 49px !important;
    display: block !important;
    transform: none !important;
    margin-top: 99px !important;
}
.top-design .wrapper .container {
    bottom: 0px !important;
    width: calc(100% - 0px) !important;
    border-top: 1px solid #eee !important;
    box-shadow: 0px -1px #ffffff9e;
    -webkit-backdrop-filter: blur(60px) !important;
    backdrop-filter: blur(60px) !important;
    background-color: rgba(253, 253, 253, 0.7) !important;
}
.top-design .wrapper .container .details {
    margin-top: 9px !important;
}
.top-design .wrapper .container .details .title {
    color: rgba(48, 48, 48, 0.98);
    margin-left: 7.5rem !important;
    font-weight: 500 !important;
    font-family: Roboto, sans-serif !important;
    font-size: 1.3rem !important;
    margin-top: -34px !important;
}
.top-design .wrapper .container .details .slidecontainer .slider {
    width: 35% !important;
}
.top-design .wrapper .container .details .slidecontainer .time-line {
    display: flex !important;
    width: 35% !important;
    font-family: monospace;
    font-size: 1.2rem;
    color: #bbb !important;
}

/* END TOP*/


/* end player media */

/* playlist */

@media (min-width: 1260px){
.grid.grid--flow-row.grid--category-bricks.svelte-1a54yxp.svelte-1a54yxp, .grid.grid--flow-row.grid--recently-searched.svelte-1a54yxp.svelte-1a54yxp {
    --numSearchColumns: 4;
}
}

@media (min-width: 1000px){
.grid.grid--flow-row.grid--category-bricks.svelte-1a54yxp.svelte-1a54yxp, .grid.grid--flow-row.grid--recently-searched.svelte-1a54yxp.svelte-1a54yxp {
    --numSearchColumns: 4;
}
}
.grid.grid--flow-row.grid--category-bricks.svelte-1a54yxp.svelte-1a54yxp, .grid.grid--flow-row.grid--recently-searched.svelte-1a54yxp.svelte-1a54yxp {
    grid-template-columns: repeat( auto-fit, minmax(200px, 1fr) )
}
.grid.grid--flow-row.grid--category-bricks.svelte-1a54yxp.svelte-1a54yxp {
    --numSearchColumns: 4;
}
@media (min-width: 1580px){
.grid.grid--flow-row.grid--category-bricks.svelte-1a54yxp.svelte-1a54yxp, .grid.grid--flow-row.grid--recently-searched.svelte-1a54yxp.svelte-1a54yxp {
    --numSearchColumns: 5;
}
}
@media (min-width: 1000px){
.grid.grid--flow-row.svelte-1a54yxp.svelte-1a54yxp {
    grid-gap: 20px;
}
}


@media (min-width: 484px){
.app-container.svelte-t3vj1e {
    --toast-position-inline-start: calc(50% + 16.94vw);
    grid-template-areas:
        "structure-header structure-main-section"
        "structure-upsell structure-upsell"
        "structure-locale-switcher structure-locale-switcher";
    grid-template-columns: 33.88vw minmax(0,1fr);
    grid-template-rows: minmax(0,1fr) auto auto;
}
}
.app-container.svelte-t3vj1e {
    --toast-position-inline-start: calc(50% + 16.94vw);
    grid-template-areas:
        "structure-header structure-main-section"
        "structure-upsell structure-upsell"
        "structure-locale-switcher structure-locale-switcher";
    grid-template-columns: 33.88vw minmax(0,1fr);
    grid-template-rows: minmax(0,1fr) auto auto;
}
@media (min-width: 767.32px){
    .app-container.svelte-t3vj1e {
        --toast-position-inline-start: calc(50% + 130px);
        grid-template-columns: 260px minmax(0,1fr);
    }
}
.app-container.svelte-t3vj1e {
        --toast-position-inline-start: calc(50% + 130px);
        grid-template-columns: 260px minmax(0,1fr);
}
@media (min-width: 1000px){
.grid.grid--flow-row.svelte-1a54yxp.svelte-1a54yxp {
    grid-gap: 20px;
}
}
.grid.grid--flow-row.svelte-1a54yxp.svelte-1a54yxp {
    display: grid;
    grid-gap: 15px;
}

.grid.svelte-1a54yxp.svelte-1a54yxp {
    margin: 0 var(--bodyGutter) 32px;
}
ul {
    list-style-type: none;
}
li {
    list-style: none;
}

a, blockquote, body, code, dd, div, dl, dt, embed, fieldset, footer, form, h1, h2, h3, h4, h5, h6, header, html, img, legend, li, ol, p, pre, section, table, td, th, ul {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
}
abbr, blockquote, body, button, dd, dl, dt, fieldset, figure, form, h1, h2, h3, h4, h5, h6, hgroup, input, legend, li, ol, p, pre, ul {
    margin: 0;
    padding: 0;
}
*, :after, :before {
    box-sizing: inherit;
}
.grid.grid--flow-row.grid--category-bricks.svelte-1a54yxp a {
    border-radius: 10px;
    display: block;
}

.link, a {
    color: var(--linkColor,inherit);
    cursor: pointer;
    letter-spacing: inherit;
    text-decoration: none !important;
    color: inherit !important;
}
.category-brick.svelte-1mi51kw {
    border-radius: var(--global-border-radius-large,10px);
    box-shadow: 0 1px -1px rgba(0,0,0,.02), 0 1px 1px rgba(0,0,0,.01), 0 4px 4px rgba(0,0,0,.02), 0 4px 4px rgba(0,0,0,.02), 0 7px 7px rgba(0,0,0,0.02);
    overflow: hidden;
    position: relative;
    z-index: var(--z-default);
}
.artwork-component.svelte-10tj07c.svelte-10tj07c {
    background-color: var(--override-placeholder-bg-color,var(--placeholder-bg-color,var(--genericJoeColor)));
    border-radius: inherit;
    box-sizing: border-box;
    contain: content;
    height: var(--artwork-override-height,auto);
    max-height: var(--artwork-override-max-height,none);
    max-width: var(--artwork-override-max-width,none);
    min-height: var(--artwork-override-min-height,0);
    min-width: var(--artwork-override-min-width,0);
    overflow: hidden;
    position: relative;
    width: var(--artwork-override-width,100%);
    z-index: var(--z-default);
}

.container-style.svelte-10tj07c.svelte-10tj07c {
    border-radius: var(--global-border-radius-medium,7px);
}
.category-brick__title.svelte-1mi51kw {
    bottom: 0px;
    color: #fff;
    display: -webkit-box;
    padding-inline-end: 12px;
    padding-inline-start: 12px;
    font-weight: 500;
    pointer-events: none;
    position: absolute;
    z-index: calc(var(--z-default) + 1);
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.artwork-component.artwork-component--has-borders.svelte-10tj07c.svelte-10tj07c:after {
    border-radius: var(--afterShadowBorderRadius,inherit);
    /*box-shadow: var(--artworkShadowInset,inset 0 0 0 1px hsla(0,0%,50%,.1));*/
    content: "";
    display: block;
    height: 0;
    max-height: 100%;
    max-width: 100%;
    min-height: 100%;
    min-width: 100%;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: calc(var(--z-default) + 1);
}

.container-style.svelte-10tj07c.svelte-10tj07c:after {
    border-radius: var(--afterShadowBorderRadius,inherit);
    /*box-shadow: var(--artworkShadowInset,inset 0 0 0 1px hsla(0,0%,50%,.1));*/
    content: "";
    display: block;
    height: 0;
    max-height: 100%;
    max-width: 100%;
    min-height: 100%;
    min-width: 100%;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: calc(var(--z-default) + 1);
}
.multiline-clamp--overflow.svelte-1a7gcr6.svelte-1a7gcr6 {
    font-size: 1.18rem;
    padding-left: 10px;
    padding-top: 4px;
    padding-right: 7px;
    margin-top: 0.6rem;
}
.product-lockup__content-details--no-subtitle-link.svelte-1rancje .product-lockup__subtitle-links.svelte-1rancje, .product-lockup__content-details--no-subtitle-link.svelte-1rancje .product-lockup__title-link.svelte-1rancje {
    -webkit-text-decoration: var(--linkHoverTextDecoration);
    text-decoration: var(--linkHoverTextDecoration);
}
.product-lockup__subtitle-links.svelte-1rancje.svelte-1rancje {
    color: var(--systemSecondary);
    font: var(--callout);
    margin-top: 1px;
}
.product-lockup__subtitle-links {
    font-size: 1.1rem;
    color: #999;
    margin-top: -0.2rem;
}
/* en dplaylist */

.shelf-grid__body.svelte-1g6lpdp.svelte-1g6lpdp {
    box-sizing: content-box;
    margin-inline-end: -2px;
    margin-inline-start: -2px;
    overflow: visible;
    padding-inline-end: 2px;
    padding-inline-start: 3px;
    width: 100%;
}

.shelf-grid__list.svelte-1g6lpdp.svelte-1g6lpdp {
    display: grid;
    -moz-column-gap: 20px;
    column-gap: 20px;
    --numSearchColumns: 4;
    grid-template-columns: repeat( auto-fit, minmax(345px, 1fr) );
    grid-template-rows: minmax(0,1fr) auto auto;
}

.shelf-grid__list-item.svelte-1g6lpdp.svelte-1g6lpdp {
    /*contain: content;*/
    margin-top: calc(var(--override-shelf-overflow-bleed-top, var(--standard-lockup-shadow-offset, 15px))*-1);
    margin-inline-end: calc(var(--standard-lockup-shadow-offset, 15px)*-1);
    margin-bottom: calc(var(--override-shelf-overflow-bleed-bottom, var(--standard-lockup-shadow-offset, 15px))*-1);
    margin-inline-start: calc(var(--standard-lockup-shadow-offset, 15px)*-1);
    padding-inline-end: var(--standard-lockup-shadow-offset,15px);
    padding-bottom: var(--override-shelf-overflow-bleed-bottom,var(--standard-lockup-shadow-offset,15px));
    padding-top: var(--override-shelf-overflow-bleed-top,var(--standard-lockup-shadow-offset,15px));
    padding-inline-start: var(--standard-lockup-shadow-offset,15px);
    scroll-snap-align: start;
}
.is-link.svelte-1tnc1ep.svelte-1tnc1ep {
    cursor: pointer;
}
.track-lockup.svelte-1tnc1ep.svelte-1tnc1ep {
    align-items: center;
    color: var(--systemPrimary);
    display: grid;
    grid-template-columns: auto auto 1fr auto;
    padding-bottom: 0.7rem;
    padding-top: 0.7rem;
    position: relative;
    width: 100%;
    -webkit-padding-end: var(--trackLockupPaddingInlineEnd,14px);
    -moz-padding-end: var(--trackLockupPaddingInlineEnd,14px);
    padding-inline-end: var(--trackLockupPaddingInlineEnd,14px);
}
.track-lockup__artwork-wrapper.svelte-1tnc1ep.svelte-1tnc1ep {
    border-radius: 5px;
    position: relative;
    -webkit-margin-end: 12px;
    -moz-margin-end: 12px;
    margin-inline-end: 12px;
}
.track-lockup__artwork-wrapper.svelte-1tnc1ep .artwork-component {
    --artwork-override-width: calc(40px*var(--aspect-ratio));
    --artwork-override-height: 40px;
}
.artwork-component.svelte-10tj07c.svelte-10tj07c {
    background-color: var(--override-placeholder-bg-color,var(--placeholder-bg-color,var(--genericJoeColor)));
    border-radius: inherit;
    box-sizing: border-box;
    contain: content;
    height: var(--artwork-override-height,auto);
    max-height: var(--artwork-override-max-height,none);
    max-width: var(--artwork-override-max-width,none);
    min-height: var(--artwork-override-min-height,0);
    min-width: var(--artwork-override-min-width,0);
    overflow: hidden;
    position: relative;
    width: var(--artwork-override-width,100%);
    z-index: var(--z-default);
}
.track-lockup__play-button-wrapper.svelte-1tnc1ep .play-button, .track-lockup__play-button-wrapper.svelte-1tnc1ep.svelte-1tnc1ep {
    border-radius: 5px;
    bottom: 0;
    inset-inline-end: 0;
    inset-inline-start: 0;
    margin: auto;
    position: absolute;
    top: 0;
    z-index: 1;
}
.track-lockup__play-button-wrapper.svelte-1tnc1ep.svelte-1tnc1ep {
    --playButtonIconHoverColor: #fff;
    --progress-play-background-color: hsla(0,0%,100%,.1);
    transition: var(--global-transition);
}
.interactive-play-button.svelte-a72zjx {
    --nonPlatterIconFill: var(--nonPlatterOverrideIconColor,var(--keyColor) );
    height: var(--interactivePlayButtonSize,16px);
    width: var(--interactivePlayButtonSize,16px);
}
.track-lockup__play-button-wrapper.svelte-1tnc1ep .play-button, .track-lockup__play-button-wrapper.svelte-1tnc1ep.svelte-1tnc1ep {
    border-radius: 5px;
    bottom: 0;
    inset-inline-end: 0;
    inset-inline-start: 0;
    margin: auto;
    position: absolute;
    top: 0;
    z-index: 1;
}
.play-button.svelte-1tvdl0z {
    --nonPlatterIconFill: var(--playButtonIconColor,#fff);
    --playingBarColor: var(--nonPlatterIconFill,#fff);
    line-height: 0;
    pointer-events: auto;
    position: relative;
    z-index: var(--z-default);
}
.track-lockup__content.svelte-1tnc1ep.svelte-1tnc1ep {
    --linkHoverTextDecoration: none;
    align-items: flex-start;
    align-self: stretch;
    display: flex;
    flex-flow: column;
    justify-content: center;
    overflow: hidden;
    text-align: start;
    -webkit-padding-start: 4px;
    -moz-padding-start: 4px;
    padding-inline-start: 4px;
    -webkit-padding-end: 4px;
    -moz-padding-end: 4px;
    padding-inline-end: 4px;
    -webkit-margin-end: 8px;
    -moz-margin-end: 8px;
    margin-inline-end: 8px;
}
.track-lockup__title.svelte-1tnc1ep.svelte-1tnc1ep {
    --explicitBadgeSize: 10px;
    align-items: baseline;
    display: inline-grid;
    font: var(--body-tall);
    grid-template-columns: 1fr auto auto;
}
.track-lockup__clamp-wrapper.svelte-1tnc1ep.svelte-1tnc1ep {
    margin-bottom: -4px;
    margin-top: -4px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    -webkit-margin-start: -4px;
    -moz-margin-start: -4px;
    margin-inline-start: -4px;
    -webkit-margin-end: -4px;
    -moz-margin-end: -4px;
    margin-inline-end: -4px;
    padding-bottom: 4px;
    padding-top: 4px;
    -webkit-padding-end: 4px;
    -moz-padding-end: 4px;
    padding-inline-end: 4px;
    -webkit-padding-start: 4px;
    -moz-padding-start: 4px;
    padding-inline-start: 4px;
}
.track-lockup__subtitle.svelte-1tnc1ep.svelte-1tnc1ep {
    --linkHoverColor: inherit;
    --linkHoverTextDecoration: underline;
    color: var(--systemSecondary);
    font: var(--callout);
    max-width: 100%;
}

.blur-content-full {
    -webkit-backdrop-filter: blur(60px);
    backdrop-filter: blur(60px);
    background-color: rgba(253, 253, 253, 0.8);
}
.margin-player-top {
    margin-top: 16px;
}
.padding-player-top {
    padding-left: 7px;
    padding-right: 7px;
}
.map-container {
  height: 500px;
  width: 100%;
  border-radius: 10px;
}


/* MOBILE */
.itm-opt-hide-mobile {
    display: none;
}
.margin-play-action {
    top: 1px !important;
}
@media (max-width: 640px){
    .itm-list-hide-mobile {
        display: none;
    }
    .itm-list-data-mobile {
        margin-top: -30px !important;
    }
    .wide-menu {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }
    .itm-opt-hide-mobile {
        display: block !important;
    }
    .itm-resize-switch-props {
        position: fixed;
        width: calc(100% - 33px) !important;
        margin-left: 10px !important; 
    }
    .shelf-grid__body.svelte-1g6lpdp.svelte-1g6lpdp {
        margin-inline-start: -8px !important;
    }
    .margin-play-action {
        top: -1px !important;
    }
}



@media (min-width: 1031px){
    .mini-player__body.svelte-19dfmbh .svelte-19dfmbh {
        margin-top: 0px !important;
    }
}


/* MINI PLAYER */

@media (max-width: 483px) {
    .player-bar.player-bar__floating-player.svelte-1rr9v04 {
        background-image: linear-gradient(0deg, hsla(0, 0%, 100%, .8), transparent);
        height: 59px;
    }
}

.player-bar.svelte-1rr9v04 {
    bottom: 0rem;
    flex-shrink: 0;
    height: 54px;
    inset-inline-end: 0;
    position: fixed;
    transition: opacity .25s, transform .25s;
    width: 100%;
    z-index: 999;
}
.mini-player.svelte-19dfmbh.svelte-19dfmbh {
    display: grid;
    grid-template-columns: auto;
    grid-template-rows: var(--miniPlayerHeight) 0 repeat(2, 0);
    grid-column-gap: 0;
    grid-row-gap: 0;
    -webkit-backdrop-filter: saturate(60%) blur(20px);
    backdrop-filter: saturate(60%) blur(20px);
    background-color: #ffffffb8;
    border-radius: 14px;
    box-shadow: 0 0 8px rgba(0, 0, 0, .2);
    margin: 0 12px;
    overflow: hidden;
    max-width: calc(100vw - 24px);
}
button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.mini-player__body.svelte-19dfmbh.svelte-19dfmbh {
        width: calc(100vw - 24px) !important;
}
.mini-player__body.svelte-19dfmbh.svelte-19dfmbh {
    --playback-controls-play-color: var(--miniPlayerPlayButtonColor, --systemPrimary);
    --skip-control-color: var(--miniPlayerPlayButtonColor, --systemPrimary);
    --playback-control-icon-width: var(--miniPlayerControlsButtonWidth, 35px);
    --playback-control-icon-height: var(--miniPlayerControlsButtonWidth, 35px);
    --skip-icon-width: var(--miniPlayerControlsButtonWidth, 35px);
    --skip-icon-height: var(--miniPlayerControlsButtonWidth, 35px);
    align-items: center;
    display: flex;
    gap: 11px;
    grid-area: 1 / 5 / 2 / 6;
    height: var(--miniPlayerHeight, 56px);
    padding-inline-end: var(--miniPlayerPaddingEnd, 15px);
    padding-inline-start: var(--miniPlayerPaddingStart, 8px);
    
}

@media (max-width: 1030px){
    .component-audio-master {
        display: none;
    }
    .mini-player__body.svelte-19dfmbh .svelte-19dfmbh {
        margin-top: 0px !important;
        margin-left: 0rem;
    }
}
.mini-player__metadata-button.svelte-19dfmbh.svelte-19dfmbh {
    cursor: pointer;
}

.mini-player__metadata.svelte-19dfmbh.svelte-19dfmbh {
    align-items: center;
    background-color: transparent;
    display: flex;
    gap: 8px;
    height: 40px;
    min-width: 0;
    width: calc(100% - 10.7rem);
}
.mini-player__artwork.svelte-1eo13fv.svelte-1eo13fv:not(:has(.artwork-component--downloaded)) {
    aspect-ratio: 1 auto;
    height: inherit;
}
.mini-player__body.svelte-19dfmbh .svelte-19dfmbh {
    margin-inline-end: -3px;
    width: auto;
}

.mini-player__controls.svelte-19dfmbh.svelte-19dfmbh {
    display: flex;
}

.playback-controls-play {
    width: var(--playback-control-button-width, 32px);
    height: var(--playback-control-button-height, 32px);
    display: flex;
    flex: 0 0 auto;
    align-items: stretch;
    justify-content: stretch;
    position: relative;
}
[hydrated] {
    visibility: inherit;
}
.mini-player__artwork.svelte-1eo13fv.svelte-1eo13fv {
    --override-placeholder-bg-color: #d1d1d1;
    border-radius: 6px;
    flex-shrink: 0;
}
.artwork-component--aspect-ratio.svelte-1fla0gl.svelte-1fla0gl:not(.artwork-component--downloaded), .artwork-component--error.svelte-1fla0gl.svelte-1fla0gl {
    overflow: hidden;
}
.artwork-component--error.svelte-1fla0gl.svelte-1fla0gl, .artwork-component.svelte-1fla0gl.svelte-1fla0gl:not(.artwork-component--downloaded) {
    background-color: var(--override-placeholder-bg-color, var(--placeholder-bg-color, var(--genericJoeColor)));
}
.artwork-component--fullwidth.svelte-1fla0gl.svelte-1fla0gl, .artwork-component--fullwidth.svelte-1fla0gl>noscript {
    width: 100%;
}
.artwork-component.svelte-1fla0gl.svelte-1fla0gl {
    background-color: var(--override-placeholder-bg-color, var(--placeholder-bg-color, var(--genericJoeColor)));
    border-radius: inherit;
    box-sizing: border-box;
    contain: content;
    height: -webkit-fill-available;
    max-height: -webkit-fill-available;
    max-width: -webkit-fill-available;
    min-height: -webkit-fill-available;
    min-width: -webkit-fill-available;
    overflow: hidden;
    position: relative;
    width: var(--artwork-override-width, 100%);
    z-index: var(--z-default);
}
.artwork-component--aspect-ratio.svelte-1fla0gl.svelte-1fla0gl:not(.artwork-component--downloaded):after, .artwork-component--aspect-ratio.svelte-1fla0gl.svelte-1fla0gl:not(.artwork-component--downloaded):before, .artwork-component--error.svelte-1fla0gl.svelte-1fla0gl:after, .artwork-component--error.svelte-1fla0gl.svelte-1fla0gl:before {
    box-sizing: border-box;
    content: "";
    display: block;
    padding-bottom: calc(100% / var(--shelf-aspect-ratio, var(--aspect-ratio)));
}
.artwork-component--aspect-ratio.svelte-1fla0gl:not(.artwork-component--downloaded)>:first-child, .artwork-component--aspect-ratio.svelte-1fla0gl:not(.artwork-component--downloaded)>noscript>:first-child, .artwork-component--error.svelte-1fla0gl>:first-child, .artwork-component--error.svelte-1fla0gl>noscript>:first-child {
    height: var(--artwork-override-height, 100%);
    left: 50%;
    max-height: var(--artwork-override-max-height, none);
    max-width: var(--artwork-override-max-width, none);
    min-height: var(--artwork-override-min-height, 0);
    min-width: var(--artwork-override-min-width, 0);
    position: absolute;
    top: 50%;
    transform: translateY(-50%) translate(-50%);
    width: var(--artwork-override-width, 100%);
    z-index: var(--z-default);
}

.artwork-component__contents.svelte-1fla0gl.svelte-1fla0gl {
    border-radius: inherit;
    transition: var(--global-transition, opacity .1s ease-in);
}
.artwork-fallback.svelte-1dcaujl, .artwork-fallback.svelte-1dcaujl svg {
    height: auto;
    width: inherit;
}

.artwork-fallback.svelte-1dcaujl {
    background-color: var(--genericJoeColor);
    max-height: 100%;
    max-width: 100%;
}

@media (max-width: 483px) {
    .player-bar.player-bar__floating-player.svelte-1rr9v04:before {
        -webkit-backdrop-filter: blur(3px);
        backdrop-filter: blur(3px);
        bottom: 0px;
        height: 31px;
    }
}

@media (max-width: 483px) {
    .player-bar.player-bar__floating-player.svelte-1rr9v04:after, .player-bar.player-bar__floating-player.svelte-1rr9v04:before {
        content: "";
        display: block;
        height: 30px;
        left: 0;
        position: fixed;
        width: 100%;
        z-index: calc(var(--z-default) - 2);
    }
}
*, :after, :before {
    box-sizing: inherit;
}

/* DISC */

.container-detail-header.svelte-12o9jcf.svelte-12o9jcf {
    display: grid;
    grid-template-areas:
        "secondary-actions"
        "artwork"
        "headings"
        "primary-actions"
        "description";
    justify-items: center;
    margin: 0 var(--bodyGutter);
    margin-bottom: var(--containerDetailHeaderSpacer, 32px);
    padding-top: 20px;
}
[slot=artwork] {
    --radiosity-effect-shadow-z: var(--z-gpu);
    align-self: start;
    border-radius: var(--global-border-radius-large, 10px);
    box-shadow: 0 10px 20px 0 var(--radiosityShadowColor);
    grid-area: artwork;
    margin: 15px auto 0;
    position: relative;
    width: var(--artworkSize, 270px);
    z-index: var(--radiosity-effect-shadow-z, var(--z-default));
}

[draggable=true] {
    -webkit-user-drag: element;
}
.artwork__radiosity.svelte-1agpw2h {
    --artwork-override-max-height: 100%;
    -webkit-filter: blur(20px) saturate(2);
    filter: blur(20px) saturate(2);
    height: 100%;
    opacity: .4;
    position: absolute;
    transform: scale(.88);
    transform-origin: bottom center;
    width: 100%;
    z-index: var(--radiosity-effect-z, var(--z-default));
}
.artwork-component.svelte-1fla0gl.svelte-1fla0gl {
    background-color: var(--override-placeholder-bg-color, var(--placeholder-bg-color, var(--genericJoeColor)));
    border-radius: inherit;
    box-sizing: border-box;
    contain: content;
    max-height: var(--artwork-override-max-height, none);
    max-width: var(--artwork-override-max-width, none);
    min-height: var(--artwork-override-min-height, 0);
    min-width: var(--artwork-override-min-width, 0);
    overflow: hidden;
    position: relative;
    width: var(--artwork-override-width, 100%);
    z-index: var(--z-default);
}
.artwork-component__image.svelte-1fla0gl.svelte-1fla0gl {
    display: block;
    height: var(--artwork-override-height, auto);
    max-height: var(--artwork-override-max-height, none);
    max-width: var(--artwork-override-max-width, none);
    min-height: var(--artwork-override-min-height, 0);
    min-width: var(--artwork-override-min-width, 0);
    -o-object-fit: var(--artwork-override-object-fit,fill);
    object-fit: var(--artwork-override-object-fit, fill);
    -o-object-position: var(--artwork-override-object-position,center);
    object-position: var(--artwork-override-object-position, center);
    width: var(--artwork-override-width, 100%);
}

.artwork-component__contents.svelte-1fla0gl.svelte-1fla0gl {
    border-radius: inherit;
    transition: var(--global-transition, opacity .1s ease-in);
}
.headings.svelte-12o9jcf.svelte-12o9jcf {
    align-items: center;
    display: flex;
    flex-direction: column;
    grid-area: headings;
    margin-top: 18px;
    min-width: 0;
    width: 100%;
}
.headings__title.svelte-12o9jcf.svelte-12o9jcf {
    color: #444;
    cursor: text;
    display: -webkit-box;
    font-size: 1.6rem;
    margin-bottom: 3px;
    text-align: center;
    text-wrap: balance;
    -webkit-user-select: text;
    -moz-user-select: text;
    user-select: text;
    word-break: break-word;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.headings__badges.svelte-12o9jcf.svelte-12o9jcf {
    --explicitBadgeSize: 19px;
    --favoriteBadgeSize: 14px;
    --favoriteBadgeMarginInlineStart: 1px;
    align-items: center;
    display: inline-flex;
    gap: 6px;
    margin-inline-start: 4px;
}
.headings__subtitles.svelte-12o9jcf.svelte-12o9jcf {
    --linkColor: #d60017;
    color: #d60017;
    font-size: 2rem;
    margin-bottom: -5px;
    margin-top: -5px;
    margin-inline-end: -5px;
    margin-inline-start: -5px;
    overflow: hidden;
    padding-bottom: 5px;
    padding-inline-end: 5px;
    padding-top: 5px;
    padding-inline-start: 5px;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
}
.headings__metadata-bottom.svelte-12o9jcf.svelte-12o9jcf {
    color: var(--systemSecondary);
    font: var(--callout-emphasized);
    margin-top: 4px;
    text-align: center;
}

/* END DISC */

/* player complete */

.modal-wrapper.svelte-173vgxg.svelte-173vgxg {
    --slidingModalHandleColor: var(--systemTertiary-onDark);
}
@media (max-width: 999px) {
    .sliding-modal-wrapper.svelte-kzi81j.svelte-kzi81j {
        --modalWidth: 100%;
        --modalTop: calc(100% - var(--slidingModalHeight, 100%));
        --modalOverflow: hidden;
        --modalBorderRadius: var(--slidingModalBorderRadius, 0) var(--slidingModalBorderRadius, 0) 0 0;
    }
}

.sliding-modal-wrapper.svelte-kzi81j.svelte-kzi81j {
    display: contents;
}
dialog.svelte-1a4zf5b:modal {
    position: fixed;
}

dialog.svelte-1a4zf5b {
    background: transparent;
    border: 0;
    border-radius: var(--modalBorderRadius, 10px);
    color: var(--systemPrimary);
    font: var(--body);
    height: var(--modalHeight, -moz-fit-content);
    height: var(--modalHeight, fit-content);
    max-height: var(--modalMaxHeight, initial);
    max-width: var(--modalMaxWidth, initial);
    overflow: var(--modalOverflow, auto);
    padding: 0;
    top: var(--modalTop, 0);
    width: var(--modalWidth, -moz-fit-content);
    width: var(--modalWidth, fit-content);
    background-size: 286% !important;
}
.sliding-modal.svelte-kzi81j.svelte-kzi81j { /* background player*/
    border-radius: var(--modalBorderRadius);
    box-shadow: 0 0 5px 3px rgba(0, 0, 0, .3);
    height: var(--slidingModalContentHeight, 100%);
    overflow: hidden;
    position: relative;
    width: 100%;
    z-index: 9999;
    opacity: 0.98;
    -webkit-backdrop-filter: saturate(60%) blur(20px);
    backdrop-filter: saturate(60%) blur(20px);
    background-color: #000000d4;
    box-shadow: 0 0 8px rgba(0, 0, 0, .2);
}
.sliding-modal-backdrop.svelte-kzi81j.svelte-kzi81j {
    bottom: 0;
    inset-inline-end: 0;
    inset-inline-start: 0;
    margin: auto;
    position: absolute;
    top: 0;
    z-index: 0;
}
.backdrop.svelte-10f8t8k {
    height: 100%;
    width: 100%;
}
.dt-lyrics__platter.svelte-2zgn0e.svelte-2zgn0e {
    border-radius: inherit;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    width: 100%;
    z-index: var(--z-default);
}
.dt-lyrics__platter.svelte-2zgn0e canvas.svelte-2zgn0e {
    display: block;
    height: 100%;
    width: 100%;
}

audio, canvas, progress, video {
    vertical-align: baseline;
}
.sliding-modal-content.svelte-kzi81j.svelte-kzi81j {
    background-color: var(--slidingModalContentBgColor, transparent);
    display: flex;
    flex-direction: column;
    height: 100%;
    position: relative;
    width: 100%;
}
.sliding-modal-collapse.svelte-kzi81j.svelte-kzi81j {
    flex: 0;
    padding-bottom: 17px;
    padding-top: 18px;
    z-index: var(--z-default);
}

button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
body, button, input, select, textarea {
    -moz-font-feature-settings: "kern";
    font-synthesis: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
button {
    background: none;
    border: 0;
    color: inherit;
    cursor: pointer;
    font: inherit;
    line-height: inherit;
    vertical-align: inherit;
}
abbr, blockquote, body, button, dd, dl, dt, fieldset, figure, form, h1, h2, h3, h4, h5, h6, hgroup, input, legend, li, ol, p, pre, ul {
    margin: 0;
    padding: 0;
}
.sliding-modal-collapse.svelte-kzi81j svg {
    height: 8px;
    margin: auto;
    fill: white;
    margin-top: 2rem;
}

svg {
    pointer-events: none;
}
*, :after, :before {
    box-sizing: inherit;
}
svg:not(:root) {
    overflow-clip-margin: content-box;
    overflow: hidden;
}
.sliding-modal-main.svelte-kzi81j.svelte-kzi81j {
    flex: 1;
    position: relative;
}
.now-playing-structure.svelte-173vgxg.svelte-173vgxg {
    background: linear-gradient(0deg, rgba(0, 0, 0, .4) 0, transparent 50%);
    color: #fff;
    display: flex;
    flex-direction: column;
    height: calc(100dvh - 51px);
}
.now-playing-main.svelte-173vgxg.svelte-173vgxg {
    flex: 1 65.5%;
    overflow: hidden auto;
    padding-top: 2rem;
}
.playback-item.svelte-1k62exr.svelte-1k62exr {
    display: flex;
    flex-direction: column;
    height: 70%; /* aument */
    justify-content: space-around;
    width: 100%;
}
.playback-item--large.is-empty.svelte-1k62exr .artwork-container.svelte-1k62exr:not(.is-animating), .playback-item--large.is-paused.svelte-1k62exr .artwork-container.svelte-1k62exr:not(.is-animating) {
    transform: scale(.73) !important;
    transition: transform .35s;
}

.playback-item--large.svelte-1k62exr .artwork-container.svelte-1k62exr:not(.is-animating) {
    transition: transform .5s cubic-bezier(.76, .665, .37, 1.35);
}
.playback-item--large.svelte-1k62exr .artwork-container.svelte-1k62exr {
    align-content: center;
    display: grid;
    height: 100%;
    width: 100vw;
}
.artwork-container.svelte-1k62exr.svelte-1k62exr {
    line-height: 0;
    position: relative;
    z-index: var(--z-default);
}
.artwork-button.svelte-1k62exr.svelte-1k62exr {
    -webkit-tap-highlight-color: transparent;
    display: contents;
}
button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
body, button, input, select, textarea {
    -moz-font-feature-settings: "kern";
    font-synthesis: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
button {
    background: none;
    border: 0;
    color: inherit;
    cursor: pointer;
    font: inherit;
    line-height: inherit;
    vertical-align: inherit;
}
.now-playing-artwork--large.svelte-tyg4xq {
    max-height: calc(100% - 30px);
}

.now-playing-artwork--compact.svelte-tyg4xq, .now-playing-artwork--large.svelte-tyg4xq {
    --artwork-override-height: auto;
    --artwork-override-max-width: calc(100dvw - 64px);
    --artwork-override-max-height: calc(100dvh - 335px);
    display: contents;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}
.now-playing-artwork.svelte-tyg4xq {
    --artwork-override-width: auto;
    --artwork-override-height: 100%;
    --artwork-override-max-width: 100%;
    --artwork-override-max-height: 100%;
    --shadowOffset: 20px;
    --shadowBlur: 25px;
    --shadowSpread: -15px;
    --shadowColor: rgba(0, 0, 0, .22);
    border-radius: inherit;
    height: 100%;
}
.now-playing-artwork.svelte-tyg4xq .artwork-component {
    display: contents;
}
.artwork-component.svelte-1fla0gl.svelte-1fla0gl {
    background-color: var(--override-placeholder-bg-color, var(--placeholder-bg-color, var(--genericJoeColor)));
    border-radius: inherit;
    box-sizing: border-box;
    contain: content;
    max-height: var(--artwork-override-max-height, none);
    max-width: var(--artwork-override-max-width, none);
    min-height: var(--artwork-override-min-height, 0);
    min-width: var(--artwork-override-min-width, 0);
    overflow: hidden;
    position: relative;
    width: var(--artwork-override-width, 100%);
    z-index: var(--z-default);
}
.now-playing-artwork.svelte-tyg4xq .artwork-component__image {
    aspect-ratio: 1 auto;
    border-radius: var(--artworkRadius, 10px);
    bottom: 0;
    box-shadow: 0 var(--shadowOffset) var(--shadowBlur) var(--shadowSpread) var(--shadowColor);
    display: inline-block;
    inset-inline-end: 0;
    inset-inline-start: 0;
    margin: auto;
    -o-object-fit: contain;
    object-fit: contain;
    position: absolute;
    top: 0;
    z-index: 1;
}

.artwork-component__image.svelte-1fla0gl.svelte-1fla0gl {
    display: block;
    height: var(--artwork-override-height, auto);
    max-height: var(--artwork-override-max-height, none);
    max-width: var(--artwork-override-max-width, none);
    min-height: var(--artwork-override-min-height, 0);
    min-width: var(--artwork-override-min-width, 0);
    -o-object-fit: var(--artwork-override-object-fit,fill);
    object-fit: var(--artwork-override-object-fit, fill);
    -o-object-position: var(--artwork-override-object-position,center);
    object-position: var(--artwork-override-object-position, center);
    width: var(--artwork-override-width, 100%);
}
.artwork-component__contents.svelte-1fla0gl.svelte-1fla0gl {
    border-radius: 6px;
    transition: var(--global-transition, opacity .1s ease-in);
}
.now-playing-controls.svelte-173vgxg.svelte-173vgxg {
    flex: 0 100 calc(34.5% - 54px);
    margin: 0 32px;
}
.now-playing-controls.svelte-173vgxg.svelte-173vgxg {
    flex: 0 100 calc(34.5% - 54px);
    margin: 0 32px;
}
.playback-controls.svelte-1gorbyf {
    --progress-track-height: 7px;
    --progress-track-color: var(--systemTertiary-onDark);
    --progress-track-color-elapsed: var(--systemSecondary-onDark);
    --progress-thumb-color: transparent;
    --progress-thumb-height: 18px;
    --progress-thumb-offset: -6px;
    display: flex;
    flex-direction: column;
    height: 100%;
    -webkit-tap-highlight-color: transparent;
}
.controls.svelte-1gorbyf {
    display: flex;
    margin-bottom: auto;
    margin-top: auto;
}
.playback-buttons.svelte-1gorbyf {
    display: flex;
    flex: 1;
    gap: 32px;
    justify-content: space-evenly;
}
.svelte-1gorbyf {
    --iconSize: 50px;
}

.svelte-1gorbyf, .svelte-1gorbyf {
    --playback-control-icon-width: var(--iconSize);
    --playback-control-icon-height: var(--iconSize);
    display: block;
    flex: 0 0 var(--iconSize);
}
[hydrated] {
    visibility: inherit;
}
:host button {
    width: 100%;
    height: 100%;
    position: relative;
    transition: color 0.2s ease-out;
}
.button--previous {
    transform: rotate(180deg);
}
button {
    margin: 0;
    padding: 0;
    display: inline-block;
    border: 0;
    background-color: transparent;
    outline: none;
    cursor: pointer;
    appearance: none;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    width: 100%;
    height: 100%;
    color: var(--skip-control-color, var(--white80, rgba(255, 255, 255, 0.8)));
    background-position: center;
    background-size: contain;
}
:host {
    width: var(--playback-control-icon-width, 32px);
    height: var(--playback-control-icon-height, 28px);
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
button.button--undefined .icon {
    display: block;
}
button.button--undefined .icon svg {
    width: inherit;
    height: inherit;
    display: block;
    color: currentColor;
    pointer-events: none;
}
.icon-player-control {
    width: 4rem;
    height: 3.5rem;
}
.icon-player-control.prev {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}
.button__label {
    position: absolute;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(0 0 99.9% 99.9%);
    overflow: hidden;
    height: 1px;
    width: 1px;
    padding: 0;
    border: 0;
}
.svelte-1gorbyf {
    --iconSize: 68px;
}
.svelte-1gorbyf, .svelte-1gorbyf {
    --playback-control-icon-width: var(--iconSize);
    --playback-control-icon-height: var(--iconSize);
    display: block;
    flex: 0 0 var(--iconSize);
}
.playback-controls-play {
    width: var(--playback-control-button-width, 32px);
    height: var(--playback-control-button-height, 32px);
    display: flex;
    flex: 0 0 auto;
    align-items: stretch;
    justify-content: stretch;
    position: relative;
}
button.playback-play__play, button.playback-play__pause, button.playback-play__stop {
    position: relative;
    transition: transform 0.2s ease-out;
    margin: 0;
    padding: 0;
    display: inline-block;
    border: 0;
    background-color: transparent;
    outline: none;
    cursor: pointer;
    appearance: none;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    color: var(--playback-controls-play-color, #fff);
}
.playback-controls-play button {
    width: 100%;
    height: 100%;
    position: relative;
    transition: color 0.2s ease-out;
}
button.playback-play__play, button.playback-play__pause, button.playback-play__stop {
    position: relative;
    transition: transform 0.2s ease-out;
    margin: 0;
    padding: 0;
    display: inline-block;
    border: 0;
    background-color: transparent;
    outline: none;
    cursor: pointer;
    appearance: none;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    color: var(--playback-controls-play-color, #fff);
}
button.playback-play__play::before, button.playback-play__pause::before, button.playback-play__stop::before {
    content: "";
    width: 32px;
    height: 32px;
    display: block;
    position: absolute;
    z-index: -1;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: #000;
    transition: opacity 0.2s ease-out;
    opacity: 0;
}
*, :after, :before {
    box-sizing: inherit;
}
.playback-controls-play {
    width: var(--playback-control-icon-width, 32px);
    height: var(--playback-control-icon-height, 28px);
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
button.playback-play__play[aria-hidden=true], button.playback-play__pause[aria-hidden=true], button.playback-play__stop[aria-hidden=true] {
    opacity: 0;
    pointer-events: none;
}

button.playback-play__play, button.playback-play__pause, button.playback-play__stop {
    position: relative;
    transition: transform 0.2s ease-out;
    margin: 0;
    padding: 0;
    display: inline-block;
    border: 0;
    background-color: transparent;
    outline: none;
    cursor: pointer;
    appearance: none;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    color: var(--playback-controls-play-color, #fff);
}
.playback-controls-play button {
    width: 100%;
    height: 100%;
    position: relative;
    transition: color 0.2s ease-out;
}
button.playback-play__play::before, button.playback-play__pause::before, button.playback-play__stop::before {
    content: "";
    width: 32px;
    height: 32px;
    display: block;
    position: absolute;
    z-index: -1;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: #000;
    transition: opacity 0.2s ease-out;
    opacity: 0;
}

*, :after, :before {
    box-sizing: inherit;
}
.playback-controls-play {
    width: var(--playback-control-icon-width, 32px);
    height: var(--playback-control-icon-height, 28px);
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
button.playback-play__play[aria-hidden=true], button.playback-play__pause[aria-hidden=true], button.playback-play__stop[aria-hidden=true] {
    opacity: 0;
    pointer-events: none;
}

button.playback-play__play, button.playback-play__pause, button.playback-play__stop {
    position: relative;
    transition: transform 0.2s ease-out;
    margin: 0;
    padding: 0;
    display: inline-block;
    border: 0;
    background-color: transparent;
    outline: none;
    cursor: pointer;
    appearance: none;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    color: var(--playback-controls-play-color, #fff);
}
.playback-controls-play button {
    width: 100%;
    height: 100%;
    position: relative;
    transition: color 0.2s ease-out;
}
.svelte-1gorbyf {
    --iconSize: 50px;
}

.svelte-1gorbyf, .svelte-1gorbyf {
    --playback-control-icon-width: var(--iconSize);
    --playback-control-icon-height: var(--iconSize);
    display: block;
    flex: 0 0 var(--iconSize);
}
dialog.no-scrim.svelte-1a4zf5b+.backdrop, dialog.no-scrim.svelte-1a4zf5b::backdrop {
    --modalScrimColor: transparent;
}
dialog.svelte-1a4zf5b+.backdrop, dialog.svelte-1a4zf5b::backdrop {
    background-color: var(--modalScrimColor, rgba(0, 0, 0, .45));
}
dialog:-internal-dialog-in-top-layer::backdrop {
    position: fixed;
    background-color: rgba(0, 0, 0, 0.1);
    inset: 0px;
}

/*CONTRLS*/
.metadata.svelte-1k62exr.svelte-1k62exr {
    display: flex;
    margin: 0 32px 8px;
    padding-top: 3rem;
}
.metadata-container.svelte-1k62exr.svelte-1k62exr {
    position: relative;
    width: 100%;
}
.metadata__song-details.svelte-1k62exr.svelte-1k62exr {
    display: flex;
    justify-content: space-between;
    position: relative;
}
.svelte-1k62exr.svelte-1k62exr {
    --lcd-height: 48px;
    --lcd-justify-text: start;
    --lcd-primary-text-color: var(--systemPrimary-onDark);
    --lcd-secondary-text-color: var(--systemSecondary-onDark);
    --lcd-meta-explicit-icon-size: 17px;
    --lcd-meta-icon-color: var(--systemSecondary-onDark);
    --stopped-marquee-mask: linear-gradient(270deg, transparent, #000 32px);
    --stopped-marquee-mask-rtl: linear-gradient(-270deg, transparent, #000 32px);
    --animated-marquee-mask: linear-gradient(90deg, transparent, #000 64px, #000 calc(100% - 64px), transparent);
    width: calc(100% - 72px);
    -webkit-margin-start: -10px;
    -moz-margin-start: -10px;
    margin-inline-start: -10px;
    margin-inline-end: -36px;
}
.lcd-meta {
    max-width: 100%;
    height: calc(var(--lcd-height, 44px) - 3px);
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    align-items: var(--lcd-justify-text, center);
    justify-content: center;
    overflow: hidden;
    position: relative;
}
.lcd-meta__primary-wrapper {
    width: 100%;
    max-width: 100%;
}
.svelte-1k62exr .lcd-meta__primary {
    font: var(--title-2-emphasized);
}
.lcd-meta__primary-wrapper {
    min-width: 0;
}
.lcd-meta {
    max-width: 100%;
}
.lcd-meta__primary {
    font-size: 12px;
    line-height: 1.25;
    font-weight: 600;
    letter-spacing: 0em;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro", "SF Pro Icons", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
    color: var(--lcd-primary-text-color, var(--systemPrimary));
}
@media (max-width: 999px) {
    .lcd-meta-line.not-marquee {
        padding: var(--lcd-line-padding, 0 10px);
    }
}
@media (max-width: 999px) {
    .lcd-meta-line {
        justify-content: var(--lcd-justify-text, center);
        text-align: var(--lcd-justify-text, center);
    }
}
.lcd-meta-line {
    width: 100%;
    display: flex;
    box-sizing: border-box;
    flex-direction: row;
    align-items: center;
    justify-content: var(--lcd-justify-text, center);
    overflow: hidden;
    position: relative;
    text-align: var(--lcd-justify-text, center);
    text-overflow: none;
    white-space: nowrap;
}
.not-marquee .lcd-meta-line__string-container {
    position: relative;
    padding-inline-end: 0;
}
.lcd-meta-line__string-container {
    width: auto;
    min-width: 0;
}
.svelte-1k62exr .lcd-meta-line__marquee-mask {
    height: 24px;
    padding: 0;
}
.lcd-meta-line__marquee-mask {
    width: 100%;
    height: 16px;
}
.lcd-meta-line__marquee-scroller {
    display: grid;
    z-index: 1;
}
.lcd-meta-line__fragment {
    color: inherit;
    text-decoration: none;
}
.not-marquee .lcd-meta-line__scrolling-text-chunk--copy {
    display: none;
}
.lcd-meta-line__scrolling-text-chunk--copy {
    opacity: 0;
}
.lcd-meta-line__fragment {
    color: inherit;
    text-decoration: none;
}
.not-marquee .marquee-text__menu-slot-wrapper {
    inset-inline-start: calc(100% + 4px);
}
.marquee-text__menu-slot-wrapper {
    max-height: 16px;
    position: absolute;
    top: 0;
}
.svelte-1k62exr .lcd-meta__secondary {
    font: var(--title-2);
}
.lcd-meta {
    max-width: 100%;
}
.lcd-meta__secondary {
    font-size: 12px;
    line-height: 1.25;
    font-weight: 400;
    letter-spacing: 0em;
    font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Helvetica", "Arial", sans-serif;
    width: var(--lcd-secondary-width, 100%);
    min-height: 16px;
    position: relative;
    color: var(--lcd-secondary-text-color, var(--systemSecondary));
    transition: color 0.1s ease-in;
}
.svelte-1k62exr .lcd-meta__secondary .lcd-meta-line-wrapper {
    height: auto;
    position: static;
}
.lcd-meta__secondary .lcd-meta-line-wrapper {
    width: 100%;
    height: 21px;
    position: absolute;
    top: -5px;
}
.lcd-meta-line.is-marquee {
    justify-content: flex-end;
    position: relative;
}
.is-marquee {
    padding-right: 4px;
    flex-grow: 1;
    flex-shrink: 1;
}
@media (max-width: 999px) {
    .lcd-meta-line {
        justify-content: var(--lcd-justify-text, center);
        text-align: var(--lcd-justify-text, center);
    }
}
.lcd-meta-line {
    width: 100%;
    display: flex;
    box-sizing: border-box;
    flex-direction: row;
    align-items: center;
    justify-content: var(--lcd-justify-text, center);
    overflow: hidden;
    position: relative;
    text-align: var(--lcd-justify-text, center);
    text-overflow: none;
    white-space: nowrap;
}
.is-marquee .lcd-meta-line__string-container {
    padding: var(--lcd-line-padding, 0 10px);
}
.lcd-meta-line__string-container {
    width: auto;
    min-width: 0;
}
@media (max-width: 999px) {
    .lcd-meta__secondary .is-marquee:not(.is-animating) .lcd-meta-line__marquee-mask {
        mask: var(--stopped-marquee-mask-small, linear-gradient(270deg, transparent 0, black 15px));
    }
}
.lcd-meta__secondary .is-marquee:not(.is-animating) .lcd-meta-line__marquee-mask {
    mask: var(--secondary-mask-hover, var(--stopped-marquee-mask, linear-gradient(270deg, transparent 35px, black 50px)));
}
.is-marquee:not(.is-animating) .lcd-meta-line__marquee-mask {
    mask: var(--stopped-marquee-mask, linear-gradient(270deg, transparent 35px, black 50px));
}
.svelte-1k62exr .lcd-meta-line__marquee-mask {
    height: 24px;
    padding: 0;
}
.lcd-meta__secondary .lcd-meta-line__marquee-mask {
    padding: 3px 0 2px;
    height: 21px;
    box-sizing: border-box;
}
.lcd-meta-line__marquee-mask {
    width: 100%;
    height: 16px;
}
.is-marquee .lcd-meta-line__marquee-scroller {
    height: 15px;
    grid-template-columns: auto 1fr;
}
.lcd-meta-line__marquee-scroller {
    display: grid;
    z-index: 1;
}
.is-marquee .lcd-meta-line__scrolling-text-chunk {
    padding-inline-end: var(--marquee-line-padding);
}
button.lcd-meta-line__fragment {
    margin: 0;
    padding: 0;
    display: inline-block;
    border: 0;
    background-color: transparent;
    outline: none;
    cursor: pointer;
    appearance: none;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    line-height: initial;
}
.lcd-meta-line__fragment {
    color: inherit;
    text-decoration: none;
}
.is-marquee .lcd-meta-line__scrolling-text-chunk {
    padding-inline-end: var(--marquee-line-padding);
}
.lcd-meta-line__scrolling-text-chunk--copy {
    opacity: 0;
}
.is-marquee .marquee-text__menu-slot-wrapper {
    inset-inline-end: var(--menu-position-shift, 26px);
}
.marquee-text__menu-slot-wrapper {
    max-height: 16px;
    position: absolute;
    top: 0;
}
.playback-item--large.svelte-1k62exr .accessory-buttons.svelte-1k62exr {
    position: static;
}

.accessory-buttons.svelte-1k62exr.svelte-1k62exr {
    --contextMenuCircleFillOverride: var(--systemQuaternary-onDark);
    --favoriteButtonSize: 28px;
    --favoriteButtonBackground: var(--systemQuaternary-onDark);
    --favoriteButtonStarOutline: var(--systemPrimary-onDark);
    --favoriteButtonStarCutout: var(--systemSecondary-onDark);
    --favoriteButtonStarFill: transparent;
    --favoriteButtonBackground-hover: var(--favoriteButtonBackground);
    --favoriteButtonStarOutline-hover: var(--favoriteButtonStarOutline);
    --favoriteButtonStarCutout-hover: var(--favoriteButtonStarCutout);
    --favoriteButtonStarFill-hover: var(--favoriteButtonStarFill);
    align-items: center;
    display: flex;
    gap: 16px;
    justify-content: flex-end;
    position: absolute;
    right: 0;
}
.favorite-button--platter.svelte-j6xj5e {
    --favoriteIconStarOutline: hsla(0, 0%, 100%, .92);
    background: hsla(0, 0%, 100%, .42);
    border-radius: 50%;
}

.favorite-button.svelte-j6xj5e {
    align-items: center;
    background: hsla(0, 0%, 100%, .42);
    display: flex;
    height: var(--favoriteButtonSize, 100%);
    justify-content: center;
    line-height: 0;
    width: var(--favoriteButtonSize, 100%);
}
.favorite-icon.svelte-exd8bk {
    height: var(--favoriteIconSize, 28px);
    width: var(--favoriteIconSize, 28px);
}
.comp-media-show {
    opacity: 1;
    top: 0vh;
    transition: opacity 0.5s, transform 0.5s;
    
}
.comp-media-hidden {
    opacity: 1;
    top:100vh;
    transition: opacity 0.5s, transform 0.5s;
    
}

/* end player complete*/

/* discs */

.shelf-grid__body.svelte-ye5jkb.svelte-ye5jkb {
    box-sizing: content-box;
    margin-inline-end: -2px;
    margin-inline-start: -2px;
    overflow: visible;
    padding-inline-end: 2px;
    padding-inline-start: 2px;
    width: 100%;
}
.shelf:has(.shelf-grid__list--grid-rows-1) .shelf-grid-nav__arrow.svelte-1xmivhv {
    top: anchor(--shelf-first-artwork center, 50%);
}

.shelf-grid--onhover.svelte-ye5jkb .shelf-grid-nav__arrow {
    opacity: 0;
    transition: background-color .25s linear, color .25s linear, opacity .25s linear;
    will-change: opacity;
}
.shelf-grid-nav__arrow--left.svelte-1xmivhv {
    left: 6px;
}
.shelf-grid-nav__arrow.svelte-1xmivhv {
    align-items: center;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    height: 64px;
    justify-content: center;
    overflow: hidden;
    position: absolute;
    top: 50%;
    transition: background-color .25s linear, color .25s linear, opacity .25s linear;
    translate: 0 -50%;
    width: 28px;
    z-index: var(--z-default);
}

.shelf-grid__list.svelte-ye5jkb.svelte-ye5jkb {
    align-items: stretch;
    -moz-column-gap: 19px;
    column-gap: 19px;
}
@media (min-width: 1000px) {
    .shelf-grid__list.svelte-ye5jkb.svelte-ye5jkb {
        margin-inline-end: calc(var(--standard-lockup-shadow-offset, 15px) * -1);
        margin-inline-start: calc(var(--standard-lockup-shadow-offset, 15px) * -1);
        padding-inline-end: var(--standard-lockup-shadow-offset, 15px);
        padding-inline-start: var(--standard-lockup-shadow-offset, 15px);
        width: calc(100% + 0px);
    }
}
.shelf-grid__list.svelte-ye5jkb.svelte-ye5jkb {
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: column;
    list-style: none;
    margin: 0;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0;
    -webkit-overflow-scrolling: touch;
    margin-bottom: calc(var(--override-shelf-overflow-bleed-bottom, var(--overflowBleedBottom, 15px)) * -1);
    margin-top: calc(var(--override-shelf-overflow-bleed-top, var(--overflowBleedTop, 15px)) * -1);
    overscroll-behavior-x: none;
    padding-bottom: var(--override-shelf-overflow-bleed-bottom, var(--overflowBleedBottom, 15px));
    padding-top: var(--override-shelf-overflow-bleed-top, var(--overflowBleedTop, 15px));
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}
ul {
    list-style-type: none;
}
.shelf-grid__list-item.svelte-ye5jkb.svelte-ye5jkb {
        contain: content;
    margin-top: calc(var(--override-shelf-overflow-bleed-top, var(--standard-lockup-shadow-offset, 15px)) * -1);
    margin-inline-end: calc(var(--standard-lockup-shadow-offset, 13px) * -1);
    margin-bottom: calc(var(--override-shelf-overflow-bleed-bottom, var(--standard-lockup-shadow-offset, 15px)) * -1);
    margin-inline-start: calc(var(--standard-lockup-shadow-offset, 13px) * -1);
    padding-inline-end: var(--standard-lockup-shadow-offset, 15px);
    padding-bottom: var(--override-shelf-overflow-bleed-bottom, var(--standard-lockup-shadow-offset, 15px));
    padding-top: var(--override-shelf-overflow-bleed-top, var(--standard-lockup-shadow-offset, 15px));
    padding-inline-start: var(--standard-lockup-shadow-offset, 14px);
    scroll-snap-align: start;
}

li {
    list-style: none;
}

.product-lockup.interactive.svelte-1t8rpbz.svelte-1t8rpbz {
    cursor: pointer;
}
.product-lockup.svelte-1t8rpbz.svelte-1t8rpbz {
    height: 100%;
    min-width: 0;
}
[draggable=true] {
    -webkit-user-drag: element;
}
.product-lockup__artwork.svelte-1t8rpbz.svelte-1t8rpbz {
    border-radius: var(--global-border-radius-medium, 12px);
    /*box-shadow: 0 1px 1px rgba(0, 0, 0, .01), 0 2px 2px rgba(0, 0, 0, .01), 0 4px 4px rgba(0, 0, 0, .02), 0 8px 8px rgba(0, 0, 0, .03), 0 14px 14px rgba(0, 0, 0, .03);*/
    position: relative;
    z-index: 1
}
@media (min-width: 1000px) {
    .shelf-grid__list.svelte-ye5jkb .svelte-ye5jkb:first-child .artwork-component:not(.artwork-component--no-anchor) {
        anchor-name: --shelf-first-artwork;
    }
}

.product-lockup__artwork.svelte-1t8rpbz .artwork-component {
    --override-placeholder-bg-color: var(--artwork-bg-color);
}
.artwork-component--fullwidth.svelte-1fla0gl.svelte-1fla0gl, .artwork-component--fullwidth.svelte-1fla0gl>noscript {
    width: 100%;
}
.artwork-component.svelte-1fla0gl.svelte-1fla0gl {
    background-color: var(--override-placeholder-bg-color, var(--placeholder-bg-color, var(--genericJoeColor)));
    border-radius: inherit;
    box-sizing: border-box;
    contain: content;
    height: var(--artwork-override-height, auto);
    max-height: var(--artwork-override-max-height, none);
    max-width: var(--artwork-override-max-width, none);
    min-height: var(--artwork-override-min-height, 0);
    min-width: var(--artwork-override-min-width, 0);
    overflow: hidden;
    position: relative;
    width: var(--artwork-override-width, 100%);
    z-index: 1
}
.product-lockup__artwork.svelte-1t8rpbz .artwork-component {
    --override-placeholder-bg-color: var(--artwork-bg-color);
}
.artwork-component.artwork-component--has-borders.svelte-1fla0gl.svelte-1fla0gl:after {
    border-radius: var(--afterShadowBorderRadius, inherit);
    box-shadow: var(--artworkShadowInset);
    content: "";
    display: block;
    height: 0;
    max-height: 100%;
    max-width: 100%;
    min-height: 100%;
    min-width: 100%;
    opacity: var(--containerInnerStrokeAlpha, .1);
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: calc(var(--z-default) + 1);
}
*, :after, :before {
    box-sizing: inherit;
}
.artwork-component__image.svelte-1fla0gl.svelte-1fla0gl {
    display: block;
    height: var(--artwork-override-height, auto);
    max-height: var(--artwork-override-max-height, none);
    max-width: var(--artwork-override-max-width, none);
    min-height: var(--artwork-override-min-height, 0);
    min-width: var(--artwork-override-min-width, 0);
    -o-object-fit: var(--artwork-override-object-fit,fill);
    object-fit: var(--artwork-override-object-fit, fill);
    -o-object-position: var(--artwork-override-object-position,center);
    object-position: var(--artwork-override-object-position, center);
    width: var(--artwork-override-width, 100%);
}

.artwork-component__contents.svelte-1fla0gl.svelte-1fla0gl {
    border-radius: inherit;
    transition: var(--global-transition, opacity .1s ease-in);
}
.square-lockup__social.svelte-152pqr7 {
    bottom: 8px;
    inset-inline-end: 8px;
    position: absolute;
    z-index: 1
}
.product-lockup__controls.svelte-1t8rpbz.svelte-1t8rpbz {
    border-radius: inherit;
    height: 100%;
    opacity: var(--scrimOpacity, 0);
    position: absolute;
    top: 0;
    transition: var(--global-transition);
    width: 100%;
    z-index: calc(var(--z-default) + 1);
}
.product-lockup__link.svelte-1t8rpbz.svelte-1t8rpbz {
    color: transparent;
    display: block;
    height: 100%;
    position: absolute;
    width: 100%;
    z-index: 1
}
.product-lockup__play-button.svelte-1t8rpbz.svelte-1t8rpbz {
    --iconCircleFillBGOverride: transparent;
    bottom: 2rem;
    inset-inline-end: 2rem;
    line-height: 0;
    position: absolute;
    z-index: 1
}
.play-button--platter.svelte-19j07e7:not(.play-button--artwork-overlay) {
    display: block;
    line-height: 0;
}

.play-button.svelte-19j07e7 {
    --nonPlatterIconFill: var(--playButtonIconColor, #fff);
    --playingBarColor: var(--nonPlatterIconFill, #fff);
    line-height: 0;
    pointer-events: auto;
    position: relative;
    z-index: 1
}
.play-button--platter.svelte-19j07e7 {
    --iconCircleFillBG: var(--iconCircleFillBGOverride, var(--systemQuaternary));
    --iconFillArrow: var(--playButtonIconColor, #fff);
    border-radius: 50%;
}
button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
@supports ((-webkit-backdrop-filter:blur(10px)) or (backdrop-filter:blur(10px))) {
    .play-button--platter.svelte-19j07e7:not(.play-button--artwork-overlay) .icon {
        -webkit-backdrop-filter: saturate(190%) blur(60px);
        backdrop-filter: saturate(190%) blur(60px);
        background-color: var(--systemStandardThinMaterialSover);
    }
}

.play-button--platter.svelte-19j07e7:not(.play-button--artwork-overlay) .icon {
    background-color: var(--systemStandardThinMaterialSover-default_IC);
    border-radius: 50%;
}
.play-button--platter.is-stand-alone.svelte-19j07e7 .icon, .play-button--platter.svelte-19j07e7 .icon {
    height: var(--playButtonSize, 30px);
    width: var(--playButtonSize, 30px);
}
.play-button--platter.svelte-19j07e7 .icon {
    display: inline-block;
}
.play-button.svelte-19j07e7 .icon {
    display: inline-block;
}
.product-lockup__context-button.svelte-1t8rpbz.svelte-1t8rpbz {
    bottom: 10px;
    inset-inline-end: 10px;
    line-height: 0;
    position: absolute;
    z-index: 1
}
.contextual-menu__trigger {
    margin: 0;
    padding: 0;
    display: block;
    border: 0;
    background-color: transparent;
    outline: none;
    cursor: pointer;
    appearance: none;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    border-radius: var(--ctxmenu-trigger-border-radius, 50%);
    background-color: var(--ctxmenu-trigger-background-color, transparent);
    transition: opacity 0.1s ease-in;
    opacity: var(--ctxmenu-trigger-opacity, 1);
    cursor: pointer;
    backdrop-filter: blur(var(--ctxmenu-trigger-backdrop-blur, 0));
}
@supports ((-webkit-backdrop-filter:blur(10px)) or (backdrop-filter:blur(10px))) {
    .more-button--material.svelte-dj0bcp.svelte-dj0bcp {
        -webkit-backdrop-filter: saturate(190%) blur(60px);
        backdrop-filter: saturate(190%) blur(60px);
        background-color: #fffffffa;
    }
}

.more-button--material.svelte-dj0bcp.svelte-dj0bcp {
    background-color: #fffffffa;
    height: var(--contextMenuButtonSize, 30px);
    width: auto;
    padding-left: 2rem;
    padding-right: 2rem;
}
.more-button--platter.svelte-dj0bcp.svelte-dj0bcp {
    --iconCircleFill: var(--contextMenuCircleFillOverride, transparent);
    --iconEllipsisFill: var(--contextMenuEllipsisFillOverride, #d60017);
    border-radius: 14px;
}
.more-button.svelte-dj0bcp.svelte-dj0bcp {
    --iconCircleFill: transparent;
    --iconEllipsisFill: var(--contextMenuEllipsisFillOverride, #fff);
    display: block;
    height: var(--contextMenuButtonSize, 45px);
    line-height: 0;
    width: auto;
    padding-left: 2rem;
    padding-right: 2rem;
}

amp-contextual-menu-button.svelte-dj0bcp:hover .more-button--material {
    --iconCircleFill: var(--contextMenuCircleHoverFill, var(--keyColor));
    --iconEllipsisFill: var(--contextMenuEllipsisHoverFill, #d60017);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    background-color: #f9f9f9;
}

@media (hover: hover) and (pointer: fine) {
    amp-contextual-menu-button.svelte-dj0bcp:hover .more-button--platter {
        --iconCircleFill: var(--contextMenuCircleHoverFill, transparent);
        --iconEllipsisFill: var(--contextMenuEllipsisHoverFill, #fff);
    }
}


@media (hover: hover) and (pointer: fine) {
    amp-contextual-menu-button.svelte-dj0bcp:hover .product-lockup.interactive.svelte-1t8rpbz.svelte-1t8rpbz {
        --scrimOpacity: 1 !important;
        transition: opacity 1s ease-in;
    }
}
/* button-play hover*/
.product-lockup.interactive.svelte-1t8rpbz.svelte-1t8rpbz {
    --scrimOpacity: 1 !important;
    transition: opacity 1s ease-in;
}
.product-lockup.interactive.svelte-1t8rpbz.svelte-1t8rpbz:hover {
    --scrimOpacity: 1 !important;
    transition: opacity 1s ease-in;
}

.content-browse-input {
    margin-top: -2rem !important;
}

.resize-map-content {
    padding-left: 2.9rem !important;
    padding-top: 4.2rem !important;
    width: calc(100% + 57px) !important;
}

/* end discs */

#ck-container {
    background-color: transparent;
    border-width: 0;
    z-index: var(--z-modal);
}
.ck-curtain {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.48);
}
.cc-modal {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100vw;
    height: 100vh;
    z-index: 9999;
    position: fixed;
    top: 0;
    left: 0;
    background-color: #bdbdbdad;
}
.cc-modal__modal {
    position: fixed;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: 0 5px 10px rgba(0, 0, 0, .1);
    background: #fff;
    height: 100%;
    width: 100%;
    max-width: 800px;
    max-height: 680px;
    border-radius: 40px;
    -webkit-backdrop-filter: saturate(60%) blur(20px);
    backdrop-filter: saturate(60%) blur(20px);
    background-color: #fffffffa;
    z-index: 9999;
    top: 50%;
    margin-top: -340px;
    left: 50%;
    margin-left: -400px;
}
@media (max-width: 1030px){
    .cc-modal__modal {
        max-height: calc(100vh - 0rem);
        border-bottom-left-radius: 0px;
        border-bottom-right-radius: 0px;
        bottom: 0;
        z-index: 9999;
        position: fixed;
        left: 0;
        margin-left: auto;
        margin-top: auto;
    }
}
.cc-modal__body {
    flex: 1;
    overflow-x: hidden;
    overflow-y: auto;
}
.cwc-app {
    display: contents;
}
.is-ltr .cc-modal__header {
    right: 0;
}

.is-ltr .cc-modal__header, .is-rtl .cc-modal__header {
    left: 0;
}
.cc-modal__header {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    position: absolute;
    top: 0;
    z-index: 100;
    pointer-events: none;
}
.is-ltr .cc-modal__close-button {
    margin: 20px 0 0 20px;
}

.cc-modal__close-button {
    padding: 4px;
    border-radius: 50%;
    pointer-events: auto;
}
body, button, input, select, textarea {
    font-synthesis: none;
    -moz-font-feature-settings: "kern";
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
button {
    background: none;
    border: 0;
    box-sizing: content-box;
    color: inherit;
    cursor: pointer;
    font: inherit;
    line-height: inherit;
    overflow: visible;
    vertical-align: inherit;
}
.cc-modal__close-button-circle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    transition: background .1s linear;
    background: #e8e8ed;
}
.cc-modal__close-button-icon, .theme-dark .cc-modal__close-button-icon {
    height: 14px;
    width: 14px;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

.cc-modal__close-button-icon {
    display: inline-block;
    transition: background .1s linear;
    background-color: rgba(0, 0, 0, .56);
}
.is-ltr .cc-modal__kit-device-icon {
    margin: 28px 28px 0 auto;
}

.cc-modal__kit-device-icon {
    height: 25px;
    width: 25px;
    background-color: #ccc;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;

}
.page-container--padded.page-container--modal.page-container--full-height {
    padding-bottom: 30px;
}
.offer-music-modal-wrapper .offer-music {
    margin: auto;
    padding-top: 30px;
    display: flex;
    flex-direction: column;
    max-width: 750px;
    height: 100%;
    box-sizing: border-box;
}
.offer-music-modal-wrapper .offer-music__hero-wrapper {
    direction: ltr;
}
.cover-art-collage[data-v-5826276c] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    grid-template-areas:
        ". . c c . ."
        ". . c c . .";
}

.offer-music-modal-wrapper .offer-music__hero {
    position: relative;
    left: 50%;
    transform: translate(-50%);
    min-width: 140%;
}
.cover-art-collage__image--center[data-v-5826276c] {
    grid-area: c;
}
.cover-art {
    background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
    border-radius: 8px;
    border: .5px solid #e6e6e6;
}
.offer-music-modal-wrapper .offer-music__content {
    margin: 0 auto;
    padding: 1rem 2rem;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    max-width: 500px;
}
.offer-music-modal-wrapper .offer-music__wordmark {
    margin: 0 auto .8rem;
    fill: #1d1d1f;
    height: 20px;
}

.offer-music__wordmark {
    fill: #1d1d1f;
}
.heading[data-v-dca24a8e] {
    margin-bottom: 1.2rem;
}

.offer-music-modal-wrapper .offer-music__heading {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 1rem;
}
.heading[data-v-dca24a8e] {
    margin-bottom: 1.2rem;
}
.cc-modal__body .heading {
    font-size: 32px;
    line-height: 1.125;
    font-weight: 600;
    letter-spacing: .004em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial, sans-serif;
}
.offer-music-modal-wrapper .offer-music__body {
    margin: 0 0 1.2rem;
}
.theme-music .button.web-button.web-button--primary {
    --sk-button-background: #fa233b;
    --sk-button-background-hover: #fb394f;
    --sk-button-background-active: #f90722;
}

.offer-music-modal-wrapper .offer-music__cta {
    margin: 0 auto;
    display: block;
    min-width: 250px;
    background: #fa233b;
}
.button.web-button--rectangle {
    border-radius: 8px;
}
.button.web-button {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.button {
    --sk-button-color: #fff;
    --sk-button-color-hover: var(--sk-button-color);
    --sk-button-color-active: var(--sk-button-color-hover);
    --sk-button-disabled-opacity: var(--sk-link-disabled-opacity, 0.42);
    --sk-button-border-color: transparent;
    --sk-button-border-radius: 980px;
    --sk-button-margin-horizontal: 14px;
    --sk-button-margin-vertical: 14px;
    --sk-button-min-width-basis: 60px;
    --sk-button-padding-horizontal: 16px;
    --sk-button-padding-vertical: 9px;
    --sk-button-border-width: 1px;
    --sk-button-box-sizing: content-box;
    --sk-button-width: auto;
    --sk-button-display: inline-block;
    font-size: 14px;
    line-height: 1.2857742857;
    font-weight: 400;
    letter-spacing: -.016em;
    font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial, sans-serif;
    background: var(--sk-button-background);
    color: var(--sk-button-color);
    border-color: var(--sk-button-border-color);
    padding-block: calc(var(--sk-button-padding-vertical) - var(--sk-button-border-width));
    padding-inline: calc(var(--sk-button-padding-horizontal) - var(--sk-button-border-width));
    border-radius: var(--sk-button-border-radius);
    border-style: solid;
    border-width: var(--sk-button-border-width);
    width: var(--sk-button-width);
    min-width: calc(var(--sk-button-min-width-basis) - var(--sk-button-padding-horizontal) * 2);
    cursor: pointer;
    display: var(--sk-button-display);
    box-sizing: var(--sk-button-box-sizing);
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    --sk-button-background: #0071e3;
    --sk-button-background-hover: #0077ed;
    --sk-button-background-active: #006edb;
}
.item-type-select {
    border: 2px solid transparent;
}
.item-type-select.selected {
    border: 2px solid #0071e3;
}

.search-box-shop {
    position: relative;
    width: 100%;
}
.placeholder-container {
    position: absolute;
    left: 20px;
    top: 3px;
    height: 40px;
    width: calc(100% - 0px);
    overflow: hidden;
    pointer-events: none;
}
.placeholder-text {
    transition: transform 0.9s ease;
}
.placeholder-text div {
    font-family: 'Mona Sans', Arial, Helvetica, sans-serif;
    font-size: 1.32rem;
    font-weight: 400;
    height: 40px;
    line-height: 40px;
    color: #555;
}
.product-move-list {
    opacity: 0;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
}
.product-hover-function:hover .product-move-list  {
    opacity: 1;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
}

/* emnty */

.box-empty-none {
    width: 100%;
    height: 54px;
    background-color: #ffffff;
    box-shadow: 0px 0px 10px 3px rgba(194, 197, 201, 0.43);
    -webkit-box-shadow: 0px 0px 17px 3px rgb(227 229 231 / 53%);
    -moz-box-shadow: 0px 0px 10px 3px rgba(194, 197, 201, 0.43);
    border: 1px solid #eeeeee;
    border-radius: 10px;
}

/* en emnty*/

/* menu */

.contextual-menu {
    padding: 0;
    min-width: var(--ctxmenu-item-min-width, 185px);
    max-width: var(--ctxmenu-item-max-width, 350px);
    display: none;
    position: absolute;
    z-index: 999;
    top: 5px;
    bottom: var(--ctxmenu-bottom);
    right: 34px;
    border: 1px solid #cfcfd238;
    border-radius: 6px;
    overflow: auto;
}
.control-item-options:hover + .contextual-menu,
.contextual-menu:hover {
    display: block !important;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
}
@supports (backdrop-filter: blur(10px)) {
    .contextual-menu::before {
        background-color: var(--systemStandardThickMaterialSover);
        backdrop-filter: blur(60px) saturate(210%);
    }
}
amp-contextual-menu {
    --ctxmenu-item-bg-hover: rgba(0,0,0,.05);
    --borderRule: var(rgba(60,60,67,.29), rgba(0, 0, 0, .15));
    --ctxmenu-item-min-width: 185px;
    --ctxmenu-z-index: 9951;
    --ctxmenu-scrim-z-index: calc(9951 - 1);
    --keyColor-focus-color: rgba(214,0,23, .6);
    position: relative;
}
.contextual-menu::before {
    background-color: #fff;
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    border-radius: inherit;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.2), 0 8px 40px var(rgba(0,0,0,.25));
    backdrop-filter: blur(60px) saturate(210%);
}
.contextual-menu__list {
    min-width: var(--ctxmenu-item-min-width, 185px);
    max-width: 100%;
    max-height: var(--ctxmenu-submenu-max-height, auto);
    overflow-x: hidden;
    overflow-y: auto;
    pointer-events: auto;
}
.contextual-menu-item {
    margin: 0;
    padding: 0;
    position: static;
    color: rgba(0,0,0,.88);
    list-style-type: none;
    pointer-events: auto;
}
@media (min-width: 484px) {
    amp-contextual-menu-item:first-of-type>li>button {
        border-top-left-radius: 6px;
        border-top-right-radius: 6px;
    }
}

amp-contextual-menu-item:last-child>li>button {
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}
amp-contextual-menu-item:first-child>li>button {
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}
@media (min-width: 484px) {
    .contextual-menu-item>button, .contextual-menu-item>label {
        padding: 0 10px;
        height: 32px;
    }
}
.contextual-menu-item>button, .contextual-menu-item>label {
    margin: 0;
    padding: 0;
    display: flex;
    border: 0;
    outline: none;
    cursor: pointer;
    appearance: none;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    font-size: 13px;
    line-height: 1.2307692308;
    font-weight: 400;
    letter-spacing: 0em;
    font-family: "Mona Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
    padding: 0 17px;
    width: 100%;
    height: 45px;
    align-items: center;
    justify-content: space-between;
    background-color: transparent;
    outline: none;
    -webkit-tap-highlight-color: #fff;
    background-color: transparent;
        backdrop-filter: blur(60px) saturate(210%);
}
.contextual-menu-item__option-wrapper {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

*, :after, :before {
    box-sizing: inherit;
}
.contextual-menu-item .contextual-menu-item__option-text--after {
    position: absolute;
    transition-property: 0;
    transition-duration: 0s;
    opacity: 1;
    pointer-events: none;
}

.contextual-menu-item__option-text {
    max-width: 100%;
    display: block;
    overflow: hidden;
    text-align: start;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.contextual-menu-item__icon-container {
    width: 16px;
    height: 16px;
}
.contextual-menu-item>button svg, .contextual-menu-item>label svg {
    width: inherit;
    height: inherit;
    display: block;
    fill: currentColor;
}
/* end menu */

.itm-like {
    animation: likeQui 0.35s ease;
}
.itm-like-active {
    animation: likePop 0.35s ease;
}
@keyframes likePop {
    0% { transform: scale(1); }
    40% { transform: scale(1.4); }
    70% { transform: scale(0.9); }
    100% { transform: scale(1); }
}
@keyframes likeQui {
    0% { transform: scale(1); }
    40% { transform: scale(1.1); }
    70% { transform: scale(0.9); }
    100% { transform: scale(1); }
}
.day-selected-library {
    border: 1px solid #71b8e07a !important;
    background-color: #bfc9cf7a !important;
}

.marker-wrapper {
    width: 30px;
    height: 30px;
    background: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
  
    /* contorno */
    border: 3px solid #ffffff;
  
    /* sombra tipo Waze */
    box-shadow: 0 2px 6px rgba(0,0,0,0.3);
  }
  
  .marker-img {
    width: 30px;
    height: 30px;
    object-fit: contain;
  }
  .leaflet-div-icon {
    background: transparent !important;
    border: 0px solid transparent !important;
  }

  .shelf-grid__list-item.svelte-ye5jkb.svelte-ye5jkb:last-child {
    padding-inline-end: var(--standard-lockup-shadow-offset, 15px) !important;
  }

.mmr-padding { 
    padding-right: 2.5rem !important;
    padding-left: 2.5rem !important;
}
  /* para que aplique si es ceclualr */
  @media (max-width: 1030px){
    .shelf-grid__list-item.svelte-ye5jkb.svelte-ye5jkb:last-child {
        padding-inline-end: var(--standard-lockup-shadow-offset, 15px) !important;
    }
    .leaflet-control-container {
        opacity: 0 !important;
    }
    .mmr-padding { 
        padding-right: 2.5rem !important;
        margin-top: 1.5rem;
    }
    #act-button-close-up {
        display: none !important;
    }
    .margin-top-2-rem {
        padding-bottom: 11.3rem !important;
    }
    
}

.act-button-change-cover{
    opacity: 0;
} 
.artwork-cover-application:hover .act-button-change-cover{
    opacity: 1;
}
.sidebar>* {
    touch-action: pan-y;
}
.library>* {
    touch-action: pan-y;
}
.sidebar-menu>* {
    touch-action: pan-y;
}
.grid.grid--flow-row.grid--category-bricks.svelte-1a54yxp.svelte-1a54yxp>* {
    touch-action: pan-y;
}

@media screen and (orientation: landscape) {
    body {
      /*transform: rotate(90deg); */
    }
}

.body-map-options {
    opacity: 1;
    transform: translateY(260px);
    transition: opacity 0.5s, transform 0.5s;
}
.body-map-options-hide {
    opacity: 1;
    transform: translateY(calc(100vh - 153px));
    transition: opacity 0.5s, transform 0.5s;
}
.body-map-options-full {
    opacity: 1;
    transform: translateY(700px);
    transition: opacity 0.5s, transform 0.5s;
}

/* home */

.temporal-home * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: Arial, sans-serif;
  }

  body .temporal-home {
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: #fff;
  }

  /* HEADER */
  .temporal-home .header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
  }

  .temporal-home .menu-icon {
    font-size: 22px;
    cursor: pointer;
  }

  .temporal-home .header-right {
    display: flex;
    align-items: center;
    gap: 15px;
    font-size: 14px;
  }

  .temporal-home .header-right span {
    cursor: pointer;
    color: #555;
  }

  .temporal-home .avatar {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #ccc;
  }

  /* CENTER */
  .temporal-home .center {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 20px;
  }

  .temporal-home .content {
    display: flex;
    align-items: center;
    gap: 15px;
    flex-wrap: wrap;
    justify-content: center;
  }

  .temporal-home .logo {
    font-size: 60px;
    font-weight: bold;
    background: linear-gradient(45deg, #4285F4, #EA4335, #FBBC05, #34A853);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

  .temporal-home .text {
    text-align: left;
  }

  .temporal-home .text h2 {
    font-size: 20px;
    color: #555;
  }

  .temporal-home .text p {
    font-size: 11px;
    color: #333;
  }

  /* FOOTER */
  .temporal-home .footer {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 15px 20px;
    font-size: 12px;
    color: #777;
  }

  .temporal-home .footer div {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
  }

  /* RESPONSIVE */
  @media (max-width: 600px) {
    .temporal-home .logo {
      font-size: 40px;
    }

    .temporal-home .text h2 {
      font-size: 16px;
    }

    .temporal-home .header {
      padding: 10px;
    }

    .temporal-home .footer {
      flex-direction: column;
      gap: 10px;
      text-align: center;
    }
  }


/* end home */

.progress-line {
    width: 100%;
    height: 2px;
    appearance: none;
    -webkit-appearance: none;
  }
  
  /* Fondo (línea base) */
  .progress-line::-webkit-progress-bar {
    background-color: #e0e0e0;
    border-radius: 2px;
  }
  
  /* Progreso (parte llena) */
  .progress-line::-webkit-progress-value {
    background-color: #000;
    border-radius: 2px;
  }
  
  /* Firefox */
  .progress-line::-moz-progress-bar {
    background-color: #000;
    border-radius: 2px;
  }
  .inactive-button-upload {
    opacity: 0.12;
  }

.timer-seconds-song {
    color: #777;
}

.note-class-selected .timer-seconds-song {
    color: #ffffff;
}

.resize-cover-item-list {
    margin-left: -6px !important;
}

.click-button:active {
    opacity: 0.45 imo !important;
}

/* --- */
@media (min-width: 0px) and (max-width: 360px) {
    .shelf-grid__list.svelte-ye5jkb.svelte-ye5jkb {
        -moz-column-gap: 12px;
        column-gap: 12px;
        grid-auto-columns: calc((100% - (0 - 1) * -80px) / 1);
        grid-template-rows: repeat(1, max-content);
        row-gap: 24px;
    }
    .authors-circle-items {
        grid-template-rows: repeat(1, max-content) !important;
        column-gap: 12px !important;
        grid-auto-columns: calc((100% - (5 - 1) * -5px) / 4) !important;
    }
    .bg-gris {
        background-color: #f9f9f9 !important;
    }
}
@media (min-width: 360px) and (max-width: 500px) {
    .shelf-grid__list.svelte-ye5jkb.svelte-ye5jkb {
        -moz-column-gap: 12px;
        column-gap: 12px;
        grid-auto-columns: calc((100% - (2 - 1) * 24px) / 2);
        grid-template-rows: repeat(1, max-content);
        row-gap: 24px;
    }
    .authors-circle-items {
        grid-template-rows: repeat(1, max-content) !important;
        column-gap: 20px !important;
        grid-auto-columns: calc((100% - (5 - 1) * -18px) / 5) !important;
    }
    .bg-gris {
        background-color: #f9f9f9 !important;
    }
    .resize-cover-item-list {
        margin-left: 0px !important;
    }
}
@media (min-width: 500px) and (max-width: 740px) {
    .shelf-grid__list.svelte-ye5jkb.svelte-ye5jkb {
        -moz-column-gap: 12px;
        column-gap: 12px;
        grid-auto-columns: calc((100% - (3 - 1) * 19px) / 3);
        grid-template-rows: repeat(1, max-content);
        row-gap: 24px;
    }
    .authors-circle-items {
        grid-template-rows: repeat(1, max-content) !important;
        column-gap: 12px !important;
        grid-auto-columns: calc((100% - (5 - 1) * -10px) / 6) !important;
    }
    .bg-gris {
        background-color: #f9f9f9 !important;
    }
}
@media (min-width: 740px) and (max-width: 1030px) {
    .shelf-grid__list.svelte-ye5jkb.svelte-ye5jkb {
        -moz-column-gap: 12px;
        column-gap: 12px;
        grid-auto-columns: calc((100% - (4 - 1) * 16px) / 4);
        grid-template-rows: repeat(1, max-content);
        row-gap: 24px;
    }
    .authors-circle-items {
        grid-template-rows: repeat(1, max-content) !important;
        column-gap: 13px !important;
        grid-auto-columns: calc((100% - (5 - 1) * -5px) / 8) !important;
    }
}
@media (min-width: 1030px) and (max-width: 1200px) {
    .shelf-grid__list.svelte-ye5jkb.svelte-ye5jkb {
        -moz-column-gap: 12px;
        column-gap: 12px;
        grid-auto-columns: calc((100% - (5 - 1) * 14px) / 5);
        grid-template-rows: repeat(1, max-content);
        row-gap: 24px;
    }
    .authors-circle-items {
        grid-template-rows: repeat(1, max-content) !important;
        column-gap: 13px !important;
        grid-auto-columns: calc((100% - (5 - 1) * -1px) / 9) !important;
    }
}
@media (min-width: 1200px) and (max-width: 5500px) {
    .shelf-grid__list.svelte-ye5jkb.svelte-ye5jkb {
        -moz-column-gap: 9px;
        column-gap: 9px;
        grid-auto-columns: calc((100% - (5 - 1) * -26px) / 5);
        grid-template-rows: repeat(1, max-content);
        row-gap: 24px;
    }
    .authors-circle-items {
        grid-template-rows: repeat(1, max-content) !important;
        column-gap: 30px !important;
        grid-auto-columns: calc((100% - (5 - 1) * -11px) / 8) !important;
    }
}

@media (max-width: 5500px){
    .resize-cover-disc-list {
        width: 34.5rem; /* width: 18.4rem;*/
    }
    .resize-cover-disc-latest {
        width: 21.1rem !important; /* width: 18.4rem;*/
        padding-inline-end: 7px !important;
    }
    .resize-map-content {
        padding-left: 0rem !important;
        padding-top: 0rem !important;
    }
    .resize-cover-item-list {
        width: calc(100% - 0px) !important;
        grid-auto-columns: calc((100% - (5 - 1) * -67px) / 2) !important;
    }
    .content-browse-input {
        margin-top: 0.4rem !important;
    }
}

.loader {
    width: 12px;
    height: 12px;
    border: 1px solid #e5e5e5;
    border-top: 1px solid #333;
    border-radius: 50%;
    animation: spin 1.5s linear infinite;
  }
  
  .loader-grey {
    width: 12px;
    height: 12px;
    border: 1px solid #dbdbdb;
    border-top: 1px solid #bababa;
    border-radius: 50%;
    animation: spin 1.5s linear infinite;
  }

  .loader-white {
    width: 12px;
    height: 12px;
    border: 1px solid #ffffff30;
    border-top: 1px solid #fff;
    border-radius: 50%;
    animation: spin 1.5s linear infinite;
  }

  @keyframes spin {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
  }

  .anima-button {
  width: 100px;
  height: 100px;
  background-color: red;
  border-radius: 50%;
  margin: 100px auto;
  
  animation: anima-button 3s infinite ease-in-out;
}

@keyframes anima-button {
  0% {
    transform: scale(1);
  }
  25% {
    transform: scale(1.05);
  }
  50% {
    transform: scale(1);
  }
  75% {
    transform: scale(1);
  }
  100% {
    transform: scale(1);
  }
}

.act-button-coport {
    opacity: 1;
    -webkit-transition: opacity 0.8s ease-in-out;
    transition: opacity 0.8s ease-in-out;
}
.act-button-coport:active {
    opacity: 0.79;
    -webkit-transition: opacity 0.8s ease-in-out;
    transition: opacity 0.8s ease-in-out;
}

/* --- */


.app-connect {
    width: 100%;
    height: 100vh;
    background: #e9e9e9;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .app-connect__container {
    width: 95%;
    height: 95vh;
    display: flex;
    border-radius: 20px;
    overflow: hidden;
    background: #fff;
  }
  
  /* LEFT */
  .app-connect__left {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .app-connect__card {
    text-align: center;
    width: 320px;
  }
  
  .app-connect__title {
    font-size: 20px;
    margin-bottom: 5px;
  }
  
  .app-connect__subtitle {
    font-size: 12px;
    color: #888;
    margin-bottom: 20px;
  }
  
  /* PIN INPUTS */
  .app-connect__pin {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-bottom: 15px;
  }
  
  .app-connect__pin input {
    width: 55px;
    height: 55px;
    border-radius: 10px;
    border: 1px solid #999;
    text-align: center;
    font-size: 22px;
    font-weight: 600;
  }
  
  /* INPUT */
  .app-connect__input {
    width: 100%;
    height: 60px;
    border-radius: 10px;
    border: 1px solid #999;
    margin-bottom: 15px;
    padding: 0 10px;
    font-size: 16px;
  }
  
  /* BUTTON */
  .app-connect__button {
    width: 100%;
    height: 50px;
    background: #000;
    color: #fff;
    border: none;
    border-radius: 10px;
    cursor: pointer;
  }
  
  /* RIGHT (IMAGE) */
  .app-connect__right {
    flex: 1;
    background: url('https://images.unsplash.com/photo-1571330735066-03aaa9429d89?q=80&w=1470&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D') center/cover no-repeat;
    filter: brightness(0.4);
  }
  
  /* 📱 RESPONSIVE */
  @media (max-width: 900px) {
    .app-container {
      flex-direction: column;
    }
  
    .app-connect__right {
      height: 250px;
    }
  }

  /* ecualizer */

  .equalizer {
    display: flex;
    align-items: flex-end;
    gap: 3px;
    height: 15px;
  }
  
  .equalizer span {
    width: 3px;
    height: 15px;
    background: #FFFFFF;
    animation: bounce 1s infinite ease-in-out;
  }
  
  /* Diferentes tiempos para efecto más natural */
  .equalizer span:nth-child(1) {
    animation-delay: 0s;
  }
  .equalizer span:nth-child(2) {
    animation-delay: 0.2s;
  }
  .equalizer span:nth-child(3) {
    animation-delay: 0.6s;
  }
  .equalizer span:nth-child(4) {
    animation-delay: 0.3s;
  }
  .equalizer span:nth-child(5) {
    animation-delay: 0.5s;
  }
  .equalizer span:nth-child(6) {
    animation-delay: 0s;
  }
  .equalizer span:nth-child(7) {
    animation-delay: 0.3s;
  }
  .equalizer span:nth-child(8) {
    animation-delay: 0s;
  }
  
  @keyframes bounce {
    0%, 100% {
      height: 8px;
    }
    50% {
      height: 15px;
    }
  }

.userid a.hashtag {
  color: #fff !important;
  text-decoration: none !important;
  font-weight: 700 !important;
}

.userid a.hashtag:hover {
  text-decoration: underline !important;
}
  /* end ecualizer */