.cover {
	position: relative; cursor: pointer;
}
.cover img {
	margin: auto; left: 0px; top: 0px; right: 0px; bottom: 0px; position: absolute;
}
#pictureViewer {
	left: 0px; top: 0px; width: 100%; height: 100%; position: fixed; z-index: 10000; background-color: rgba(0, 0, 0, 0.3);
}
#pictureViewer > .content {
	margin: auto; left: 0px; top: 0px; width: 590px; height: 590px; right: 0px; bottom: 0px; position: absolute; background-color: rgb(255, 255, 255);
}
#pictureViewer .menu-bar {
	width: 100%;
}
#pictureViewer .menu-bar .handel {
	background-position: 50%; width: 40px; height: 40px; float: right; cursor: pointer; background-repeat: no-repeat;
}
#pictureViewer .menu-bar .handel:hover {
	transition:0.3s; background-color: rgb(255, 46, 103); -webkit-transition: all .3s; -o-transition: all .3s; -moz-transition: all .3s;
}
#pictureViewer .menu-bar .handel.maximization {
	background-image: url("../images/icons/maximization_black.png"); background-size: 14px;
}
#pictureViewer .menu-bar .handel.maximization:hover {
	background-image: url("../images/icons/maximization_white.png");
}
#pictureViewer .menu-bar .handel.miniaturization {
	background-image: url("../images/icons/miniaturization_black.png"); background-size: 16px;
}
#pictureViewer .menu-bar .handel.miniaturization:hover {
	background-image: url("../images/icons/miniaturization_white.png");
}
#pictureViewer .menu-bar .handel.close-view {
	background-image: url("../images/icons/close_black.png"); background-size: 15px;
}
#pictureViewer .menu-bar .handel.close-view:hover {
	background-image: url("../images/icons/close_white.png");
}
#pictureViewer .handel-prev {
	background-position: 50%; transition:0.3s; top: calc(50% - 80px); width: 50px; height: 70px; display: inline-block; position: relative; cursor: pointer; background-repeat: no-repeat; background-size: 25px; -webkit-transition: all .3s; -o-transition: all .3s; -moz-transition: all .3s;
}
#pictureViewer .handel-next {
	background-position: 50%; transition:0.3s; top: calc(50% - 80px); width: 50px; height: 70px; display: inline-block; position: relative; cursor: pointer; background-repeat: no-repeat; background-size: 25px; -webkit-transition: all .3s; -o-transition: all .3s; -moz-transition: all .3s;
}
#pictureViewer .handel-prev {
	background-image: url("../images/icons/prev_blank.png");
}
#pictureViewer .handel-next {
	background-image: url("../images/icons/next_blank.png");
}
#pictureViewer .handel-prev:hover {
	background-color: rgb(255, 46, 103);
}
#pictureViewer .handel-next:hover {
	background-color: rgb(255, 46, 103);
}
#pictureViewer .handel-prev:hover {
	background-image: url("../images/icons/prev_white.png");
}
#pictureViewer .handel-next:hover {
	background-image: url("../images/icons/next_white.png");
}
#pictureViewer .picture-content {
	margin: 0px auto; left: 0px; width: 80%; height: calc(100% - 80px); right: 0px; display: inline-block; position: absolute;
}
#pictureViewer .picture-content .cover {
	margin: auto; left: 0px; top: 0px; right: 0px; bottom: 0px; position: absolute;
}
#pictureViewer .counter {
	width: 100%; height: 40px; text-align: center; bottom: 0px; color: gray; line-height: 40px; font-size: 13px; position: absolute;
}
#pictureViewer .hide {
	display: none;
}
#pictureViewer .left {
	float: left;
}
#pictureViewer .right {
	float: right;
}
#pictureViewer .clear-flex {
	clear: both;
}
#pictureViewer img {
	max-height: 100%; max-width: 100%;
}
