body{
    font-family: cursive, "Helvetica Neue", helvetica, arial, sans-serif;
    }

h1 {
    background-color: aliceblue;
    color:brown;
    font-size: 30px;
    text-align: center;
    font-family: cursive, "Helvetica Neue", helvetica, arial, sans-serif;
    }
    
img {
    width: 20%;
    height: 10%;
    }
    
.description {
      font-family: cursive, "Helvetica Neue", helvetica, arial, sans-serif;
      font-size:150%;
      text-align: justify;
      float: right;
      width: 74%;
      margin-top:5%;
      margin-right:4%;
    }

      input.rules {
        width: 10%;
        margin-left: 5%;
        margin-top:2%;
        position: absolute;
        padding: 1%;
        cursor: pointer;
        font-weight: bold;
        font-size: 100%;
        background:black;
        color: #fff;
        border: 1% solid #111213;
        border-radius: 8%;
    
        }

        input.rules:hover {
        color: #fff;
        background:brown;
        border: 1% solid #fff;
        }

        .grid-container {
            display: grid;
            height: 25%;
            width: 35%;
            margin-left:35%;
            margin-top: 0;    
            align-content: center;
            grid-template-columns: auto auto auto;
            grid-gap: 1%;
            background-color: #111213;;
            padding: 1%;
            z-index:1;   
                
          }
          
          .grid-container > div {
            background-color: white;
            text-align: center;
            padding: 40%;
            font-size: 250%;
     }