@charset "UTF-8";

#gallery {
	margin: auto;
	width: 800px;
	padding: 5px;
	height: 825px;
}
#thumbs {
	width: 80px;
	height: 80px;
	padding: 5px;
	float: left;
	margin: 5px;
}
#thumbs img {
	width: 100%;
	height: 100%;
	opacity: 1.0;
	filter: alpha(opacity=100);
}
#thumbs img:hover {
	opacity: 0.5;
	filter: alpha(opacity=50);
}
.lightbox {
	visibility: hidden;
	opacity: 0;
	position: fixed;
	top: 0px;
	left: 0;
	background-color: rgba(72,73,74,0.7);
	height: 100%;
	width: 100%;
}
.lightbox:target {
	visibility: visible;
	opacity: 1;
	transition:opacity 2s;
}
#outer {
	background-color: white;
	width: 729px;
	margin: auto;
	margin-top: 40px;
	box-shadow: 0px 0px 35px black;
	padding: 10px;
}
#inner {
	
}
.lightbox a{
	text-decoration: none;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#666;
	opacity: 0;
}
#cross {
	float: right;
	font-size: 18px;
	padding-right: 15px;
}
.lightbox #outer:hover #cross{
	opacity: 1;
	transition: opacity 1s;
}
.lightbox #outer:hover #next{
	opacity: 1;
	transition: opacity 1s;
}
.lightbox #outer:hover #prev{
	opacity: 1;
	transition: opacity 1s;
}
#next {
	float: right;
	padding-right: 15px;
}
#prev {
	padding-left: 15px;
}