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

p { clear:both; }
fieldset { border:0; margin-top: 0.5em;}	
label { margin:0; font-weight: normal;}
	
#slider1, #slider2 { margin:0; padding:0; border:0; }

/* slider widget */

.sliderControl { position: relative;  height: 32px; clear: both; margin-top: 10px; }
.sliderIndicator {width:38px; height:32px; top: 0px; z-index: 3; background:url(../images/slider_pull.gif) no-repeat center bottom; position: absolute;}
.sliderIndicator span {display: block; font-size: 10px; color: #999999; background-color:#ffffff; border: 1px solid #dddddd; padding: 2px; padding-top: 0px; height: 10px; text-align:center; }

.xScale {left: 18px; top: 30px; z-index: 1; }
.xScale, .xScale * {margin: 0; padding: 0; position: relative;}
.xScale dd, .xScale li {position: absolute; top: 0; text-align: left; list-style: none; font-size:1em; }
.xScale span {position: absolute; top: .5em; font-size: 9px; font-weight: normal;}
.xScale dd.od, .xScale li.morning {color: #999999; border-top: 4px solid #eeeeee;}
.xScale dd.do, .xScale li.evening {color: #999999; border-top: 4px solid #eeeeee;}
.xScale dt {position: absolute; top: 2em; color: #999999; text-transform: uppercase; font-size: .7em;}
.xScale dt.od {left: 0; color: #69a535;}
.xScale dt.do {right: 36px; color: #eeeeee;}
div.sliderSpan {position: absolute; z-index: 0; top: 18px; left: 18px; height: 6px; overflow: hidden; width: 500px; background-color: #FF0000; center no-repeat;}
div.blotA, div.blotB {position: absolute; left: 0; width: 0;  z-index: 99999; top: 0; border-top: 15px solid #fff; }
div.scale {display: block; position: absolute; left: 18px; top: 27px; z-index: 2; border-bottom: 1px solid #cccccc; height: 3px;}
div.scale span {position: absolute; border-right: 1px solid #cccccc; height: 3px; top: 4px; font-size: 0; line-height: 0;}
p.caption {font-size: 1em; font-style: italic; margin-top: 6em;}