@import "design.css";

/* AUTH PAGE */
.ap-after-valid {
    width: 100%;
    height: 12px;
    font-size: 12px;
    color: var(--color-error-text);
    align-items: center;
}

.ap__message {
    position: fixed;
    top: var(--30px);
    right: var(--30px);
    width: var(--240px);
    height: var(--40px);
    border-radius: 4px;
    background-color: var(--color-success);
    display: flex;
    align-items: center;
    padding: 0 var(--16px);
    font-size: var(--12px);
    color: var(--color-success-text);
    z-index: 2147483645 !important;
    transition: transform 700ms ease;
    transform: translateX(120%);
}

.ap_mess_img_text {
    width: var(--20px);
    height: var(--20px);
    border-radius: 50%;
    padding: 1px;
}

.ap__message > .ap_mess_img_text {
    background-color: var(--color-success-img)
}

._x_, ._v_ {
    stroke: var(--color-success-text)
}

.ap__message > :not(:first-child) {
    margin-left: 20px
}

.ap-text-default {
    color: var(--color-text) !important
}

.ap-active {
    color: #A04382 !important
}

.ap-active-option {
    color: var(--color-third) !important
}

.ap-btn-active {
    border-color: #A04382 !important
}

.ap-invalid {
    border-color: var(--color-red) !important
}

.ap-lang-link {
    font-size: var(--14px);
    font-weight: 400;
}

.ap-circle {
    width: var(--8px);
    height: var(--8px);
    content: url('/Media/img/ball-1.svg');
}

.ap-step {
    font-size: var(--14px);
    color: var(--color-lang);
    transform: translateY(var(--20px));
}

.ap-line {
    width: var(--140px);
    border-top: var(--2px) solid var(--color-text-btn);
}

.ap__input.ap__proff:focus {
    caret-color: transparent
}

.ap__mess {
    width: 100%;
    padding: 12px;
    height: var(--40px);
    font-size: var(--12px);
    background-color: var(--color-message);
    color: var(--color-text-message);
    border-color: transparent;
    display: flex;
    align-items: center;
}

.ap__mess > :first-child {
    width: var(--20px);
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ap__mess__img {
    background-color: var(--color-ball-mess);
    border-radius: 50%;
    padding: 4px;
}

.ap__mess__img {
    background-color: var(--color-ball-mess);
    border-radius: 50%;
    padding: 4px;
}

.ap__mess > :last-child {
    width: 70%;
    white-space: normal;
}

.ap__mess__rules {
    color: var(--color-btns-inpts);
    font-size: var(--14px);
}

.ap__input__check {
    border-radius: 8px !important;
    width: var(--23px) !important;
    height: var(--23px) !important;
}

.ap__input__check:checked {
    accent-color: var(--color-kronas-text) !important
}

.ap__mess__rules > a {
    text-decoration: underline;
    color: var(--color-kronas-text);
}

@font-face {
    font-family: 'Museo Sans Cyrl';
    src: url('/Media/fonts/MuseoSansCyrl-300.otf') format('otf');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Museo Sans Cyrl';
    src: url('/Media/fonts/MuseoSansCyrl-500.otf') format('otf');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Museo Sans Cyrl';
    src: url('/Media/fonts/MuseoSansCyrl-700.otf') format('otf');
    font-weight: 600;
    font-style: normal;
}

.alexproger {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: var(--color-background);
    display: flex;
    align-items: center;
    font-family: 'Museo Sans Cyrl', sans-serif;
    transition: all 700ms ease;
    z-index: 2147483649 !important;
}

.ap__img {
    width: 100%;
    height: 100%;
    transform: scale(1.01);
}

.ap__left, .ap__right {
    overflow: hidden;
    width: 50%;
    height: 100%;
    transition: all 700ms ease;
}

.ap__left {
    position: relative;
    display: flex;
    align-items: start;
    justify-content: center;
    /*background-image: url("/Media/img/log-1.jpg");*/
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
    transition: width 700ms ease;
}

.ap__logo {
    position: absolute;
    width: var(--240px);
    top: var(--25px);
    left: 50%;
    transform: translateX(-50%);
    transition: all 700ms ease;
}

.ap__logo.ap-md-show {
    display: none;
    position: sticky;
    top: 50px;
    left: 0;
    background-color: var(--color-background);
    transform: translateX(0);
    transition: all 700ms ease;
}

.ap__left__div {
    position: absolute;
    bottom: var(--25px);
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - var(--50px));
    height: var(--180px);
    background: var(--color-background-opacity);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    border-radius: 10px;
    padding: var(--22px);
    color: var(--color-white);
}

.ap__left__div__title {
    font-size: var(--20px);
    font-weight: 600;
}

.ap__left__div__text {
    font-size: var(--14px);
    font-weight: 300;
}

.circle {
    width: 18px !important;
    height: 18px !important;
}

.ap__left__div__btn {
    width: var(--23px);
    height: var(--23px);
    color: var(--color-dark-text);
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.ap-arrow {
    width: var(--15px);
    height: var(--20px);
}

.ap__page__success {
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 50%;
    height: 70%;
    transform: translate(-50%, -50%);
    background-color: VAR(--color-white);
    border-radius: 4px;
}

.ap__success__img {
    max-width: 50%
}

.ap__success__title {
    font-size: var(--23px);
    font-weight: 600;
    color: var(--color-kronas-text);
}

.ap__success__text {
    width: 30%;
    font-size: var(--16px);
    font-weight: 400;
    text-align: center;
    color: var(--color-btns-inpts);
}

.ap__success__btn {
    width: var(--240px);
    height: var(--40px);
    background-color: var(--color-kronas-text);
    border: 1px solid var(--color-kronas-text);
    border-radius: 4px;
    font-size: var(--14px);
    font-weight: 500;
    color: var(--color-white);
    cursor: pointer;
}

.ap__right {
    position: relative;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: width 700ms ease;
}

.ap__lang {
    position: absolute;
    top: var(--25px);
    right: var(--80px);
    display: flex;
    align-items: end;
    color: var(--color-lang);
    z-index: 99;
}

.ap__lang > :not(:first-child) {
    margin-left: var(--10px)
}

.ap__title {
    color: var(--color-text);
    font-size: var(--20px);
    font-weight: 600;
}

.ap__btns {
    font-size: var(--14px);
    font-weight: 600;
    color: var(--color-btns-inpts);
    display: flex;
    align-items: center;
    cursor: pointer;
}

.ap__email, .ap__phone {
    width: var(--150px);
    padding: var(--18px) 0;
    text-align: center;
    border-bottom: 1px solid var(--color-border);
}

.ap__form {
    width: var(--240px)
}

.ap__recovery__text {
    width: var(--300px);
    text-align: center;
    color: var(--color-btns-inpts);
    font-size: var(--16px);
}

.ap__label {
    font-size: var(--14px);
    font-weight: 400;
    color: var(--color-label);
}

.ap__div {
    padding: 0;
    background: var(--color-white);
    border: 1px solid var(--color-border);
    border-radius: 4px;
}

.ap__div.ap-absolute {
    transform: translateY(calc(100% + 4px))
}

.ap__option {
    color: var(--color-label);
    padding: var(--2px) var(--4px);
    border-radius: 3px;
}

.ap__input {
    width: calc(100% - var(--40px));
    height: var(--40px);
    padding-left: var(--16px);
    font-size: var(--14px);
    font-weight: 400;
    color: var(--color-btns-inpts);
    /*caret-color: transparent;*/
}

.ap__div:focus-within {
    border-color: var(--color-kronas-text)
}

#ap-auth-phone::placeholder, #ap-reg-phone::placeholder {
    color: var(--color-btns-inpts)
}

.ap__span {
    width: var(--40px);
    height: var(--40px);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.ap__eye, .ap__select__proff {
    width: var(--14px)
}

.ap__auth__btn, .ap__next__btn, .ap__reg__btn, .ap__recovery__btn, .ap__repass__btn {
    background: var(--color-background-dis-btn);
    border: 1px solid var(--color-border-dis-btn);
    border-radius: 4px;
    height: var(--40px);
    color: var(--color-text-btn);
    font-size: var(--14px);
    font-weight: 600;
}

.ap__right__asks {
    width: var(--300px);
    color: var(--color-text);
    font-size: var(--12px);
    text-align: center;
    padding-top: var(--40px);
}

.ap__right__asks.ap__ask__auth, .ap__right__asks.ap__ask__repass {
    padding-top: var(--20px)
}

.ap__right__asks.ap__ask__recovery {
    padding-top: var(--80px)
}

.ap__ask__password, .ap__ask__reg > :not(:first-child), .ap__ask__auth, .ap__ask__recovery, .ap__ask__repass {
    color: var(--color-kronas-text)
}

/* Score form style*/

.score-payment{
    display:flex;
    width:100%;
}

.score__stub {
    height: 600px;
    width: 50%;
    background-image: linear-gradient(180deg, rgba(161, 67, 137, 0.50) -7.78%, rgba(0, 0, 0, 0.05) 100%), url("../../Media/img/score-door-background.webp");
    background-repeat: no-repeat;
    background-size: cover;
    background-color: lightgray;
    background-position: bottom;
}

.score__wrapper {
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 40px;
}

.score__form {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.score__title {
    color: #000;
    width: inherit;
    text-align: center;
    font-family: Museo Sans Cyrl,sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 179.5%;
    text-transform: uppercase;
}

.score__subtitle {
    color: #000;
    font-family: Museo Sans Cyrl,sans-serif;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 107%;
}


.score__input-wrapper {
    display: flex;
    gap: 20px;
    padding: 20px;
    background-color: #FFF;
    box-shadow: 0 4px 37px 0 rgba(119, 119, 119, 0.16);
    flex-direction: column;
    align-items: flex-start;
}

.score__form-label {
    display: flex;
    gap: 10px;
    flex-direction: column;
    color: #000;
    font-family: Museo Sans Cyrl,sans-serif;
    font-size: 13px;
    font-style: normal;
    font-weight: 300;
    line-height: 107%;
    width: 100%;
}

.score__form-input {
    height: 100%;
    width: 100%;
    display: flex;
    padding: 10px;
    align-items: center;
    border-radius: 0.25rem;
    border: 1px solid #DEE2E6;
}

.score__form-submitBtn {
    display: flex;
    width: 100%;
    padding: 15px 80px;
    justify-content: center;
    align-items: center;
    border-radius: 0.75rem;
    background-color: #A14389;
    color: white;
}

.cartBrnPopup__button {
    color: white;
    display: flex;
    padding: 10px;
    justify-content: center;
    align-items: center;
    border-radius: 0.75rem;
    background-color: #A14389;
}

@media (max-width: 899px) {

    .score-payment {
        position: relative;
        display: flex;
        width: 100%;
        flex-direction: column;
    }

    .score__stub {
        width: 100%;
    }

    .score__wrapper {
        padding: 40px;
        position: absolute;
        width: 100%;
        flex-direction: column;
    }

    .score__title {
        color: #FDFDFD;
        text-align: center;
        font-size: 28px;
        font-style: normal;
        font-weight: 600;
        line-height: 125.5%;
    }

    .ap__message {
        top: var(--50px);
        right: var(--50px);
        width: var(--500px);
        height: var(--80px);
        padding: 0 var(--30px);
        font-size: 12px;
    }

    .ap_mess_img_text {
        width: var(--40px);
        height: var(--40px);
    }

    .alexproger {
        padding: var(--80px);
        background-image: url("/Media/img/log-1.jpg");
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
    }

    .ap__lang > :not(:first-child) {
        margin-left: var(--20px)
    }

    .ap-lang-link {
        font-size: var(--22px)
    }

    .ap__left {
        width: 0;
        /*display: none;*/
    }

    .ap__page__success {
        width: 90%;
        height: 50%;
    }

    .ap__success__title {
        font-size: var(--50px)
    }

    .ap__success__text {
        font-size: var(--30px)
    }

    .ap__success__btn {
        width: var(--500px);
        height: var(--80px);
        font-size: 14px;
    }

    .ap__right {
        width: 100%;
        background-color: var(--color-background);
        border-radius: 10px;
        overflow-y: scroll;
    }

    .ap-circle {
        width: 8px;
        height: 8px;
    }

    .ap-step {
        font-size: 14px;
        transform: translateY(20px);
    }

    .ap-line {
        width: 140px;
        border-top: 2px solid var(--color-text-btn);
    }

    .ap__logo.ap-md-show {
        display: block
    }

    .ap__recovery__img {
        padding-top: 100px
    }

    .ap__title {
        font-size: var(--30px);
        padding-top: 50px;
    }

    .ap-page-recovery > .ap__title {
        padding-top: 50px
    }

    .ap__title.ap-text-kronas {
        padding-top: 20px
    }

    .ap__email, .ap__phone {
        width: var(--240px);
        font-size: var(--22px);
    }

    .ap__form {
        width: var(--420px)
    }

    .ap__recovery__text {
        width: var(--600px);
        font-size: var(--30px);
    }

    .ap__label {
        font-size: 14px
    }

    .ap__input {
        height: var(--50px);
        width: calc(100% - var(--50px));
        padding-left: var(--30px);
        font-size: var(--22px);
    }

    .ap__span {
        width: var(--50px);
        height: var(--50px);
    }

    .ap__select__proff {
        width: var(--18px)
    }

    .ap__eye, .ap__select__proff {
        width: var(--22px)
    }

    .ap__auth__btn, .ap__next__btn, .ap__reg__btn, .ap__recovery__btn, .ap__repass__btn {
        height: var(--50px);
        font-size: var(--22px);
    }

    .ap__right__asks {
        width: var(--600px);
        font-size: 12px;
        padding-top: var(--50px);
        padding-bottom: 40px;
    }

    .ap__ask__auth {
        color: var(--color-kronas-text)
    }

    .ap__mess {
        height: var(--80px);
        font-size: 12px;
    }

    .ap__mess > :first-child {
        width: var(--40px)
    }

    .ap__mess__rules {
        font-size: 14px
    }

    .ap__input__check {
        width: var(--50px) !important;
        height: var(--50px) !important;
    }
}

@media (max-width: 639px) {

    .score__title {
        font-size: 18px;
    }

    .ap__message {
        top: 30px;
        right: 30px;
        width: 240px;
        height: 40px;
        padding: 0 16px;
    }

    .ap_mess_img_text {
        width: 20px;
        height: 20px;
    }

    .sm\:ap-space-y-5 :not(:first-child) {
        margin-top: 20px !important
    }

    .alexproger {
        padding: 0
    }

    .ap__left, .ap__right {
        transition: width 200ms linear
    }

    .ap__page__success {
        height: 70%
    }

    .ap__success__title {
        font-size: 24px
    }

    .ap__success__text {
        width: 70%;
        font-size: 16px;
    }

    .ap__success__btn {
        width: 240px;
        height: 40px;
    }

    .ap__lang {
        display: none
    }

    .ap-lang-link {
        font-size: 14px
    }

    .ap__right {
        width: 100%;
        border-radius: 0;
    }

    .ap__logo.ap-md-show {
        width: 200px
    }

    .ap__title {
        font-size: 20px
    }

    .ap__email, .ap__phone {
        width: 150px;
        font-size: 14px;
    }

    .ap__form {
        width: 240px
    }

    .ap__recovery__text {
        width: 300px;
        font-size: 16px;
    }

    .ap__input {
        height: 40px;
        width: calc(100% - 40px);
        padding-left: 16px;
        font-size: 14px;
    }

    .ap__span {
        width: 40px;
        height: 40px;
    }

    .ap__select__proff {
        width: 10px
    }

    .ap__eye, .ap__select__proff {
        width: 14px
    }

    .ap__auth__btn, .ap__next__btn, .ap__reg__btn, .ap__recovery__btn, .ap__repass__btn {
        height: 40px;
        font-size: 14px;
    }

    .ap__right__asks {
        width: 300px;
        padding-top: 40px;
    }

    .ap__mess {
        height: 40px
    }

    .ap__mess > :first-child {
        width: 20px
    }

    .ap__input__check {
        width: 24px !important;
        height: 24px !important;
    }
}

@media (max-width: 374px) {
    .ap__logo.ap-md-show {
        width: 150px
    }
}

@media (max-width: 339px) {
    .ap__logo.ap-md-show {
        display: none
    }
}

/* DESIGNER OF SHOWER SYSTEMS */
.ap-designer {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 400;
    color: var(--color-white);
    margin-top: 20px;
    background: var(--color-designer);
    border-radius: 10px;
    box-shadow: 0 5px 20px 1px rgba(0, 0, 0, 0.22);
    cursor: pointer;
}

.ap-designer > a {
    width: 100%;
    padding: 18px 0;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ap-designer > a > :not(:first-child) {
    margin-left: 8px
}

/* FOLDERS IN FAVORITES */
.folders {
    width: 100%;
    max-height: 300px;
    overflow-y: scroll;
    display: flex;
    flex-direction: column;
    align-items: end;
}

.folders > * {
    width: 100%;
    display: flex;
    align-items: center;
    height: 60px;
    padding: 10px 10px 10px 20px;
    font-weight: 500;
    color: var(--color-text);
    border-bottom: var(--rem-1-5px) solid var(--color-border-menu-account);
}

.add-folder,
.add-in-folder {
    display: flex;
    align-items: center;
    justify-content: center;
}

.folder, .in-folder,
.folder > div,
.in-folder > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.folder:hover,
.in-folder:hover,
.mode-folder:hover,
.mode-in-folder:hover {
    background-color: var(--color-active-folder)
}

.folder > :first-child,
.in-folder > :first-child {
    width: 70%;
    justify-content: start;
    white-space: nowrap;
    overflow: hidden;
}

.folder > :last-child,
.in-folder > :last-child {
    width: 30%;
    justify-content: end;
}

.folder > div > :not(:first-child),
.in-folder > div > :not(:first-child) {
    margin-left: 8px
}

.folder > :first-child > :last-child,
.in-folder > :first-child > :last-child {
    display: flex;
    padding: 8px 0;
}

.ball {
    content: '';
    display: block;
    margin-right: 4px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background-color: var(--color-kronas-text);
}

.folder-arrow {
    width: 20px;
}

.in-folder {
    padding-left: 40px
}

.btn-add-folder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 90%;
    padding: 4px 0;
    border: 1px solid var(--color-kronas-text);
    border-radius: 3px;
    color: var(--color-kronas-text)
}

.active-folder {
    background-color: var(--color-active-folder)
}

.show-add-folder, .show-delete-folder {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 90%;
    height: 321px;
    transform: translate(-50%, -50%);
    background-color: var(--color-white);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    z-index: 2147483648;
}

.show-add-folder > :not(:first-child) {
    margin-top: 20px
}

.show-add-folder > :last-child {
    margin-top: 40px
}

.show-add-folder > label {
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    color: var(--color-kronas-text);
}

.show-add-folder > label > span {
    font-weight: 400;
    color: var(--color-text);
}

.show-add-folder > input {
    width: 238px;
    font-size: 14px;
    padding: 8px 16px;
    background-color: var(--color-white);
    color: var(--color-btns-inpts);
    border-radius: 4px;
    border: 1px solid var(--color-border);
}

.show-add-folder > input::placeholder {
    color: var(--color-lang)
}

.show-add-folder > button {
    width: 238px;
    font-size: 14px;
    padding: 8px 0;
    background-color: var(--color-background-dis-btn);
    color: var(--color-text-btn);
    border-radius: 4px;
    border: 1px solid var(--color-border-dis-btn);
}

.show-delete-folder {
    height: 238px
}

.show-delete-folder > div {
    font-size: 18px;
    font-weight: 400;
}

.show-delete-folder > div > span {
    font-weight: 600
}

.show-delete-folder > div > button {
    width: 118px;
    font-size: 14px;
    padding: 8px 0;
    margin-top: 30px;
    background-color: var(--color-kronas-text);
    color: var(--color-white);
    border-radius: 4px;
    border: 1px solid var(--color-kronas-text);
    cursor: pointer;
}

.show-delete-folder > div > :not(:first-child) {
    margin-left: 32px;
    background-color: var(--color-white);
    color: var(--color-kronas-text);
    border-color: var(--color-kronas-text);
}

.prodListBlockItem__favorite, .productShopBtn {
    position: relative
}

.mode-set-favorite-in-folder {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    width: 200px;
    min-height: 40px;
    max-height: 260px;
    transform: translateY(-110%);
    background-color: var(--color-white);
    box-shadow: 0 1px 20px 0 rgba(0, 0, 0, 0.10);
    border-radius: 6px;
    overflow-y: scroll;
    font-size: 14px;
}

.mode-folders {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: end;
}

.mode-folders > * {
    width: 100%;
    display: flex;
    align-items: center;
    height: 34px;
    padding: 10px 10px 10px 20px;
    font-weight: 500;
    color: var(--color-text);
    border-bottom: var(--rem-1-5px) solid var(--color-border-menu-account);
}

.mode-in-folder {
    padding-left: 40px
}

.mode-folder > :not(:first-child), .mode-in-folder > :not(:first-child) {
    margin-left: 8px
}

.mode-add-folder {
    display: flex;
    align-items: center;
    justify-content: end;
    color: var(--color-kronas-text);
    text-decoration: underline;
    text-decoration-color: var(--color-kronas-text);
    text-underline-offset: 4px;
}

.remote-from-favorites {
    font-weight: 500;
}

.remote-from-favorites:hover {
    color: var(--color-ferrari);
}

@media (min-width: 640px) {
    .show-add-folder, .show-delete-folder {
        width: 586px
    }
}


/*  FOLDERS */
.favorite-container {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.favorite-container > :not(:first-child) {
    margin-top: 8px
}

.folders-header {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
}

.span-check {
    display: flex;
    align-items: center;
}

.span-check > :not(:first-child) {
    margin-left: 8px
}

.input-check {
    width: 20px;
    height: 20px;
    border: none;
}

.input-check:checked {
    accent-color: var(--color-kronas-text) !important
}

.label-check {
    color: var(--color-btns-inpts)
}

.btn-all-pay {
    width: 168px;
    height: 38px;
    padding: 0 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    border: 1px solid var(--color-border-dis-btn);
    background-color: var(--color-background-dis-btn);
    color: var(--color-text-btn);
    font-size: 14px;
    font-weight: 500;
    cursor: inherit;
}

.btn-all-pay > :not(:first-child) {
    margin-left: 8px
}

.btn-all-pay > svg {
    width: 15px;
    height: 15px;
}

#basket {
    fill: var(--color-text-btn)
}

.folders__favorite-block {
    width: 100%;
    height: 100px;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: var(--color-background-favorite);
}

.folders__first-block {
    width: 50%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.folders__first-block > :not(:first-child) {
    margin-left: 20px
}

.folders__image {
    width: 106px;
    height: 78px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
}

.folders__name-pay {
    width: calc(100% - 166px);
    height: 100%;
    padding: 15px 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
}

.folders__name {
    color: var(--color-btns-inpts)
}

.folders__pay {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.folders__pay-price {
    display: flex;
    align-items: end;
}

.folders__pay-price > :not(:first-child) {
    margin-left: 20px
}

.folders__pay-price-label {
    color: var(--color-black)
}

.folders__pay-price-element {
    font-size: 20px;
    font-weight: 600;
    color: var(--color-kronas-text);
    transform: translateY(4px);
}

.folders__pay-btns {
    width: 102px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transform: translateY(4px);
}

.folders__pay-input {
    max-width: 30px;
    text-align: center;
    color: var(--color-kronas-text);
}

.folders__pay-btn-minus, .folders__pay-btn-plus {
    width: 30px;
    height: 30px;
    background-color: var(--color-white);
    fill: var(--color-kronas-text);
    border: 1px solid var(--color-border-menu-account);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.folders__pay-btn-minus > svg, .folders__pay-btn-plus > svg {
    width: 1.8rem;
    height: 1.8rem;
}

.folders__second-block {
    width: 50%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.folders__second-block > :last-child {
    margin-left: 11px
}

.folders__second__all-btns {
    display: flex;
    align-items: center;
    justify-content: start;
}

.folders__second__all-btns > :not(:first-child) {
    margin-left: 9px
}

.folders__second__btns {
    position: relative;
    cursor: pointer;
}

.folders__second__btn-pay {
    width: 146px;
    height: 36px;
    background-color: var(--color-kronas-text);
    color: var(--color-white);
    font-size: 16px;
    font-weight: 500;
    border-radius: 18px;
    cursor: pointer;
}

@media (max-width: 768px) {
    .folders__favorite-block {
        height: 150px;
        flex-direction: column;
        align-items: start;
        padding: 0 15px;
    }

    .folders__first-block, .folders__second-block {
        width: 100%;
        height: 60%;
    }

    .folders__second-block {
        height: 40%;
        justify-content: space-between;
    }

    .folders__first-block > :not(:first-child) {
        margin-left: 10px
    }

    .folders__image {
        width: 63px;
        height: 73px;
    }

    .folders__pay-price {
        justify-content: start;
    }

    .folders__pay-price > :not(:first-child) {
        margin-left: 0
    }

    .folders__pay-price-label {
        display: none;
    }

    .folders__pay-price-element {
        font-size: 18px;
    }

    .folders__name-pay {
        width: calc(100% - 103px);
        justify-content: space-between;
    }
}

/* ARTEM CURT REQUISITES */

.block-requisites {
    display: flex;
    flex-direction: column;
    text-align: center;
    align-items: center;
    margin: 20px 0 0 0
}

.block-requisites p {
    vertical-align: middle;
    color: #501c54;
    font-size: 1.4rem;
}

.custom-hr {
    width: 100%;
    content: '';
    border-top: 0.03125rem solid var(--color-second);
    margin: 10px 0;
}

.span-copy {
    cursor: pointer;
    transition:  var(--transition-all-ease);
}

.span-copy:hover {
    transform: scale(1.1) ;
    color: var(--color-first) ;
}

.span-copy::before {
    content: "📋"; /* Код иконки Font Awesome для копирования */
    font-family: "Font Awesome 5 Free", serif; /* Название шрифта Font Awesome */
    margin-right: 5px; /* Отступ между иконкой и текстом */
    display: none; /* По умолчанию скрываем иконку */
}

.span-copy:hover::before {
    display: inline-block;
}

.border {
    margin: 10px 0;
    padding: 10px 30px;
    border: 1px solid var(--color-second);
    border-radius: 2rem;
}
.master-3d {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    width: 188px;
    padding: 12px 22px;
    border: 1px solid #ebebeb;
    border-radius: 18px;
    background-color: var(--color-white);
    box-shadow: 0 0.4rem 0.8rem rgba(152, 152, 152, .2);
}
.ap-mobileMenu__item:after {
    left: 0;
    border-bottom-color: #e3e3e4;
}
.ap-mobileMenu__item a, .ap-mobileMenu__item > span {
    color: #777;
    font-family: OpenSansLight, serif;
    font-size: 14px;
    display: block;
}
.ap-mobileMenu__item--3 {background-color: #a04382}
.ap-mobileMenu__item--3 a, .ap-mobileMenu__item--3 > span {color: #fff}
.ap-modal-window-sale-call {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    width: 75rem;
    height: 50%;
    min-height: 400px;
    padding: 22px;
    transform: translate(-50%, -50%);
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--color-text);
    background-color: var(--color-white);
    border-radius: 33px;
    box-shadow: 0 0.4rem 0.8rem rgba(152, 152, 152, .2);
    z-index: 2147483648;
}
.ap-callPopup__form {
    width: 45rem;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 10;
}
.ap-form {
    width: 35rem;
    max-width: 100%;
}
.ap-online-pay {
    max-width: 220px;
    width: max-content;
    height: 41px;
    padding: 0 33px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 30px;
    border: var(--rem-0-5px) solid var(--color-border-dis-btn);
    color: var(--color-text-btn);
    background: var(--color-background-dis-btn);
    cursor: default;
}
.ap-online-pay-active {
    border: var(--rem-0-5px) solid var(--color-kronas-text);
    color: var(--color-white);
    background: var(--color-kronas-text);
    cursor: pointer;
}
.ap-page-pay {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 500px;
    height: 300px;
    padding: 22px;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--color-text);
    background-color: var(--color-white);
    border-radius: 33px;
    transition: var(--transition-all-ease);
    box-shadow: 0 0.4rem 0.8rem rgba(152, 152, 152, .2);
    z-index: 2147483648;
}
@media (max-width: 639px) {
    .ap-modal-window-sale-call, .ap-page-pay {
        width: 80%;
    }
}
@media (max-width: 476px) {
    .ap-modal-window-sale-call, .ap-page-pay {
        width: 98%;
    }
}
.ap-logo-cart {
    position: absolute;
    top: 0;
    left: 0;
    width: 185px;
    height: 62px;
    padding: 16px;
    z-index: 99;
}

.cooperation-section {
    margin-top: 20px;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    color: var(--color-first);
}
.cooperation-section > :not(:first-child) {margin-top: 90px}
.cs-header {
    font-size: 35px;
    text-transform: uppercase;
}
.cs-main {
    width: calc(100% - 64px);
    padding: 0 32px;
    display: flex;
    align-items: stretch;
    justify-content: space-evenly;
}
.vertical-line {
    content: '';
    border-left: 1px solid var(--color-vertical-line);
}
.horizontal-line {
    content: '';
    width: 100%;
    display: none;
    border-top: 1px solid var(--color-vertical-line);
}
.csm-box,
.csm-box-2,
.csmb-block,
.csmb-block-3 {
    position: relative;
    display: flex;
    flex-direction: column;
}
.csm-box, .csm-box-2 {width: 20%}
.csm-box > :not(:first-child),
.csm-box > :not(:first-child) {margin-top: 37px}
.csm-box-2 > :not(:first-child) {margin-top: 27px}
.csmb-block > input[type=text],
.csmb-block-3 > input[type=text],
.csmb-block-3 > input[type=tel] {
    width: calc(330px - 24px);
    min-height: 44px;
    padding: 12px;
    font-size: 16px;
    font-weight: 300;
    color: var(--color-first);
    border: 1px solid var(--color-BBBBBB);
    border-radius: unset;
}
.csmb-block > :first-child,
.csmb-block-3 > :first-child,
.csmb-header {
    font-size: 18px;
    color: var(--color-first)
}
.csmb-block > input[type=text]::placeholder,
.csmb-block-3 > input[type=text]::placeholder,
.csmb-block-3 > input[type=tel]::placeholder,
.csmb-block > select {color: var(--color-first-60-percent)}
.csmb-block > :not(:first-child),
.csmb-block-3 > :not(:first-child) {margin-top: 12px}
.csmbb-radio > label > input:checked,
.csmb-block-2 > label > input:checked {accent-color: var(--color-kronas-text)}
input#type {
    outline: none;
    cursor: pointer;
    color: transparent;
}
.csmbb-type {
    position: absolute;
    top: 74px;
    left: 0;
    width: calc(330px - 24px);
    max-height: 200px;
    padding: 8px;
    display: none;
    flex-direction: column;
    align-items: start;
    font-size: 14px;
    background-color: var(--color-white);
    border: 1px solid var(--color-BBBBBB);
    overflow-y: scroll;
    z-index: 5;
}
.csmbb-type > :not(:first-child) {border-top: var(--rem-0-5px) solid var(--color-vertical-line)}
.csmbb-type > span {
    width: 100%;
    padding: 4px;
    cursor: pointer;
}
.csmbb-type > span:hover {background-color: var(--color-active-option)}
.csmbb-radio > :not(:first-child) {margin-left: 16px}
.csmb-block-2 {
    display: flex;
    flex-direction: column;
    align-items: start;
}
.csmb-block-2 > :not(:first-child) {margin-top: 19px}
.csmb-block-2 > label {
    font-size: 16px;
    font-weight: 300;
}
.csf-btn {
    width: 285px;
    height: 48px;
    font-size: 18px;
    color: var(--color-white);
    background-color: var(--color-kronas-text);
    border-radius: 12px;
    cursor: pointer;
}
#ap-services-terms {
    font-size: 16px;
    color: var(--color-black);
    border-color: var(--color-C9C9C9);
}
#ap-services-terms .btn-select {
    font-weight: 600;
    line-height: 21px;
    padding: 4px 24px 12px;
    border-bottom: 2px solid var(--color-E9E9E9);
    white-space: nowrap;
    transition: var(--transition-all-300-ease);
    cursor: pointer;
}
#ap-services-terms .btn-select.active-btn-select {border-color: var(--color-kronas-text)}
#ap-services-terms th {
    font-weight: 600;
    background-color: var(--color-E9E9E9);
}
#ap-services-terms td {
    text-align: center;
}
.toTop {animation: jumpTop 2s ease infinite}
.master-3d-bg {width: 100%}
.box-kronas-master {
    padding-left: 5rem;
    padding-right: 5rem;
    padding-bottom: 5rem;
    display: flex;
    flex-direction: row-reverse;
    align-items: stretch;
    justify-content: center;
}
.box-kronas-master > :not(:first-child) {margin-right: 40px}
.block-kronas-master {
    position: relative;
    width: calc(50% - 20px);
    padding: 40px 40px 120px;
    display: flex;
    flex-direction: column;
    align-items: start;
    background-color: var(--color-EBEBEB);
}
.block-kronas-master > :not(:first-child) {margin-top: 20px}
.km-title {
    font-size: 32px;
    font-weight: 300;
    text-transform: uppercase;
    color: var(--color-black);
}
.km-btn-go {
    width: 290px;
    height: 115px;
    cursor: pointer;
}
.km-btn-go.km {
    height: 110px;
    padding: 4px;
    background-color: var(--color-white);
    border-radius: 24px;
    box-shadow: 0 5px 7px 0 var(--color-BBBBBB);
    cursor: default;
}
.kmbg-in {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 32px;
    text-transform: uppercase;
    line-height: 32px;
    color: var(--color-kronas-text);
    border: 1px solid var(--color-kronas-text);
    border-radius: 20px;
}
.km-btn-go > img {
    height: 100%;
    transform: translateY(-5px);
    border-radius: 24px;
    box-shadow: 0 5px 7px 0 var(--color-BBBBBB);
}
.km-text, .km-text2 {
    font-size: 14px;
    font-weight: 400;
    color: var(--color-lang);
}
.km-text2 {
    font-weight: 600;
    color: var(--color-kronas-text);
}
.km-text > :not(:first-child) {margin-top: 10px}
.km-text ul {margin-left: 20px}
.km-text a {
    color: var(--color-kronas-text);
    text-decoration: underline;
    text-decoration-color: var(--color-kronas-text);
}
.km-services {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
}
.km-btn-service {
    min-width: 120px;
    height: 60px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    line-height: 16px;
    color: var(--color-white);
    text-shadow: 0 2px 1px var(--color-first);
    background-image: var(--color-to-right-gradient);
    border-radius: 18px;
    box-shadow: 0 5px 7px 0 var(--color-BBBBBB);
    cursor: pointer;
}
.kmbs-bottom {font-weight: 300}
.km-btn-inst {
    position: absolute;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
    width: 200px;
    height: 50px;
    font-size: 24px;
    font-weight: 600;
    line-height: 50px;
    text-align: center;
    text-transform: uppercase;
    color: var(--color-white)!important;
    text-shadow: 0 2px 1px var(--color-first);
    background-image: var(--color-to-right-gradient);
    border-radius: 24px;
    box-shadow: 0 5px 7px 0 var(--color-BBBBBB);
}


.gallery__header {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 30px;
    background: #FFF;
    box-shadow: 0 1.6px 1.6px 0 rgba(255, 255, 255, 0.15) inset, 0 0 24px 0 rgba(255, 255, 255, 0.05) inset;
}

.gallery__header-label {
    position: relative;
    width: 40%;
}

.gallery__search-input {
    display: flex;
    width: 100%;
    height: 3rem;
    transform: rotate(-0.016deg);
    padding: 0.625rem 1.3125rem;
    align-items: center;
    gap: 1.25rem;
    flex-shrink: 0;
    border-radius: 2.20606rem;
    background: #F2F2F2;
}

.gallery__header-title-block{
    padding: 10px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    gap:50px;
    cursor: pointer;
    width: 20%;
}

.gallery__active {
    background: #F2F2F2;
}

.gallery__filter{
    position: absolute;
    width: 100%;
    top: 100%;
    left: 0;
    display: flex;
    padding: 5px;
    flex-direction: column;
    z-index: 999;
    background: #FFF;
}

.gallery__filter-button{
    padding: 10px;
    color: #501C54;
    font-family: Museo Sans Cyrl,sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.gallery__filter-button:hover {
    background-color: rgba(161, 67, 137, 0.24);
}

.gallery__header-title {
    color: #501C54;
    font-family: Museo Sans Cyrl,sans-serif;
    font-size: 1.875rem;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.gallery__header-svg {
    height: 20px;
    width:20px;
    fill: #a04382;
}

.gallery__wrapper {
    padding: 10px;
    display: grid;
    grid-template-columns: repeat(10, 1fr);
    overflow-y: hidden;
    row-gap: 5px;
    column-gap: 5px;
    overflow-x: hidden;
}

.gallery__img {
    position:relative;
}

.gallery__img:nth-child(odd) {
    grid-row: span 1;
}

.gallery__img:nth-child(even) {
    grid-row: span 2;
}

.gallery__img img {
    width: 100%;
    height: 100%;
}

.gallery__img:hover{
    z-index: 100;
    transform:scale(1.05);
    transition: ease-in 200ms;
}

.gallery__img-number {
    position: absolute;
    bottom:0;
    left:0;
    background-color: rgba(255, 255, 255, 0.18);
    box-shadow: 0 1.6px 1.6px 0 rgba(255, 255, 255, 0.15) inset, 0 0 25px 0 rgba(255, 255, 255, 0.05) inset, 3px 4px 59px 0 rgba(83, 5, 88, 0.78);
    backdrop-filter: blur(26px);
    display: flex;
    width: 7rem;
    padding: 0.5rem 0;
    justify-content: center;
    align-items: center;
}

.vacancy__form {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.sendingLetters__wrapper{
    margin-top: 50px;
    display: flex;
    padding: 16px;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 22px;
    border-radius: 1rem;
    background-color: #FFF;
    box-shadow: 0 4px 15px 0 rgba(0, 0, 0, 0.17);
}

.sendingLetters__title {
    color: #000;
    font-family: Museo Sans Cyrl,sans-serif;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
}

.sendingLetters__img {
    width: 100%;
}

.sendingLetters__block {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 12px;
}

.sendingLetters__description {
    color: #000;
    font-family: Museo Sans Cyrl,sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 107%;
}

.sendingLetters__svg {
    width: 10px;
    height: 20px;
}

.sendingLetters__button {
    border: 2px dashed #A14389;
    background-color: rgba(161, 67, 137, 0.06);
    display: flex;
    width: 100%;
    padding: 20px;
    gap: 20px;
    align-items: center;
    position: relative;
}

.gallery__overlay, .sendingLetters__overlay {
    overflow: initial;
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.77);
    z-index: 999;
    cursor: pointer;
}

.gallery__modal-window {
    width: 50%;
    height: 50%;
    z-index: 1000;
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 50px;
    color: white;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s;
}
.sendingLetters__modal-window {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 740px;
    max-height: 90%;
    z-index: 1000;
    position: fixed;
    top: 50%;
    left: 50%;
    font-size: 50px;
    border-radius: 0.75rem;
    background: #FFF;
    color: white;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s;
}

.gallery__modal-window__close{
    z-index: 999;
    width: 25px;
    height: 25px;
    position: absolute;
    top: 10%;
    right: 5%;
    fill: white;
}

.gallery__modal-img{
    object-fit: contain;
    width: 100%;
    height: 100%;
}

.gallery__hidden {
    display: none;
}
.btns-paginate-gallery {
    width: 100%;
    padding: 60px 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.btns-paginate-gallery > :not(:first-child) {margin-left: 10px}
.btn-page {
    font-size: 22px;
    font-weight: 600;
    color: var(--color-first-50-percent);
    cursor: pointer;
}
.active-btn-page {
    color: var(--color-first);
    cursor: default;
}
.arrow-page-left, .arrow-page-right {cursor: pointer}
.arrow-end {
    display: none;
    cursor: default;
}
.btn-page-points {cursor: default}

.sendingLetters__modal-window__text {
    text-align: center;
    color: #000;
    font-family: Museo Sans Cyrl,sans-serif;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 107%;
}


.sendingLetters__button > input {
    height: 100%;
    width: 100%;
    opacity: 0;
    cursor: pointer;
    position: absolute;
}

.file__svg {
    width: 20px;
    height: 20px;
}

.pink-text {
    margin: 10px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #451D54;
    font-family: Museo Sans Cyrl,sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.sendingLetters__pink-span {
    color: #A14389;
    font-family: Museo Sans Cyrl,sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 300;
    line-height: 107%;
}

.sendingLetters__button-sub {
    color: white;
    width: 100%;
    display: flex;
    padding: 14px 70px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 8px;
    background-color:#A14389;
}

.sendingLetters__approved {
    display: none;
}

.sendingLetters__modal-window__svg {
    width: 72px;
    height: 72px;
}
.background-pink {
    background-color: #F9D5DC;
}

.vacancies {
    position: relative;
}

.vacancies__search {
    top: -15px;
    padding: 10px;
    position: absolute;
    width: 50%;
    border-radius: 2.375rem;
    background-color: #FFF;
    box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.08);
}

.vacancies__search-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
}

.vacancies__header {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 7rem;
    padding: 9.0625rem 15.75rem 7.75rem 15.375rem;
}

.description-text{
    color: #333;
    font-family: Museo Sans Cyrl,sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.vacancies__header-description {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.vacancies__title {
    color: #000;
    font-family: Museo Sans Cyrl,sans-serif;
    font-size: 30px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.vacancies__enumeration{
    display: flex;
    flex-direction: column;
    gap:20px;
    background-color: #F2F2F2;
    padding: 5rem 15rem;
}

.vacancies__select-block {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
}

.select-block {
    width: 20%;
    border: 1px solid #C0C0C0;
    background-color: #FFF;
    border-radius: 0;
    padding: 5px;
}

.vacancies__list {
    background-color: #FFF;
    box-shadow: 5px 7px 19px 0 rgba(147, 147, 147, 0.07);
}

.vacancies__list-element {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 30px;
}

.vacancies__list-element-header {
    position: relative;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.vacancies__svg {
    position: absolute;
    right: 0;
    fill: #451D54;
    top: 5px;
    width: 20px;
    height: 20px;
}

.vacancies__list-element-title {
    color:#2A3610;
    font-family: Museo Sans Cyrl,sans-serif;
    font-size: 22px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
}

.vacancies__grey-text {
    color: #898989;
    font-family: Museo Sans Cyrl,sans-serif;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
    margin-right: 50px;
}

.vacancies__list-element-location {
    display: flex;
    gap:25px;
    align-items: center;
}

.vacancies__list-element-description {
    display: none;
    flex-direction: column;
    gap: 20px;
}

.logo-last-viewed {
    width: 100%;
    padding-left: 40px;
    padding-right: 40px;
    display: flex;
    align-items: end;
    justify-content: space-between;
}
.last-viewed-see-all {
    min-width: 200px;
    padding: 8px 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    color: var(--color-white);
    background-image: linear-gradient(115deg, var(--color-kronas-text) 15.84%, var(--color-first) 172.37%);
    border-radius: 18px;
    cursor: pointer;
}
.last-viewed {
    width: 100%;
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 8px 80px;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 2rem;
}
.component-product {
    width: 333px;
    height: 430px;
    padding: 1.5rem;
    background-color: #fff;
    position: relative;
    transition: all 300ms ease;
    transform-origin: 50% 47rem;
    border: 1px solid #d7d7d7;
}.component-product > :not(:first-child) {margin-top: 10px}
.component-product .textBtn {
    width: auto;
    height: auto;
    font-size: 1.4rem;
    text-align: right;
}
.component-product:hover {
    transform: scale(1.01);
    z-index: 99;
    box-shadow: 0 .5rem 1rem rgba(160, 67, 130, .3);
}
.cp-imgs {
    width: 100%;
    height: calc(60% - 1.5rem);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.cp-components {
    width: 100%;
    height: 40%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    color: var(--color-first);
}
.cpc-top {
    width: 100%;

}
.cpc-statuses {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    white-space: nowrap;
    margin-bottom: 8px;
}
.cpc-statuses > :not(:first-child) {margin-left: 8px}
.cpcs-articul {
    width: 60%;
    font-size: 14px;
    font-weight: 600;
}
.cpcsa-text {color: var(--color-kronas-text)}
.cpcs-status {
    width: 40%;
    display: flex;
    justify-content: right;
    font-size: 14px;
    overflow: hidden;
}
.cpc-name {width: 100%}
.cpc-bottom {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.cpcb-prices {
    font-size: 18px;
    font-weight: 600;
    color: var(--color-kronas-text);
    line-height: 18px;
}
.cpcbp-old-price {
    font-size: 17px;
    color: var(--color-D7D7D7);
    text-decoration-line: line-through;
}
.cpcb-btns {
    display: flex;
    align-items: center;
}
.new-bay-button {
    width: 110px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-white);
    background-image: linear-gradient(115deg, var(--color-kronas-text) 15.84%, var(--color-first) 172.37%);
    border-radius: 30px;
    cursor: pointer;
}
.cpcb-favorites {
    position: relative;
    margin-left: 8px;
}
.kronas-master {}
.kronas-master-3d {}
.search-loader {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.search-offer {
    width: 100%;
    height: 30px;
    padding-bottom: 8px;
    font-size: 12px;
    font-weight: 300;
    text-align: center;
}
.search-block > :not(:first-child) {margin-left: 20px}
.search-block {
    width: 100%;
    height: calc(100% - 30px);
    display: flex;
    align-items: stretch;
}
.sb-menu {
    width: 360px;
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: space-between;
}
.sbm-btn-menu {
    display: none;
    position: absolute;
    top: 10px;
    left: 10px;
    padding: 8px 6px;
    background-color: var(--color-kronas-text);
    border-radius: 12px;
    z-index: 99;
}
.sbm-products {
    width: 100%;
    height: 230px;
}
.sbmp-top {
    width: 100%;
    padding: 4px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.sbmp-btn {
    width: 26px;
    height: 16px;
    fill: var(--color-kronas-text);
}
.sbmp-category {
    width: 100%;
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    align-items: start;
}
.sbmp-category.sbmp-prod {
    height: calc(100% - 44px);
    overflow-y: scroll;
}
.sbmpc-item {
    width: 100%;
    padding: 14px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px;
    color: var(--color-first);
    background-color: var(--color-white);
    box-shadow: 5px -6px 106px -19px rgba(108, 108, 108, 0.29);
}
.sbmpci-count {
    width: 45px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    color: rgba(80, 28, 84, 0.50);
    background-color: var(--color-F5EAF2);
    border-radius: 25px;
}


.sbm-btn {
    width: 100%;
    padding: 8px 20px 8px 25px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 16px;
    color: rgba(80, 28, 84, 0.50);
    background-color: var(--color-F5EAF2);
    border-radius: 30px;
}

.sb-products {
    width: calc(50% - 180px);
    color: var(--color-first);
}
.sb-products > :not(:first-child), .sbmp-category > :not(:first-child) {margin-top: 12px}
.sb-products > div > span {font-size: 18px}
.sbp-top, .sbmp-top {
    width: 100%;
    padding: 4px 12px;
    display: flex;
    align-items: end;
    justify-content: space-between;
}
.sb-btn {
    font-size: 16px;
    color: var(--color-kronas-text);
}
.sbp-item {
    width: 100%;
    height: 84px;
    padding: 0 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    /*border: var(--rem-0-5px) solid var(--color-border-dis-btn);*/
    background-color: var(--color-white);
    box-shadow: 5px -6px 106px -34px rgba(108, 108, 108, 0.20);
    overflow: hidden;
}
.sbpi-left {
    width: 80%;
    height: calc(100% - 12px);
    display: flex;
    align-items: center;
    justify-content: start;
}
.sbpi-right {
    width: 20%;
    text-align: right;
    font-size: 18px;
    color: var(--color-kronas-text);
}
.sbpi-right._right {
    width: 16px;
    height: 26px;
    fill: var(--color-kronas-text);
}
.sbpil-image {
    width: 80px;
    height: 70px;
    margin-right: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.sbpil-image > img {width: 100%!important}
.sbpil-text {
    width: calc(100% - 92px);
    height: 70px;
    padding: 4px 0;
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: space-between;
}
.sbpilta-label, .sbpilta-num {
    font-size: 14px;
    color: rgba(69, 29, 84, 0.50);
}
.sbpilta-num {color: var(--color-451D54)}
.sbpilt-name {
    width: 100%;
    font-size: 16px;
    color: var(--color-451D54);
    white-space: normal;
    overflow: hidden;
}
.sbpilt-name.sbpilt-art {width: calc(100% - 92px)}
.masterProp-top {
    padding: 0 5rem;
    display: flex;
    align-items: center;
}
.masterProp-top-left, .masterProp-top-right {
    width: 50%;
    display: flex;
    flex-direction: column;
}
.masterProp-tr-btn {
    width: 400px;
    margin-left: 80px;
}
.btn-km3d {
    border-radius: 32px;
}
.back-unsubscribe {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    align-items: center;
    justify-content: center;
    background: rgba(240, 240, 240, 0.62);
    backdrop-filter: blur(28px);
    z-index: 2147483644 !important;
}
.window-unsubscribe {
    width: 689px;
    height: calc(100% - 100px);
    min-height: 600px;
    padding: 50px 40px 40px;
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: space-between;
    background-color: var(--color-white);
    border-top: 4px solid var(--color-kronas-text);
}
.wu > :not(:first-child) {margin-top: 45px}
.wu-logo {
    width: 232px;
    height: 46px;
}
.wu-title {
    font-size: 25px;
    font-weight: 600;
    letter-spacing: 1px;
    color: var(--color-black);
}
.wu-text, .wu-label {
    margin-top: 12px;
    font-size: 16px;
    line-height: 21px;
    color: var(--color-black);
}
.wu-clock-input {
    display: flex;
    flex-direction: column;
    align-items: start;
}
.wu-label {
    margin-top: 0;
    margin-bottom: 8px;
    font-weight: 600;
}
.wu-input {
    min-width: 348px;
    padding: 12px 14px;
    background: #F5F6F6;
    border: 1px solid #DEE2E6;
    border-radius: 4px;
}
.wu-input::placeholder {color: #A6AEB6}
.wu-question {
    margin-bottom: 23px;
    font-size: 18px;
    color: var(--color-black);
}
.wu-btn {
    width: 218px;
    padding: 13px;
    font-size: 18px;
    color: var(--color-kronas-text);
    background-color: var(--color-white);
    border: 1px solid var(--color-kronas-text);
    border-radius: 12px;
    cursor: pointer;
}
.wu-btn-dark {
    margin-right: 18px;
    color: var(--color-white);
    background-color: var(--color-kronas-text);
}

/* todo Start Media */
@media (max-width: 1904px) {
    .last-viewed {padding: 8px 40px}
}
@media (max-width: 1899px) {
    .km-services {grid-template-columns: repeat(5, minmax(0, 1fr))}
}
@media (max-width: 1809px) {
    .last-viewed {
        padding: 8px 80px;
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}
@media (max-width: 1679px) {
    .new-bay-button {
        width: 105px;
        height: 38px;
    }
    .cpcb-btn-pay .new-bay-button {width: 108px}
}
@media (max-width: 1599px) {
    .km-services {grid-template-columns: repeat(4, minmax(0, 1fr))}
}
@media (max-width: 1564px) {
    .last-viewed {padding: 8px 40px}
}
@media (max-width: 1499px) {
    .cs-main {
        padding: 0 8px;
        justify-content: space-around;
    }
}
@media (max-width: 1469px) {
    .last-viewed {
        padding: 8px 80px;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
@media (max-width: 1399px) {
    .cs-main {
        padding: 0;
        justify-content: space-between;
    }
    .km-services {grid-template-columns: repeat(3, minmax(0, 1fr))}
    .sb-menu {width: 300px}
}
@media (max-width: 1355px) {
    .new-bay-button {
        width: 100px;
        height: 36px;
        font-size: 14px;
        font-weight: 600;
    }
    .cpcb-btn-pay .new-bay-button {width: 106px}
}
@media (max-width: 1280px) {
    .box-kronas-master {
        padding-left: 2rem;
        padding-right: 2rem;
    }
    .new-bay-button {
        width: 95px;
        height: 34px;
    }
    .cpcb-btn-pay .new-bay-button {width: 104px}
    .sbm-btn-menu {display: block}
    .sb-menu {
        display: none;
        position: absolute;
        top: 40px;
        left: 20px;
        height: calc(100% - 40px);
        background-color: var(--color-FCFCFC);
    }
    .sb-products {width: 50%}
}
@media (max-width: 1209px) {
    .last-viewed {padding: 8px 40px}
    .masterProp-top {padding: 0 3rem}
}
@media (max-width: 1199px) {
    .cs-main {
        padding: 0 32px;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 60px;
    }
    .vertical-line {display: none}
    .csm-box,
    .csm-box-2,
    .csm-box-3 {width: 100%}
}
@media (max-width: 1179px) {
    .new-bay-button {width: 34px}
    .btn__icon {display: flex}
    .text-new-bay-button {display: none}
    .cpcb-btn-pay .new-bay-button {width: 104px}
    .cpcb-btn-pay .btn__icon {display: none}
    .cpcb-btn-pay .text-new-bay-button {display: block}
}
@media (max-width: 1149px) {
    .last-viewed {
        padding: 8px 80px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 1080px) {
    .masterProp-top {padding: 0 2.5rem}
}
@media (max-width: 1029px) {
    .box-kronas-master {
        flex-direction: column;
        align-items: center;
        padding-left: 0;
        padding-right: 0;
    }
    .box-kronas-master > :not(:first-child) {margin-right: 0}
    .box-kronas-master > :not(:first-child) {margin-top: 40px}
    .block-kronas-master {width: 100%}
    .km-services {grid-template-columns: repeat(6, minmax(0, 1fr))}
    .masterProp-tr-btn {margin-left: 40px}
}
@media (max-width: 999px) {
    .new-bay-button {
        width: 32px;
        height: 32px;
    }
}
@media (max-width: 950px) {
    .kronas-master-3d > :not(:first-child) {margin-top: 40px}
    .masterProp-top {flex-direction: column}
    .masterProp-top > :not(:first-child) {margin-top: 40px}
    .masterProp-top-left, .masterProp-top-right {width: 100%}
    .masterProp-top-right {align-items: center}
    .masterProp-tr-btn {margin: 0}
    .selectList.search {
        height: max-content;
        min-height: 600px;
        overflow-y: scroll
    }
    .selectList.search::-webkit-scrollbar {display: none}
    .search-block {flex-direction: column}
    .search-block > :not(:first-child) {margin-left: 0}
    .search-block > :not(:first-child) {margin-top: 20px}
    .sbm-btn-menu {display: none}
    .sb-menu {
        display: flex;
        position: relative;
        top: 0;
        left: 0;
        width: 100%;
    }
    .sb-menu > :not(:first-child) {margin-top: 20px}
    .sbm-products, .sbm-category, .sbmp-category.sbmp-prod {height: max-content}
    .sb-products {width: 100%}
    .sbmp-btn {transform: rotateZ(180deg)}
    .sbmp-category {display: none}
}
@media (max-width: 899px) {
    .km-services {grid-template-columns: repeat(5, minmax(0, 1fr))}
    .last-viewed {padding: 8px 40px}
}
@media (max-width: 859px) {

    .score__stub {
        height: 700px;
    }

    .cs-main,
    .csm-box-2,
    .csm-box-3 {padding: 0}
}
@media (max-width: 767px) {
    .cooperation-section > :not(:first-child) {margin-top: 35px}
    .cs-main {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 30px;
    }
    .horizontal-line {display: inline}
    .csm-box {align-items: center}
    #ap-services-terms .btn-select {font-size: 14px}
    .master-3d-bg {display: none}
    .km-services {grid-template-columns: repeat(4, minmax(0, 1fr))}
    .logo-last-viewed {
        padding-left: 20px;
        padding-right: 20px;
    }
    .last-viewed-see-all {display: none}
    .last-viewed {
        height: 455px;
        padding: 8px 20px;
        display: flex;
        align-items: center;
        overflow-x: scroll;
    }
    /*.last-viewed::-webkit-scrollbar {display: none}*/
    .component-product {min-width: 333px}
    .gallery__header {
        flex-direction: column-reverse;
    }
    .gallery__header-title-block, .gallery__header-label {width: 100%}
    .gallery__header-title-block {background-color: var(--color-background-dis-btn)}
    .gallery__header-label {margin-bottom: 30px}
    .gallery__search-input {
        font-size: 18px;
        padding: 8px 4px;
    }
    .sendingLetters__modal-window {max-width: 100%}
    .window-unsubscribe {
        width: calc(100% - 32px);
        padding: 38px 33px 33px;
    }
    .wu > :not(:first-child) {margin-top: 20px}
    .wu-logo {
        width: 200px;
        height: 40px;
    }
    .wu-title, .wu-text, .wu-label, .wu-input, .wu-block-btns {width: 100%}
    .wu-text {line-height: 18px}
    .wu-input {min-width: unset}
    .wu-block-btns {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .wu-btn {width: 143px}
}
@media (max-width: 744px) {
    .last-viewed {}
}
@media (max-width: 640px) {
    .selectList.search {top: 120%}
}
@media (max-width: 639px) {
    .km-services {grid-template-columns: repeat(3, minmax(0, 1fr))}
    .selectList.search {top: 125%}
}
@media (max-width: 580px) {
    .sbp-item.sbp-prod {
        height: 100px;
        flex-direction: column;
    }
    .sbpi-left, .sbpi-right {width: 100%}
    .sbpi-right {text-align: left}
    .sbpi-right._right {display: none}
    .selectList.search {top: 130%}
}
@media (max-width: 529px) {
    .block-kronas-master {
        padding-left: 20px;
        padding-right: 20px;
    }
    .km-services {
        overflow-x: scroll;
        display: flex;
        align-items: center;
    }
    .km-services::-webkit-scrollbar {display: none}
    .km-services > :not(:first-child) {margin-left: 10px}
    .km-title, .km-btn-go {align-self: center}
    .selectList.search {top: 150%}
}
@media (max-width: 500px) {
    .selectList.search {top: 170%}
    .sbpilt-name {font-size: 14px}
}
@media (max-width: 449px) {
    .block-kronas-master {
        padding-left: 10px;
        padding-right: 10px;
    }
    .selectList.search {top: 190%}
    .window-unsubscribe {padding: 38px 20px 20px}
    .wu-question {margin-bottom: 10px}
    .wu-btn {width: max-content}
}
@media (max-width: 404px) {
    .last-viewed {padding: 8px 4px}
    .sbpil-text {overflow: hidden}
}
@media (max-width: 400px) {
    .selectList.search {top: 200%}
}
/* Dima media */
@media(max-width:925px){

    .gallery__wrapper {
        grid-template-columns: repeat(7, 1fr);
    }
}

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

    .gallery__wrapper {
        grid-template-columns: repeat(6, 1fr);
    }

}

@media screen and (max-width: 668px) {
    .gallery__wrapper {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media screen and (max-width: 568px) {
    .gallery__wrapper {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media screen and (max-width: 468px) {
    .gallery__wrapper {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media screen and (max-width: 400px) {
    .gallery__wrapper {
        grid-template-columns: repeat(2, 1fr);
    }
}


/* todo ANIMATIONS */
@keyframes status-10 {
    0% {
        transform: translateX(0)
    }
    50% {
        transform: translateX(10px)
    }
    100% {
        transform: translateX(0)
    }
}

@keyframes status-20 {
    0% {
        transform: translateX(0)
    }
    50% {
        transform: translateX(20px)
    }
    100% {
        transform: translateX(0)
    }
}

@keyframes status-30 {
    0% {
        transform: translateX(0)
    }
    50% {
        transform: translateX(30px)
    }
    100% {
        transform: translateX(0)
    }
}

@keyframes status-40 {
    0% {
        transform: translateX(0)
    }
    50% {
        transform: translateX(40px)
    }
    100% {
        transform: translateX(0)
    }
}

@keyframes status-50 {
    0% {
        transform: translateX(0)
    }
    50% {
        transform: translateX(50px)
    }
    100% {
        transform: translateX(0)
    }
}

@keyframes status-60 {
    0% {
        transform: translateX(0)
    }
    50% {
        transform: translateX(60px)
    }
    100% {
        transform: translateX(0)
    }
}

@keyframes status-70 {
    0% {
        transform: translateX(0)
    }
    50% {
        transform: translateX(70px)
    }
    100% {
        transform: translateX(0)
    }
}

@keyframes status-80 {
    0% {
        transform: translateX(0)
    }
    50% {
        transform: translateX(80px)
    }
    100% {
        transform: translateX(0)
    }
}

@keyframes status-90 {
    0% {
        transform: translateX(0)
    }
    50% {
        transform: translateX(90px)
    }
    100% {
        transform: translateX(0)
    }
}

@keyframes status-100 {
    0% {
        transform: translateX(0)
    }
    50% {
        transform: translateX(100px)
    }
    100% {
        transform: translateX(0)
    }
}

@keyframes opacity-text {
    0% {
        opacity: 1
    }
    50% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@keyframes jump {
    5% {transform: translateY(-10px)}
    10% {transform: translateY(10px)}
    15% {transform: translateY(-10px)}
    20% {transform: translateY(0px)}
}
@keyframes jumpTop {
    5% {transform: translateY(-10px)}
    10% {transform: translateY(0px)}
    15% {transform: translateY(-10px)}
    20% {transform: translateY(0px)}
}