.contenedor {
    width: 100%;
    height: 30vh;
    /* margin: 0 auto;  */
    position: relative;  
    overflow: hidden; 
    z-index: 10; 
} 
.dino {
    width: 9vh;
    height: 9vh; 
    position: absolute;
    bottom: 0;
    left: 4.5vh;
    z-index: 2; 
    background: url(../img/img_trex/dino.svg) repeat-x 0px 0px;
    background-size: 36vh 9vh;
    background-position-x: 0px;

}

.dino-corriendo {
    animation: animarDino 0.25s steps(2) infinite;
}
.dino-estrellado {
    background-position-x: -27vh;
}

.suelo {
    width: 200%;
    height: 6.4vh; 
    position: absolute;
    bottom: 0;
    left: 0; 
    background: url(../img/img_trex/suelo.svg) repeat-x 0px 0px;
    background-size: 100% 9.1vh;

}

.cactus{
    width: 4.9vh;
    height: 10.2vh; 
    position: absolute;
    bottom: 1.3vh;
    left: 6.4vh;
    z-index: 1; 
    background: url(../img/img_trex/cactus1.svg) no-repeat;
}
.cactus2{
    width: 10.5vh;
    height: 7.0vh; 
    background: url(../img/img_trex/cactus2.svg) no-repeat;
}

.nube{
    width: 9.8vh;
    height: 2.7vh; 
    position: absolute;
    z-index: 0; 
    background: url(../img/img_trex/nube.svg) no-repeat;
    background-size: 9.8vh 2.7vh;
}

.score{
    width: auto;
    height: 3.2vh; 
    position: absolute;
    top: 1.9vh;
    right: 2.1vh;
    z-index: 10; 
    color: #fff;
    font-family: Verdana;
    font-size: 3.2vh; 
    font-weight: bold;
    text-align: right;

    font-family: texto_018; 
    letter-spacing: 0.4rem; 
}

.game-over{
    display: none; 
    position: absolute;
    width: 100%; 
    text-align: center;
    color: #fff;
    font-size: 3.2vh; 
    font-family: Verdana;
    font-weight: 700;
    bottom: 22%; 
}

@keyframes animarDino{
    from{
        background-position-x: -9vh;
    }
    to{
        background-position-x: -27vh;
    }
}