.clock {
  font-size: 25px;
position: absolute;
        right: 50px;
        padding: 10px;
}
  

.popup-overlay {

    display: none;
    
    z-index: 2;

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: rgba(0, 162, 237, 1);
animation: fadeOut 2s;
animation-delay: 3s;
animation-fill-mode: forwards;

}


.popup {

font-family: Arial, serif;

    position: absolute;

    top: 50%;

    left: 50%;
    
    width: 60%;
    height: 40%;

    transform: translate(-50%, -50%);

    background: #fff;

    padding: 20px;
    
    border: 5px solid;
    
border-color: black;

animation: fadeOut 2s;
animation-delay: 3s;
animation-fill-mode: forwards;

}

.popup-content {

    text-align: center;
animation: fadeOut 2s;
animation-delay: 3s;
animation-fill-mode: forwards;
}


@keyframes fadeOut {
  from {
opacity: 1;
}
to {
opacity: 0;
display:none;
}}