:root{
	--gallery-example-size:320px;
}


#gallery-example0{
	position:relative;
	min-height:var(--gallery-example-size);
	text-align:center;
}
#gallery-example0>*{
	position:absolute;
	top:0;
	left:calc(50% - (var(--gallery-example-size) / 2)); /* center horizontally */
	width: var(--gallery-example-size);
	height: var(--gallery-example-size);

	transition: transform .65s, z-index .45s, filter .65s;
}

#gallery-example0>*.carousel-current{
	z-index:5300;
	transform:translate(0px, 0px);
	box-shadow: rgba(0,0,0,.45) 0 0 32px 8px;
}



#gallery-example0>*.carousel-head1,
#gallery-example0>*.carousel-tail1{
	z-index:5200;
	filter: brightness(50%);
}
#gallery-example0>*.carousel-head2,
#gallery-example0>*.carousel-tail2{
	z-index:5100;
	filter: brightness(25%);
}


#gallery-example0>*.carousel-head1{
	transform:translate(50%, 0px) scale(0.8);
}
#gallery-example0>*.carousel-head2{
	transform:translate(90%, 0px) scale(0.6);
}
#gallery-example0>*.carousel-tail1{
	transform:translate(-50%, 0px) scale(0.8);
}
#gallery-example0>*.carousel-tail2{
	transform:translate(-90%, 0px) scale(0.6);
}
#gallery-example0>*.carousel-none{
	z-index:5000;
	filter: brightness(10%);
	transform:translate(0px, 0px) scale(0.5);
}


#gallery-example0>*.carousel-clickable:hover{
	cursor:pointer;
}


@media(max-width:888px){
	:root{
		--gallery-example-size:260px;
	}
}

@media(max-width:720px){
	:root{
		--gallery-example-size:224px;
	}
}

@media(max-width:624px){
	:root{
		--gallery-example-size:192px;
	}
}

@media(max-width:536px){
	:root{
		--gallery-example-size:128px;
	}
}

@media(max-width:360px){
	:root{
		--gallery-example-size:112px;
	}
}