table {
  width: 100%;
}

td {
  display: block;
  width: 100%;
}

tr {
  display: block;
}

.content .panel-button {
  padding: 1em;
  margin: 0.5em 0.3em;
  line-height: 1;
  width: 100%;
}

.panel-button {
  text-align: left;
}

.panel-button:hover {
  text-decoration: none;
  filter: brightness(175%);
}

.panel-button .panel-title {
  font-weight: bold;
  font-size: large;
}

.panel-button .panel-location, .panel-button .panel-panelist {
  display: inline;
  flex-grow: 0;
  flex-basis: auto;
}

.panel-button .panel-location {
  margin-right: 4em;
  text-decoration: underline;
}

.panel-button .panel-panelist {
  font-style: italic;
}

.panel-button .panel-metadata {
  display: flex;
  justify-content: space-between;
}


/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
  table .header {
    white-space: nowrap;
    text-align: right;
    min-width: 8em;
  }

  table .content {
    width: 100%;
  }

  table td {
    display: revert;
    width: revert;
  }

  .table td {
    vertical-align: inherit;
    border-top: none;
  }
  
  .content .panel-button {
    width: initial;
  }
}