.datetime-weekday {
  display: block;
  text-align: center;
  font-family: "Cal Sans";
  text-transform: uppercase;
  font-size: 0.8rem;
  font-weight: 500;
  margin-bottom: -0.2em;
  color: #8c8c8c;

  @include media-breakpoint-up(sm) {
    font-size: 1rem;
  }
}

.datetime-day {
  display: block;
  text-align: center;
  font-family: "Cal Sans";
  font-size: 1.5rem;
  margin-bottom: -0.2em;

  @include media-breakpoint-up(sm) {
    font-size: 2rem;
  }
}

.datetime-mon {
  display: block;
  text-align: center;
  font-size: 0.8rem;
  font-family: "Cal Sans";
  letter-spacing: 0.02rem;
  font-weight: 500;
  margin-bottom: 0.8em;
  color: #8c8c8c;

  @include media-breakpoint-up(sm) {
    font-size: 1.2rem;
  }
}

.datetime-time-1 {
  font-family: "Inter";
  display: block;
  text-align: center;
  margin-bottom: -0.2em;
  letter-spacing: 0.03rem;
  font-size: 0.7rem;

  @include media-breakpoint-up(sm) {
    font-size: 1rem;
  }
}

.datetime-time-2 {
  font-family: "Inter";
  display: block;
  text-align: center;
  letter-spacing: 0.03rem;
  font-size: 0.7rem;

  @include media-breakpoint-up(sm) {
    font-size: 1rem;
  }
}

.datetime-time-sep-voter {
  font-size: 1.2rem;
  font-weight: 300;
  color: #d7d7d7;
  margin-left: -0.7rem;

  @include media-breakpoint-up(sm) {
    font-size: 1.7rem;
    margin-left: -1rem;
  }
}

.datetime-time-sep-admin {
  font-size: 1.2rem;
  font-weight: 300;
  color: #d7d7d7;
  margin-left: -0.7rem;

  @include media-breakpoint-up(sm) {
    font-size: 1.7rem;
    margin-left: -1rem;
  }
}

.datetime-sep-time-div {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.datetime-same-middle-line {
  border-top: 0.2rem solid #c4c4c4 !important;
  height: 1.5rem;
  margin-bottom: 1rem;

  @include media-breakpoint-up(sm) {
    height: 2rem;
    margin-bottom: 2rem;
  }
}

.datetime-same-last-line {
  border-top: 0.2rem solid #c4c4c4 !important;
  border-right: 0.2rem solid #c4c4c4 !important;
  height: 1.5rem;
  margin-right: 2.5rem;
  margin-bottom: 1rem;

  @include media-breakpoint-up(sm) {
    height: 2rem;
    margin-right: 3.5rem;
    margin-bottom: 2rem;
  }
}
