* {
    margin:0;
    padding: 0;
    box-sizing: border-box;
  }
  
  body {font-family: Arial, Helvetica, sans-serif;
    font-size:1em; 
    display: grid;
  }
  
  .header{
    background-color: #fff;
    grid-area: hd;
  }

  .header-grid {
    display: grid; 
    grid-template-columns: 60px 200px auto;
    grid-template-rows: 60px; 
  }
  
  .header-logo {
    background-color: #fff;
    background-image: url(../img/neil2.png);
    background-size: cover;
    margin: 10px; 
  }
  
  .header-name {
    background-color: #fff;
    font-family: 'Urbanist',Arial, Helvetica, sans-serif;
    font-size: 30pt;
    padding-top: 7px;
    margin-left: -5px;
    color: #666;  
  }
  
  .header-nav {
    background-color: #fff;
  }
  

  .container-grid {
    display: grid;
    grid-template-columns: 100%;
    grid-template-rows: 75px auto 60px;
  }

  .main {
    max-width: 550px;
    width: 85%;
    margin: 0 auto;
    border-radius: 20px;
    background-color: #ddd;
    border: 1px solid #aaa;
  }
  
  .content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr; 
    padding: 10px;
    padding-top: 50px;
    align-items:center;
    justify-items: center;
  }
  

  .footer {
    grid-area: ft;
    background-color: #fff;
    color: #3F367B;
    font-size: 14px;
    text-align: center;
    padding-top: 14px;
  }
  

  .game-button {
    width: 200px;
    height: 100px;
    margin:20px;
    background-color: none;
    border-radius: 15px;
    transition: all .2s ease-in-out;
  }

  .game-button:hover { 
    transform: scale(1.08);
   }

  .game-button#red-button {
    border: 5px solid red;
  }

  .game-button#yellow-button {
    border: 5px solid yellow;
  }

  .game-button#green-button {
    border: 5px solid green;
  }

  .game-button#blue-button {
    border: 5px solid blue;
  }

  .control-button {
    width: 200px;
    height: 50px;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    text-decoration: none;
    background: #4281a4;
    color: #e4dfda;
    margin: 20px;
    grid-column: 1/3;
    text-align: center;
    padding-top: 15px;
    border-radius: 8px;
  }