/* Slider itself */
/* 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(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 and thumbnails navigation	
*/
.royalSlider.default .royalControlNavOverflow a {
    background-color: transparent;
    background-image: url(controls-sprite.png);
    background-position: 0 -164px;
    width: 18px;
    height: 18px;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    filter: alpha(opacity=80);
    -moz-opacity: 0.8;
    -khtml-opacity: 0.8;
    opacity: 0.8
    }
/* Current bullet */
.royalSlider.default .royalControlNavOverflow a.current {
    background-position: 0 -182px !important
    }
/* Bullet hover state */
.royalSlider.default .royalControlNavOverflow a:hover {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity: 1
    }
/* 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 */
.royalSlider.default .royalControlNavOverflow {
    margin-top: -30px
    }
/* Thumbnails main container */
.royalSlider.default .royalControlNavOverflow.royalThumbs {
    margin-top: 4px
    }
/* Thumbnails */
.royalSlider.default .royalControlNavOverflow a.royalThumb {
    background-color: transparent;
    background-position: 0 0;
    width: 60px;
    height: 60px;
    /* thumbnails spacing, use margin-right only */
    margin-right: 4px;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity: 1
    }
/* Current thumbnail */
.royalSlider.default .royalControlNavOverflow a.royalThumb.current {
    background-position: -3px -3px !important;
    border: 3px solid #666 !important;
    width: 54px;
    height: 54px
    }
/* Thumbnail hover state*/
.royalSlider.default .royalControlNavOverflow a.royalThumb:hover {
    background-position: -3px -3px;
    border: 3px solid #AAA;
    width: 54px;
    height: 54px
    }
/* 
	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
    }