html {
       margin: 0;
       /* setting border: 0 hoses ie6 win window inner well border */
       padding: 0;
       height: 100%;
       }

body {
       font: 62.5% "lucida grande", Tahoma, Verdana, Arial, Helvetica, sans-serif; /* Resets 1em to 10px */
       color: #222 !important;
       background: #FFF;
       text-align: center;
       margin: 0 0 30px;
       overflow: hidden;
       z-index: 1;
       }

img {
      border: none;
      }

a {
    outline: 0;
    moz-outline: none;
    }

div#tabs {
           width: 100%;
           height: 20px;
           line-height: 20px;
           margin: 0;
           background: #222;
           position: fixed;
           left: 0;
           right: 0;
           top: 0;
           /*border-bottom: 1px solid #888;*/
           z-index: 4;
           moz-user-select: none;
           -webkit-user-select: none;
           -webkit-box-shadow:0 1px 3px #666;
           }

div#tabs ul {
	float: left;
	margin: 0;
	padding: 0 7px;
	text-align: center;
}

div#tabs > ul li a { color:#fff; }

div#tabs > ul li {
                   list-style-type: none;
                   list-style-image: none;
                   float: left;
                   padding: 0;
                   margin: 0 0 0 0;
                   margin-right: 10px;
                   vertical-align: middle;
                   height: inherit;
                   color: #eee;
                   outline: none;
                   text-decoration: none;
                   cursor: pointer;
                   }

div#tabs > span {
                  color: #eee;
                  float: right;
                  padding-right: 10px;
                  cursor: pointer;
                  }

div#cal {
          position: fixed;
          left: 10px;
          right: 10px;
          top: 20px;
          height: 0px;
          z-index: 2;
          overflow: hidden;
          }

div#cal div.datepicker {
                         position: absolute;
                         right: 30px;
                         bottom: 0;
                         }

div#view {
           position: fixed;
           top: 20px;
           bottom: 20px;
           right: 0px;
           left: 0px;
           background: #DDD;
           padding: 0px;
           margin: 0px;
           overflow: auto;
           z-index: 1;
           -webkit-box-shadow:0 1px 3px #666;
           }

div#stat {
           width: 100%;
           height: 20px;
           line-height: 20px;
           margin: 0;
           padding: 0;
           border-top: 1px solid #555;
           background: #aaa  left bottom repeat-x;
           position: fixed;
           left: 0px;
           right: 0px;
           bottom: 0;
           z-index: 0;
           color: #000;
           text-shadow: 0 1px 0 #ccc;
           }

div#graph { 
            white-space: nowrap;
            visibility: no-scroll;
            overflow: hidden;
            }

div#diagram {
              position: relative;
              float: left;
              width: 90%;
              height: 100%;
              }

div#legend {
             position: relative;
             padding: 20px;
             float: right;
             width: 4%;
             margin-right: 20px;
             margin-left: -60px;
             height: 100%;
             vertical-align: middle;
             text-align: left;
             line-height: 16px;
             }

div#legend > #title {
                      font-weight: bold;
                      margin: 10px;
                     }

div#legend > div{
                  cursor: pointer;
                  font-weight: normal;
                  }
div#legend > div.hover{
                        font-weight: bold;
                        }

div#legend > div > div#mark {
                              float: left;
                              width: 8px;
                              height: 8px;
                              margin: 4px;
                              margin-bottom: 2px;
                              border: solid #222 1px;
                              background: #aaa;
                              }
div#legend > div.hover > div#mark {
                                    width: 10px;
                                    height: 10px;
                                    margin: 3px;
                                    margin-bottom: 1px;
                                    }
div.datepicker {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	cursor: default;
	display: none;
}
.datepickerContainer {
	background: #121212;
	position: absolute;
	top: 0px;
	left: 0px;
                       border: solid 10px #121212;
                       -moz-border-radius: 0px 0px 10px 10px;
                       -webkit-border-radius: 0px 0px 10px 10px;
                       -webkit-box-shadow:0 1px 3px #666;
}
.datepickerBorderT { display:none; }
.datepickerBorderB { height: 20px; }
.datepickerBorderL { display:none; }
.datepickerBorderR { display:none; }
.datepickerBorderTL { display:none; }
.datepickerBorderTR { display:none; }
.datepickerBorderBL { display:none; }
.datepickerBorderBR { display:none; }
.datepickerHidden { display: none; }
div.datepicker table {
	border-collapse:collapse;
}
div.datepicker a {
	color: #eee;
	text-decoration: none;
	cursor: default;
	outline: none;
}
div.datepicker table td {
	text-align: right;
	padding: 0;
	margin: 0;
}
div.datepicker th {
	text-align: center;
	color: #999;
	font-weight: normal;
}
div.datepicker tbody th {
	text-align: left;
}
div.datepicker tbody a {
	display: block;
}
.datepickerDays a {
	width: 20px;
	line-height: 16px;
	height: 16px;
	padding-right: 2px;
}
.datepickerYears a,
.datepickerMonths a{
	width: 44px;
	line-height: 36px;
	height: 36px;
	text-align: center;
}
td.datepickerNotInMonth a {
	color: #666;
}
tbody.datepickerDays td.datepickerSelected{
                                            -moz-border-radius:10px;
                                            -webkit-border-radius:10px;
	background: #136A9F;
}
tbody.datepickerDays td.datepickerNotInMonth.datepickerSelected {
	background: #17384d;
}
tbody.datepickerYears td.datepickerSelected,
tbody.datepickerMonths td.datepickerSelected{
	background: #17384d;
}
div.datepicker a:hover,
div.datepicker a:hover {
	color: #88c5eb;
}
div.datepicker td.datepickerNotInMonth a:hover {
	color: #999;
}
div.datepicker tbody th {
	text-align: left;
}
.datepickerSpace div {
	width: 20px;
}
.datepickerGoNext a,
.datepickerGoPrev a,
.datepickerMonth a {
	text-align: center;
	height: 20px;
	line-height: 20px;
}
.datepickerGoNext a {
	float: right;
	width: 20px;
}
.datepickerGoPrev a {
	float: left;
	width: 20px;
}
table.datepickerViewDays tbody.datepickerMonths,
table.datepickerViewDays tbody.datepickerYears {
	display: none;
}
table.datepickerViewMonths tbody.datepickerDays,
table.datepickerViewMonths tbody.datepickerYears,
table.datepickerViewMonths tr.datepickerDoW {
	display: none;
}
table.datepickerViewYears tbody.datepickerDays,
table.datepickerViewYears tbody.datepickerMonths,
table.datepickerViewYears tr.datepickerDoW {
	display: none;
}
td.datepickerDisabled a,
td.datepickerDisabled.datepickerNotInMonth a{
	color: #333;
}
td.datepickerDisabled a:hover {
	color: #333;
}
td.datepickerSpecial a {
	background: #700;
}
td.datepickerSpecial.datepickerSelected a {
	background: #a00;
}