﻿@media only screen and (max-width:1024px) {
	.img-holder input:checked ~ .lightbox .img-popup { max-width: 80vw }
}
@media only screen and (max-width:800px) {
	.zdz-colRight,
	.zdz-colLeft, #LeftPanel{ display: none;!important }
	.main .zdz-col-main .col-inner { margin-left: 0; }
	.main > * + *{ padding-left:0; }
	.itemTitle,
	.itemTitle * { text-align: center; }

	.img-holder input:checked ~ .lightbox .img-popup { left: 0; margin-left: 15px; margin-right: 15px; max-width: 100%; max-height: 600px; }
	
		.img-box{ float:none!important; }
	.thumb{ float:none; width:100%; margin-top:15px}
}



@media only screen and (max-width:767px) {
	.zdz-gallery .img-box { position: relative; }
	.zdz-gallery .img-box,
	.thumb { width: auto; float: none; }
	.thumb { margin-left: -7.5px; margin-right: 7.5px; padding-top: 7.5px; }
	.thumb label { float: none; }
	.thumb label .box { margin: 7.5px; }
	.img-holder input:checked ~ .lightbox .img-popup { margin-left: auto; margin-right: auto; width: 100%; border-width: 3px; }
	
	.img-popup img {
    text-align: center;
    display: inline-block;
    border: 0;
    max-width: 100%;
    max-height: 100%;
}

.itemTitle {
    margin-top: 35px;
}

	
}
@media only screen and (max-width:640px) { }
@media only screen and (max-width:480px) {
	.mdl-Box .fr { margin: 0 0 10px; float: none; text-align: center; }
}
@media only screen and (max-width:360px) {
	.img-holder .imgBox { height: 300px; }
	
	
			.zdzpre{
    z-index: 1;
    top: -160px;
    background: #8ec840;
    color: #fff;
    padding: 5px 10px;
    font-size: 20px;
    font-weight: 400;cursor: pointer;float:left;position: relative;
}

	.zdznext{
    z-index: 1;
    top: -160px;
    background: #8ec840;
    color: #fff;
    padding: 5px 10px;
    font-size: 20px;
    font-weight: 400;cursor: pointer;float:right;position: relative;
}
	
}