.event-list {
  font-size: 1.1em;
  padding-left: 0;
}
.event-list > .event-line {
  max-height: 200px;
  overflow:hidden auto;
  margin-bottom: 10px;
  padding-left: 0;
}
.event-list > .event-line > .event-wrapper {
  display: flex;
  flex-direction: row;
  background-color: rgba(3, 63, 23, 0.9);
  border: 1px solid gray;
  border-radius:12px;
}
.event-list > .event-line:nth-child(2n) > .event-wrapper {
  background-color: rgba(190, 80, 21, 0.9);
  color: rgba(80,80,80,0.9);
}
.event-wrapper > .event-date {
  display: flex;
  flex-direction: column;
  width: 15%;
}
.event-wrapper > .event-date > .event-day {
  display: inline-block;
  font-size: 4rem;
  font-weight: bold;
  margin: 0 auto;
}
.event-wrapper > .event-date > .event-mony {
  display: inline-block;
  font-size: 1.75rem;
  margin: 0 auto;
}
.event-wrapper > .event-date > .event-time {
  display: inline-block;
  font-size: 1.6rem;
  margin: 0 auto;
}
.event-wrapper > .event-body {
  width: 80%;
  background-color: rgba(240,240,240, 1.0);
}
.event-wrapper > .event-body > h2 {
  font-size: 1.3rem;
  font-weight: bold;
  margin: 0;
  padding: 4pt;
}
.event-wrapper > .event-body > h3 {
  font-size: 1.1rem;
  font-weight: normal;
  margin: 0;
  margin-bottom: 8pt;
  padding: 0 8pt;
}
.event-wrapper > .event-body p {
  margin: 0;
  padding: 0 8pt;
}
.event-wrapper > .event-flags {
  display: flex;
  flex-direction: column;
  font-size: 1.6rem;
  padding: 8pt;
}
.event-wrapper > .event-flags > i {
  display: inline-block;
  margin: 0 auto;
  padding: 8pt;
  cursor: pointer;
}
.event-line:nth-child(2n-1) > .event-wrapper > .event-flags a {
  text-decoration: none;
  color: rgba(240,80,80,0.9);
}
.event-line:nth-child(2n) > .event-wrapper > .event-flags a {
  text-decoration: none;
  color: rgba(80,240,80,0.9);
}
@media screen and (max-width: 736px) {
  .event-list {
    width: 100%;
    font-size: 0.9em;
    padding: 0;
  }
  .event-list > .event-line {
    margin-bottom: 6px;
    overflow: hidden;
    padding: 0;
  }
  .event-wrapper > .event-date {
    display: flex;
    flex-direction: column;
    width: 25%;
  }
  .event-wrapper > .event-date > .event-day {
    font-size: 1.6rem;
  }
  .event-wrapper > .event-date > .event-mony {
    font-size: 0.8rem;
    margin: 0 auto;
  }
  .event-wrapper > .event-date > .event-time {
    font-size: 0.9rem;
    margin: 0 auto;
  }
  .event-wrapper > .event-body {
    width: 65%;
    max-height: 20vh;
    overflow-y: auto;
    margin-bottom: 0.25rem;
    background-color: rgba(240,240,240, 1.0);
  }
  .event-wrapper > .event-body > h2 {
    font-size: 1.0rem;
  }
  .event-wrapper > .event-body > h3 {
    font-size: 0.9rem;
    margin-bottom: 4pt;
    padding: 0 4pt;
  }
  .event-wrapper > .event-body p {
    margin: 0;
    padding: 0 4pt;
  }
  .event-wrapper > .event-flags {
    font-size: 1.2rem;
    padding: 4pt;
  }
  .event-wrapper > .event-flags i {
    padding: 4pt;
  }
}