body{
    padding: 0,5%;
    background-color: rgb(169, 190, 204);
}
.heder {
    padding: 1%;
    height: 100px;
    width: 100%;
    background-color: rgb(78, 119, 148);
}


.title {
    border-radius: 15px 15px;
    border-color: rgb(106, 118, 128);
    background-color: rgb(108, 164, 204);
    font-size: 50px;
    height: 100px;
    width: 250px;
    color: rgb(63, 71, 77);
    font-family: "Times New Roman", Times, serif;
  }
    .title:hover{
        border-color: rgb(169, 190, 204);
    }
        .title:active{
            background-color: rgb(169, 190, 204);
        }
        .container-1{
            position: fixed;
            top: 40%;
            left: 30%;
            right: 30%;
        }
    .game-1{
        border: 5px solid;
        border-radius: 15px 15px;
        border-color: rgb(106, 118, 128);
        background-color: rgb(108, 164, 204);
        font-size: 50px;
        height: 300px;
        width: 100 px;
        color: rgb(63, 71, 77);
        font-family: "Times New Roman", Times, serif;
    }
    .game-1:hover{
        border-color: rgb(169, 190, 204);
    }
        .game-1:active{
            background-color: rgb(169, 190, 204);
        }
    .game-2{
        border: 5px solid; 
        border-radius: 15px 15px;
        border-color: rgb(106, 118, 128);
        background-color: rgb(108, 164, 204);
        font-size: 50px;
        height: 300px;
        width: 100px;
        color: rgb(63, 71, 77);
        font-family: "Times New Roman", Times, serif;
    }
    .game-2:hover{
        border-color: rgb(169, 190, 204);
    }
        .game-2:active{
            background-color: rgb(169, 190, 204);
        }