.picShowFog{
    position:fixed;
    top: 0;
    background: rgba(240,197,142,0.8);
    width:100%;
    height:100%;
    margin:0;
	z-index:101;
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
}
.picShowContainer{
	position:relative;
	height:calc(100% - 20px);
	padding:5px;
	margin:5px;
}
.picShowAppearImage{
	animation-name:picShowAppearImage;
	animation-fill-mode: forwards;
	animation-duration: 1s;
}

@keyframes picShowAppearImage {
	0% {opacity:0;}
	100% {opacity:1;}
}

.picShowDisappearImage{
	animation-name:picShowDisappearImage;
	animation-fill-mode: forwards;
	animation-duration: 1s;
}

@keyframes picShowDisappearImage {
	0% {opacity:1;}
	100% {opacity:0;}
}


.picShowTitleDiv{
	background: rgba(170,111,50,0.8);
	padding:10px;
	margin:10px;
	border-radius:5px;
	transform: translate(0, -200%);
	color:white;
	font-family: Arial, Helvetica, sans-serif;
	font-size:16px;
}

.picShowPrev{
	width:50%;
	position:absolute;
	top:0;
	left:0;
	cursor:pointer;
}
	
.picShowPrev:hover{
	background-image: url('./picShow/prev.png');
	background-repeat:no-repeat;
	background-position: left top;
}
.picShowNext{
	width:50%;
	position:absolute;
	top:0;
	left:50%;
	cursor:pointer;

}

.picShowNext:hover{
	background-image: url('./picShow/next.png');
	background-repeat:no-repeat;
	background-position: right top;
}

.picShowFirst{
	width:50%;
	position:absolute;
	top:0;
	left:0;
	background-image: url('./picShow/first_photo.png');
	background-repeat:no-repeat;
	background-position: left top;

}

.picShowLast{
	width:50%;
	position:absolute;
	top:0;
	left:50%;
	background-image: url('./picShow/last_photo.png');
	background-repeat:no-repeat;
	background-position: right top;

}
