h1 {
    text-align: center;
    font-family:Impact;
}

img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    min-width: 150px;
  }

body {
    background-color: grey;
    position: relative;
    
  }
/* code adapted from W3Schools*/
ul {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
    width: auto;
    overflow: hidden;
    background-color: rgb(5, 165, 85);
  }

li {
    float: left;
    border-right: 4px solid;
}

li:first-child {
  border-left: 4px solid;
}

li:last-child {
    border-left: 4px solid;
}

li a {
  display: block;
  color: rgb(0, 0, 0);
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

li a:hover {
    background-color: rgb(165, 5, 165) ;
}

.active {
    background-color: lightgray ;
}

/*end of adapted code*/

h2 {
  font-size:xx-large;
}
div.container {
   width: 90%;
   padding: 20px;

}

div.left-column {
    float: left;
    width: 60%;
    clear: both;
    padding-bottom: 30px;
}

div.right-column {
    float: left;
    width: 40%;
    text-align: center;
    font-size: larger;
}

div.left-column-players{
  float:left;
  width: 500px;
  clear: both;
  padding:10px
}

div.right-column-players{
  float:left;
  width: 500px;
  font-size: larger;
}



div.left-column-history{
  float:left;
  width: 40%;
  font-size: larger;
  clear:both;
  padding-bottom: 20px;
}

div.right-column-history{
  float: left;
  width: 50%;
  padding:10px;
}

div.left-column-contact {
  float: left;
  width: 500px;
}

div.right-column-contact{
  float:left;
  padding-left: 50px;
}
/* code adapted from Digital Ocean */
footer{
  display: block;
  clear: both;
  position: relative;
  left: 0;
  bottom: 0;
  text-align: left;
  width: 100%;
  background-color: rgb(165, 5, 165) ;
  padding: 1px;
}
/*End of adapted code*/