*,
*:after,
*:before {
  box-sizing: border-box;
}

section {
  border-bottom: 0px solid black;
}

h1 {
  text-align: center;
}

.carousel {
  margin: 0px auto;
  overflow: hidden;
  position: relative;
  width: 280px;
}

@media screen and (max-width: 600px) {
  .carousel {
    width: 280px;
  }
}


@media (min-width: 1024px) {
  .carousel {
    width: 600px;
  }
}



@media (min-width: 1150px) {
  .carousel {
    width: 600px;
  }
}

@media (min-width: 1300px) {
  .carousel {
    width: 1110px;
  }
}

.carousel:before,
.carousel:after {
  content: "";
  display: table;
}

.carousel:after {
  clear: both;
}

.slide {
  background: transparent;
  border: 10px solid transparent;
  height: 200px;
  width: 280px;
}