@charset "utf-8";




/*
=========================================

 KRT Horizontal slider

========================================= */


/* Items */
.krt-horizontal-slider{
  position: relative;
  --desktop-min-viewport:1300px;
  --gap: 20px;
  /*--item:50%;*/
}
.krt-horizontal-slider .items{
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: var(--gap);
  overflow: scroll;
  left: calc(50% - 50vw);
  padding: 30px calc(50vw - 50%);
  margin:-30px 0;
  width:100vw;
  position: relative;
}

@media(max-width:1300px) {
  .krt-horizontal-slider .items{
    left: calc(50% - var(--desktop-min-viewport)/2);
    padding: 0px calc(var(--desktop-min-viewport)/2 - 50%);
  }
}





@media (max-width:640px) {
  .krt-horizontal-slider .items{
    gap: 6px;
    left:-5vw;
    padding:0 5vw;
  }
}


/* Item
---------------------------------------  */
.krt-horizontal-slider .items .item{
  width: calc(50% - (var(--gap) * 1 / 2 ) );

  flex:0 0 auto;
  cursor: pointer;
}

@media (max-width:640px) {
  .krt-horizontal-slider .items .item{
    width: calc(50% - 8px);

    flex:0 0 auto;
    overflow: hidden;
  }
}













/* Arrows
---------------------------------------- */

.krt-horizontal-slider .arrows{
  z-index: 1;
  width: fit-content;
  margin:20px 0 0 auto;
  display: flex;

  justify-content: flex-start;
  align-items: center;
  gap:4px;
}
@media (max-width:640px){
  .krt-horizontal-slider .arrows{
    display: none;
  }
}
.krt-horizontal-slider .arrows .arrow{

}
.krt-horizontal-slider .arrows .arrow:not(.disabled){
  cursor: pointer;
}
.krt-horizontal-slider .arrows .arrow:not(.disabled):hover{
  /*background-color: rgba(255,255,255,0.98);*/
}
.krt-horizontal-slider .arrows .arrow.prev{
  left: 0px;
  transform: rotate(180deg);
}
.krt-horizontal-slider .arrows .arrow.next{
  right: 0px;
}
.krt-horizontal-slider .arrows .arrow.disabled{
  opacity:0.4;
}
.krt-horizontal-slider .arrows .arrow.hidden{
  display: none;
}



.krt-horizontal-slider .arrows hr{
  border-left:1px solid var(--color-mazenda-1);
  opacity: 0.2;
  height: 24px;
  display: block;
}

