#splash.nextspin {
    background-size: 1000px 1000px;
}

#splash.nextspin .progress-bar {
    top: calc(50% - 33px);
    left: calc(50vw + 5px);
    width: 380px;
    border-radius: 0px;
    transform: translate(-50%, -50%) skewX(-30deg);
}

#splash.nextspin .progress-bar span.full:after { 
    /* Make sure that the tiger is NOT transformed */
    display: none;
}

#splash.nextspin .progress-bar span:after { 
    /* Make sure that the tiger is NOT transformed */
    transform: skew(30deg);
}

#splash.nextspin .progress-bar span {
    background-color: #eb3c14;
}

#splash.nextspin .stripes span {
    background-size: 4px 4px;    
    animation: animate-stripes 2.5s linear infinite;
    border-radius: 0px;
    position: relative;
}

#splash.nextspin .progress-bar span:after {
    content: url('./tiger.gif');
    position: absolute;
    right: -40px;
    top: -17px;
}

@media (orientation: portrait) {
    #splash.nextspin .progress-bar {
        height: 5px;
        top: calc(50% - 20px);
        width: 230px;
    }

    #splash.nextspin {
        background-size: 600px;
        background-position: center;
    }

    #splash.nextspin .progress-bar span:after {
        right: -36px;
        top: -16px;
        /* skew needed to make sure that the tiger is NOT transformed */
        transform: scale(0.7) skew(30deg);
    }
}