/*

	GalleryView Stylesheet
	
	Use the CSS rules below to modify the look of your gallery.
	
	To create additional rules, use the markup below as a guide to GalleryView's architecture.
	
	<div class="gallery">
		<div class="panel">
			<img src="path/to/image.jpg" />
			<div class="panel-overlay">
				...overlay content...
			</div>
		</div>
		<ul class="filmstrip">
			<li class="frame current">
				<img src="path/to/thumbnail.jpg" />
				<div class="caption">caption text</div>
			</li>
			<li class="frame">
				<img src="path/to/thumbnail.jpg" />
				<div class="caption">caption text</div>
			</li>
		</ul>
	</div>
		

*/


/* GALLERY CONTAINER */
#photos		{visibility:hidden;}

/* LOADING BOX */
.loader		{background:#dddddd url(../galleryView/loader.gif) no-repeat center center;}

/* GALLERY PANELS */
.panel  {}

/* DEFINE HEIGHT OF PANEL OVERLAY */
/* NOTE - It is best to define padding here as well so overlay and background retain identical dimensions */
.panel .panel-overlay	{overflow:hidden;}

/* PANEL OVERLAY CONTENT */
.panel .panel-overlay		{}
div.panel-overlay h2		{display:block; font-weight:normal; font-size:19px; margin:8px 10px -8px 10px; position:relative;} /* have already side - 10px */
div.panel-overlay p		{display:block; font-weight:normal; font-size:15px; margin:10px 10px 0px 10px;} /* have already side - 10px */
.panel .panel-overlay a		{color:#ffffff; text-decoration:underline; font-weight:bold;}

/* FILMSTRIP */
/* 'margin' will define top/bottom margin in completed gallery */
div.strip_wrapper		{top:426px !important;}
ul.filmstrip			{}
ul.filmstrip li.frame	{list-style-type:none !important; list-style-image:none !important;}

/* FRAME IMAGES */
li.frame .img_wrap			{/*background:#ffffff;*/}
li.frame .current .img_wrap	{}
ul.filmstrip li.frame img	{/*margin:1px;*/}

/* FRAME CAPTION */
.frame .caption				{height:30px !important; font-size:13px !important; line-height:15px !important; padding-top:9px !important;}
.frame .current .caption	{}

/* POINTER FOR CURRENT FRAME */
#pointer		{top:426px !important; width:142px !important; height:90px !important; border:#3f6694 5px solid !important;}
#pointer IMG	{width:22px !important; height:15px !important; top:-20px !important; z-index:9999 !important;}

/* Arrows */
#photos IMG.nav-next    {top:460px !important; right:15px !important; width:13px !important; height:22px !important;}
#photos IMG.nav-prev    {top:460px !important; left:15px !important; width:13px !important; height:22px !important;}