@import url(https://fonts.googleapis.com/css?family=Lexend+Deca&display=swap);
* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

*, li, p, h1, h2, h3 {
  font-family: 'Lexend Deca', sans-serif; }

body {
  font-size: 10px; }
  @media screen and (min-width: 1200px) and (min-device-width: 1200px) {
    body {
      font-size: 16px; } }

p {
  line-height: 1.4; }

ul {
  list-style: disc; }

.o-button {
  cursor: pointer;
  border-radius: 1em;
  padding: .5em;
  width: auto;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  color: #FFF;
  background: #CCC; }

.c-calendar__wrapper {
  width: 100%;
  height: auto;
  font-size: 1.5em; }

.c-calendar__nav--add, .c-calendar__nav--settings, .c-calendar__nav--remove {
  width: 2em;
  height: 2em;
  top: 1em;
  right: 1em;
  -webkit-transition: all .5s;
  transition: all .5s;
  color: #000;
  background: transparent; }

.c-calendar__nav--add, .c-calendar__nav--settings {
  position: fixed; }

.c-calendar__nav--remove {
  position: absolute; }

.c-calendar__nav--settings {
  right: 3em; }

.is-open .c-calendar__nav--add {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg); }

.c-calendar__nav--remove {
  color: #000;
  background: transparent; }

.c-calendar__content {
  margin-top: 2em;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start; }

.c-calendar__day {
  background: #FFF;
  padding: 1px;
  height: auto;
  -ms-flex-preferred-size: 23%;
      flex-basis: 23%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 1em;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center; }
  @media screen and (min-width: 700px) and (min-device-width: 700px) {
    .c-calendar__day {
      -ms-flex-preferred-size: 13%;
          flex-basis: 13%; } }
  .c-calendar__day:nth-of-type(7n+1) .c-calendar__day--date {
    background: #00743F; }
  .c-calendar__day:nth-of-type(7n+2) .c-calendar__day--date {
    background: #7C57AF; }
  .c-calendar__day:nth-of-type(7n+3) .c-calendar__day--date {
    background: #48A9A6; }
  .c-calendar__day:nth-of-type(7n+4) .c-calendar__day--date {
    background: #4281A4; }
  .c-calendar__day:nth-of-type(7n+5) .c-calendar__day--date {
    background: #AF3B6E; }
  .c-calendar__day:nth-of-type(7n+6) .c-calendar__day--date {
    background: #C1666B; }
  .c-calendar__day:nth-of-type(7n+7) .c-calendar__day--date {
    background: #F3CD05; }

.c-calendar__day--inner {
  background: #CCC;
  width: 100%;
  height: auto;
  padding: .25em; }

.c-calendar__day--date {
  color: #FFF;
  padding: .5em; }

.c-calendar__event {
  display: block;
  background: #FFF;
  color: #000;
  margin: .5em 0em;
  padding: .5em; }

.c-calendar__description {
  opacity: 0;
  font-size: 2em;
  width: 100%;
  max-height: 0px;
  height: 10em;
  position: fixed;
  bottom: 0;
  left: 0;
  background: #FFF;
  padding: 1em;
  -webkit-transition: all .5s;
  transition: all .5s;
  -webkit-box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.25);
          box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.25); }
  .c-calendar__description.is-open {
    max-height: 10em;
    opacity: 1; }

.c-add-popup__wrapper {
  position: fixed;
  top: 5em;
  left: 100%;
  height: auto;
  font-size: 2em;
  width: 90%;
  background: #FFF;
  padding: 1em;
  -webkit-transition: all .5s;
  transition: all .5s;
  -webkit-box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.25);
          box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.25); }
  .is-open .c-add-popup__wrapper {
    left: 5em; }
  .c-add-popup__wrapper.is-unavailable {
    opacity: .5;
    pointer-events: none; }

.c-add-popup__input {
  display: block;
  width: 70%;
  margin-bottom: 1em; }
  .c-add-popup__input.is-hidden {
    display: none; }

.t-page {
  position: relative;
  padding: 1em; }