/*slider frame*/
#sliderFrame {
position:relative;
background-color:#fff;
width:850px;

}      
        

#slider {

    width:850px; 
	height:300px;/* Make it the same size as your images */
	background:#fff url(loading.gif) no-repeat 50% 50%;
	position:relative;
	margin:0 auto;/*make the image slider center-aligned */
    box-shadow: 0px 1px 5px #999999;
}
#slider img {
	position:absolute;
	border:none;
	display:none;
}

/* the link style (if an image is wrapped in a link) */
#slider a.imgLink {
	z-index:2;
	display:none;position:absolute;
	top:0px;left:0px;border:0;padding:0;margin:0;
	width:100%;height:100%;
}
/* Caption styles - div que contiene el texto sobre la noticia*/
div.mc-caption-bg, div.mc-caption-bg2 {
	position:absolute;
	width:380px;
	height:auto;
	bottom:20px;
	padding:5px;
	right:440px; 
	z-index:3;
	overflow:hidden;
	font-size:0;
}


div.mc-caption-bg {
	background-color:white; /*Caption background color. Can be set to "background:transparent;", or set to semi-transparent through the sliderOptions.captionOpacity setting in the javascript.*/
	border:1px solid block;
	border-radius: 5px;
	
}
div.mc-caption {
	
	font:12px Arial;
	color:black;
	z-index:1;
	padding:3px 0;/*Adding a padding-left or padding-right here will make the caption area wider than its background. Sometimes you may need to define its width again here to keep it the same width as its background area (div.mc-caption-bg).*/
	
}
div.mc-caption a {
	color:white;
}
div.mc-caption a:hover {
		color:#DA0;
}



/* ----------- thumbnails ----------- */
#thumbs 
{
  	border:1px solid white; text-align:center; 
    font-size:0px;
    width:700px;
	height:35px;/*Setting the expected height to line-height fixes many IE8 erratic behaviours*/
}
#thumbs .thumb 
{
    width:60px;height:45px;
    cursor:pointer;
    text-align:center;
    border-left:1px solid #FFF; border-right:1px solid #DDD; 
    
    display:inline-block;
    *display:inline;zoom:1; /*IE Hack*/
}
#thumbs .thumb-on {background-image: url(active-bg.png);}
#thumbs .thumb img {vertical-align:middle;}





/* ------ built-in navigation bullets wrapper ------*/
div.navBulletsWrapper  {
	top:315px; left:240px; /* Its position is relative to the #slider. Don't set #slider "overflow:hidden;" if bullets are to be positioned outside of the #slider. */
	width:220px;
	background:none;
	position:relative;
	z-index:5;
	cursor:pointer;
}

/* each bullet */
div.navBulletsWrapper div 
{
    width:11px; height:11px;
    background:transparent url(bullet.png) no-repeat 0 0;
    float:left;
	overflow:hidden;
	vertical-align:middle;
	cursor:pointer;
	
	margin-right:15px;/* distance between each bullet*/
    _position:relative;/*IE6 hack*/
}

div.navBulletsWrapper div.active {background-position:0 -11px;}

/* ----------- navigation buttons in the thumbnails bar ---------- */

a.group2-Prev, a.group2-Next, a.group2-Play, a.group2-Pause 
{
	width:20px; height:20px; 
    background:transparent url(navButtons.gif); 
    display:inline-block; 
    margin-top:8px;
	margin-right:8px;
    cursor:pointer;
	
}
a.group2-Pause{background-position:0 0;}
a.group2-Play {background-position:0 -20px;}
a.group2-Next {background-position:0 -40px;}
a.group2-Prev {background-position:0 -60px;} 

a.group2-Pause:hover{background-position:20px 0;}
a.group2-Play:hover {background-position:20px -20px;}
a.group2-Next:hover {background-position:20px -40px;}
a.group2-Prev:hover {background-position:20px -60px;} 




/* --------- Others ------- */
#slider 
{
	transform: translate3d(0,0,0);
    -ms-transform:translate3d(0,0,0);
    -moz-transform:translate3d(0,0,0);
    -o-transform:translate3d(0,0,0);
}