/* parent container */
.catalogue_slider{
	width:100%;
	height:0;
	position:relative;
	overflow:hidden;
	padding-bottom:60%;
	
	-webkit-perspective: 1500;
	-moz-perspective: 1500;
	perspective: 1500;
	
	-webkit-transition-duration:0.5s;
	-moz-transition-duration:0.5s;
	transition-duration:0.5s;
}

/* full width mode */
.catalogue_slider.full{
	padding-bottom:141.4%;/* vertical a4 */
}

/* full screen mode */
.catalogue_slider.full_screen{
	padding-bottom:0;
	height:100%; /* set height to 100% screen height */
	background-color:#333;
}

/* slides are divs with background-image, positioned absolutely */
.catalogue_slider .slide{
	width:100%;
	height:100%;
	background-position:center;
	background-repeat:no-repeat;
	background-size:contain;
	position:absolute;
	top:0;
	left:0;
	opacity:0;
	-webkit-transform-origin: 0% 0%;
	-moz-transform-origin: 0% 0%;
	transform-origin: 0% 0%;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transition-timing-function:ease;
	-moz-transition-timing-function:ease;
	transition-timing-function:ease;
	display:none;
}

/* fly out to the left */
.catalogue_slider .slide.to_next{
	-webkit-transform: translate3d(-8%, 0, 0) rotateY(-90deg);
	-webkit-transition-duration:1s;
	-moz-transform: translate3d(-8%, 0, 0) rotateY(-90deg);
	-moz-transition-duration:1s;
	transform: translate3d(-8%, 0, 0) rotateY(-90deg);
	transition-duration:1s;
	z-index:5;
	opacity:0.7 !important;
	display:block;
}

/* fly in from the left */
.catalogue_slider .slide.prep_prev{
	-webkit-transform: translate3d(-8%, 0, 0) rotateY(-90deg);
	-moz-transform: translate3d(-8%, 0, 0) rotateY(-90deg);
	transform: translate3d(-8%, 0, 0) rotateY(-90deg);
	z-index:5;
	opacity:0.7;
	display:block;
}
.catalogue_slider .slide.to_prev{
	-webkit-transform: translate3d(0, 0, 0) rotateY(0);
	-webkit-transition-duration:1s;
	-moz-transform: translate3d(0, 0, 0) rotateY(0);
	-moz-transition-duration:1s;
	transform: translate3d(0, 0, 0) rotateY(0);
	transition-duration:1s;
	display:block;
}

/* make current slide visible */
.catalogue_slider .slide.current, .catalogue_slider .slide.prev{
	opacity:1;
	display:block;
}

/* next & prev buttons */
.catalogue_slider .prev_slide, .catalogue_slider .next_slide{
	position:absolute;
	left:0;
	top:0;
	width:2em;
	height:100%;
	background:rgba(0,0,0,0);
	cursor:pointer;
	
	-webkit-transition-duration:0.5s;
	-moz-transition-duration:0.5s;
	transition-duration:0.5s;
}
.catalogue_slider .next_slide{
	left:auto;
	right:0;
}
.catalogue_slider .prev_slide:after, .catalogue_slider .next_slide:after {
	font-family: "dashicons";
	content: "\f345";
	position:absolute;
	left:50%;
	top:50%;
	margin-left:-0.5em;
	margin-top:-0.5em;
}
.catalogue_slider.full_screen .prev_slide:after, .catalogue_slider.full_screen .next_slide:after{
	color:#fff;
}
.catalogue_slider .prev_slide:after{
	content: "\f341";
}

/* show nav buttons on slide hover */
.catalogue_slider .slide:hover .next_slide, .catalogue_slider .slide:hover .prev_slide{
	background:rgba(0,0,0,0.2);
}

/* hide nav buttons while animating */
.catalogue_slider .slide.to_next .prev_slide, .catalogue_slider .slide.prep_prev .prev_slide, .catalogue_slider .slide.to_prev .prev_slide,
.catalogue_slider .slide.to_next .next_slide, .catalogue_slider .slide.prep_prev .next_slide, .catalogue_slider .slide.to_prev .next_slide{
	background:rgba(0,0,0,0);
	opacity:0;
	
	-webkit-transition-duration:0s;
	-moz-transition-duration:0s;
	transition-duration:0s;
}

/* fullscreen button */
.fullscreen_toggle{
	float:right;
}
.catalogue_slider .fullscreen_toggle{
	position:absolute;
	bottom:0;
	right:2em;
	float:none;
	padding:0 0.4em;
	background:rgba(0,0,0,0);
	display:none;
	
	-webkit-transition-duration:0.5s;
	-moz-transition-duration:0.5s;
	transition-duration:0.5s;
}
.catalogue_slider.full_screen .fullscreen_toggle{
	display:block;
}
.catalogue_slider.full_screen:hover .fullscreen_toggle{
	background:rgba(0,0,0,0.2);
}
.fullscreen_toggle:after{
	font-family: "dashicons";
	content: "\f211";
	font-size:1.5em;
	cursor:pointer;
	color:rgba(0,0,0,0.7);
}
.catalogue_slider.full_screen .fullscreen_toggle:after{
	color:#fff;
}
.fullscreen_toggle.toggled:after{
	content: "\f506";
}
.fullscreen_toggle:hover:after{
	color:#000;
}

@media screen and (max-width:900px){
	.catalogue_slider{
		padding-bottom: 141.4%; /* A4 size */
	}
}