img.logo {
  display: inline;
  height: 90px;
  padding: 0px;
  margin: 10px 30px;
}

div.logo {
  display: flex;
  justify-content: center;
  outline: 1px black;
}

@media screen and (min-width: 1400px) {
   th.c4,
   td.c4 {
      display: table-cell;
   }
}

@media screen and (min-width: 900px) {
   th.c3,
   td.c3 {
      display: table-cell;
   }
}

@media screen and (min-width: 700px) {
   th.c2,
   td.c2 {
      display: table-cell;
   }
}

@media screen and (min-width: 500px) {
   th.c1,
   td.c1 {
      display: table-cell;
   }
}

td.c0 {display: block;}
th.c0 {display: table-cell;}

td, th {
  display: none;
  padding-left: 10px;
  padding-right: 10px;
}

/* Makes the a tag in the first column into a large clickable box */
.clickable-cell {
  display: block;
  padding: 10px;
  height: 100%;
}


/* Makes every other cell grey */
tbody tr:nth-child(odd) {
  background-color: #F0F0F0;
}

/* Makes the hovered cell blue */
tbody tr:hover {
  background-color: lightblue;
}

thead th {
    text-align: center;
    vertical-align:middle;
}

table a {
  color: black;
  text-decoration-line: none;
}

table {
  border-collapse: collapse; /* Makes the internal lines collapse into one */
  word-wrap: break-word;,
  width: 100%;
}