/* 
	IMAGE BROWSER CSS 
	Go through it and set the marked values for:
	.gallery-imagebrowser .thumbnails .thumbnail
	.gallery-imagebrowser .pages .page
*/
.gallery-imagebrowser { padding-bottom: 30px; position: relative; }

	.gallery-imagebrowser .navigation-container { position: relative; }

		.gallery-imagebrowser .navigation { text-align: center; background: none; margin: 0; height: 100%; }
			
			.gallery-imagebrowser .navigation .control { position: absolute; z-index: 2; width: 30px; height: 30px; line-height: 30px; text-indent: -9999px; }		
			.gallery-imagebrowser .navigation .previous { left: 10px; padding: 0 50% 0 0; height: 100%; }
			.gallery-imagebrowser .navigation .next { right: 10px; padding: 0 0 0 50%; height: 100%; }
		
				.gallery-imagebrowser .navigation span { width: 30px; height: 30px; display: block; position: absolute; top: 45%; }
			
				.gallery-imagebrowser .navigation .previous span { left: 0; background: url('images/image-browser-nav.png') 0 0 no-repeat; }
				.gallery-imagebrowser .navigation .previous:hover span { background: url('images/image-browser-nav.png') 0 -30px no-repeat; }
				.gallery-imagebrowser .navigation .next span { right: 0; background: url('images/image-browser-nav.png') -30px 0 no-repeat;}
				.gallery-imagebrowser .navigation .next:hover span { background: url('images/image-browser-nav.png') -30px -30px no-repeat; }
		
		.gallery-imagebrowser .current-image { text-align: center; position: relative; }
		
			.gallery-imagebrowser .current-image img { max-width: 100%; }
			
			.gallery-imagebrowser .current-image .preloader { position: absolute; z-index: 2; left: 0; top: 0; width: 100%; height: 100%; background: url('images/image-browser-preloader.png') center no-repeat; display: none; }
			
		.gallery-imagebrowser .current-image-description { padding-top: 15px; text-align: center; }

			.gallery-imagebrowser strong { display: block; font-weight: bold; font-size: 16px;  color: #8f8f8f; }

			.gallery-imagebrowser .image-description { display: block; font-size: 14px; color: #8f8f8f; }
		
		.gallery-imagebrowser .thumbnails { position: relative; height: 100px; padding: 0 16px; }
		
			.gallery-imagebrowser .thumbnails .browse { position: absolute; width: 8px; background: url('images/image-browser-page.png') no-repeat; line-height: 100px; text-indent: -9999px; }
			.gallery-imagebrowser .thumbnails .prev { left: 0; padding-left: 5px; background-position: 5px 50%; }
			.gallery-imagebrowser .thumbnails .next { right: 0; padding-right: 5px; background-position: -8px 50%; }
			
			.gallery-imagebrowser .thumbnails .thumbnail { margin: 0 2px; /* Set the margins to compensate for the differences in thumbnail size */}
			.page-template-default .gallery-imagebrowser .thumbnails .thumbnail { margin: 0 23px; }
		
		/* Scrollable required styling */
		.gallery-imagebrowser .wrapper { position: relative; width: 100%; height: 100%; overflow: hidden; }

			.gallery-imagebrowser .pages { /* this cannot be too large */ width: 20000em; position: absolute; }

				.gallery-imagebrowser .pages .page { float: left; width: 620px; /* Set this to the width of the gallery container */ text-align: center; }
				.page-template-default .gallery-imagebrowser .pages .page { width: 700px; }