.header .garland {
    position: absolute;
    top: 100%;
    left: 0;
    transform: translateY(-50%);
}

@media screen and (max-width: 1279px) {
    .header .garland {
        z-index: 4;
    }
}

@keyframes garlandAnimation1 {
    0% {
        fill: #0A79F8;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(10, 121, 248, 0.6));
    }

    20% {
        fill: #E166EA;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(225, 102, 234, 0.6));
    }

    40% {
        fill: #EDCF38;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(237, 207, 56, 0.6));
    }

    60% {
        fill: #DD406F;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(221, 64, 111, 0.6));
    }

    80% {
        fill: #22DB8C;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(34, 219, 140, 0.6));
    }

    100% {
        fill: #0A79F8;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(10, 121, 248, 0.6));
    }
}

@keyframes garlandAnimation2 {
    0% {
        fill: #AD61DC;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(173, 97, 220, 0.6));
    }

    20% {
        fill: #FC7979;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(252, 121, 121, 0.6));
    }

    40% {
        fill: #0A79F8;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(10, 121, 248, 0.6));
    }


    60% {
        fill: #EDCF38;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(237, 207, 56, 0.6));
    }


    80% {
        fill: #DD406F;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(221, 64, 111, 0.6));
    }


    100% {
        fill: #AD61DC;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(173, 97, 220, 0.6));
    }
}

@keyframes garlandAnimation3 {
    0% {
        fill: #22DB8C;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(34, 219, 140, 0.6));
    }

    20% {
        fill: #FC7979;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(252, 121, 121, 0.6));
    }

    40% {
        fill: #EDCF38;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(237, 207, 56, 0.6));
    }

    60% {
        fill: #AD61DC;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(173, 97, 220, 0.6));
    }

    80% {
        fill: #DD406F;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(221, 64, 111, 0.6));
    }

    100% {
        fill: #22DB8C;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(34, 219, 140, 0.6));
    }
}

@keyframes garlandAnimation4 {
    0% {
        fill: #FC7979;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(252, 121, 121, 0.6));
    }

    20% {
        fill: #0A79F8;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(10, 121, 248, 0.6));
    }

    40% {
        fill: #EDCF38;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(237, 207, 56, 0.6));
    }

    60% {
        fill: #DD406F;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(221, 64, 111, 0.6));
    }

    80% {
        fill: #22DB8C;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(34, 219, 140, 0.6));
    }

    100% {
        fill: #FC7979;
        filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(252, 121, 121, 0.6));
    }
}

.garlandAnimation1,
.garlandAnimation2,
.garlandAnimation3,
.garlandAnimation4 {
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease;
}

.garlandAnimation1 {
    animation-name: garlandAnimation1;
    fill: #0A79F8;
    filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(10, 121, 248, 0.6));
}

.garlandAnimation2 {
    animation-name: garlandAnimation2;
    fill: #AD61DC;
    filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(173, 97, 220, 0.6));
}

.garlandAnimation3 {
    animation-name: garlandAnimation3;
    fill: #22DB8C;
    filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(34, 219, 140, 0.6));
}

.garlandAnimation4 {
    animation-name: garlandAnimation4;
    fill: #FC7979;
    filter: url('#garland-shadow') drop-shadow(1px 1px 2px rgba(252, 121, 121, 0.6));
}