#sjf_heroAnimation::after, #sjf_heroAnimation::before {
    content: "";
    display: block !important;
    height: 650px;
    width: 100%;
    bottom: 0;
    position: absolute;
    background: linear-gradient(to top, #19192A, transparent);
    pointer-events: none !important;
}

#sjf_heroAnimation .hero_wrapper {
    display: flex;
    justify-content: space-between;
    width: 50vw;
    transform: rotate(35deg);
    position: absolute;
    top: -20vh;
    right: -10vw;
    opacity: .3;
    height: 150vh;
    pointer-events: none !important;
    z-index: -1;
}

@media only screen and (max-width: 1024px) {
    #sjf_heroAnimation .hero_wrapper {
        width: 100vw !important;
        opacity: .1 !important;
    }
}

#sjf_heroAnimation .column {
    display: flex;
    flex-direction: column;
    width: 48%;
    height: auto;
    pointer-events: none !important;
}

#sjf_heroAnimation .col-1 .images-set {
    animation: moveUp 40s linear infinite;
    display: inline-block !important;
    height: 100% !important;
    pointer-events: none !important;
}

#sjf_heroAnimation .col-2 {
    margin-top: -25%;
}

#sjf_heroAnimation .col-2 .images-set {
    animation: moveDown 40s linear infinite;
    display: inline-block !important;
    pointer-events: none !important;
}

@keyframes moveUp {
    from { transform: translateY(0); }
    to { transform: translateY(-100%); }
}

@keyframes moveDown {
    from { transform: translateY(0); }
    to { transform: translateY(100%); }
}


.logo-carousel {
    transform: rotate(2deg);
    margin-top: -20px;
    opacity: .8;
}