#sliderContainer {
  height: 320px;
  width: 192px;	
  overflow:  hidden;
  margin-left:  80px;
}
#mySlides{
	width:  100%;
	height:  calc(100% - 28px); /** -20px = space from the bottom for text **/
  position: relative;
  transition: transform 750ms ease-in;
}

.slide-item {
  position: absolute; 
  width: 100%;
  height: 100%;
  text-align: center;
}


.slide-item p {
  font: 14px Arial, Helvetica, sans-serif;
  position: absolute;
  left: 0;
  right: 0;
  z-index:1;
  text-align: center;
  margin: 0 auto;
  font-weight: 600;
  margin-top: 8px;
  color: #b90c0c;
  margin-bottom: 0;
  padding-bottom: 0;

}

.slide-item a,
.slide-item a:hover,
.slide-item a:focus {
  color: #b90c0c;
  text-decoration: none;
}

.slide-item img {
  width:  100%;
  height:  calc(100% - 28px); /** -28px = space from the bottom for text **/
  object-fit: contain;
}

 .s-control {
   margin: 0 5px;
   display: flex;
   align-items: center;
   justify-content: center;
   height: 40px;
   width: 40px;
   border-radius: 50%;
   background-color: rgba(255, 255, 255, 0.7);
   opacity: .5;
   transition: ease .3s;
   cursor: pointer;
}

 .s-control:hover {
   opacity: 1;
 }

.s-nav-indicator {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
  z-index: 1;
}
.s-indicator {
  width: 8px;
  height: 8px;
  border-radius:  100rem;
  border:  1px solid rgba(0,0,0,.4);
  margin: 0 2px;
  cursor: pointer;
}

.s-indicator.active {
	border-color: rgba(0,0,0,.3);
  background-color: rgba(0,0,0,.3);
  pointer-events: none;
}

.s-hidden {
  visibility: hidden
}