﻿BODY, DIV, TABLE, TD, P {font-family:verdana,arial,helvetica,sans-serif;}

img {border:0;}

td {
	vertical-align:top;
	}

.inline {display:inline;}

.hide {display:none;}

.small {
	font-size:9px;}


h1 {
	font-weight:normal;
	font-size:25px;
	color:#575447;
	margin-bottom:10px;
	}

h2 {
	font: normal 20px Georgia;
	line-height:20px;
	margin-top:20px;
	margin-bottom:10px;
	display:block;
	}

.page h3 {
	font: normal 16px Georgia;
	line-height:20px;
	margin-bottom:10px;
	}

.x {
	clear:both;
	font-size:1px;
	height:1px;
	line-height:1px;
	margin-bottom:-1px;
	overflow:hidden;
	visibility:hidden;
	width:1px;
}


.nopad {padding:0 !important;}

.bullets {
	margin:1em 15px;
  }

.bullets li {
    margin:0;
    padding:0;
    line-height:15px;
    margin-left:15px;
    list-style-type:disc;
    padding:5px 0;
    }


.page {
	padding:30px;
	padding-top:5em;
	line-height:20px;
	font-size:1.2em;
	}
	

a:link, a:visited {
	color:#003466;
	}

.link {
	color:#003466;
	text-decoration:underline;
	cursor:pointer;
	}

.linkoff {
	color:#666;
	text-decoration:none;
	cursor:auto;
	}


.form td.l, form td.r {
	padding:4px;
	}

.form td.l {
	padding-right:10px;
	border-right:1px solid #ccc;
	color:#000;
	font-size:12px;
	}

	.form td.l em {
		color:#c00;
		font-size:10px;
		position:relative; top:-0.6em; left:0;
	}


	
#powered {
	text-align:right;
	padding-right:15px;
	padding-top:30px;
	}
				
			
.red {color:#c00;}
.b {font-weight:bold;}
.green {color:#090;}


/*
	...................................
	=Simple Chart
	
	The arrow is 7 x 20
	...................................
*/

.simplechart {
    width: 620px;
    height:200px;
    position:relative;
    border:2px solid #000;
    }
    
    .simplechart .bar {
        width:450px;
        height:40px;
        background: #ffd100 url(images/bar.jpg) repeat-y 0 0;
        position:relative;
        top:80px;
        left:80px;
        border:1px solid #000;
        }
        
    .simplechart .avgbar {
        background-color:#000;
        width:15px;
        height:100%;
        }

    .scbox {
        /*background-color:#ffd100;*/
        /*border:1px solid #000;*/
        height:40px;
        padding:1px 6px;
        position:absolute;
        line-height:20px;
        color:#000;
        white-space:nowrap;
        text-align:center;
        width:109px;
        }
        
        .scbox span {
			display:block;
			font-size:11px;
			}
        
        .scbox img {
            position:absolute;
            }
            
        .max, .avg, .min {
            top: 60px;	/* bar height + arrow height */
            background: transparent url(images/labelDY.gif) no-repeat 0 0;
            }
            
        .max img, .avg img, .min img {
            top:-20px;
        }
                
        .scbox img  {
            left:55px;
            }
        
        .user img 
        {
        	top:40px;
        	left:71px !important;
        }
        
        .max {
            left:391px; /* -59 + width */
            }
            
        .min {
            left:-59px;
            }
            
        .user {
            top:-61px; /* scbox height + arrow */
            background: transparent url(images/labelLY.gif) no-repeat 0 0;
            width:141px;
            }
            
            
	.deptbar {
		/*display:inline;*/
		background-color:#0c0;
		color:#fff;
		font-weight:bold;
		padding-left:5px;
		}
		
	.deptbar.userdept {
		background-color:#00c;
	}
	
#reghelp {
	border-left:1px solid #ccc;
	padding-left:30px;
	width:200px;
	color:#444;
}

#reghelp h2, #reghelp h3 {
	color:#827654;
	}
	
.schart td {
	text-align:right;
}
.schart .end span {
	display:block;
	font-size:10px;
	}

.schart .graph, .schart .mark {
	position:relative;
	color:#00c;
	}

.schart .graph img {
	border:1px solid #000;
}
.schart .mark {
	width:100%;
	}
.schart .graph {
	width:45px;
	}

.schart .graph .avgmrk {
	border:0;
	position:absolute;
	right:1px;
	}
	
.schart .mark .v {
	background:transparent url(images/arrowr.gif) no-repeat right 7px;
	padding-right:30px;
	position:absolute;
	right:0;
	width:150px;
	}
	
.schart .mark .v span {display:block;}


	
.dchart td {
	text-align:left;
}
.dchart .end span, .mark .v span {
	display:block;
	font-size:10px;
	}

.dchart .graph, .dchart .mark {
	color:#00c;
	}

.rel {position:relative;width:100%;height:100%;}

.dchart .graph img {
	border:1px solid #000;
}
.dchart .mark {
	width:100%;
	}
.dchart .graph {
	width:45px;
	
	}

.dchart .graph .avgmrk {
	border:0;
	position:absolute;
	left:1px;
	}
	
.dchart .mark .v {
	
	padding-left:30px;
	position:absolute;
	left:0;
	width:150px;
	background:transparent url(images/arrowl.gif) no-repeat left 7px;
	}
	
.dchart .mark.btm .v {
	background-position: left 28px;
	}
	
.schart .mark.btm .v {
	background-position: right 28px;
	}
	
.dchart .mark .v span {display:block;}

#chartside {
	border-left:1px solid #ccc;
	padding-left:20px;
	width:175px;
	color:#444;
}

#chartside h2, #chartside h3 {
	color:#827654;
	}
	
/*
	...................................
	=Admin
	...................................
*/

#impersonate {
	background-color:#ffcc52;
	border:1px solid #e68c00;
	position:fixed;
	bottom:0;
	padding:10px;
	width:600px;
	color:#000;
	margin-left:-300px;
}

#impersonate input {
	position:absolute;
	right:20px;
	width:120px;
	border:1px solid #e68c00;
	background-color:#fff6ce;
	}