section.mod_convex_slider{
  isolation: isolate;
  --SliderItemMinWidth: 240px;
  --SliderGridGap: 20px;
  --SliderRowHeight: 400px;
}

/* this means there is always an odd number of items */
/* may need overriding if bloq left & right padding is not 20px */

@media screen and (max-width: 1320px){
	section.mod_convex_slider{
	  --SliderItemMinWidth: 340px;
	}
}

@media screen and (max-width: 1100px){
	section.mod_convex_slider{
	  --SliderItemMinWidth: 290px;
	}
}

@media screen and (max-width: 950px){
	section.mod_convex_slider{
	  --SliderItemMinWidth: 240px;
	}
}

/* end queries */

section.mod_convex_slider{
  --titles-max-width: 850px;
  isolation: isolate;
}

section.mod_convex_slider h2.bloqTitle, section.mod_convex_slider .filterSourceSideBySideButtons{
  max-width: var(--titles-max-width);
  margin: 10px auto 0;
}

section.mod_convex_slider div.Slider{
  max-width: 1300px;
  margin: 10px auto 0;
  padding: 0;
}

section.mod_convex_slider div.Slider .nav{
  top: calc(-25px - var(--nav-size));
}

section.mod_convex_slider div.Slider .nav.last{
  left: calc(50% + min(calc(415px - (2 * var(--nav-size))), calc(50vw - (2 * var(--nav-size)) - var(--button-gap) - var(--button-gap) - 20px)));
}

section.mod_convex_slider div.Slider .nav.next{
  right: auto;
  left: calc(50% + min(calc(425px - var(--nav-size)), calc(50vw - var(--nav-size) - 20px)));
}

section.mod_convex_slider .filterSourceSideBySideButtons .sourceButtonWrapper{
  padding-right: calc(40px + (2 * var(--nav-size)));
}

section.mod_convex_slider .filterSourceSideBySideButtons .sourceButtonWrapper .sourceLink, section.mod_convex_slider .filterSourceSideBySideButtons .sourceButtonWrapper .calendarPageLink{
  height: var(--nav-size);
  padding: 0 20px;
  border-radius: var(--nav-border-radius);
  border: 1px solid rgb(var(--color2));
  color: rgb(var(--color2));
  background-color: rgb(var(--grey10));
  font-size: calc(var(--nav-size)* 0.35);
}

section.mod_convex_slider .filterSourceSideBySideButtons .sourceButtonWrapper .sourceLink:hover, section.mod_convex_slider .filterSourceSideBySideButtons .sourceButtonWrapper .calendarPageLink:hover{
	background-color: rgb(var(--color2));
	color: rgb(var(--grey10));
}

section.mod_convex_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_convex_slider .filterSourceSideBySideButtons .sourceButtonWrapper .sourceLink{
  width: var(--nav-size);
  padding: 0;
}

section.mod_convex_slider .filterSourceSideBySideButtons .sourceButtonWrapper .sourceLink:hover, section.mod_cards_slider .filterSourceSideBySideButtons .sourceButtonWrapper .calendarPageLink:hover{
  background-color: rgb(var(--color2));
  color: rgb(var(--grey10));
}


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

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

section.mod_convex_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: 350px;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
}

section.mod_convex_slider div.Slider .SliderInner>ul>li .Item:hover .ItemInner::before{
  background-color: rgb(var(--color1));
  height: 100%;
}

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

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

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

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


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


section.mod_convex_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_convex_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_convex_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));
}

section.mod_convex_slider div.Slider .SliderInner>ul>li .Item, section.mod_convex_slider div.Slider>ul>li .Item{
	height: calc(var(--SliderRowHeight) - 100px);
	margin-top: 50px;
	transition: 0.2s;
}


section.mod_convex_slider div.Slider .SliderInner>ul>li, section.mod_convex_slider div.Slider>ul>li{
	transition: 0.2s;
	transform-style: preserve-3d;
	perspective-origin: center;
	position: relative;
}

section.mod_convex_slider div.Slider .SliderInner>ul>li, section.mod_convex_slider div.Slider>ul>li{
  transform: perspective(200px) rotateY(-15deg);
	transform-origin: right;
}
section.mod_convex_slider div.Slider .SliderInner>ul>li[data-pos-showing] + li, section.mod_convex_slider div.Slider>ul>li[data-pos-showing] + li{
  transform: perspective(200px) rotateY(-5deg);
	transform-origin: right;
	left: -10px;
}

section.mod_convex_slider div.Slider .SliderInner>ul>li[data-pos-showing] + li .Item, section.mod_convex_slider div.Slider>ul>li[data-pos-showing] + li + li .Item{
	height: calc(var(--SliderRowHeight) - 30px);
	margin-top: 15px;
}

/*central item*/
section.mod_convex_slider div.Slider .SliderInner>ul>li[data-pos-showing] + li + li, section.mod_convex_slider div.Slider>ul>li[data-pos-showing] + li + li{
  transform: perspective(200px) rotateY(0deg);
	transform-origin: center;
	left: 0px;
}
/*end*/

/*central item sizing*/
section.mod_convex_slider div.Slider .SliderInner>ul>li[data-pos-showing] + li + li .Item, section.mod_convex_slider div.Slider>ul>li[data-pos-showing] + li + li .Item{
	height: var(--SliderRowHeight);
	margin-top: 0px;
}
/*end*/

section.mod_convex_slider div.Slider .SliderInner>ul>li[data-pos-showing] + li + li + li .Item, section.mod_convex_slider div.Slider>ul>li[data-pos-showing] + li + li .Item{
	height: calc(var(--SliderRowHeight) - 30px);
	margin-top: 15px;
}

section.mod_convex_slider div.Slider .SliderInner>ul>li[data-pos-showing] + li + li + li, section.mod_convex_slider div.Slider>ul>li[data-pos-showing] + li + li + li{
  transform: perspective(200px) rotateY(5deg);
	transform-origin: left;
	left: 10px;
}
section.mod_convex_slider div.Slider .SliderInner>ul>li[data-pos-showing] + li + li + li + li, section.mod_convex_slider div.Slider>ul>li[data-pos-showing] + li + li + li + li{
  transform: perspective(200px) rotateY(15deg);
	transform-origin: left;
}
section.mod_convex_slider div.Slider .SliderInner>ul>li[data-pos-showing] + li + li + li + li + li, section.mod_convex_slider div.Slider>ul>li[data-pos-showing] + li + li + li + li + li{
  transform: perspective(200px) rotateY(15deg);
	transform-origin: left;
	left: 0px;
}


/* change to 3 items */
@media screen and (max-width: 1320px){
	section.mod_convex_slider div.Slider .SliderInner>ul>li, section.mod_convex_slider div.Slider>ul>li{
	  transform: perspective(200px) rotateY(-10deg);
		transform-origin: right;
		left: 0px;
	}

	/*central item*/
	section.mod_convex_slider div.Slider .SliderInner>ul>li[data-pos-showing] + li, section.mod_convex_slider div.Slider>ul>li[data-pos-showing] + li{
	  transform: perspective(200px) rotateY(0deg);
		transform-origin: center;
		left: 0px;
	}
	/*end*/

	/*undo large size central item sizing*/
	section.mod_convex_slider div.Slider .SliderInner>ul>li[data-pos-showing] + li + li .Item, section.mod_convex_slider div.Slider>ul>li[data-pos-showing] + li + li .Item{
		height: calc(var(--SliderRowHeight) - 100px);
		margin-top: 50px;
	}
	/*end*/

	/*new large size central item sizing*/
	section.mod_convex_slider div.Slider .SliderInner>ul>li[data-pos-showing] + li .Item, section.mod_convex_slider div.Slider>ul>li[data-pos-showing] + li .Item{
		height: var(--SliderRowHeight);
		margin-top: 0px;
	}
	/*end*/

	section.mod_convex_slider div.Slider .SliderInner>ul>li[data-pos-showing] + li + li, section.mod_convex_slider div.Slider>ul>li[data-pos-showing] + li + li{
	  transform: perspective(200px) rotateY(10deg);
		transform-origin: left;
		left: 0px;
	}

	section.mod_convex_slider div.Slider .SliderInner>ul>li[data-pos-showing] + li + li + li, section.mod_convex_slider div.Slider>ul>li[data-pos-showing] + li + li + li{
	  transform: perspective(200px) rotateY(10deg);
		transform-origin: left;
		left: 0px;
	}
}


@media screen and (max-width: 799px){
	section.mod_convex_slider div.Slider .SliderInner>ul>li, section.mod_convex_slider div.Slider>ul>li{
		left: -30px;
	}
	section.mod_convex_slider div.Slider .SliderInner>ul>li[data-pos-showing] + li, section.mod_convex_slider div.Slider>ul>li[data-pos-showing] + li{
		left: -30px;
	}
}


@media screen and (max-width: 600px){
  section.mod_convex_slider .filterSourceSideBySideButtons .FilterSet{
    justify-content: flex-start;
  }
  section.mod_convex_slider .filterSourceSideBySideButtons .sourceButtonWrapper{
    margin: 0 auto 10px 0;
  }
}


@media screen and (max-width: 539px){
	section.mod_convex_slider div.Slider .SliderInner>ul>li, section.mod_convex_slider div.Slider>ul>li{
	  transform: perspective(200px) rotateY(0deg) !important;
		transform-origin: center !important;
		left: 0px !important;
	}
	section.mod_convex_slider div.Slider .SliderInner>ul>li .Item, section.mod_convex_slider div.Slider>ul>li .Item{
		height: var(--SliderRowHeight) !important;
		margin-top: 0px !important;
	}
}

