html {
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  box-sizing: border-box;
  font-size:10px;
  font-family: Arial, Helvetica, sans-serif;
}

body {
  margin:0;
  padding:0;
  width:100%;
  height:100%;
  line-height:150%;
  font-size:1.6rem;
  background-color:#f6ffe8;
  color:#333;
}

h1, h2 {
  font-family: 'Press Start 2P', cursive;
}

h1 {
  text-transform: uppercase;
  font-size:3rem;
  text-align:center;
}
body>header {
  display:flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width:100%;
  height:3rem;
  background: linear-gradient(#fff, #ccc);
}

a:link {
  color:blue;
  font-weight:bold;
  text-decoration:none;
}

a:visited {
  color:purple;
}

a:hover, a:active {
  color:red;
  font-weight:bold;
  text-decoration:underline;
}

.logo-type {
  font-family: 'Press Start 2P', cursive;
  text-transform: uppercase;
  padding:0.5rem;
}

nav {
  padding: 0.5rem;
}

nav a {
  padding-right:2rem;
  text-decoration: none;
}

nav a:last-child {
  padding-right:0;
}

nav a:hover {
  color:red;
}

footer {
  position:fixed;
  bottom:0;
  left:0;
  width:100%;
  border-top:1px solid #333;
  background-color: linear-gradient(white, #f6ffe8, white);
  background-color: rgba(255, 255, 255, 1);
  text-align:center;
  line-height:1.5em;
}

/* Main page classes and ids */

.header-image {
  display:block;
  width:80%;
  max-width:800px;
  margin:0.5rem auto;
  border:1px solid #333;
}

/* The list of feature cards on the main page */
.features {
  display:flex;
  flex-direction: row;
}

/* Formatting for the individual cards. */
.card {
  width:33%;
  padding:2rem;
  border:1px solid #333;
  margin:2rem;
}

.patreon-button {
  width:100%;
  height:auto;
}

/* Bios page classes and ids */
/* The table of biographies and pictures */
table {
  width:60%;
  margin:1rem auto;
}

td {
  width:50%;
  vertical-align: middle;
}

td img {
  width:90%;
}

/* Video page classes and ids */
#video-page {
  width:80%;
  margin:2rem auto;
}

#video-list {
  width:100%;
  display:grid;
  grid-template-rows: repeat(5, 1fr);
  grid-template-columns:repeat(4,1fr);
}

.video-card {
  padding: 1rem;
}

small {
  margin-top:0;
}

#video-page h3 {
  margin-bottom:0;
  font-size:2rem;
}