body{
    margin: 0px;
}

#board{
    background-color: blue;
    width: 100%;
    height: 600px;
    position: relative;
}

#player{
    width: 70px;
    height: 70px;
    position: absolute;
    bottom: 190px;
    left: 100px;
}

#player img{
    width: 100%;
    height: 100%;
}

.playerJump{
    animation: playerJump 1s linear;
}

@keyframes playerJump {
    0%{
        bottom: 190px;
    }
    45%, 55%{
        bottom: 300px;
    }
}

#background{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: url("background.png");
    background-repeat: repeat;
    background-position: 0 0;
    background-size: auto 100%;
    animation: animatedBackground 25s linear infinite;

}

@keyframes animatedBackground {
  from {
    background-position: 0 0;
  }
  to {
    background-position: -10000px 0;
  }
}

#cactus{
    position: absolute;
    bottom: 180px;
    right: 0px;
    height: 80px;
    width: 55px;
}

.animatedCactus{
    animation: movementCactus 2s linear infinite;
}

#cactus img{
    max-width: 100%;
    max-height: 100%;
}

#scoreContainer{
    text-align-last: center;
    font-size: 50px;
    margin-top: 20px;
}

@keyframes movementCactus {
    0% {
        right: 0%;
    }
    100%{
        right: 100%;
    }
}

.menu{
    display: flex;
    justify-content: center;
}

.button.play, .button.reset {
  border-style: solid;
  border-width: 37px 0 37px 60px;
}

.button {
  border: 0;
  background: transparent;
  box-sizing: border-box;
  width: 0;
  height: 74px;
  border-color: transparent transparent transparent #202020;
  transition: 1000ms all ease;
  cursor: pointer;
  border-style: double;
  border-width: 0px 0 0px 60px;
}

.button:hover {
  border-color: transparent transparent transparent #404040;
}



#nombre{
  background: yellow;
    font-size: 50px;
    
}

h1{
  color: blue;                               
  font-size: 15px;
}
h2{
  color: blue;                               
  font-size: 15px;
}