#container {

    width: 100%;
    height: 100%;
    background color: blue;
    float: left;

}

#header {

    width: 100%;
    height: 50px;
    background-color: yellow   ;
    float: left;

}   


/* Add a background color to the top navigation */
.topnav {
    background-color: #333;
    overflow: hidden;
    float: both;
    clear: both;    
}

/* Style the links inside the navigation bar */
.topnav a {
    float: left;
    display: block;
    color: #f2f2f2;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 20px;
    text-align: center;
}

/* Change the color of links on hover */
.topnav a:hover {
    background-color: yellow;
    color: black;
}

#whatis  {
    width: 1300px;
    height: 1600px; 
    background-color: #b1bbcc;
    float: center;
    clear:left;
    border-radius: 20px;
    margin-top: 5px;
    font-size: 15pt;
    border-color: black;


}


#whatheader {
    width: 500px;
    height: 100px;
    background-color:#6a7484  ;
    border-radius: 20px;
    font-size: 20pt;
    border-color: black;
    float: left;

}

#games {
    width: 500px;
    height: 500px;
    background-color: #b1bbcc;
    float:left;
    border-radius: 20px;
    margin-left: 20px;
    margin-top: 5px;
    font-size: 15pt;

}

#gamesheader {
     width: 500px;
    height: 100px;
    background-color:#6a7484 ;
    border-radius: 20px;
    font-size: 20pt;
    border-color: black;
    float: left;
}

#background {
    background-color: red;
      width: 1300px;
    height: 1200px;
}

#textareas {
    width: 1300px;
    height: 1200px;
    background color: red;
    float: left;    
}

.containerPicture {
    position: relative;
    text-align: center;
    color: white;
}


.centered {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 50px;
}