section.mod_widecircles_slider{
  isolation: isolate;
  --SliderRowHeight: 550px;
  --SliderGridGap: 100px;
  --SliderItemMinWidth: 310px;
  --HighDifference: calc(var(--nav-size) + var(--SliderGridGap));
}

section.mod_widecircles_slider .filterSourceSideBySideButtons{
  margin-right: calc(50% + (var(--SliderItemMinWidth) * 0.78) + (var(--SliderGridGap) / 2));
  margin-left: auto;
  max-width: calc((var(--SliderItemMinWidth) * 0.78) + (var(--SliderGridGap) / 2));
  width: 100%;
  text-align: left;
  justify-content: flex-start;
  z-index: 2;
  position: relative;
}

section.mod_widecircles_slider h2.bloqTitle{
  position: absolute;
  top: 80px;
  left: 26.5%;
  width: max-content;
}

section.mod_widecircles_slider .FilterSet.HasFilters{
	margin-left: auto;
	justify-content: center;
}

section.mod_widecircles_slider .FilterSet.HasFilters button:last-child{
	margin-right: var(--button-gap);
}

section.mod_widecircles_slider div.Slider{
  max-width: 1500px;
  margin: 0 auto;
  padding: 0;
}

section.mod_widecircles_slider div.Slider .nav{
  top: auto;
  bottom: 0px;
}

section.mod_widecircles_slider div.Slider .nav.last{
  left: auto;
  right: calc(50% + var(--button-gap) + var(--button-gap));
}

section.mod_widecircles_slider div.Slider .nav.next{
  left: calc(50% + var(--button-gap) + var(--button-gap));
  right: auto;
}

section.mod_widecircles_slider .filterSourceSideBySideButtons .sourceButtonWrapper .sourceLink, section.mod_widecircles_slider .filterSourceSideBySideButtons .sourceButtonWrapper .calendarPageLink{
  height: var(--nav-size);
  border-radius: var(--nav-border-radius);
}

section.mod_widecircles_slider div.Slider .SliderInner>ul>li .Item .ItemInner .CalendarCategory{
  display: none;	
}

section.mod_widecircles_slider .filterSourceSideBySideButtons .sourceButtonWrapper .calendarPageLink{
  margin-right: 0;
}

section.mod_widecircles_slider .filterSourceSideBySideButtons .FilterSet .filterbutton{
  height: var(--nav-size);
  padding: 0 20px;
  border-radius: var(--nav-border-radius);
  font-size: calc(var(--nav-size)* 0.35);
}

section.mod_widecircles_slider .filterSourceSideBySideButtons .sourceButtonWrapper .sourceLink{
  width: var(--nav-size);
  padding: 0;
}

section.mod_widecircles_slider div.Slider .SliderInner>ul>li, section.mod_widecircles_slider div.Slider>ul>li{
  position: relative;
}

section.mod_widecircles_slider div.Slider .SliderInner>ul>li .Item, section.mod_widecircles_slider div.Slider>ul>li .Item{
	height: calc(var(--SliderRowHeight) - var(--HighDifference));
	transition: 0.3s;
  width: 78%;
  position: absolute;
  top: var(--HighDifference);
  left: 0;
  pointer-events: none;
}

section.mod_widecircles_slider div.Slider .SliderInner>ul>li .Item .ItemInner, section.mod_widecircles_slider div.Slider>ul>li .Item .ItemInner{
  width: 100%;
  aspect-ratio: 1 / 1;
  height: auto;
  left: 0 !important;
  bottom: 0 !important;
  top: auto !important;
  padding: 0;
  justify-content: flex-start;
  &::before{
    display: none;
  }
  .ItemIcon, .ItemContent{
    display: none;
  }
  h3.Title{
    text-transform: uppercase;
    font-size: 30px;
    line-height: 30px;
    font-weight: 100;
    background-color: rgb(var(--color1));
    width: fit-content;
    display: block;
    padding: 8px 20px 5px;
    margin: 0;
    min-width: 0px;
  }
}

@media screen and (max-width: 1320px){
  section.mod_widecircles_slider div.Slider .SliderInner>ul>li .Item .ItemInner, section.mod_widecircles_slider div.Slider>ul>li .Item .ItemInner{
    h3.Title{
      font-size: 20px;
      line-height: 20px;
    }
  }
}

section.mod_widecircles_slider div.Slider .SliderInner>ul>li .Item .ItemBefore, section.mod_widecircles_slider div.Slider>ul>li .Item .ItemBefore{
  width: 100%;
  aspect-ratio: 1 / 1;
  height: auto;
  border-radius: 50%;
  overflow: hidden;
  left: auto !important;
  right: 0;
  bottom: 0 !important;
  top: auto !important;
  opacity: 0.2;
  transition: 0.3s;
  .ItemImage{
    transition: 0.3s;
    width: 100%;
    aspect-ratio: 1 / 1;
  }
}

/* 2nd item */

section.mod_widecircles_slider div.Slider .SliderInner>ul>li[data-pos-showing] + li .Item, section.mod_widecircles_slider div.Slider>ul>li[data-pos-showing] + li .Item{
  width: calc(144% + 100px);
  transform: translateX(-50%);
  left: 50%;
  top: 0;
  overflow: visible;
  .ItemBefore{
    height: auto;
    max-height: 100%;
    width: 57%;
    aspect-ratio: 1 / 1;
    left: auto !important;
    right: 0;
    opacity: 1;
    .ItemImage{
      border-radius: var(--general-border-radius) 0 0 var(--general-border-radius);
    }
  }
  .ItemInner{
    left: 50%;
    height: 100%;
    align-items: flex-start;
    h3.Title{
      font-size: 45px;
      line-height: 45px;
      margin-top: 110px;
    }
    .ItemContent{
      display: block;
      opacity: 1;
      color: rgb(var(--grey1));
      width: 38%;
      text-align: left;
      font-weight: 100;
      line-height: 1.2em;
    }
  }
}

section.mod_widecircles_slider div.Slider .SliderInner>ul>li[data-pos-showing] + li .Item:hover .ItemBefore, section.mod_widecircles_slider div.Slider>ul>li[data-pos-showing] + li .Item:hover .ItemBefore{
  bottom: 0;
}

/* end */

/* 3rd item */

section.mod_widecircles_slider div.Slider .SliderInner>ul>li[data-pos-showing] + li + li .Item, section.mod_widecircles_slider div.Slider>ul>li[data-pos-showing] + li + li .Item{
  right: 0;
  left: auto;
}

/* end */

section.mod_widecircles_slider div.Slider .SliderInner>ul>li .Item .ItemInner{
  background-color: transparent;
}

section.mod_widecircles_slider div.Slider .SliderInner>ul>li .Item .ItemInner::before{
  content: '';
  background: linear-gradient(0deg, rgba(var(--color1),1) 150px, rgba(var(--color1),0) 100%);
  height: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
}

section.mod_widecircles_slider div.Slider .SliderInner>ul>li .Item .ItemInner .ItemDate{
  color: rgb(var(--grey10));
  z-index: 1;
}

section.mod_widecircles_slider div.Slider .SliderInner>ul>li .Item .ItemInner .Title{
  color: rgb(var(--grey10));
  z-index: 1;
}

section.mod_widecircles_slider div.Slider .SliderInner>ul>li .Item:not(.CalendarItem) .ItemInner .ItemIcon{
  background-color: rgb(var(--color2));
  color: rgb(var(--grey10));
}

section.mod_widecircles_slider div.Slider .SliderInner>ul>li .Item .ItemInner .ItemContent{
  color: rgb(var(--grey10));
  z-index: 1;
}

section.mod_widecircles_slider div.Slider .SliderInner>ul>li .Item .ItemInner .ItemContent .paracontent .location, section.mod_widecircles_slider div.Slider .SliderInner>ul>li .Item .ItemInner .ItemContent .paracontent .tags .tag{
  color: rgb(var(--grey10));
  z-index: 1;
  text-transform: none;
}

section.mod_widecircles_slider div.Slider .SliderInner>ul>li .Item .ItemInner .ItemContent .paracontent .cardBottomLinks{
  flex-direction: column;
  border-top: 0px solid transparent;
  padding: 0 20px 10px 20px;
}

section.mod_widecircles_slider div.Slider .SliderInner>ul>li .Item .ItemInner .ItemContent .paracontent .cardBottomLinks a{
  color: rgb(var(--grey10));
  border: 1px solid rgb(var(--color2));
  text-align: center !important;
  margin-bottom: 10px;
}

section.mod_widecircles_slider div.Slider .SliderInner>ul>li .Item .ItemInner .ItemContent .paracontent .cardBottomLinks a:hover{
  background-color: rgb(var(--grey10));
  border: 1px solid rgb(var(--grey10));
  color: rgb(var(--color1));
}

@media screen and (max-width: 1169px){

  section.mod_widecircles_slider h2.bloqTitle, section.mod_widecircles_slider .filterSourceSideBySideButtons{
    margin-right: auto;
    margin-left: 0px;
    width: calc(33% - (var(--SliderGridGap) / 3));
    max-width: none;
  }

  section.mod_widecircles_slider div.Slider .nav.last{
    left: auto;
    right: calc(var(--nav-size) + var(--button-gap) + var(--button-gap) + var(--button-gap));
  }

  section.mod_widecircles_slider div.Slider .nav.next{
    left: auto;
    right: 0px;
  }

  section.mod_widecircles_slider div.Slider .SliderInner>ul>li .Item, section.mod_widecircles_slider div.Slider>ul>li .Item{
    width: 66.6666%;
  }

  section.mod_widecircles_slider div.Slider .SliderInner>ul>li[data-pos-showing] + li .Item, section.mod_widecircles_slider div.Slider>ul>li[data-pos-showing] + li .Item{
    width: calc(133.3333% + 50px);
    transform: translateX(-50%);
    left: calc(33.3333% - 25px);
    top: 0;
  }

}


@media screen and (max-width: 759px){

  section.mod_widecircles_slider div.Slider .SliderInner>ul>li .Item, section.mod_widecircles_slider div.Slider>ul>li .Item{
    width: 100% !important;
    transform: translateX(-50%) !important;
    left: 50% !important;
    top: 80px !important;
    overflow: visible;
    .ItemBefore{
      height: auto;
      max-height: 100%;
      width: 57%;
      aspect-ratio: 1 / 1;
      left: auto !important;
      right: 0;
      opacity: 1;
      .ItemImage{
        border-radius: var(--general-border-radius) 0 0 var(--general-border-radius);
      }
    }
    .ItemInner{
      left: 50%;
      height: 100%;
      align-items: flex-start;
      h3.Title{
        font-size: 45px;
        line-height: 45px;
        margin-top: 110px;
      }
      .ItemContent{
        display: block;
        opacity: 1;
        color: rgb(var(--grey1));
        width: 38%;
        text-align: left;
        font-weight: 100;
        line-height: 1.2em;
      }
    }
  }

  section.mod_widecircles_slider div.Slider .SliderInner>ul>li[data-pos-showing] + li .Item:hover .ItemBefore, section.mod_widecircles_slider div.Slider>ul>li[data-pos-showing] + li .Item:hover .ItemBefore{
    bottom: 0;
  }

}

@media screen and (max-width: 450px){

  section.mod_widecircles_slider div.Slider .SliderInner>ul>li .Item, section.mod_widecircles_slider div.Slider>ul>li .Item{
    .ItemBefore{
      display: none;
    }
    .ItemInner{
      h3.Title{
        font-size: 30px;
        line-height: 30px;
      }
      .ItemContent{
        width: 100%;
      }
    }
  }

}


