/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
.strip_wrapper {
	/* required settings */
	position:relative;
	overflow:hidden;
	width: 480px;
	*width: 480px;
	height: 77px;
	padding: 10px 0px;
	*padding: 10px 0px;
	top:360px;
	background-color: #BEE1F4;
	z-index: 100;
	filter:alpha(opacity=100);
	opacity:1;
	zoom:1;
}
/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a extremely large width to accomodate scrollable items.
	it's enough that you set the width and height for the root element and
	not for this element.
*/
.filmstrip {
	/* this cannot be too large */
	list-style-type: none; 
	list-style-position: initial; 
	list-style-image: initial;
	position:relative;
	height:90px;
	width:20000em;
	/*clear:both;*/
	margin: 0px; 
	padding:0 0 0 19px;
}

.container {
	float:left;
	width:490px;
	height:90px;
	border:none;
	position:relative;
}

/* single scrollable item */
.filmstrip img {
	float:left;
	margin:0 0 0px 0;
	padding:0 0 0px 0;
	width:100px;
	height:75px;
	position:relative;
}

/* active item */
.filmstrip .active {
	position:relative;
	cursor:default;
}
/* FILMSTRIP FRAMES (contains both images and captions) */
.frame {float: left;position: relative;height: 75px;width: 100px;z-index: 150;cursor: pointer;padding:0 5px;}

/* WRAPPER FOR FILMSTRIP IMAGES */
.frame .img_wrap {border: none;height: 75px; width: 100px; position: relative; top: 0px; left: 0px; overflow: hidden; }

/* WRAPPER FOR CURRENT FILMSTRIP IMAGE */
.frame.current .img_wrap { border: 1px solid #ffffff; }

/* FRAME IMAGES */
/*.frame img { border: none; height: 75px; width: 100px; position: relative; }*/

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

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