--------------JS-----------------

carregaElementos() {
document.getElementById("pausa").style.display = "none";
}

function retomarVida() {
    i = 1;
    k = 1;
    j = 1;
    l = 1;
    n = 1;
    o = 1;
    gil.style.display = "block";
    pulmao++;
    document.getElementById("fimvida").style.display = "none";
    timerNuvens = setInterval(movNuvem, 1000 / 60);
    animMiniPutin = setInterval(animacaoPutinas, 325 / 3.5);
    saltominiputin = setInterval(saltoPutinas, 100 / 3.5);
    radioAnim = setInterval(radioAnimation, 1000 / 10);
    moverBala = setInterval(moverTiro, 1000 / 60);
    bv = 1;
    barraOxigenio = setInterval(barraVida, 1000);
    teclaativa = true;
    merda = setInterval(atualizaColisao, 1000 / 5);

}

function fimJogo() {
    estadoJogo = false;
    teclaativa = false;
    clearInterval(timerNuvens);
    clearInterval(moverBala);
    clearInterval(tiroRadio);
    clearInterval(radioDie);
    clearInterval(radioAnim);
    clearInterval(animMiniPutin);
    clearInterval(saltominiputin);
    clearInterval(gilDie);
    clearInterval(barraOxigenio);
    bv = 1;
    document.getElementById("personagens").style.display = "none";
    document.getElementById("fimjogo").style.display = "block";
    document.getElementById("pulmao" + pulmao).style.display = "none";
    document.getElementById("barravida").style.display = "none";
    document.getElementById("recomecar").onclick = function () {
        recomecarJogo();
     };
    document.getElementById("sair").onclick = function () {
        self.close();
    }
}

function limpaTeclas(event) {
    // cada vez que uma tecla é libertada, ela é removida da lista
    if (event.key == 'w' || event.key == 'a' || event.key == 'd' || event.key == ' ' || event.key == 'm' || event.key == 's' || event.key == 'p') {
       /* if (event.key == 'm')
            velocidade34 = 5;*/
        removeKey(event.key);
    }
}

function processaTeclas(event) {
    // verificar se a tecla pressionada é uma das pretendidas e invocar a função para adicionar ao array;
    if (event.key == 'w'
        || event.key == 'a'
        || event.key == 'd'
        || event.key == ' '
        || event.key == 'm'
        || event.key == 's'
        || event.key == 'p') {
        addKey(event.key)
    }
    processaTecla();
    // mostra a lista de teclas pressionadas
    console.log(teclas);
}

function processaTecla () {
if (teclas == "p") {
        pausaJogo();
    }
}

function pausaJogo () {
    document.getElementById("pausa").style.display = "block";
    teclaativa = false;
    estadoJogo = false;
    clearInterval(timerNuvens);
    clearInterval(moverBala);
    clearInterval(tiroRadio);
    clearInterval(radioAnim);
    clearInterval(radioDie);
    clearInterval(animMiniPutin);
    clearInterval(saltominiputin);
    clearInterval(merda);
    clearInterval(barraOxigenio);
    document.getElementById("continuar").onclick = function () {
        estadoJogo = true;
        document.getElementById("pausa").style.display = "none";
        timerNuvens = setInterval(movNuvem, 1000 / 60);
        animMiniPutin = setInterval(animacaoPutinas, 325 / 3.5);
        saltominiputin = setInterval(saltoPutinas, 100 / 3.5);
        radioAnim = setInterval(radioAnimation, 1000 / 10);
        moverBala = setInterval(moverTiro, 1000 / 60);
        barraOxigenio = setInterval(barraVida, 1000);
        teclaativa = true;
        merda = setInterval(atualizaColisao, 1000 / 5);
    };
    document.getElementById("recomecarpause").onclick = function () {
       recomecarJogo();
    };
    document.getElementById("sairpause").onclick = function () {
        self.close();
    }
}

function recomecarJogo () {

    //quando recomeça o jogo no final das vidas todas não há gil

    i = 1;
    k = 1;
    j = 1;
    l = 1;
    n = 1;
    o = 1;
    p = 1;
    gil.src = "IMAGENS/gil/right/parado.png";
    document.getElementById("pausa").style.display = "none";
    for (pulmao = 1; pulmao<=3; pulmao++) {
        document.getElementById("pulmao" + pulmao).style.display = "block";
        document.getElementById("pulmao" + pulmao).src = "IMAGENS/barravida/pulmao1.png";
    }
    gil.style.display = "block";
    carregaElementos();
    estadoJogo = true;
    teclaativa = true;
    bv =1;
    pulmao = 1;
    vidas = 2;
    timerNuvens = setInterval(movNuvem, 1000 / 60);
    animMiniPutin = setInterval(animacaoPutinas, 325 / 3.5);
    saltominiputin = setInterval(saltoPutinas, 100 / 3.5);
    radioAnim = setInterval(radioAnimation, 1000 / 10);
    moverBala = setInterval(moverTiro, 1000 / 60);
    barraOxigenio = setInterval(barraVida, 1000);
}


------------------CSS------------------------------

#pausa {
    width: 100%;
    height: 800px;
    background-color: rgba(126,126,126,0.8);
    position: relative;
    left: 0;
    top: 0;
    z-index: 3;
}

#recomecarpause {
    position: fixed;
    top: 40%;
    left: 42%;
}

#recomecarpause:hover {
    padding: 10px 5px 10px 5px;
}

#continuar {
    position: fixed;
    top: 30%;
    left: 42%;
}

#continuar:hover {
    padding: 10px 5px 10px 5px;
}

#sairpause {
    position: fixed;
    top: 50%;
    left: 46.5%;
}

#sairpause:hover {
    padding: 10px 5px 10px 5px;
}

------------HTML-------------------
<div id="pausa">
    <p id="continuar">CONTINUAR</p>
    <p id="recomecarpause">RECOMEÇAR</p>
    <p id="sairpause">SAIR</p>
</div>