/* JDev Modifications */


/*TEMP*/
@media(max-width:575px){
  .accordion-x .flexbox-slider {
    max-height: 100vh;
  }
}

@media(min-width:576px){
  .accordion-x .flexbox-slider {
    height:calc( (100vw * 0.5625) * 0.55 ) !important;
  }
}

@media(min-width:576px) and (max-width:767px){
  .accordion-x {
    width: calc(100vw * 2) !important;
  }
}
@media(min-width:768px) and (max-width:991px){
  .accordion-x {
    width: calc(100vw * 0.875) !important;
    margin: 0 auto !important;
  }
}
@media(min-width:992px) and (max-width:1199px){
  .accordion-x {
    width: calc(100vw * 0.775) !important;
    margin: 0 auto !important;
  }
}
@media(min-width:1200px){
  .accordion-x {
    width: calc(100vw * 0.675) !important;
    margin: 0 auto !important;
  }
}
.accordion-x .flexbox-slider .flexbox-slide img {
  filter:grayscale(1);
  transition: all 800ms ease;
}
.accordion-x .flexbox-slider .flexbox-slide:hover img {
  filter:grayscale(0);
}
.accordion-x .flexbox-slider .flexbox-slide .text {
  line-height: 1.35;
  font-size: 0.95rem;
  overflow: auto;
  height: 35%;
}
.accordion-x .flexbox-slider .flexbox-slide .text::-webkit-scrollbar {
    width: 7px;
    background: rgba(0,0,0, .3);
}
.accordion-x .flexbox-slider .flexbox-slide .text::-webkit-scrollbar-thumb {
    background: #F0F0F0;
    /*border-radius: 5px;*/
    border-right: 3px solid #CECECE;
}
.accordion-x .flexbox-slider .flexbox-slide h3 {
  margin-bottom: 12px;
}
  /*.accordion-x .flexbox-slider .flexbox-slide p {
    margin-bottom: 6px;
    line-height: 21px;
  }*/
  /*.accordion-x .flexbox-slider .flexbox-slide a {
    text-decoration: none;
    color: #E4FF25;
    transition: all 500ms ease;
  }
  .accordion-x .flexbox-slider .flexbox-slide a:hover {
    color: #2878F9;
}*/
/* // JDev Modifications */

.accordion-x {
  /*width: 1100px;
  margin: 50px auto 0;*/
  width: calc(100vw);
  margin: 0;
}

/* Breakpoint Add:; .accordion-x */

.accordion-x .slider-containers {
  width: 100%;
  /*margin-top: 60px;*/
}

/*.accordion-x .slider-container {
  margin-bottom: 60px;
}*/

.accordion-x .slider-container h2 {
  text-align: center;
}

.accordion-x .flexbox-slider {
  margin-top: 50px;
}

/*slide styles !!!YOU NEED THEM */
.accordion-x .flexbox-slider {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  /*height: 500px;*/
  height: 75vh;
  /*visibility: hidden;*/
  /*If disign scroll (+8 src)*/
  visibility: inherit;
  overflow-x: scroll;
  overscroll-behavior-x: contain;
  scroll-snap-type: x proximity;

  /*add custom: If disign scroll (+8 src)*/
}
  .accordion-x .flexbox-slider::-webkit-scrollbar {
      height: 7px;
      background: rgba(255,255,255, .1);
  }
  .accordion-x .flexbox-slider::-webkit-scrollbar-thumb {
      background: #F0F0F0;
      border-radius: 5px;
      border-bottom: 3px solid #CECECE;
  }

.accordion-x .flexbox-slider .flexbox-slide {
  -webkit-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.3s;
          transition-duration: 0.3s;
  -webkit-transition-timing-function: linear;
          transition-timing-function: linear;
  -webkit-transition-delay: 0s;
          transition-delay: 0s;
    width: 12.5%;

    /*If scroll (+8 src)*/
    min-width: 12.5%;

  height: 100%;
  position: relative;
  overflow: hidden;
  /*cursor: pointer;*/
  visibility: visible;
}

.accordion-x .flexbox-slider .flexbox-slide:after {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.6);
  z-index: 2;
  opacity: 0;
}

.accordion-x .flexbox-slider .flexbox-slide img {
  position: absolute;
  top: 50%;
  left: 50%;
  height: auto;
  width: auto;
  min-width: 100%;
  min-height: 100%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  z-index: 1;
}

.accordion-x .flexbox-slider .flexbox-slide .text-block {
  position: absolute;
  left: 0px;
  bottom: 30px;
  /*max-width: 400px;*/
height: 100%;
  padding: 20px;
  /*background-color: rgba(0, 0, 0, 0.4);*/
background-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .55) 100%, rgba(0, 0, 0, .55) 90%, transparent 95%);
  color: #fff;
  z-index: 4;
  visibility: hidden;
  opacity: 0;
display: flex;
flex-direction: column;
justify-content: flex-end;
}

.accordion-x .flexbox-slider .flexbox-slide .text-block h3 {
  font-size: 20px;
  font-weight: 700;
}

.accordion-x .flexbox-slider:hover .flexbox-slide:hover {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: 30%;
}
.accordion-x .flexbox-slider:hover .flexbox-slide:last-child:hover{
  scroll-snap-align: end;
}
.accordion-x .flexbox-slider:hover .flexbox-slide:nth-last-child(2):hover{
  scroll-snap-align: end;
}


/* effect 1 styles */
.accordion-x .flexbox-slider.flexbox-slider-1 .flexbox-slide .text-block {
  bottom: 60px;
}

.accordion-x .flexbox-slider.flexbox-slider-1:hover .flexbox-slide:hover .text-block {
  -webkit-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.2s;
          transition-duration: 0.2s;
  -webkit-transition-timing-function: linear;
          transition-timing-function: linear;
  -webkit-transition-delay: 0.5s;
          transition-delay: 0.5s;
  bottom: 0px;
  opacity: 1;
  visibility: visible;
}