@charset "utf-8";
/* CSS Document */

<style type="text/css" media="screen">
/* (DEMO ONLY) The dynamically created div that changes colour */
#colorBox
        {
        float:left;
        clear:both;
        width:20.5em;
        height:1em;
        border:1px solid #ccc;
        border-top:1px solid #888;
        border-left:1px solid #888;
        margin-left:5em;
        }
/* (DEMO ONLY) The dynamically created div that holds the hexadecimal colour value */
#hexValue
        {
        float:left;
        width:5em;
        margin-left:0.2em;
        color:#222;
        font-family:'andale mono','lucida console','courier new',monospace;
        }
/* (DEMO ONLY) The div used to wrap the vertical slider */
#verticalWrapper
        {
        height:255px;
        text-align:left;
        position:relative;
        margin:0;
        }
/* (DEMO ONLY) An extra class that floats the vertical slider left for the demo */
.verticalclass
        {
        float:left;
        margin-right:4px;
        height:255px;
        }
/* (DEMO ONLY) An extra class that floats & sizes the horizontal sliders for the demo */
div.extraclass
        {
        width:20.6em;
        float:left;
        }
/* (DEMO ONLY) Extra styling for the black sliders targeted using their parent fieldset's id */
#bswrap .fd-slider-vertical
        {
        float:left;
        height:150px;
        margin-right:4px;
        }
#bswrap .fd-slider-vertical .fd-slider-inner
        {
        background:#202020;
        border-color:#1c1c1c;
        }
#bswrap .fd-slider-vertical .fd-slider-bar
        {
        background:#111;
        border-color:#111 #2c2c2c #2c2c2c #111;
        }
#bswrap
        {
        background:#222;
        border:3px double #333;
        -moz-border-radius:0;
        color:#ccc;
        }
#bswrap code
        {
        color:#ccc;
        }
#bswrap .fd-slider:focus .fd-slider-inner,
#bswrap .fd-slider-vertical:focus .fd-slider-inner,
#bswrap .focused .fd-slider-inner
        {
        background:#202020 !important;
        border-color:#000 !important;
        }
#selectTestLabel, .mt
        {
        margin-top:1em;
        }
/* Generic CSS used for the demo */

kbd
        {
        background-color:#eeeeee;
        padding:2px;
        border:1px solid #dddddd;
        border-bottom-color:#999999;
        border-left-color:#999999;
        }
kbd, code
        {
        font-family:'andale mono','lucida console','courier new',monospace;
        font-size:1em;
        }
#article-wrapper
        {
        text-align:center;
        border:3px double #ccc;
        background:#fcfcfc;
        width:800px;
        margin:2em auto;
        padding:1em;
        }
fieldset
        {
        margin:0;
        padding:1em;
        text-align:left;
        }
form > fieldset
        {
        border:1px solid #ccc;
        }
form
        {
        margin:0 auto 1.4em 0;
        padding:0;
        text-align:center;
        margin:0 auto;
        }
dl,dt,dd
        {
        margin:0;
        padding:0;
        text-align:left;
        }
dt
        {
        width:5em;
        float:left;
        clear:left;
        padding:0 0 4px 0;
        }
dd
        {
        margin-left:5em;
        padding-bottom:4px;
        }
code
        {
        font-family:'andale mono', 'lucida console', 'courier new', monospace;
        font-size:12px;
        color:#222;
        }

</style>
<!--[if lte IE 6]>
<link rel="stylesheet" type="text/css" media="screen, projection" href="ie.css" />
<style type="text/css">
/* Beat the IE double float margin bug */
#colorBox
        {
        margin-left:2.5em;
        }
</style>
<![endif]-->

