.viewport {
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    position: relative;
}

.game {
    position: relative;
    width: 703px;
    height: 258px;
}
.game .row{
    margin: 0;
}
.results {
    position: absolute;
    display: none;
    align-items: center;
    justify-content: center;
    transform: translateY(100%);
    transition: transform 1s ease;
    color: #000;
    font-size: 2em;
    font-family: "KG Happy Solid" !important;
    background-color: #fff200;
    padding: 9px 15px 5px;
}

.results.shown {
    display: flex;
    transform: translateY(0);
}

.columns {
    background-size: 100% 100%;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}

.columns.columns-top {
    background-image: url(../../../images/22/feb/lp/strip-1.png);
	background-image: -webkit-image-set(url("../../../images/22/feb/lp/strip-1.png") 1x, url("../../../images/22/feb/lp/strip-1@2x.png") 2x);
}

.columns.columns-center {
    background-image: url(../../../images/22/feb/lp/strip-2.png);
	background-image: -webkit-image-set(url("../../../images/22/feb/lp/strip-2.png") 1x, url("../../../images/22/feb/lp/strip-2@2x.png") 2x);
}

.columns.columns-bottom {
    background-image: url(../../../images/22/feb/lp/strip-3.png);
	background-image: -webkit-image-set(url("../../../images/22/feb/lp/strip-3.png") 1x, url("../../../images/22/feb/lp/strip-3@2x.png") 2x);
}

.columns:after {
    content: "";
    display: block;
    padding-top: 12.07%;
}


@keyframes ltr-transition-0 {
    0% {
        background-position: 0px;
    }

    100% {
        background-position: 234.099px;
    }
}

@keyframes ltr-transition-1 {
    0% {
        background-position: 234.099px;
    }

    100% {
        background-position: 468.198px;
    }
}

@keyframes ltr-transition-2 {
    0% {
        background-position: 468.198px;
    }

    100% {
        background-position: 703px;
    }
}

@keyframes rtl-transition-0 {
    0% {
        background-position: -234.099px;
    }

    100% {
        background-position: -468.198px;
    }
}

@keyframes rtl-transition-1 {
    0% {
        background-position: -703px;
    }

    100% {
        background-position: -937.099px
    }
}

@keyframes rtl-transition-2 {
    0% {
        background-position: -1171.198px
    }

    100% {
        background-position: -1406px;
    }
}
@media screen and (max-width: 767px){
    .game {
        position: relative;
        width: 354px;
        height: 130px;
    }
    .results{
        font-size: 1.3em;
    }
    @keyframes ltr-transition-0 {
        0% {
            background-position: 0px;
        }

        100% {
            background-position: 118px;
        }
    }

    @keyframes ltr-transition-1 {
        0% {
            background-position: 118px;
        }

        100% {
            background-position: 236px;
        }
    }

    @keyframes ltr-transition-2 {
        0% {
            background-position: 236px;
        }

        100% {
            background-position: 354px;
        }
    }

    @keyframes rtl-transition-0 {
        0% {
            background-position: -118px;
        }

        100% {
            background-position: -236px;
        }
    }

    @keyframes rtl-transition-1 {
        0% {
            background-position: -354px;
        }

        100% {
            background-position: -472px
        }
    }

    @keyframes rtl-transition-2 {
        0% {
            background-position: -590px
        }

        100% {
            background-position: -708px;
        }
    }

}