.modals-overlay {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
    opacity: .2;
    background: #000;
    display: none;
    z-index: 9000;
}
._show_modal {
	overflow: hidden !important;
	padding-right: 17px !important;
}
/**/
@media screen {
    .modal-fade-in,.modal-popup,.modal-slide,.modal-slide-bottom {
        position: fixed;
        z-index: 9001;
        visibility: hidden;
        transition-property: opacity,visibility,transform;
        transition-duration: .3s
    }

    .modal-fade-in,.modal-fade-in .modal-content,.modal-popup,.modal-popup .modal-content,.modal-slide,.modal-slide-bottom,.modal-slide-bottom .modal-content,.modal-slide .modal-content {
        background-color: #fff
    }

    .modal-fade-in._show,.modal-popup._show,.modal-slide-bottom._show,.modal-slide._show {
        visibility: visible
    }

    .modal-fade-in._bounce-in-up-init .modal-inner-wrap,.modal-popup._bounce-in-up-init .modal-inner-wrap,.modal-slide-bottom._bounce-in-up-init .modal-inner-wrap,.modal-slide._bounce-in-up-init .modal-inner-wrap {
        opacity: 0;
        visibility: hidden;
        will-change: transform;
        transform: translateY(20px) translateZ(0)
    }

    .modal-fade-in .action-close,.modal-popup .action-close,.modal-slide-bottom .action-close,.modal-slide .action-close {
        background-color: transparent;
        font-size: 0;
        display: block;
        margin-left: auto;
        cursor: pointer;
        position: relative;
        width: 20px;
        height: 20px;
        background: url(/local/templates/site/img/dolyame/close-cross.svg)
    }
}

@media screen {
    .modal-fade-in .action-close:hover,.modal-popup .action-close:hover,.modal-slide-bottom .action-close:hover,.modal-slide .action-close:hover {
        background: url(/local/templates/site/img/dolyame/close-cross-hover.svg)
    }
}

@media screen {
    .modal-slide {
        bottom: 0;
        top: 0;
        right: 0;
        width: 100%;
        max-width: 826px;
        overflow-y: scroll;
        will-change: transform;
        transform: translateX(100%)
    }

    .modal-slide._left {
        left: 0;
        right: auto;
        transform: translateX(-100%)
    }

    .modal-slide._show {
        visibility: visible;
        transform: translateX(0)
    }

    .modal-slide._show-edit {
        transform: none;
        will-change: auto
    }

    .modal-slide._bounce-in-up .modal-inner-wrap {
        animation: bounceInUpCart .4s cubic-bezier(.7,0,.2,1) 0s both
    }
}

@keyframes bounceInUpCart {
    0% {
        opacity: 0;
        visibility: hidden;
        transform: translateY(20px) translateZ(0)
    }

    to {
        opacity: 1;
        visibility: visible;
        transform: translateY(0) translateZ(0)
    }
}

@media screen {
    .modal-popup {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        top: 0
    }

    .modal-popup .modal-inner-wrap {
        margin: 5rem auto;
        width: 75%;
        height: auto
    }

    .modal-popup .modal-footer {
        margin-top: auto;
        padding-bottom: 3rem;
        padding-top: 3rem
    }

    .modal-popup .action-primary,.modal-popup .action-secondary {
        display: inline-block;
        padding-left: 1em;
        padding-right: 1em;
        width: auto
    }

    .modal-popup .action-secondary {
        background: 0 0;
        color: #000
    }
}

@media screen {
    .modal-fade-in {
        overflow-y: visible
    }

    .modal-fade-in .modal-inner-wrap {
        display: flex;
        flex-direction: column;
        height: 100%
    }

    .modal-fade-in .modal-header {
        flex-shrink: 0
    }

    .modal-fade-in .modal-content {
        flex-grow: 1;
        overflow-y: scroll
    }

    .modal-fade-in .action-close {
        position: absolute
    }

    .modal-fade-in .modal-title {
        display: none
    }

    .modal-fade-in .action-close {
        z-index: 1
    }
}

@media screen and (max-width: 767px) {
    .modal-fade-in .action-close {
        top:20px;
        right: 20px
    }
}

@media screen and (min-width: 768px) and (max-width:1023px) {
    .modal-fade-in .action-close {
        top:23px;
        right: 23px
    }
}

@media screen and (min-width: 1024px) {
    .modal-fade-in .action-close {
        top:40px;
        right: 40px
    }
}

@media screen {
    .modal-fade-in {
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        opacity: 0
    }

    .modal-fade-in._show {
        opacity: 1
    }
}

@media screen and (max-width: 767px) {
    .modal-fade-in .modal-header {
        z-index:1;
        display: none
    }

    .modal-fade-in .modal-title {
        margin-right: 15px;
        font-size: 16px;
        font-weight: 500;
        line-height: 26px;
        text-transform: lowercase;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden
    }

    .modal-fade-in._scroll-up .modal-title {
        display: block
    }

    .modal-fade-in._scroll-up .modal-header {
        position: absolute;
        display: flex;
        align-items: center;
        width: 100%;
        height: 60px;
        padding: 0 20px;
        background: #fff
    }

    .modal-fade-in._scroll-up:not(._fully-scrolled) .modal-header {
        border-bottom: 1px solid #f2f2f2
    }

    .modal-fade-in._scroll-up .action-close {
        position: static;
        flex-shrink: 0
    }

    .modal-fade-in._scroll-up:not(._fully-scrolled) .modal-header {
        border-bottom-color: transparent
    }
}

@media screen and (min-width: 768px) and (max-width:1023px) {
    .modal-fade-in .action-close {
        top:30px
    }
}

@media screen and (min-width: 768px) and (max-width:1529px) {
    .modal-fade-in .action-close {
        right:2.94118%
    }
}

@media screen and (min-width: 1024px) {
    .modal-fade-in .action-close {
        top:40px
    }
}

@media screen and (min-width: 1530px) {
    .modal-fade-in .action-close {
        right:40px
    }
}

@media screen {
    .modal-slide-bottom {
        bottom: 0;
        right: 0;
        left: 0;
        width: 100%;
        overflow-y: auto;
        will-change: transform;
        transform: translateY(100%)
    }

    .modal-slide-bottom._show {
        visibility: visible;
        transform: translateY(0)
    }

    .modal-slide-bottom .modal-header {
        display: none
    }
}

@media screen {
    .modals-overlay {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        top: 0;
        opacity: .2;
        background: #000
    }
}