.carousel-sticky-wrapper{
  position: relative;
}

.carousel-inner{
  position: relative;
  height: 510px;
}


/* SLIDE BASE */
.slide{
  position: absolute;
  width: 100%;
  height:33.333%;
  top: 50%;
  left: 50%;

  transform: translate(-50%, -50%) scale(.8);
  opacity: 0;

  display: flex;
  align-items: center;

  transition: all .5s cubic-bezier(.4,0,.2,1);
  will-change: transform, opacity;
}

/* ACTIVE (CENTER) */
.slide.active{
  z-index: 3;
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}


/* PREV (ABOVE / TOP) */
.slide.prev{
  z-index: 2;
  opacity: .20;
  transform: translate(-50%, -140%) scale(.9);
}

/* NEXT (BELOW / BOTTOM) */
.slide.next{
  z-index: 2;
  opacity: .20;
  transform: translate(-50%, 40%) scale(.9);
}

/* CARD */
.slide-content{
  border: 0.8px solid transparent;
  background:
    linear-gradient(45deg, #141414 0%, #2F2E2F 100%) padding-box,
    linear-gradient(45deg, #595759 0%, #787578 100%) border-box;

  border-radius: 18px;
  padding: 50px 40px;

  height: 100%;
  width: 100%;

  position: relative;
}

/* ACTIVE SHADOW */
.slide.active .slide-content{
  box-shadow: -17px 16px 23px 0px rgba(18, 18, 18, 0.85);
}

/* CAPTION */
.caption-time{
  position: absolute;
  top: 8px;
  right: 8px;

  background: #595759;
  border-radius: 18px;

  font-size: 14px;
  padding: 3px 10px;
}

/* NUMBER */
.slide-number-circle{
  min-width: 62px;
  width: 62px;
  height: 62px;

  border-radius: 12px;
  border: 1px solid #000;

  background: linear-gradient(45deg, #003962 0%, #000 100%);

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 32px;
  font-weight: 600;
}

/* COLORS */
.slide-number-circle-blue{
  border: 1px solid #3898DD;
  background: linear-gradient(45deg, #003962 0%, #2171AB 100%);
}

.slide-number-circle-green{
  border: 1px solid #70F2AB;
  background: linear-gradient(45deg, #141414 0%, #0A5C2E 37%, #13492B 62%, #252425 100%);
}

/* MOBILE */
@media (max-width: 768px){

  .carousel-inner{
    height: 498px;
  }

  .slide-content{
    padding: 15px 8px;
  }

  .slide-number-circle{
    min-width: 50px;
    width: 50px;
    height: 50px;
  }
}