.bg-bounding {
    max-width: 100%;
    overflow-x: hidden !important;
    position: relative;
}

.bgdiag {
    animation: bgdiagslide 15s ease-in-out infinite alternate;
    background-image: linear-gradient(55deg, #000136 50%, #4502ff 50%);
    left: -50%;
    opacity: .5;
    position: absolute;
    right: -50%;
    height: 100%;
    max-width: 100vw - 10px;
    z-index: -1;
}

.bgdiag2 {
    animation-direction: alternate-reverse;
    animation-duration: 4s;
    position: absolute;
}

.bgdiag3 {
    animation-duration: 5s;
    position: absolute;
}

.bgdiag-content-box {
    padding: 10vmin;
}

.bgdiag-content {
    box-sizing: border-box;
    padding: 25px;
    text-align: center;
}

.item-outline {
    filter: drop-shadow(-2px -2px 0px #ffffff) drop-shadow(2px -2px 0px #ffffff) drop-shadow(2px 2px 0px #ffffff) drop-shadow(-2px 2px 0px #ffffff);
}

@keyframes bgdiagslide {
    0% {
        transform: translateX(25%);
    }
    100% {
        transform: translateX(-25%);
    }
}