.overlay{
	width: 0px;
	height: 0px;
	position: fixed;
	overflow: hidden;
	left: 0px;
	top: 0px;
	padding: 0px;
	z-index: 99;
	background: rgba(0,0,0,0.8);
}
.overlay a.close{
	width: 30px;
	height: 30px;
	margin:0 auto;
	text-align: right;
	position: absolute;
	z-index: 1001;
	top: -180px;
	right: 10px;
	opacity: 0.5;
}
.overlay a.close:hover{opacity: 1;}
.overlay:target {
	width: 100%;
	height: auto;
	margin:0 auto;
	bottom: 0px;
	right: 0px;
}

.slider {margin: 70px auto 0 auto;max-width:800px;}
.slide_viewer {
	height: 400px;
	margin:0;
	overflow: hidden;
	position: relative;
}
.slide_group {
	width: 100%;
	height: 100%;
	position: relative;
}
.slide {
	width: 100%;
	height: 100%;
	text-align:center;
	display: none;
	position: absolute;
}

.slide:first-child {display: block;}
.slide img{max-height: 100%;position: relative;}

.directional_nav{
	width:800px;
	height: 400px;
	margin: 0 auto;
	max-width: 90%;
	position: relative;
	top: -215px;
}
.previous_btn {
	margin: auto;
	position: absolute;
	top: 0;
	left: 10px;
}
.next_btn {
	margin: auto;
	top: 0;
	right: 10px;
	position: absolute;
}
.previous_btn, .next_btn {
	width: 31px;
	height: 31px;
	cursor: pointer;
	opacity: 0.5;
}
.previous_btn:hover,
.next_btn:hover {
	opacity: 1;
}

@media only screen and (max-width: 600px) {
	.overlay a.close{
		top: 0;
		left:50%;
		margin-left:-15px;
	}
	.slider {margin: 120px auto 0 auto;}
	.slide img{max-width: 100%;position: relative;}
	.slide_viewer {height: 300px;}
	.directional_nav{
	position:absolute;
	height: 31px;
	max-width: 100%;
	top:50%;
	margin-top:30px;
	}
	.previous_btn {left: 30%;}
	.next_btn {right: 30%;}
}
