ZaGeri

.timer-container {
  border: solid 2px green;
}



.loader {
  border: 16px solid #f3f3f3; /* Light grey */
  border-left: 16px solid #c528bd; /* Blue */
  border-radius: 50%;
  width: 120px;
  height: 120px;
  animation: load 6s linear infinite;
 /* margin-left: auto;*/
}

@keyframes load {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }

}

.timer{
  position: absolute;
  margin-top: 12%;
  font-size: 350%;
  z-index: 3;
}









//Function TIMER
var timeleft = 60;
var downloadTimer = setInterval(function(){
  if(timeleft <= 0){
    clearInterval(downloadTimer);
    document.getElementById("timer1").innerHTML = "Finished";
  } else {
    document.getElementById("timer1").innerHTML = timeleft;
  }
  timeleft -= 1;
}, 1000);






<!-- Game One Container -->
    <div class="game-container game-container-1" id="game1">
    <output class="timer" id="timer1" value=""></output>

        <output id="gameLabel1" class="gameLabel" value=""></output>
        <p>Some game is playing...</p>
        <label>RESULT</label>
        <output class="result-game" id="result-game1"></output>
    <div class="timer-container">

     <div class="loader"></div>


    </div>



        <button class="ok-button" id="ok-button-game1" onclick="closeGame(this)">GET RESULT</button>
    </div>
    <!-- End of Game One Container -->