@CHARSET "UTF-8";

/*  
 RoyalSlider
 */
.royalSlider {  
    position:relative;
    /* set width and height of slider here, in px, % or em*/
    width:320px;
    height:192px;
    margin:0 auto;
    /* Used to prevent content "jumping" on page load. this property is removed when javascript is loaded and slider is instanciated */
    overflow:hidden;
}

/**
*  Slides area (set background here)
*/

.royalSlider .royalWrapper {
    overflow:hidden;    
    position:relative;
    width:100%; 
    height:100%;
}
.royalSlider .royalSlide,
.royalSlider .royalWrapper {
    /* Bakground behind slides */
    background: #111111; 
    background: -moz-linear-gradient(top, #111111 0%, #242424 100%);    
    background: -webkit-linear-gradient(top, #111111 0%,#242424 100%); 
    background: -o-linear-gradient(top, #111111 0%,#242424 100%);
    background: -ms-linear-gradient(top, #111111 0%,#242424 100%);  
    background: linear-gradient(top, #111111 0%,#242424 100%);
}
/* slides holder, grabbing container */
.royalSlider .royalSlidesContainer {
    position: relative;
    left: 0;
    top: 0 !important;
    list-style:none !important;
    margin:0 !important;
    padding:0 !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(../img/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 {
    display:none;
}
/* 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;
}


/* 

    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(../img/preloader.gif);
}

.royalSlider .grab-cursor{cursor:move;}
.royalSlider .grab-cursor{cursor:url("/themes/images/download/android_vip_en/grab.png") 8 8,-moz-grab;}
.royalSlider .grab-cursor{*cursor:url(/themes/images/download/android_vip_en/grab.cur);}
.royalSlider .grab-cursor{cursor:move\0/;} /* ie8 hack */

.royalSlider .grabbing-cursor{cursor:move;}
.royalSlider .grabbing-cursor{cursor:url("/themes/images/download/android_vip_en/grabbing.png") 8 8,-moz-grabbing;}
.royalSlider .grabbing-cursor{*cursor:url(/themes/images/download/android_vip_en/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;   
}
.royalSlider .royalImage2 {
    max-width:none;
    margin:0;
    padding: 0 !important;
    border: 0 !important;   
}
/* Slider itself */
.royalSlider.default {  
    
}
/* Slider with thumbs (used to add padding based on thumbnails size)*/
.royalSlider.default.with-thumbs {
    padding-bottom: 68px;
}

/* 
    Left and right navigation arrows    
*/
.royalSlider.default .arrow
{   
    background: rgb(50, 50, 50);
    background: rgba(0, 0, 0, 0.5);
    
    background-image:url(/themes/images/download/android_vip_en/controls-sprite.png);

    /* change arrows size here */
    width: 30px;
    height: 30px;
    margin-top:-15px;   
    
    -moz-border-radius: 4px; 
    -webkit-border-radius: 4px; 
    border-radius: 4px;
    
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    filter: alpha(opacity=80);
    -moz-opacity: 0.8;
    -khtml-opacity: 0.8;
    opacity: 0.8;   
}
/* arrow position in slider with thumbs */
.royalSlider.default.with-thumbs .arrow {
    margin-top:-49px;
}
/* Arrow down state */
.royalSlider.default .arrow:active {    
    background-color: rgba(0,0,0,0.6);
}
/* Arrow hover state */
.royalSlider.default .arrow:hover {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity: 1; 
}
/* Arrow disabled state */
.royalSlider.default .arrow.disabled {  
    background-color: rgba(0,0,0,0.5) !important;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)" !important;
    filter: alpha(opacity=20) !important;
    -moz-opacity: 0.2;
    -khtml-opacity: 0.2;
    opacity: 0.2;   
}
/* left arrow */
.royalSlider.default .arrow.left {
    background-position: top left;
    left: 5px;  
}
/* right arrow */
.royalSlider.default .arrow.right {
    background-position: top right;
    right: 5px;
}




/* Bullets nav sub-container */
.royalSlider.default .royalControlNavCenterer { 
    padding:3px 5px;
    
    background: rgb(50, 50, 50);    
    background: rgba(0,0,0,0.5);
    
    -moz-border-radius: 4px; 
    -webkit-border-radius: 4px; 
    border-radius: 4px;
}
/* Bullets nav or thumbnails main container */


/* 
    Thumbnails navigation arrows    
*/
.royalSlider.default .thumbsArrow {
    background:url(controls-sprite.png) no-repeat 0 0;
    width: 28px;
    height: 68px;   
    
    
    -moz-opacity: 0.8;  
    opacity: 0.8;   
}
.royalSlider.default .thumbsArrow.left {
    background-position: -116px -132px;
    left: 0;    
}
.royalSlider.default .thumbsArrow.right {
    background-position: -156px -132px;
    right: 0
}
.royalSlider.default .thumbsArrow:hover  {  
    -moz-opacity: 1;    
    opacity: 1; 
}
.royalSlider.default .thumbsArrow.disabled {    
    -moz-opacity: 1;    
    opacity: 1; 
}
.royalSlider.default .thumbsArrow.left.disabled {   
    background-position: -36px -132px;
}
.royalSlider.default .thumbsArrow.right.disabled {  
    background-position: -76px -132px;
}