body {
  max-width: unset; }

main {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 2rem;
  margin: 0 1rem;
  padding: 0; }

nav > ul {
  padding: 0; }

nav {
  flex-basis: 15rem;
  flex-grow: 1;
  line-height: 1.4; }
  nav ul {
    list-style-type: none; }
    nav ul li {
      margin: 1rem 0; }
      nav ul li a {
        border: none;
        border-bottom: 0.5px solid;
        border-radius: 0;
        margin: 0;
        padding: 0.5ex 0.5ch;
        text-decoration: none;
        transition: unset; }
        nav ul li a:visited {
          color: #265301 !important; }
        nav ul li a:link {
          color: #437A16 !important; }
        nav ul li a:focus {
          background: #BAE498;
          border-bottom: 1px solid; }
        nav ul li a:hover {
          background: #CDFEAA;
          border-bottom: 1px solid; }
        nav ul li a:active {
          background: #265301;
          color: #CDFEAA; }

#content {
  flex-basis: 0;
  flex-grow: 999;
  min-width: 66%; }

a[href*="http"] {
  background: url("/events/50+5//assets/images/external-link-svgrepo-com.svg") no-repeat 100% 0;
  background-size: 16px;
  padding-right: 1.5rem; }

a[href$=".pdf"]:after {
  border-radius: 4px;
  border: 2px solid #437A16;
  content: "PDF";
  font-size: xx-small;
  font-weight: bold;
  margin-left: 0.5ch;
  padding: 0.2ex 0.5ch;
  vertical-align: super; }

a[href$=".pdf"]:visited:after {
  border: 2px solid #265301; }

a[href$=".mp4"].mugshot:after {
  border-radius: 4px;
  height: 100%;
  min-width: 2.5em;
  text-align: center;
  border: 2px solid #437A16;
  content: "MP4";
  font-size: xx-small;
  font-weight: bold;
  margin-left: 0.5ch;
  padding: 0.2ex 0.5ch;
  vertical-align: super; }

ul.videos {
  list-style-type: none;
  padding-left: 0; }
  ul.videos li {
    clear: both;
    padding-top: 1ex; }
  ul.videos li + li {
    border-top: 1px solid var(--accent); }
  ul.videos a.mugshot {
    float: left;
    text-decoration: none;
    display: flex;
    padding-right: 3em;
    flex-grow: 1;
    max-width: 80px; }
  ul.videos a.details {
    display: flex;
    min-width: 70%;
    flex-basis: 0;
    flex-grow: 999;
    text-decoration: none;
    line-height: 1.5; }
    ul.videos a.details .title {
      font-weight: bold;
      width: 100%;
      margin-right: 1rem; }
    ul.videos a.details .speaker {
      width: 100%;
      margin-right: 1rem; }
    ul.videos a.details .duration:before {
      font-size: x-small;
      vertical-align: super;
      content: "Duration: "; }
    ul.videos a.details .duration {
      width: 12ch; }

header > p.subtitle {
  color: #888888; }