@media only screen and (min-width: 768px) {
  html carousel {
    width: 100%;
    text-align: center;
    font-family: Trebuchet MS;
    font-size: 6vmin;
    padding-top: 70vh;
  }
  html carousel page {
    position: absolute;
    top: 2em;
    left: 0;
    width: 100%;
    -webkit-transition: -webkit-transform 0.5s;
    transition: -webkit-transform 0.5s;
    transition: transform 0.5s;
    transition: transform 0.5s, -webkit-transform 0.5s;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  html carousel page label {
    cursor: pointer;
    background: #d9ff4f;
    padding: 1em 2em;
  }
  html carousel #page1cb:checked ~ #page1 {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  html carousel #page2cb:checked ~ #page2 {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  html carousel #page3cb:checked ~ #page3 {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  html carousel #page4cb:checked ~ #page4 {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  html carousel #page5cb:checked ~ #page5 {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

.carousel--radio {
  border: 2px solid white;
  -webkit-appearance: none;
  height: 24px;
  width: 24px;
  border-radius: 999999px;
  cursor: pointer;
  -webkit-transition: background-color 400ms ease, -webkit-transform 150ms ease;
  transition: background-color 400ms ease, -webkit-transform 150ms ease;
  transition: background-color 400ms ease, transform 150ms ease;
  transition: background-color 400ms ease, transform 150ms ease, -webkit-transform 150ms ease;
  -webkit-tap-highlight-color: transparent;
}

.carousel--radio:hover {
  background-color: rgba(255, 255, 255, 0.5);
}

.carousel--radio:checked {
  background-color: white;
}

.carousel--radio:active {
  -webkit-transform: scale(0.9);
          transform: scale(0.9);
}

@media only screen and (max-width: 768px) {
  html carousel {
    width: 100%;
    text-align: center;
    font-family: Trebuchet MS;
    font-size: 6vmin;
    display: inline-block;
  }
  html carousel page {
    position: absolute;
    top: 2em;
    left: 0;
    width: 100%;
    -webkit-transition: -webkit-transform 0.5s;
    transition: -webkit-transform 0.5s;
    transition: transform 0.5s;
    transition: transform 0.5s, -webkit-transform 0.5s;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  html carousel page label {
    cursor: pointer;
    background: #d9ff4f;
    padding: 1em 2em;
  }
  html carousel #page1cb:checked ~ #page1 {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  html carousel #page2cb:checked ~ #page2 {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  html carousel #page3cb:checked ~ #page3 {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  html carousel #page4cb:checked ~ #page4 {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  html carousel #page5cb:checked ~ #page5 {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
/*# sourceMappingURL=styles2.css.map */