/* _____________________________________________________________
	As with most projects 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.
   _____________________________________________________________ */
   
/* - - - - - - - - - - - - - - - - - - - - -
		Gallery Container
 - - - - - - - - - - - - - - - - - - - - - - */
.flickrGalleryCntr {
	position: relative;
	padding: 0 15px 15px;
}
.flickrGalleryCntr img {
	border:0pt none;
}

/* - - - - - - - - - - - - - - - - - - - - -
		album containers
 - - - - - - - - - - - - - - - - - - - - - - */
.flickrGalleryAlbum {
	width: 25%;
	height: 100%;
	height: 160px;
	float: left;
	padding: 5px;
    margin-bottom: 50px;
}

.flickrGalleryAlbum h5 {
    margin-bottom: -10px;
    height: 40px;
}

.flickrGalleryAlbum img {
    width: 75%;
	margin: 0px 15px 5px;
	border: 2px solid black;
}

/* - - - - - - - - - - - - - - - - - - - - -
		Images Container
 - - - - - - - - - - - - - - - - - - - - - - */
.flickrGalleryImages {
    margin: 25px auto;
}
.flickrGalleryImageView {
	padding-top: 50px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	width: 50%;
}
.flickrGalleryImageView img {
	display: inline;
	margin: auto;
}

/* - - - - - - - - - - - - - - - - - - - - -
		Image Navigation buttons
 - - - - - - - - - - - - - - - - - - - - - - */
 .gallery_title {
	background:#e5c995;
	color:#d97d0d;
}
 
.flickrGalleryImageMenu {
	width: 100%;
	position: inherit;
	left: 0em;
	background:#e5c995;
}
/*
.flickrGalleryImageMenuHover {
	opacity: 1;
	filter: alpha(opacity=90);
}

.flickrGalleryImageMenuButtons a:hover {
	opacity: 1;
	filter: alpha(opacity=100);
	color: #ffffff;
}
*/

.flickrGalleryImageMenu a {
	color: #000;
	width: 100%;
}
.flickrGalleryImageMenuButtons {
	background:#e5c995;
	color: #e5c995;
}

.flickrGalleryImageMenuButtons table {
    margin: 0 auto;
    width: 100%;
    background-color: #e5c995;
    border: 1px solid black;
}

.flickrGalleryImageMenuButtons a {
	padding: 3px;
	margin: 4px;
}


/* - - - - - - - - - - - - - - - - - - - - -
		Thumbnails images
 - - - - - - - - - - - - - - - - - - - - - - */
.flickrGalleryImageThumbs {
	background: #e5c995;
	border: 1px solid #0f0f0f;
    border-top: 0px solid #0f0f0f;
	padding: 1em;
	height: 300px;
	overflow: auto;
}
.flickrGalleryImageThumbs ul {
	list-style: none;
}
.flickrGalleryImageThumbs li {
	float: left;
	list-style-image: none;
	list-style-position: inside;
	list-style-type: none;
	display: block;
	height: 50px;
	width: 50px;
	overflow: hidden;
	margin: 5px;
	border:1px solid black;
}

/* - - - - - - - - - - - - - - - - - - - - -
		Loading Message Container
 - - - - - - - - - - - - - - - - - - - - - - */
.flickrGalleryLoading {
    position: absolute;
    text-align: center;
    vertical-align: middle;
    z-index: 11;
    width: 90%;
    height: 90%;
    opacity: .0;
    filter: alpha(opacity=0);
    margin: auto;
    margin-top: 30%;
    font-size: large;
    font-weight: 900;
    display: block;
}