/*  
 RoyalSlider
 */
.royalSlider
{ 
  position:relative;
  /* set width and height of slider here, in px, % or em*/
  /* Used to prevent content "jumping" on page load. this property is removed when javascript is loaded and slider is instanciated */
  overflow:hidden;
  border: 0px;
}



/**
*  Slides area (set background here)
*/

.royalSlider .royalWrapper {
  overflow:hidden;  
  position:relative;

  width:100%; 
  height:100%;
}
.royalSlider .royalSlide,
.royalSlider .royalWrapper
{
  /* Bakground behind slides */
  background: #ffffff; 
  background: -moz-linear-gradient(top, #ffffff 0%, #ffffff 100%);  
  background: -webkit-linear-gradient(top, #ffffff 0%,#ffffff 100%); 
  background: -o-linear-gradient(top, #ffffff 0%,#ffffff 100%);
  background: -ms-linear-gradient(top, #ffffff 0%,#ffffff 100%);  
  background: linear-gradient(top, #ffffff 0%,#ffffff 100%);
}
/* slides holder, grabbing container */
.royalSlider .royalSlidesContainer {
  position: relative;
  left: 0;
  top: 0 !important;
  list-style:none !important;
  margin:8px auto !important;
  padding-left:20px !important;
  border: 0 !important;
}


/* slide item */
.royalSlider .royalSlide {
  padding: 0 !important;
  margin: 0 !important; 
  border: 0 !important;
  list-style: none !important;
  
  position:relative;
  float:left; 
  
  overflow:hidden;  
}

/* 

  Direction Navigation (arrows) 

*/
.royalSlider .arrow
{ 
  /*background:url(../imagenes/controlsSprite.png) no-repeat 0 0;*/
  background-color: #C00;
  background-repeat: no-repeat;
  background-position: 0 0;

  /* change arrows size here */
  width: 45px;
  height: 90px;
  
  top:50%;
  margin-top:-45px; 
  
  cursor: pointer;
  display: block;
  position: absolute;   
  
  z-index:25;
  
}
.royalSlider .arrow:hover {
  
}
.royalSlider .arrow.disabled {
  
}
/* left arrow */
.royalSlider .arrow.left {
  background-position: top left;
  left: 0;  
}
/* right arrow */
.royalSlider .arrow.right {
  background-position: top right;
  right: 0;
}




/* Control navigation container (bullets or thumbs) */
.royalSlider .royalControlNavOverflow {
  width:100%;
  overflow:hidden;
  position:absolute;
  margin-top:-20px;
  z-index:25;
}
/* This container is inside ".royalControlNavContainer"  
   and is used for auto horizontal centering */
.royalSlider .royalControlNavCenterer { 
  float: left;
  position: relative;
  left: -50%;
}
/* Control navigation container*/ 
.royalSlider .royalControlNavContainer {
  float: left;
  position: relative;
  left: 50%;  
}


/* Scrollable thumbnails containers */
.royalSlider .royalControlNavThumbsContainer {    
  left:0;
  position:relative;
}
.royalSlider .thumbsAndArrowsContainer {
  overflow:hidden;
  width: 100%;
  position: relative;
}
.royalSlider .royalControlNavOverflow.royalThumbs { 
  width: auto;
  position: relative;
  overflow: hidden;
  margin-top:4px; 
}






/* 

  Control navigation (bullets, thumbnails)
  
*/
.royalSlider .royalControlNavOverflow a{  
  background:#0C0 none no-repeat scroll 0 0;
  
  width:20px;
  height:20px;  
  
  float:left; 
  cursor:pointer; 
  
  position:relative;
  display:block;
  
  text-indent: -9999px; 
}
/* Current control navigation item */
.royalSlider .royalControlNavOverflow a.current { 
  background-color: #C00; 
}
/* Hover state navigation item */
.royalSlider .royalControlNavOverflow a:hover { 
  background-color: #00C;
}

/* Thumbnails */
.royalSlider .royalControlNavOverflow a.royalThumb{ 
  /*background: none no-repeat 0 0;*/
  /*background-color: ;*/
  width:144px;
  height:60px;  
  /* thumbnails spacing, use margin-right only */ 
  margin-right:4px;
  
}
.royalSlider .royalControlNavOverflow a.royalThumb.current {  
  background-position: -3px -3px  !important;
  border:3px solid #C00 !important;
  width:138px;
  height:54px;
}
.royalSlider .royalControlNavOverflow a.royalThumb:hover {  
  background-position: -3px -3px; 
  border:3px solid #00C;
  width:138px;
  height:54px;
}



/* 

  Thumbnails navigation arrows 
  
*/
.royalSlider .thumbsArrow { 
  width: 38px;
  height: 68px; 
  
  cursor: pointer;
  display: block;
  position: relative;   
  z-index: 25;
  
  background: #C99;
  
}
.royalSlider .thumbsArrow.left {  
  float: left;
}
.royalSlider .thumbsArrow.right { 
  float: right;
}
.royalSlider .thumbsArrow:hover  {
  
}
.royalSlider .thumbsArrow.disabled {
  
}






/* Captions container */
.royalSlider .royalCaption {
  z-index:20;
  display:block;
  position:absolute;  
  left:0;
  top:0;
  /*font: normal normal normal 1em/1.5em Georgia, serif;
  color:#FFF;   */
}
/* Caption item */
.royalSlider .royalCaptionItem {
  position:absolute;  
  left:0;
  top:0;
  margin: 0;
  padding: 0;
}



/* Loading (welcome) screen */
.royalSlider .royalLoadingScreen {
  background:#FFF;
  width:100%;
  height:100%;
  position:absolute;
  z-index:99; 
}
/* Loading screen text ("Loading...") */
.royalSlider .royalLoadingScreen p {    
  width:100%;
  position:absolute;  
  margin:0 auto;
  top: 45%;
  text-align:center;
}

/* single slide image preloader */
.royalSlider .royalPreloader {  
  position:absolute;
  width:24px;
  height:24px;
  left:50%;
  top:50%;
  margin-left:-12px;
  margin-top:-12px; 
  z-index:0;  
  background-image:url(../imagenes/preloader.gif);
}






.royalSlider .grab-cursor{cursor:move;}
//.royalSlider .grab-cursor{cursor:url("cursors/grab.png") 8 8,-moz-grab;}
.royalSlider .grab-cursor{cursor:auto;}
.royalSlider .grab-cursor{*cursor:url("cursors/grab.cur");}
.royalSlider .grab-cursor{cursor:move\0/;} /* ie8 hack */

.royalSlider .grabbing-cursor{cursor:move;}
.royalSlider .grabbing-cursor{cursor:url("cursors/grabbing.png") 8 8,-moz-grabbing;}
.royalSlider .grabbing-cursor{*cursor:url("cursors/grabbing.cur");}


/* Cursor used if mouse dragging is disabled */
.royalSlider .auto-cursor{cursor:auto;}

.royalSlider .royalHtmlContent {
  position: absolute;
  top: 0;
  left: 0;
}
.royalSlider .non-draggable {
  cursor: auto;
}
.royalSlider .fade-container .royalSlide{
  position: absolute;
  left: 0;
  top: 0;
  list-style-type: none;
  margin: 0;
  padding: 0;
  z-index: 10;
}
.royalSlider .royalImage {
  max-width:none;
  margin:0;
  padding: 0 !important;
  border: 0 !important; 
}

/*li.royalItem
{
  float:left;
  width:235px;
  height:227px;
  list-style-type:none;
  list-style-image:none;
}*/