/*! yBox - v1.0 - 2020-09-03
* By Yuval Ashkenazi
* https://github.com/yuval123123/yBox-jQuery */
.yBoxOverlay *{-webkit-box-sizing:border-box;box-sizing:border-box;}
.yBoxOverlay{
	background:rgba(0,0,0,0.5);
	display:flex;
	justify-content:center;
	align-items:center;
	position:fixed;
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:10000;
	visibility:hidden;
	filter:alpha(opacity=0);
	opacity:0;
	-khtml-opacity:0;
	-webkit-transition:all 0.5s ease;
	transition:all 0.5s ease;
}
.yBoxOverlay.active{
	visibility:visible;
	filter:alpha(opacity=100);
	opacity:1;
	-khtml-opacity:1;
}
.yBoxImgZoom{width:100%;height:100%;}
.yBoxFrame{
	background:#fff;
	max-width:-webkit-calc(100% - 10px);
	max-width:calc(100% - 10px);
	max-height:-webkit-calc(100vh - 10px);
	max-height:calc(100vh - 10px);
	z-index:10001;
	-webkit-transition:all 0.5s ease;
	transition:all 0.5s ease;
	-webkit-transform:translate(0,30px);
	transform:translate(0,30px);
}
.yBoxOverlay.active .yBoxFrame{
	-webkit-transform:translate(0,0);
	transform:translate(0,0);
}
.closeYbox{
	background:#fff;
	background-size:100% 100%;
	width:35px;
	height:35px;
	position:absolute;
	top:10px;
	right:10px;
	margin:0;
	padding:0;
	border:none;
	outline:none;
	cursor:pointer;
	z-index:3;
}
.closeYbox::before,
.closeYbox::after{
	content:'';
	background-color:#616161;
	width:25px;
	height:2px;
	position:absolute;
	left:5px;
	top:16px;
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
	-webkit-transition:all 0.5s ease;
	transition:all 0.5s ease;
}
.closeYbox::after{
	-webkit-transform:rotate(-45deg);
	transform:rotate(-45deg);
}
.closeYbox:hover::before{
	background-color:#CC0033;
	-webkit-transform:rotate(135deg);
	transform:rotate(135deg);
}
.closeYbox:hover::after{
	background-color:#CC0033;
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
}
.yBoxIframe{
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
}
.yBoxFrame.yBoxIframeWrap{
	width:1200px;
	height:750px;
}
.yBoxFrame.yBoxIframeWrap .insertYboxAjaxHere{
	position:absolute;
	max-height:100%;
	left:10px;
	top:10px;
	right:10px;
	bottom:10px;
}
.insertYboxAjaxHere{
	min-width:150px;
	min-height:100px;
	max-height:-webkit-calc(100vh - 100px);
	max-height:calc(100vh - 100px);
	overflow:auto;
	padding:50px 19px 13px;
}
.yBoxFrame.yBoxImgWrap .insertYboxAjaxHere{
	padding:10px;
	max-height:-webkit-calc(100vh - 10px);
	max-height:calc(100vh - 10px);
}
.yBoxFrame.yBoxImgWrap img.yBoxImg{
	max-width:-webkit-calc(100vw - 50px);
	max-width:calc(100vw - 50px);
	max-height:-webkit-calc(100vh - 30px);
	max-height:calc(100vh - 30px);
	vertical-align:top;
}
.yBoxFrame.yBoxImgWrap .yBoxNextImg,
.yBoxFrame.yBoxImgWrap .yBoxPrevImg{
	background:none;
	width:30%;
	height:100%;
	position:absolute;
	top:0;
	border:none;
	cursor:pointer;
	z-index:2;
}
.yBoxFrame.yBoxImgWrap .yBoxNextImg{left:0;}
.yBoxFrame.yBoxImgWrap .yBoxPrevImg{right:0;}
.yBoxFrame.yBoxImgWrap .yBoxNextImg::after,
.yBoxFrame.yBoxImgWrap .yBoxPrevImg::after{
	content:'';
	width:20px;
	height:20px;
	position:absolute;
	top:50%;
	border-bottom:3px solid rgba(255,255,255,0.7);
	border-left:3px solid rgba(255,255,255,0.7);
}
.yBoxFrame.yBoxImgWrap .yBoxPrevImg::after{
	right:50px;
	-webkit-transform:translate(0,-50%) rotate(-135deg);
	transform:translate(0,-50%) rotate(-135deg);
}
.yBoxFrame.yBoxImgWrap .yBoxNextImg::after{
	left:50px;
	-webkit-transform:translate(0,-50%) rotate(45deg);
	transform:translate(0,-50%) rotate(45deg);
}
.yBoxFrame.yBoxImgWrap .yBoxNextImg:hover::after,
.yBoxFrame.yBoxImgWrap .yBoxPrevImg:hover::after{
	border-bottom-color:#fff;
	border-left-color:#fff;
}
.yBoxLoader{
    width:16px;
    height:16px;
    border-radius:50%;
    position:relative;
    animation:yBox-loader-circles 1s linear infinite;
    top:50%;
    margin:-8px auto 0 auto;
	zoom:0.5;
}
@keyframes yBox-loader-circles{
	0%{box-shadow:0 -27px 0 0 rgba(0,0,0,0.05),19px -19px 0 0 rgba(0,0,0,0.1),27px 0 0 0 rgba(0,0,0,0.2),19px 19px 0 0 rgba(0,0,0,0.3),0 27px 0 0 rgba(0,0,0,0.4),-19px 19px 0 0 rgba(0,0,0,0.6),-27px 0 0 0 rgba(0,0,0,0.8),-19px -19px 0 0 #ffffff;}
	12.5%{box-shadow:0 -27px 0 0 #ffffff,19px -19px 0 0 rgba(0,0,0,0.05),27px 0 0 0 rgba(0,0,0,0.1),19px 19px 0 0 rgba(0,0,0,0.2),0 27px 0 0 rgba(0,0,0,0.3),-19px 19px 0 0 rgba(0,0,0,0.4),-27px 0 0 0 rgba(0,0,0,0.6),-19px -19px 0 0 rgba(0,0,0,0.8);}
	25%{box-shadow:0 -27px 0 0 rgba(0,0,0,0.8),19px -19px 0 0 #ffffff,27px 0 0 0 rgba(0,0,0,0.05),19px 19px 0 0 rgba(0,0,0,0.1),0 27px 0 0 rgba(0,0,0,0.2),-19px 19px 0 0 rgba(0,0,0,0.3),-27px 0 0 0 rgba(0,0,0,0.4),-19px -19px 0 0 rgba(0,0,0,0.6);}
	37.5%{box-shadow:0 -27px 0 0 rgba(0,0,0,0.6),19px -19px 0 0 rgba(0,0,0,0.8),27px 0 0 0 #ffffff,19px 19px 0 0 rgba(0,0,0,0.05),0 27px 0 0 rgba(0,0,0,0.1),-19px 19px 0 0 rgba(0,0,0,0.2),-27px 0 0 0 rgba(0,0,0,0.3),-19px -19px 0 0 rgba(0,0,0,0.4);}
	50%{box-shadow:0 -27px 0 0 rgba(0,0,0,0.4),19px -19px 0 0 rgba(0,0,0,0.6),27px 0 0 0 rgba(0,0,0,0.8),19px 19px 0 0 #ffffff,0 27px 0 0 rgba(0,0,0,0.05),-19px 19px 0 0 rgba(0,0,0,0.1),-27px 0 0 0 rgba(0,0,0,0.2),-19px -19px 0 0 rgba(0,0,0,0.3);}
	62.5%{box-shadow:0 -27px 0 0 rgba(0,0,0,0.3),19px -19px 0 0 rgba(0,0,0,0.4),27px 0 0 0 rgba(0,0,0,0.6),19px 19px 0 0 rgba(0,0,0,0.8),0 27px 0 0 #ffffff,-19px 19px 0 0 rgba(0,0,0,0.05),-27px 0 0 0 rgba(0,0,0,0.1),-19px -19px 0 0 rgba(0,0,0,0.2);}
	75%{box-shadow:0 -27px 0 0 rgba(0,0,0,0.2),19px -19px 0 0 rgba(0,0,0,0.3),27px 0 0 0 rgba(0,0,0,0.4),19px 19px 0 0 rgba(0,0,0,0.6),0 27px 0 0 rgba(0,0,0,0.8),-19px 19px 0 0 #ffffff,-27px 0 0 0 rgba(0,0,0,0.05),-19px -19px 0 0 rgba(0,0,0,0.1);}
	87.5%{box-shadow:0 -27px 0 0 rgba(0,0,0,0.1),19px -19px 0 0 rgba(0,0,0,0.2),27px 0 0 0 rgba(0,0,0,0.3),19px 19px 0 0 rgba(0,0,0,0.4),0 27px 0 0 rgba(0,0,0,0.6),-19px 19px 0 0 rgba(0,0,0,0.8),-27px 0 0 0 #ffffff,-19px -19px 0 0 rgba(0,0,0,0.05);}
	100%{box-shadow:0 -27px 0 0 rgba(0,0,0,0.05),19px -19px 0 0 rgba(0,0,0,0.1),27px 0 0 0 rgba(0,0,0,0.2),19px 19px 0 0 rgba(0,0,0,0.3),0 27px 0 0 rgba(0,0,0,0.4),-19px 19px 0 0 rgba(0,0,0,0.6),-27px 0 0 0 rgba(0,0,0,0.8),-19px -19px 0 0 #ffffff;}
}
@media screen and (max-width:767px){
	.yBoxFrame.yBoxImgWrap .insertYboxAjaxHere{padding:5px;max-height:-webkit-calc(100vh - 10px);max-height:calc(100vh - 10px);}
	.closeYbox{top:5px;right:5px;}
	.yBoxFrame.yBoxImgWrap img.yBoxImg{max-width:-webkit-calc(100vw - 20px);max-width:calc(100vw - 20px);max-height:-webkit-calc(100vh - 20px);max-height:calc(100vh - 20px);}
	.yBoxFrame.yBoxImgWrap .yBoxPrevImg::after{right:50%;width:14px;height:14px;}
	.yBoxFrame.yBoxImgWrap .yBoxNextImg::after{left:50%;width:14px;height:14px;}
	.yBoxFrame.yBoxIframeWrap .insertYboxAjaxHere{left:5px;right:5px;top:5px;bottom:5px;}
	.yBoxFrame.yBoxImgWrap .yBoxNextImg,.yBoxFrame.yBoxImgWrap .yBoxPrevImg{width:50px;max-width:30%;height:50%;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);}
	.yBoxFrame.yBoxImgWrap .insertYboxAjaxHere{height:-webkit-calc(100vh - 10px);height:calc(100vh - 10px);}
	.yBoxFrame.yBoxImgWrap{width:-webkit-calc(100vw - 10px);width:calc(100vw - 10px);height:-webkit-calc(100vh - 10px);height:calc(100vh - 10px);}
	.yBoxImgZoom{display:flex;justify-content:center;align-items:center;background:#000;overflow:hidden;}
}
@media screen and (max-width:479px){
	.yBoxFrame.yBoxImgWrap,.yBoxFrame.yBoxIframeWrap{height:-webkit-calc(100vh - 80px);height:calc(100vh - 80px);}
	.yBoxFrame.yBoxImgWrap .insertYboxAjaxHere,.yBoxFrame.yBoxIframeWrap .insertYboxAjaxHere{height:-webkit-calc(100vh - 80px);height:calc(100vh - 80px);}
	.yBoxFrame.yBoxImgWrap img.yBoxImg,.yBoxIframe{max-height:-webkit-calc(100vh - 90px);max-height:calc(100vh - 90px);}
}