﻿/* _____________________________________________________________
	As with most s on the web, the beatifying of the
	webpage is done through the Cascading Style Sheets (CSS). 
	Below is the one used in the demos contained in this webpage.
   _____________________________________________________________ */

/* - - - - - - - - - - - - - - - - - - - - -
		Drupal Overrides
 - - - - - - - - - - - - - - - - - - - - - - */
.flickrGalleryCntr table, .flickrGalleryCntr tbody {
				
	padding:0;
	margin:0;	
	border:none;	
		
}


   
/* - - - - - - - - - - - - - - - - - - - - -
		Gallery Container
 - - - - - - - - - - - - - - - - - - - - - - */
.flickrGalleryCntr {
	position: relative;
	margin-top: 20px;
	text-decoration:none;
	width: 500px;
	height: 500px;
	overflow: hidden;
	background-color: #fff;
		border-bottom: 1px solid #fff; /*Left in so gallery doesn't shift 1px*/

}
.flickrGalleryCntr img, .flickrGalleryAlbum img {
margin: auto;
text-align:center;
	border:0pt none;
}



/* - - - - - - - - - - - - - - - - - - - - -
		album containers
 - - - - - - - - - - - - - - - - - - - - - - */
.flickrGalleryAlbum {
	/*width: 100%;
	height: 100%;
	float: left;
	border: 1px solid #0f0f0f;
	padding: 10px;
	margin: 10px;
	border: 5px solid #ffffff;*/
	height:500px; /*These lines of code align the images*/
margin-left:0px; /*(520-380)/2 */
margin-top:0px;
width:500px;
	
}

.flickrGalleryAlbum a {
color: #000;
text-decoration:none;
}

.flickrGalleryAlbum a:hover {
text-decoration:none;
}

.flickrGalleryAlbum span {
font-size:12px;

}

div.album-title {
display:block;
position:absolute;
top:130px;
left: 130px;
width:220px;
height:200px; /*For centering */
z-index:100;
padding: 10px;
background: #000;
background: rgba(0, 0, 0, 0.5);
color: #fff;
-moz-border-radius: 3px;
border-radius: 3px;
text-decoration:none
}

div.album-title h3, div.album-title p, div.album-title span {
color:#fff;
text-align:center;
font-size: 14px;
}

div.album-title span {
display:block;
}

div.album-title h3 {
margin-top:10px;
font-size: 24px;
font-weight:bold;
line-height:27px;
margin-bottom: 10px;
}

div.album-title:hover {
background: rgba(0, 0, 0, 0.8);
text-decoration:none;
}
/* - - - - - - - - - - - - - - - - - - - - -
		Images Container
 - - - - - - - - - - - - - - - - - - - - - - */
.flickrGalleryImages {
height:500px; /*These lines of code align the images*/
margin-left:0px; /*(520-380)/2 */
margin-top:0px;
width:500px;
}
.flickrGalleryImageView {
	/*padding-top: 30px;*/
	vertical-align:middle;
	text-align: center;
	margin: auto;
	margin-right: auto;

}
.flickrGalleryImageView img {
	display: inline;


}

/* - - - - - - - - - - - - - - - - - - - - -
		Image Navigation buttons
 - - - - - - - - - - - - - - - - - - - - - - */
.flickrGalleryImageMenu {
	width: 100%;
	position: inherit;
	left: 0em;
	background: #fff;
	opacity: .60;
	filter: alpha(opacity=60);
	bottom:0;
	border-top: 1px solid #ccc;
	font-size: 11px;
	font-weight:normal;
}
.flickrGalleryImageMenuHover {
	opacity: .90;
	filter: alpha(opacity=90);
}

.flickrGalleryImageMenu a {
	color: #000;
	/*	padding: 3px;
	margin: 4px;*/
	width: 100%;
}
.flickrGalleryImageMenuButtons {
margin-top: 2px;
	background-color: #fff;
	color: #000;
	font-weight:bold;
	padding-top:5px;
	padding-bottom: 5px;
}
.flickrGalleryImageMenuButtons a {

	border: 1px solid #fff;
	padding:3px;
	padding-left: 6px;
	padding-right: 6px;
	text-decoration: none;
}
.flickrGalleryImageMenuButtons a:hover {
	opacity: 1;
	filter: alpha(opacity=100);
	border-color: #e2e2e2;
	color: #000;
}

/*Start VT adds for styling */
.flickrGalleryImageMenuImgCount { /*Made a fixed width so that the menu doesn't shift from 9->10 etc*/
width: 50px;
float:right;
padding-left:0;
margin-left:0;
padding-right:5px;
}

a.flickrGalleryImageMenuButtonsPrev {
padding-left: 10px;
background: #fff url(../images/prev.gif) left no-repeat;
}

a.flickrGalleryImageMenuButtonsNext {
padding-right: 10px;
background: url(../images/next.gif) right no-repeat;
}

a.flickrGalleryImageMenuButtonsThumbs {
padding-right: 14px;
background: url(../images/up.gif) right no-repeat;
}
/*End VT adds for styling */

/* - - - - - - - - - - - - - - - - - - - - -
		Thumbnails images
 - - - - - - - - - - - - - - - - - - - - - - */
.flickrGalleryImageThumbs {
	background: #fff;
	border-bottom: 5px solid #fff;
	padding: 1em;
}
.flickrGalleryImageThumbs ul {
padding-left:0px;
	list-style: none;
}
.flickrGalleryImageThumbs li {
	float: left;
	list-style-image: none;
	list-style-position: inside;
	list-style-type: none;
	background:none;
	text-align:center;
	display: block;
	height: 25px;
	width: 25px;
	border:none;
	overflow: hidden;
	padding: 5px;
}

/* - - - - - - - - - - - - - - - - - - - - -
		Loading Message Container
 - - - - - - - - - - - - - - - - - - - - - - */
.flickrGalleryLoading {
	margin-left:auto;
margin-right:auto;
	opacity: .90;
	color: #ffffff;
	filter: alpha(opacity=90);
	margin: auto;
	font-size: large;
	font-weight: 900;
	display: block;
}

#outer-div {
width: 500px; height: 500px; display: table; vertical-align:middle;
}
#center-div {
display: table-cell;  text-align: center;
position:relative; vertical-align: middle; width: 100%;  
}

#outer-div {
display: block;
}

* html #center-div {
	display: inline-block;
	vertical-align: middle;
}


#center-div img {
margin-left:auto;
margin-right:auto;
}

#mainContent ul li {
margin: 0;
;