* { box-sizing: border-box; }

body { font-family: sans-serif; }

.carousel1 {
  background: #FAFAFA;
 /* margin: 0 60px;  space for prev/next buttons */
}

.carousel1-cell {
 // width: 24%;
 // height: 350px;
 // margin-right: 10px;
  background: #CCC;
  border-radius: 5px;
  // counter-increment: gallery-cell;
  padding: 10px;
}

/* cell number */
.carousel1-cell:before {
  display: block;
  text-align: center;
  // content: counter(gallery-cell);
  line-height: 200px;
  font-size: 80px;
  color: white;
}


/* smaller, dark, rounded square */
.flickity-prev-next-button {
  width: 30px;
  height: 30px;
  border-radius: 5px;
  background: #333;
}
.flickity-prev-next-button:hover {
  background: #F90;
}
/* arrow color */
.flickity-prev-next-button .arrow {
  fill: white;
}
.flickity-prev-next-button.no-svg {
  color: white;
}
/* position outside */
.flickity-prev-next-button.previous {
  left: -40px;
}
.flickity-prev-next-button.next {
  right: -40px;
}


.ws {
  width: 100%;
  // height: 100%;
  display: block;
  text-align: center;
  border:1px solid #FFFFFF;
  padding: 3px;
  background-color: #ffffff;
}



@media screen and (max-width: 767px) {
  
  .ws {
     height: 100%;
  }

  .carousel1 {
     margin: 0 0px;
   }

  .carousel1-cell {
     width: 50%;
     height: 233px;
     margin-right: 5px;
  }      
}


@media screen and (min-width: 768px) {

  .ws {
    height: 326px;
  }

  .carousel1 {
     margin: 0 60px;
   }

  .carousel1-cell {
     width: 24%;
     margin-right: 10px;
  }      
}