[data-custom-carousel].stories .item.story-item {
    margin: 0px;
    height: 600px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 110%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 20px;
    transition: background-size 0.5s ease;
    cursor: pointer;
}

[data-custom-carousel].stories .item.story-item .text .button5 {
 	display:none; 
}
[data-custom-carousel].stories .item.story-item:hover {
    background-size: 120%;
}
[data-custom-carousel].stories .item.story-item:hover .text .button5 {
 	display:block;
}
[data-custom-carousel].stories .item.story-item .text {
    padding: 0px;
    margin-bottom: 20px;
    color: white;
    text-align: center;
    transition: margin ease-in-out 500ms;
}
[data-custom-carousel].stories .item.story-item:hover .text {
    margin-bottom: 50px;
}
[data-custom-carousel].stories .item.story-item .text a {
    margin-top: 20px
}

.modal .modal-dialog-wide {
  position: relative;
  top: 5%;
  border: 1px solid #cdcdcd;
}

.modal .modal-dialog-wide .modal-content {
  border-radius: 0;
  background-color: black;
}
.modal .modal-dialog-wide .modal-content .modal-body.story-body {
  border-radius: 0;
  padding: 0;
  background-color: black;
  height: 500px;
  background-position: center;
  background-size: cover;
}
.modal .modal-dialog-wide .modal-content .modal-body.story-body .story-gradient {
	position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgb(0,0,0);
	background: linear-gradient(90deg, rgba(0,0,0,0) 24%, rgba(0,0,0,0.6895133053221288) 51%, rgba(0, 0, 0, 0.80) 100%);
}
.modal .modal-dialog-wide .modal-content .modal-body.story-body .story-detail {
  color: white;
  padding: 40px;
}
.modal .modal-dialog-wide .modal-content .modal-body.story-body h2 {
  margin-bottom: 20px;
}
.modal .modal-dialog-wide .modal-content .modal-body.story-body h4 {
    font-size: 20px;
    margin: 0 0 20px 0;
    line-height: 140%;
}
.modal .modal-dialog-wide .modal-content .modal-body.story-body .story-detail-subject {
  margin-top: 380px;
  text-align: center;
  color: white;
}
.modal .modal-dialog-wide .modal-content .modal-body.story-body .story-detail-subject .avatar {
    width: 80px;
    height: 80px;
    border-radius: 80px;
    display: none;
    background-size: cover;
    background-position: top center;
}

.modal .modal-dialog-wide .modal-content .modal-header {
  padding: 0;
  border: none;
}
.modal .modal-dialog-wide .modal-content .modal-header .close {
  background-color: black;
  color: white;
  opacity: 1;
  margin-right: 0;
  margin-top: 0;
  position: absolute;
  z-index: 2;
  right: 0;
  padding: 5px;
}
@media (max-width: 992px) {
    [data-custom-carousel].stories .item.story-item {
        height: 450px;
    }  
}
@media (min-width: 768px) {
  .modal .modal-dialog-wide {
    width: 65%;
  }
  [data-custom-carousel].stories .slick-next {right: 60px}
  [data-custom-carousel].stories .slick-prev {left: 60px}
}
@media (max-width: 768px) {
    [data-custom-carousel].stories .item.story-item {
        height: 420px;
    }
    .modal .modal-dialog-wide {
      width: 95%;
    }
    .modal .modal-dialog-wide .modal-content .modal-body.story-body .story-detail-subject {
        margin-top: 20px;
        text-align: left;

    }
    .modal .modal-dialog-wide .modal-content .modal-body.story-body {background-image: none !important; height: auto}
    .modal .modal-dialog-wide .modal-content .modal-body.story-body .story-detail-subject .avatar {display: block;}
    .modal .modal-dialog-wide .modal-content .modal-body.story-body .story-detail {padding: 0 0 20px 0}
  }
@media (max-width: 500px) {
  [data-custom-carousel].stories .item.story-item .text .button5 {
      display:block;
  }  
}