body {
    background-color: 383838;
    background-image: url('../images/red_black_background.jpg');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    color: white;
    padding-bottom: 25px;
    padding-left: 15px;
    padding-right: 15px;
}

p.info_statement {
    font-size: 20px;
}

table.player_table {
    text-align: center;
    border-collapse: collapse; 

    th { 
      cursor: pointer; 
    }
}
table.player_table tr td {
    font-size: 20px;
}
table.player_table th {
    font-size: 20px;
    padding-left: 5px;
    padding-right: 5px;
}
table.player_table tr:nth-child(even) {
    background-color: #69645f;
}

table.previous_game_table{
    text-align: left;
}
table.previous_game_table tr td {
    font-size: 20px;
}
table.previous_game_table th {
    font-size: 20px;
}

table.weights_table tr td {
    font-size: 20px;
}
table.weights_table th {
    font-size: 20px;
    padding-left: 5px;
    padding-right: 5px;
}
table.weights_table tr:nth-child(even) {
    background-color: 69645f;
}

div.game_list {
    column-count: 2;
    font-size: 24px;
}

 /* unvisited link */
 a:link {
    color: rgb(135, 248, 250);
  }
  
  /* visited link */
  a:visited {
    color: rgb(6, 186, 174);
  }
  
  /* mouse over link */
  a:hover {
    color: lightgreen;
  }
  
  /* selected link */
  a:active {
    color: rgb(203, 222, 135);
  } 

  /* Style the header with a grey background and some padding */
  .header {
    overflow: hidden;
    padding: 20px 10px;
  }
  
  /* Style the header links */
  .header a {
    float: left;
    color: white;
    text-align: center;
    padding: 12px;
    text-decoration: none;
    font-size: 18px;
    line-height: 25px;
    border-radius: 4px;
    background-color: rgb(58, 58, 58)
  }
  
  /* Style the logo link (notice that we set the same value of line-height and font-size to prevent the header to increase when the font gets bigger */
  .header a.logo {
    font-size: 25px;
    font-weight: bold;
  }
  
  /* Change the background color on mouse-over */
  .header a:hover {
    background-color: darkgray;
    color: red;
  }
  
  /* Style the active/current link*/
  .header a.active {
    background-color: white;
    color: black;
  }
  
  /* Float the link section to the right */
  .header-right {
    float: right;
    font-size: 40px;
  }
  
  /* Add media queries for responsiveness - when the screen is 500px wide or less, stack the links on top of each other */
  @media screen and (max-width: 500px) {
    .header a {
      float: none;
      display: block;
      text-align: left;
    }
    .header-right {
      float: none;
    }
  }