.jo-owl-filter .jo-cats {
  display: flex;
  list-style: none;
  padding: 0;
}


:root {
  --header-height: 3rem;

  /*========== Colors ==========*/
  /* Change favorite color to match images */
  /*Green dark 190 - Green 171 - Grren Blue 200*/
  --hue-color: 490;
    /* HSL color mode */
  --first-color: hsl(var(--hue-color), 64%, 22%);
  --first-color-second: hsl(var(--hue-color), 44%, 22%);
  --first-color-alt: hsl(var(--hue-color), 34%, 15%);
  
}
.jo-owl-filter .jo-cats .jo-cat {
  padding: 10px 15px;
  background-color: var(--first-color-alt);
  border-radius: 4px;
  color: white;
  margin: 0px 5px;
  cursor: pointer;
  transition-duration: .3s
}

.dark-theme .jo-owl-filter .jo-cats .jo-cat {
  background-color: var(--first-color-second);
}

.jo-owl-filter .jo-cats .jo-cat:hover {
  background-color: var(--first-color);
}

.jo-owl-filter .jo-cats .jo-cat.selected {
  background-color: var(--first-color);
}


.jo-owl-filter .jo-cats .jo-cat:last-child {
  margin-right: 0
}

.jo-owl-filter .jo-cats .jo-cat:first-child {
  margin-left: 0
}

.jo-owl-filter .jo-owl-carousel .item {
  border-radius: 8px
}

.jo-owl-filter .jo-owl-carousel .item.bg-blue {
  background-color: #2980b9
}

.jo-owl-filter .jo-owl-carousel .item.bg-red {
  background-color: #e74c3c
}

.jo-owl-filter .jo-owl-carousel .item.bg-green {
  background-color: #27ae60
}


.jo-owl-filter .jo-carousel-box {
  position: relative;
  height: 300px;
}

.jo-owl-filter .jo-carousel-box .jo-owl-carousel {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 0;
  pointer-events: none;
  transition-duration: .6s
}

.jo-owl-filter .jo-carousel-box .jo-owl-carousel.show {
  opacity: 1;
  pointer-events: all
}

@media screen and (max-width: 2800px){
	.jo-owl-filter .jo-carousel-box {
    height: 350px;
	}
}

@media screen and (max-width: 1920px){
	.jo-owl-filter .jo-carousel-box {
    height: 300px;
	}
}