/* font */

    @font-face {
      font-family: FiraCode;
      src: url(fonts/FiraCode-Light.woff2);
      font-style: normal;
      font-weight: 300;
    }

    @font-face {
      font-family: FiraCode;
      src: url(fonts/FiraCode-Regular.woff2);
      font-style: normal;
      font-weight: 400;
    }

    @font-face {
      font-family: FiraCode;
      src: url(fonts/FiraCode-Medium.woff2);
      font-style: normal;
      font-weight: 500;
    }

    @font-face {
      font-family: FiraCode;
      src: url(fonts/FiraCode-SemiBold.woff2);
      font-style: normal;
      font-weight: 600;
    }

    @font-face {
      font-family: FiraCode;
      src: url(fonts/FiraCode-Bold.woff2);
      font-style: normal;
      font-weight: 700;
    }

    body {
      margin: 0;
      /*background-color: #353b43;*/
      background-color: #8887a2;
      background-image: linear-gradient(326deg, #9a78b7 0%, #8887a2 74%);
    }

    .header {
      display: flex;
      align-items: center;
      justify-content: center;
      top: 0;
      position: sticky;
      height: 100px;
      width: calc(100vw - (100vw - 100%));
      /*background-color: #1d2024;*/
      background-color: rgba(30, 30, 63, 0.8);
      z-index: 100;
    }

    .nav {
      display: flex;
      justify-content: space-between;
      align-items: center;
      width: 960px;
      font-family: FiraCode, monospace;
      /*background-color:blue;*/
    }

    .nav-logo {
      margin-right: auto;
      padding-left: 20px;
    }

    .nav-logo img {
      display: block;
      height: 100px;
    }

    #menu {
      margin-left: auto;
    }

    #menu ul {
      margin: 0;
      padding: 0;
      list-style: none;
      display: flex;
      align-items: center;
    }

    #menu li {
      display: inline-block;
    }

    #menu li hr {
      display: none;
    }

    #menu a {
      display: block;
      padding: 0 20px 0 0;
      color: white;
      text-decoration: none;
    }

    #menu a:hover {
      color: #929ea9;
    }

    #content {
      display: block;
      width: 960px;
      max-width: 100%;
      margin: 0 auto 0;
    }

    .art {
      /*background-color: #292f36;*/
      background-color: rgba(45, 43, 85, 0.8);
      padding: 3rem;
      margin: 15px 0 40px 0;
      filter: drop-shadow(5px 5px 15px)
    }

    .art h2 {
      font-family: FiraCode, monospace;
      color: #fff;
    }

    .art h3 {
      font-family: FiraCode, monospace;
      color: #fff;
    }

    .art p,
    td,
    th,
    figcaption {
      font-family: FiraCode, monospace;
      /*color: #929ea9;*/
      color: #fff;
    }

    th {
      font-weight: bold;
      text-align: left;
    }

    td {
      padding-right: 2em;
    }

    .art a {
      font-family: FiraCode, monospace;
      color: #fff;
    }

    .art b {
      /*color: #929ea9;*/
      color: #ffffff;
      font-family: FiraCode, monospace;
    }
    
    .art ul {
      /*color: #929ea9;*/
      color: #ffffff;
      font-family: FiraCode, monospace;
    }

    .art a:hover {
      color: #138788;
    }

.timetable {
    width: 100%;
    border-collapse: collapse;
    background-color: rgba(45, 43, 85, 0.8);
    margin: 15px 0 40px 0;
    filter: drop-shadow(5px 5px 15px);
    font-family: FiraCode, monospace;
    color: #fff;
}

.timetable th,
.timetable td {
    padding: 0.8rem 1rem;
    text-align: left;
    color: #fff;
}

.timetable th {
    font-weight: bold;
    background-color: rgba(30, 30, 63, 0.8);
}

.timetable tr:nth-child(even) {
    background-color: rgba(255, 255, 255, 0.05);
}

.timetable tr:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

.timetable a {
    color: #fff;
    text-decoration: none;
}

.timetable a:hover {
    color: #138788;
}

.timetable_eventtype_compo,
.timetable_eventtype_event,
.timetable_eventtype_seminar {
    font-weight: bold;
}

.elapsed {
    opacity: 0.5;
}

#content h2,
#content h3 {
    font-family: FiraCode, monospace;
    color: #fff;
}

#footer {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 60px;
    width: calc(100vw - (100vw - 100%));
    background-color: rgba(30, 30, 63, 0.8);
    z-index: 100;
    font-family: FiraCode, monospace;
    color: white;
}

#footer small {
    display: flex;
    align-items: center;
    gap: 8px;
}

.footer-logo {
    height: 28px;
    width: auto;
    vertical-align: middle;
    opacity: 0.9;
}