/*
   Slider CSS, style as you please.
   The png images used for this demo were originally located at http://www.schillmania.com/

   Styles for the horizontal slider */
.fd-slider
        {
        position:relative;
        width: 120px;
        height:20px;
        text-align:center;
        }
.fd-slider-inner
        {
        position:relative;
        height:18px;
        text-align:left;
        background:#fcfcfc;
        border:1px solid #ccc;
        -moz-user-focus:normal;
        -moz-user-select:none;
        voice-family: "\"}\"";
        voice-family: inherit;
        height:20px;
        }
.fd-slider-bar
        {
        position:relative;
        height:4px;
        border:1px solid #bbb;
        border-bottom:1px solid #aaa;
        border-right:1px solid #aaa;
        background:#ddd;
        margin:0;
        overflow:hidden;
        line-height:4px;
        -moz-user-select:none;
        voice-family: "\"}\"";
        voice-family: inherit;
        height:2px;
        }
html>body .fd-slider-bar
        {
        height:2px;
        }
/* Styles for the vertical slider */
.fd-slider-vertical
        {
        position:relative;
        width:20px;
        height:100%;
        text-align:center;
        }
.fd-slider-vertical .fd-slider-inner
        {
        position:relative;
        width:18px;
        height:100%;
        text-align:left;
        background:#fcfcfc;
        border:1px solid #ccc;
        -moz-user-focus:normal;
        -moz-user-select:none;
        voice-family: "\"}\"";
        voice-family: inherit;
        width:20px;
        }
html>body .fd-slider-vertical .fd-slider-inner
        {
        width:20px;
        }
.fd-slider-vertical .fd-slider-bar
        {
        position:relative;
        width:4px;
        border:1px solid #bbb;
        border-bottom:1px solid #aaa;
        border-right:1px solid #aaa;
        background:#ddd;
        margin:0;
        padding:0;
        overflow:hidden;
        line-height:4px;
        -moz-user-select:none;
        voice-family: "\"}\"";
        voice-family: inherit;
        width:2px;
        }
html>body .fd-slider-vertical .fd-slider-bar
        {
        width:2px;
        }
/* CSS common to both vertical and horizontal sliders */
.fd-slider-inner:focus,
.focused
        {
        background:#eee !important;
        border:1px solid #aaa !important;
        }
.fd-slider-handle
        {
        position:absolute;
        top:0;
        left:0;
        width:20px;
        height:20px;
        background:transparent url(../images/slider.png) no-repeat 0px 0px !important;
        background:none;
        -moz-user-select:none;
        }
.fd-slider-hover
        {
        background:transparent url(../images/slider-1.png) no-repeat 0px 0px !important;
        background:none;
        }
.extraclass
        {
        float: left;
		margin-right: 4px;
        }