<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">/*

	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.
	
	&lt;div class="gallery"&gt;
		&lt;div class="panel"&gt;
			&lt;img src="path/to/image.jpg" /&gt;
			&lt;div class="panel-overlay"&gt;
				...overlay content...
			&lt;/div&gt;
			&lt;div class="overlay-background"&gt;&lt;/div&gt;
		&lt;/div&gt;
		&lt;ul class="filmstrip"&gt;
			&lt;li class="frame current"&gt;
				&lt;img src="path/to/thumbnail.jpg" /&gt;
				&lt;div class="caption"&gt;caption text&lt;/div&gt;
			&lt;/li&gt;
			&lt;li class="frame"&gt;
				&lt;img src="path/to/thumbnail.jpg" /&gt;
				&lt;div class="caption"&gt;caption text&lt;/div&gt;
			&lt;/li&gt;
		&lt;/ul&gt;
	&lt;/div&gt;
		

*/

/* GALLERY LIST */
/* IMPORTANT - Change '#photos' to the ID of your gallery list to prevent a flash of unstyled content */
#photos 
{ 
    visibility: hidden; 
}

/* GALLERY CONTAINER */
.gallery 
{ 
    background: #FFF; 
    border: none; 
    padding: 5px;
}

.galleryview
{
    background: #FFF; 
    border: none; 
    padding: 5px;
    margin: 0px auto !important;
}

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

/* GALLERY PANELS */
.panel
{
    width: 500px;
    height: 375px;
}

.panel img
{
    max-height: 375px;
    max-width: 500px;
    display: block;
    margin: 0px auto;
}

/* 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,
.panel .overlay-background 
{ 
    height: 60px; 
    padding: 0 1em; 
}

/* PANEL OVERLAY BACKGROUND */
.panel .overlay-background 
{ 
    background: #222; 
}

/* PANEL OVERLAY CONTENT */
.panel .panel-overlay 
{ 
    color: white; 
    font-size: 0.7em; 
}

.panel .panel-overlay a 
{ 
    color: white; 
    text-decoration: underline; 
    font-weight: bold;
}

/* FILMSTRIP */
/* 'margin' will define top/bottom margin in completed gallery */
.filmstrip
{ 
    margin: 5px; 
}

.filmstrip li
{
    display: block !important;
    width: 100px !important;
    height: 65px !important;
    text-align: center !important;
}

.filmstrip li img
{
    max-width: 100px !important;
    max-height: 68px !important;
    margin: 0px auto !important;
    display: block !important;
}

/* FILMSTRIP FRAMES (contains both images and captions) */
.frame {}

/* WRAPPER FOR FILMSTRIP IMAGES */
.frame .img_wrap 
{ 
    border: 1px solid #aaa; 
}

/* WRAPPER FOR CURRENT FILMSTRIP IMAGE */
.frame.current .img_wrap 
{ 
    border-color: #000; 
}

/* FRAME IMAGES */
.frame img 
{ 
    border: none; 
}

/* FRAME CAPTION */
.frame .caption 
{ 
    font-size: 11px; 
    text-align: center; 
    color: #888; 
}

/* CURRENT FRAME CAPTION */
.frame.current .caption 
{ 
    color: #000; 
}

/* POINTER FOR CURRENT FRAME */
.pointer 
{
	border-color: #000;
}

/* TRANSPARENT BORDER FIX FOR IE6 */
/* NOTE - DO NOT CHANGE THIS RULE */
*html .pointer {
	filter: chroma(color=pink);
}</pre></body></html>