.our-characters-item {
    opacity: 0;
    visibility: hidden;
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
  }
  
  .our-characters-item::before {
    content: "";
    position: absolute;
    top: 73px;
    left: 0;
    width: 100%;
    height: 157px;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(-71.81%, #fcb92a), color-stop(68.19%, rgba(252, 185, 42, 0)));
    background-image: -webkit-linear-gradient(top, #fcb92a -71.81%, rgba(252, 185, 42, 0) 68.19%);
    background-image: -moz-linear-gradient(top, #fcb92a -71.81%, rgba(252, 185, 42, 0) 68.19%);
    background-image: -o-linear-gradient(top, #fcb92a -71.81%, rgba(252, 185, 42, 0) 68.19%);
    background-image: linear-gradient(180deg, #fcb92a -71.81%, rgba(252, 185, 42, 0) 68.19%);
    z-index: -1;
  }
  
  .our-characters-item::after {
    content: "";
    position: absolute;
    top: 59px;
    right: -19px;
    left: -16px;
    height: 165px;
    border: 1px solid transparent;
    background: -webkit-linear-gradient(332.86deg, rgba(0, 0, 0, 0.2) -23.05%, rgba(0, 0, 0, 0.0120821) 37.76%, rgba(0, 0, 0, 0) 126.44%) border-box;
    background: -moz-linear-gradient(332.86deg, rgba(0, 0, 0, 0.2) -23.05%, rgba(0, 0, 0, 0.0120821) 37.76%, rgba(0, 0, 0, 0) 126.44%) border-box;
    background: -o-linear-gradient(332.86deg, rgba(0, 0, 0, 0.2) -23.05%, rgba(0, 0, 0, 0.0120821) 37.76%, rgba(0, 0, 0, 0) 126.44%) border-box;
    background: linear-gradient(117.14deg, rgba(0, 0, 0, 0.2) -23.05%, rgba(0, 0, 0, 0.0120821) 37.76%, rgba(0, 0, 0, 0) 126.44%) border-box;
    -webkit-mask: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff)) padding-box, -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff));
    -webkit-mask: -webkit-linear-gradient(#fff 0 0) padding-box, -webkit-linear-gradient(#fff 0 0);
    mask: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff)) padding-box, -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff));
    mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: xor;
    -webkit-mask-composite: xor;
    mask-composite: exclude;
  }
  
  .our-characters-item img {
    width: 200px;
    max-width: 200px;
    max-height: 200px;
    height: 200px;
    -webkit-filter: drop-shadow(0px 34px 29px rgba(0, 0, 0, 0.09));
    filter: drop-shadow(0px 34px 29px rgba(0, 0, 0, 0.09));
  }
  
  .our-characters-item .sup-title {
    margin: 6px 0 4px;
    font-size: 17px;
    font-weight: bold;
    line-height: 18px;
  }
  
  .our-characters-item .title {
    font-size: 21px;
    line-height: 23px;
    font-weight: 900;
    color: #121212;
  }
  
  .our-characters-item.red::before {
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(-71.81%, #e72f1f), color-stop(68.19%, rgba(231, 47, 31, 0)));
    background-image: -webkit-linear-gradient(top, #e72f1f -71.81%, rgba(231, 47, 31, 0) 68.19%);
    background-image: -moz-linear-gradient(top, #e72f1f -71.81%, rgba(231, 47, 31, 0) 68.19%);
    background-image: -o-linear-gradient(top, #e72f1f -71.81%, rgba(231, 47, 31, 0) 68.19%);
    background-image: linear-gradient(180deg, #e72f1f -71.81%, rgba(231, 47, 31, 0) 68.19%);
  }
  
  .our-characters-item.gray::before {
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(-71.81%, #474f63), color-stop(68.19%, rgba(71, 79, 99, 0)));
    background-image: -webkit-linear-gradient(top, #474f63 -71.81%, rgba(71, 79, 99, 0) 68.19%);
    background-image: -moz-linear-gradient(top, #474f63 -71.81%, rgba(71, 79, 99, 0) 68.19%);
    background-image: -o-linear-gradient(top, #474f63 -71.81%, rgba(71, 79, 99, 0) 68.19%);
    background-image: linear-gradient(180deg, #474f63 -71.81%, rgba(71, 79, 99, 0) 68.19%);
  }
  
  .swiper-slide-visible .our-characters-item {
    opacity: 1;
    visibility: visible;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  
  .our-characters .swiper-button-next,
  .our-characters .swiper-button-prev {
    top: 0;
    right: auto;
    left: 0;
    -webkit-transform: translateY(-80px);
    -moz-transform: translateY(-80px);
    -ms-transform: translateY(-80px);
    -o-transform: translateY(-80px);
    transform: translateY(-80px);
  }
  
  .our-characters .swiper-button-prev {
    left: 40px;
  }
  
  @media only screen and (max-width: 991px) {
    .our-characters-item::after {
        right: -13px;
        left: -10px;
    }
  }