/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Oct 29 2024 | 14:18:21 */
.ppm-online-marketing,
.ppm-know-how {
    display: block;
    position: relative;
}

.ppm-know-how {
    z-index: 10;
}

.ppm-online-marketing {
    z-index: 5;
}

.ppm-online-marketing > .uk-container {
    position: relative;
    z-index: 10;
}

.ppm-online-marketing.ppm-stackcards::before, 
.ppm-online-marketing.ppm-stackcards::after {
    opacity: 0 !important;
	transition: opacity 1s ease;
}


.ppm-online-marketing.ppm-stackcards.ppm-bg-visible::before, 
.ppm-online-marketing.ppm-stackcards.ppm-bg-visible::after {
    opacity: 0.6 !important;
	transition: opacity 1s ease;
}

.ppm-online-marketing.ppm-stackcards::before {
    content: "";
    width: 100%;
    height: 100%;
    background-image: url("https://www.plappermaul.at/staging_O/wp-content/uploads/2024/10/gradient-orange.png");
    background-position: 200% 20%;
    background-size: 1500px;
    background-repeat: no-repeat;
    animation: moveCardGradient1 15s ease-in-out infinite;
    pointer-events: none;
}

.ppm-online-marketing.ppm-stackcards::after {
    content: "";
    width: 100%;
    height: 100%;
    background-image: url("https://www.plappermaul.at/staging_O/wp-content/uploads/2024/10/gradient-green.png");
    background-position: -100% 100%;
    background-size: 1500px;
    background-repeat: no-repeat;
    animation: moveCardGradient2 20s ease-in-out infinite;
    pointer-events: none;
}

/* Animation for ::before (orange gradient) */
@keyframes moveCardGradient1 {
    0% {
        background-position: 200% -100%;
    }
    50% {
        background-position: -100% 30%;
    }
    100% {
        background-position: 200% -100%;
    }
}

/* Animation for ::after (green gradient) */
@keyframes moveCardGradient2 {
    0% {
        background-position: -100% 100%;
    }
    50% {
        background-position: 150% 70%;
    }
    100% {
        background-position: -100% 100%;
    }
}

.ppm-online-marketing.ppm-stackcards::before,
.ppm-online-marketing.ppm-stackcards::after {
    position: fixed;
    top: 0;
    left: 0;
}

.ppm-cardstacks-cta-container {
    padding: 120px 0;
}