* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    overflow: hidden;
}

.game-board {
    width: 100vw;
    height: 97vh;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    background: linear-gradient(#87CEEB, #E0F6FF);
}

#tempo {
    position: absolute;
    top: 10px;
    left: 10px;
    color: #007905;
    font-size: clamp(1rem, 3.5vw, 1.5rem);
    font-family: 'VT323', monospace;
}

#returnGame {
    display: none;
    justify-content: center;
    align-items: center;
    text-align: center;
    height: 100%;
    font-size: clamp(1rem, 2.5vw, 1.5rem);
    font-family: 'VT323', monospace;
    color: rgba(0, 0, 0, 0.6);
    animation: appear 1s;
    padding: 10px;
}

.pipe {
    width: clamp(40px, 8vw, 60px);
    bottom: 0;
    position: absolute;
    animation: pipe-animation 1.5s infinite linear;
}

.mario {
    width: clamp(60px, 12vw, 100px);
    bottom: 0;
    position: absolute;
}

.jump {
    animation: jump 500ms ease-out;
}

.clouds {
    width: clamp(120px, 40vw, 250px);
    bottom: 40vh;
    position: absolute;
    animation: clouds-animation 15s infinite linear;
}

footer {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 3vh;
}

p {
    font-family: 'Alkatra', cursive;
    font-size: clamp(0.7rem, 1.8vh, 0.9rem);
}

a {
    text-decoration: none;
    color: #007905;
}

a:hover {
    color: #53ff31;
}

h1::selection, h2::selection, span::selection, p::selection, a::selection, img::selection {
    color: #0037d6;
    background-color: #e80000;
}

@keyframes pipe-animation {
    from { right: -20vw; }
    to { right: 100vw; }
}

@keyframes jump {
    0% { bottom: 0; }
    40%, 50%, 60% { bottom: 25vh; }
    100% { bottom: 0; }
}

@keyframes clouds-animation {
    from { right: -50vw; }
    to { right: 100vw; }
}

@keyframes appear {
    0% { opacity: 0; }
    100% { opacity: 1; }
}