#footer {
    position: relative;
    width: 100%;
    height: 180px;

    background-color: black;
    box-shadow: 0px 0px 25px rgba(0, 0, 0, 0.25);
}

#footer > .shadow {
    position: absolute;
    left: 0; top: 0; right: 0; height: 60px;
    overflow: hidden;
}
#footer > .shadow > .gradient {
    position: absolute;
    inset: 0;

    filter: blur(25px);
    opacity: 0.75;

    transform-origin: 0% 50%;

    background: linear-gradient(to right, #2196f3, #f44336, #DCE35B, #f44336, #2196f3, #f44336, #DCE35B, #f44336, #2196f3, #f44336, #DCE35B, #f44336, #2196f3, #f44336, #DCE35B, #f44336, #2196f3);

    animation: contact-gradient-anim 15s linear 0s infinite forwards;
}
@keyframes contact-gradient-anim {
    0% {
        transform: scaleX(1000%) translateX(-75%) translateY(-100%);
    }
    100% {
        transform: scaleX(1000%) translateX(-25%) translateY(-100%);
    }
}

#footer > .margin {
    padding: 40px 0;
    height: calc(100% - 80px);
    
    min-width: min(640px, calc(100% - 40px));

    position: relative;
    left: 50%; transform: translateX(-50%);
}