body {
  font-family: Arial, Tahoma, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  scrollbar-face-color: #000000;
  scrollbar-shadow-color: #000000;
  scrollbar-highlight-color: #000000;
  scrollbar-3dlight-color: #000000;
  scrollbar-darkshadow-color: #000000;
  scrollbar-track-color: #000000;
  scrollbar-arrow-color: #000000;
  overflow: hidden;
  color: white;
  background-color: #0000ff;
  margin: 0;
}

.container.simple {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.heading {
  text-align: center;
  font-size: 7vh;
  font-family: sans-serif;
  padding: 15px;
}

.event-list,
.event {
  /* border-style: solid;
  border-color: rgba(0, 0, 0, 0.3); */
}

.event-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  max-height: calc(100vh - 120px);
  /* border-width: 3px 0 0 3px; */
}

.event {
  display: flex;
  font-size: 30px;
  font-family: Fira Sans, sans-serif;
  /* border-width: 0 3px 3px 0; */
  width: 100%;
  margin: -5px 0;
}

.event > div {
  padding: 15px;
}

.event:nth-of-type(2n-1) {
  /* background-color: #9f6005; */
}

.event-datetime {
  flex: 0 0 200px;
  align-self: center;
}

.event-datetime span {
  display: block;
}

.event-datetime .day {
}

.event-info {
  text-align: left;
  font-size: 38px;
  align-self: center;
}

.event-name {
  /* font-size: 50px; */
  margin: 6px 0px 20px;
}

.event-name small {
  display: inline-block;
  font-size: 38px;
}

mark {
  background-color: #0000ff;
  color: white;
}

/* mark {
  background-color: #3f3f67;
  color: #ff3f3f;
} */

.hide {
  display: none;
}