/* Basic sample */

body{
	/*overflow:hidden;
	background-color:#fcfcfc;*/
	margin:0;
	padding:0;
}

#fancybox_ujsag_p img, #fancybox_next_ujsag_p img, .fancybox_date_ujsag_p img {
	width: auto;
	height: 80%;
	max-width: 90%;
	object-fit: contain;
}

#fancybox_ujsag_p, #fancybox_next_ujsag_p, .fancybox_date_ujsag_p {
	display: block;
	text-align: center;
	height: 100vh;
	margin-top: 10%;
}

#turn_js_ujsag_p, #turn_js_next_ujsag_p, .turn_js_date_ujsag_p {
	display: none;
}


.flipbook-viewport, #turnjs-port, #turnjs-port-next, .turnjs-port-date{
	overflow:hidden;
	width:100%;
	height:100vh;
	box-sizing: border-box;
}

.flipbook-viewport .container, #turnjs-port .container, #turnjs-port-next .container, .turnjs-port-date .container{
	position:absolute;
	top:40%;
	left:50%;
	margin:auto;
}

.flipbook-viewport .flipbook, #turnjs-port .flipbook, #turnjs-port-next .flipbook, .turnjs-port-date .flipbook{
	width:922px;
	height:600px;
	left:-461px;
	top:-300px;
}

.flipbook-viewport .page, #turnjs-port .page, #turnjs-port-next .page, .turnjs-port-date .page{
	width:100%;
	height:100%;
	background-color:white;
	background-repeat:no-repeat;
	background-size:100% 100%;
}

.flipbook .page{
	-webkit-box-shadow:0 0 20px rgba(0,0,0,0.2);
	box-shadow:0 0 20px rgba(0,0,0,0.2);
	background-size: 100% auto;
}

.flipbook-viewport .page img, .turnjs-port .page img{
	-webkit-user-select: none;
	user-select: none;
	margin:0;
}

.flipbook-viewport .shadow, .turnjs-port .shadow{
	-webkit-transition: -webkit-box-shadow 0.5s;
	transition: box-shadow 0.5s;

	-webkit-box-shadow:0 0 20px #ccc;
	box-shadow:0 0 20px #ccc;
}

.close_button{position: absolute; right: 2%; top: 5%; color: white; line-height: 1em; padding: 0.4em .6em; border-radius: 50%;}
.close_button i{font-size: 2.5em; color: white;}
.close_button span{font-size: 2em; color: white; display: inline-block; margin-right: 5px;}
@media screen and (max-width: 1050px){
	.close_button span{display: none;}
}

#turnjs-port .next-button,
#turnjs-port .previous-button,
#turnjs-port-next .next-button,
#turnjs-port-next .previous-button
.turnjs-port-date .next-button,
.turnjs-port-date .previous-button{
	width:22px;
	height:740px;
	position:absolute;
	cursor: pointer;
	background-color: white;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 20px auto;
	top:0;
}

#turnjs-port .next-button, #turnjs-port-next .next-button, .turnjs-port-date .next-button{
	right:-22px;
	-webkit-border-radius:0 15px 15px 0;
	border-radius:0 15px 15px 0;
	background-image: url('turnjsimg/angle-right-solid.svg');
}

#turnjs-port .previous-button, #turnjs-port-next .previous-button, .turnjs-port-date .previous-button{
	left:-22px;
	-webkit-border-radius:15px 0 0 15px;
	border-radius:15px 0 0 15px;
	background-image: url('turnjsimg/angle-left-solid.svg');
}

#turnjs-port iframe, #turnjs-port-next iframe, .turnjs-port-date iframe {
	box-sizing: border-box;
	display: block;
	width: 80%;
	height: 80%;
	margin: 5% auto;
	position: relative;
}

.turnjs-help{width: 80%; position: relative; display: block; top: 5%; margin: auto;}
.turnjs-help span{color: white;}
@media screen and (max-width: 920px){
	.turnjs-help span{font-size: 12px; max-width: 600px;}
	.turnjs-help-fancy span{font-size: 12px; max-width: 600px;}
	#turnjs-port iframe, #turnjs-port-next iframe, .turnjs-port-date iframe{margin: 5px auto 5% auto;}
}

.turnjs-help-fancy{width: 80%; position: relative; display: block; top: 5%;  margin: auto;}
.turnjs-help-fancy span{color: white;}

.turnjs-help{display: none;}
.turnjs-help-fancy{display: block;}

@media screen and (min-width: 800px){
	#fancybox_ujsag_p, #fancybox_next_ujsag_p, .fancybox_date_ujsag_p {
		display: none;
	}

	#turn_js_ujsag_p, #turn_js_next_ujsag_p, .turn_js_date_ujsag_p {
		display: block;
	}
	.turnjs-help{display: block;}
	.turnjs-help-fancy{display: none;}
}