.slideshow {
  position: relative;
  margin: auto;
}
.slide {
  display: none;
  border-radius: 0.8rem;
}
.slide p {
  padding: 0.8rem 4.8rem;
  line-height: normal;
}
.slide-image {
  object-fit: cover;
}
.fade {
  animation: fade 1.5s ease;
}
@keyframes fade {
  from {opacity: 0.5;}
  to {opacity: 1;}
}
.numbertext {
  position: absolute;
  top: 0;
  padding: 1.6rem;
  color: #fff;
  text-shadow: 0 0 1.8rem #000;
}
.text {
  position: absolute;
  bottom: 0;
  margin-bottom: 0.8rem;
  border-radius: 0.8rem;
  padding: 0.4rem 0.8rem;
  text-align: center;
  white-space: nowrap;
  background-color: var(--w3-theme-background-color) !important;
  color: var(--w3-theme-color) !important;
}
.active-dot {
  background-color: var(--w3-theme-background-color) !important;
}
#dot {
  position: relative;
  bottom: 0;
  padding-top: 0.8rem;
  text-align: center;
}
.dot {
  display: inline-block;
  height: 1.5rem;
  width: 1.5rem;
  box-shadow: 0 0.4rem 1rem 0 rgba(0, 0, 0, 0.2), 0 0.4rem 2rem 0 rgba(0, 0, 0, 0.19);
  margin: 0.2rem;
  border-radius: 50%;
  cursor: none;
  transition: background-color 0.5s ease;
  background-color: var(--w3-theme-l4-background-color);
}
@media (hover:hover) {
.dot:hover {
  background-color: var(--w3-theme-l1-background-color);
}}
.pan-image-left-right {
  animation: pan-left-right 15s ease-in-out infinite;
}
@keyframes pan-left-right {
  0% {object-position: right;}
  50% {object-position: left;}
  100% {object-position: right;}
}
.pan-image-right {
  animation: pan-right 5s ease-in-out infinite;
}
@keyframes pan-right {
  from {object-position: left;}
  to {object-position: right;}
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
.slide p {
  padding: 0.8rem 6.4rem;
  line-height: unset;
}
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
.slide-image {
  object-fit: fill;
  object-position: center;
}
.pan-image-left-right {
  animation: none;
}
.pan-image-right {
  animation: none;
}
}