/* 
	root element for the scrollable. 
	when scrolling occurs this element stays still. 
*/
div.scrollable {
	
	/* required settings */
	position:relative;
	overflow:hidden;	 	
	width: 884px;	
	height:120px;
	float: left;	
	
	
	/* custom decorations */
	padding:0;				
}
#archivo-scroller div.scrollable { 	
	width: 570px;				
}

/* 
	root element for scrollable items. Must be absolutely positioned
	and it should have a super large width to accomodate scrollable items.
	it's enough that you set width and height for the root element and
	not for this element.
*/
div.scrollable ul.items {	
	/* this cannot be too large */
	width:20000em;	
	position:absolute;
	clear:both;
}

/* single scrollable item */
div.scrollable ul.items li a {
	text-decoration: none;
}
div.scrollable ul.items li {
	float:left;
	width:210px;
	padding:20px 5px 0 5px;
	height: 100px;
	opacity: 0.5;
	-moz-opacity: 0.5;
	filter:alpha(opacity=50);
}

#archivo-scroller div.scrollable ul.items li {
	width:auto;
	padding:20px 18px 0 18px;
}
div.scrollable ul.items li img {
	float: left;
	border: 1px solid #605A57;
	padding: 4px;
	margin-right: 10px;
}
#archivo-scroller div.scrollable ul.items li img {
	margin-right: 0;
}
div.scrollable ul.items li strong, div.scrollable ul.items li span {
	margin-bottom: 0;
	color: #766F6B;
	display: block;
}
div.scrollable ul.items li .titulo-obra {
	margin-bottom: 3px;
	color: #C68D1A;
	font-weight: bold;
	font-size: 1.3em;
	word-wrap: break-word;
}
div.scrollable ul.items li .gris {
	font-weight: bold;
	color: #B3ABA8;
}

/* active item */
div.scrollable ul.items li.active, div.scrollable ul.items li:hover {
	opacity: 10;
	-moz-opacity: 10;
	filter:alpha(opacity=100);
	background: #212121;
}
#horizontal-scroller .prev, #horizontal-scroller .next, #video-scroller .prev, #video-scroller .next, #archivo-scroller .prev, #archivo-scroller .next {
	float: left;
	cursor: pointer;
	margin-top: 45px;
}
#horizontal-scroller .prev, #video-scroller .prev, #archivo-scroller .prev {
	margin-right: 10px;
}
#horizontal-scroller .next, #video-scroller .next, #archivo-scroller .next {
	margin-left: 10px;
}

#horizontal-scroller1 .prev, #horizontal-scroller1 .next, #video-scroller1 .prev, #video-scroller1 .next, #archivo-scroller1 .prev, #archivo-scroller1 .next {
	float: left;
	cursor: pointer;
	margin-top: 45px;
}
#horizontal-scroller1 .prev, #video-scroller1 .prev, #archivo-scroller1 .prev {
	margin-right: 10px;
}
#horizontal-scroller1 .next, #video-scroller1 .next, #archivo-scroller1 .next {
	margin-left: 10px;
}
#horizontal-scroller1 div.scrollable ul.items li{
	width:225px;
	padding:20px 10px 0 10px;
}
#archivo-scroller {
	clear: both;
	background: #282828;
	float: left;
	padding: 0 18px;
	width: 629px;
}
#video-scroller {
	clear: both;
	background: #282828;
	float: left;
	padding: 0 25px;
	width: 940px;
}
#video-scroller div.scrollable ul.items li .titulo-obra {
	float: left;
	width: 80px;
}