/* CSS Document */



#art_section
{
	padding:10px;
	overflow:hidden;
	height:100%;
}

#pic-wrapper
{
	width: 1000px;
	margin: 0 auto;
	
	/*Display a loading img*/
	background-image: url("/img/spinnerImg.gif");
	background-position: 50% 50%;
	background-repeat: no-repeat;
}
#art_mainDisplay
{
	position:relative;
	text-align:center;
	width: 1202px;
	overflow: hidden;
	margin: 0 -101px;
}
#art_mainDisplay img
{
	width:auto;
	height:auto;
	vertical-align:middle;
	max-height:1024px;
}
#pic-shadow-top
{
	width:100%;
	height:30px;
	position:absolute;
	top:0;
	background:url("../img/pic-upper-shadow.png");
	background-repeat:no-repeat;
}
#pic-shadow-bottom
{
	width:100%;
	height:30px;
	position:absolute;
	bottom:0;
	background:url("../img/pic-lower-shadow.png");
	background-repeat:no-repeat;
}
.arrowButton
{
	position:absolute;
	top: 44%;
	
	display:inline-block;
	*display: inline;
	zoom:1;
	vertical-align:middle;
	width:40px;
	height:75px;
	
	width:50px;
	height:93px;
	overflow:hidden;
	text-indent:-99999px;
	cursor:pointer;
	opacity:0.35;
	filter:alpha(opacity=35); /* For IE8 and earlier */
	
   -moz-transition:opacity 0.2s ease-in-out;
   -o-transition:opacity 0.2s ease-in-out;
   transition:opacity 0.2s ease-in-out;
   -webkit-transition:opacity 0.2s ease-in-out;
}
.arrowButton:hover
{	
	opacity:0.78;
	filter:alpha(opacity=78); /* For IE8 and earlier */
	
   -moz-transition:opacity 0.2s ease-in-out;
   -o-transition:opacity 0.2s ease-in-out;
   transition:opacity 0.2s ease-in-out;
   -webkit-transition:opacity 0.2s ease-in-out;
}
.prevPic
{
	left:30px;
	background:url("../img/arrows-sprite.png");
	background-repeat: no-repeat;
	background-position: 0px 0px;
}
.nextPic
{
	right:30px;
	background:url("../img/arrows-sprite.png");
	background-repeat: no-repeat;
	background-position: -50px 0px;
}
#toggleDisplay
{
	text-align:center;
	cursor:pointer;
}



#albumSelector
{
	padding-left:140px;
}
#albumSelector .artNavItem
{
	display:inline-block;
	*display: inline;
	zoom:1;
	vertical-align:top;
	width:200px;
	margin:0 0 0 20px;
	font-size:22px;
}
.artNavItem a
{
	padding:6px;
	color:#AAA;
	text-decoration:none;
}
.artNavItem a:hover, .artNavItem a:active, .artNavItem a:focus
{
	color: #6685AA;
	text-shadow:0 0 12px #777;
}
.artNavItem.selected a
{
	text-decoration:underline;
	color:#555;
}

#art_albumThumbs
{
	padding-left:140px;
}
	
.thumbnail
{
	display:inline-block;
	*display: inline;
	zoom:1;
	margin:20px;
}
.thumbnail img
{
	min-height:50px;
	height:auto;
	width:100px;
	border:solid 1px #ccc;
	
	box-shadow: 0px 0px 25px 2px rgba(250, 250, 255, 0.45);
	-moz-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.3);
	
	transition: box-shadow 0.5s ease-in-out, border 0.5s ease-in-out, border-radius 0.5s ease-in-out; 
	-moz-transition: -moz-box-shadow 0.9s ease-in-out, border 0.5s ease-in-out;
	-o-transition: box-shadow 0.5s ease-in-out, border 0.5s ease-in-out, border-radius 0.5s ease-in-out;
	-webkit-transition: -webkit-box-shadow 0.5s ease-in-out, border 0.5s ease-in-out, border-radius 0.5s ease-in-out;
}
.thumbnail img:hover, .thumbnail a:focus, .thumbnail a:active
{
	border:solid 1px #fff;
	border-radius:1px;
	
	box-shadow: 0px 0px 25px 2px rgba(0, 0, 0, 0.45);
	-moz-box-shadow: 0px 0px 15px #7d979d;
	-webkit-box-shadow: 0px 0px 25px rgba(208, 240, 247, 0.7);
	-webkit-box-shadow: 0px 0px 25px #7d979d;
	
	transition: box-shadow 0.5s ease-in-out, border 0.5s ease-in-out, border-radius 0.5s ease-in-out;   
	-moz-transition: -moz-box-shadow 0.9s ease-in-out, border 0.5s ease-in-out;
	-o-transition: box-shadow 0.5s ease-in-out, border 0.5s ease-in-out, border-radius 0.5s ease-in-out; 
	-webkit-transition: -webkit-box-shadow 0.5s ease-in-out, border 0.5s ease-in-out;
}



.album_breaker
{
	text-align:center;
	border-bottom:solid 1px #666;
	margin-bottom:15px;
	margin-right:80%;
}