@keyframes fadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

@keyframes fadeInRight {
    from {
        opacity: 1;
        transform: translateX(0);
    }
    to {
        opacity: 0;
        transform: translateX(100px);
    }
}

@keyframes fadeInLeft {
    from {
        transform: translateX(150px);
    }
    to {
        transform: translateX(0);
    }
}

.fade-out {
    animation: fadeOut 0.5s ease-in-out forwards;
}

.fade-in-right {
    animation: fadeInRight 0.5s ease-out forwards;
}

.fade-in-left {
    animation: fadeInLeft 0.5s ease-out forwards;
}

.ppc-popup[data-wpr-lazyrender] {
    content-visibility: visible;
}

.ppc-popup {
    position: fixed;
    bottom: 25px;
    right: 25px;
    color: #fff;
    z-index: 99;
}

.ppc-popup.hidden,
.ppc-popup-wrapper.hidden {
    display: none;
}

.ppc-popup__content {
    width: 560px;
    border-radius: 10px;
    position: relative;
    overflow: hidden;
}

.content-image {
    background: unset !important;
}


.ppc-popup__close {
    position: absolute;
    top: -10px;
    right: -10px;
    width: 28px;
    height: 28px;
    cursor: pointer;
    background: url("/wp-content/themes/theme-3-child/images/ppc-popup-close.svg") no-repeat center;
    background-size: contain;
    transition: transform 0.2s ease-out;
    z-index: 1;
}

.ppc-popup__close:hover {
    transform: scale(0.9);
}


.ppc-image-mobile {
    display: none;
}

@media (max-width: 600px) {
    .ppc-image-mobile {
        display: block;
    }

    .ppc-image-desktop {
        display: none;
    }

    .ppc-popup__content {
        width: 100%;
        min-width: 300px;
        max-width: 410px;
    }

    .ppc-mobile {
        display: inline-block;
    }

}

@media (max-width: 600px) {
    .ppc-popup {
        display: flex;
        justify-content: flex-end;
        right: 15px;
    }
}

@media (max-width: 420px) {
    .ppc-popup__content {
        width: 95%;
    }
}