body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: small;
	margin: 2px;
	padding: 0px;
	background-image: url(../images/bg.gif);
}

/*--------------------------- Container ---------------------------*/
#container {
	width:990px;
	background-image: url(../images/bg_container.gif);
	margin-right: auto;
	margin-left: auto;
}


/*---------------------------- Header ----------------------------*/
#header {
	height: 80px;			
	background: #ffffff;
	margin: 0px 5px 0px 5px;
}

#top_menu {
	background: #ffffff;
	background-image: url(../images/bg_top_menu.jpg);
	background-repeat: repeat-y;
	text-align: right;
	margin: 0px 5px 0px 5px;
	padding: 2px;
}

#top_menu a {
	text-decoration:none;
}

#top_menu a:hover {
	text-decoration:underline;
	color: #FF0000;
}

#top_menu_loginid {
	color: #0000FF;
	font-weight: bold;	
	font-size: 80%;
}


/*------------------------------------- Footer -----------------------------------*/
#footer {
	font-size: 80%;
	clear: both;
	padding: 10px;
	text-align: center;
	margin: 5px 5px 5px 5px;
	color: #ccc;
}

#footer a {
	color: #fff;
	text-decoration:none;
}

#footer a:hover {
	text-decoration:underline;
}

#footer #power {
	margin-top:5px;
}

#footer #power_common {
	background: #fff; 
	padding: 1px; 
	font-family: Verdana,Arial,Helvetica; 
	font-size: smaller; 
	font-variant: small-caps; 
	border: 1px solid #aaa;
}

#footer #power_left {
	color: #f8f8f8; 
	background: #c00; 
	padding: 0px 2px;
}

#footer #power_right {
	 color: #f8f8f8; 
	 background: #999; 
	 padding: 0px 10px 0px 2px;
}



/*------------------------------- Main --------------------------------*/
#main {
	width: 980px;
	background-color: #ffffff;
	margin-top: 5px;
	margin-left: 5px;
	margin-right: 5px;
	position: relative;
}



/*------------------------------- Left menu -------------------------------*/
#left_menu {
	float:left;
	width: 200px;
	margin-top: -15px;
}

#left_menu ol ul { 
	margin-left:0px;
}

.leftmenuframe {
	border-color:#80D36B;
	border-style: solid;
	border-width:2px;
	background-image: url(../images/bg_left_menu.gif);
	width:180px;
	margin-left:5px;
}

a img {
	border: none;
	margin-bottom: -3px;
}

.leftmenutitle {
	text-align:left;
	font-size: 120%;
	font-weight: bold;
	color: #ffffff;
	padding:2px 2px 2px 5px;
	background-image: url(../images/bg_left_menu.gif);
}

.leftmenuitem {
	background-color: #D8EED3;
	text-align:left;
	font-weight: bold;
	padding:2px 2px 5px 5px;
}

.leftmenuitem a:hover {
	color: #FF0000;
}

.leftmenuitem a {
	text-decoration: none;
	color: #0000ff;
}



.leftmenulast {
	border-bottom-style: solid; 
	border-width:1px;
	border-color:#80D36B;
	padding-bottom: 15px;
}		

/*------------------------------ Rounded corner ---------------------------------*/
.roundtop { 
	background: url(../images/bg_container_rt.gif) no-repeat top right; 
}

.roundbottom {
	background: url(../images/bg_container_rb.gif) no-repeat top right;
	text-align:left; 
}

img.corner {
   width: 6px;
   height: 6px;
   border: none;
   display: block !important;
}


/*------------------------------ Content -------------------------------*/
#right_content {
	width: 780px;
	float: right;
	margin-top: -15px;
	margin-bottom: 10px;
}

#page_title {
	font-size: 200%;
	font-weight: bold;
	padding-top: 10px;
	color: #F99E00;
}

.title_hr {
	margin-top: 0px;
	*margin-top: -25px;
}

.content {
	margin-top:10px;
	*margin-top:-20px;
	position: relative;
}

.mainmenuframe {
	border-color:#2F7DB9;
	border-style: solid;
	border-width:2px;
	background-image: url(../images/bg_bluebox.gif);
	width:220px;
	margin-bottom: 20px;
	
}

.mainmenutitle {
	text-align:center;
	font-size: 160%;
	font-weight: bold;
	color: #ffffff;
	padding-left: 5px;
}

.mainmenuitem {
	text-align:left;
	font-size: 140%;
	font-weight: bold;
	padding:2px 2px 5px 20px;	
}

.mainmenuitem a img {
	border: none;
	margin-bottom: -3px;
}

.mainmenuitem a:hover{
	color: #ff0000;
}

.mainmenuitem a {
	text-decoration: none;
}



/*-------------------------------- Components -----------------------------------*/
.databluebox {
	background-color: #658BFD;
	border-color:#658BFD;
	border-style: solid;
	border-width:2px;	
}

.databluebox .blueboxheader {
	background-color: #658BFD;
	color: #FFFFFF;
	font-weight: bold;
	padding: 3px 0px 5px 5px;


}
.databluebox .blueboxcontent {
	background-color: #FFFFAA;
	padding: 0px 0px 0px 0px;	
}


.datagreenbox {
	background-color: #80D36B;
	border-color:#80D36B;
	border-style: solid;
	border-width:2px;	
}

.datagreenbox .greenboxheader {
	background-color: #80D36B;
	color: #FFFFFF;
	font-weight: bold;
	padding: 3px 0px 5px 5px;
}

.datagreenbox .greenboxcontent {
	background-color: #FFFFAA;
	padding: 0px 0px 0px 0px;	
}


.datagraybox {
	background-color: #888888;
	border-color:#888888;
	border-style: solid;
	border-width:2px;	
}

.datagraybox .grayboxheader {
	background-color: #888888;
	color: #FFFFFF;
	font-weight: bold;
	padding: 3px 0px 5px 5px;
}

.datagraybox .grayboxcontent {
	background-color: #DDDDDD;
	padding: 0px 0px 0px 0px;	
}



.greenboxcell1 {
	background-color: #FFFFAA;
	padding: 3px 0px 3px 3px;
}

.greenboxcell2 {
	background-color: #FFFFFF;
	padding: 3px 0px 3px 3px;
}

.sec_title_green {
	font-weight: bold;
	font-size: 120%;
	color: #00AA00;
	padding: 3px 0px 3px 3px;
}

.highlight {
	background-color: #FF8888;	
}

.highlight1 {
	color: #FF0000;
	font-weight: bold;
}

.highlight2 {
	color: #FF0000;
	font-weight: bold;
	font-size:1.4em;
}

.comment {
	color: #666666;
	font-size: 0.8em;
}

.comment_link {
	color: #0000FF;
	font-size: 0.8em;
}

a:hover.comment_link{
	color: #FF0000;
	font-size: 0.8em;
}

.caution {
	width:32em;
	*width:32em;
	position:relative;
	margin: 30px 0px 10px 5px;
	float:right;
}

.cautionhandle {
	color:#ffffff;
	background-color:#9DB0FE;
	font-size:120%;
	font-weight:bold;
}

.navigator {
	float: left;
	margin: 10px 10px 10px 10px;
	*margin: 10px 10px 10px 5px;
	width: 20em;
}

.boxRemind {
	border: 1px solid #ff0000;
	background-color: #FFD299;
	font-size:1em;
	font-weight: bold;
	color: #ff0000;
	line-height: 1.5em;
	padding: 3px 3px 3px 3px;
}

.greenEmp {
	color: #33AA33;
	font-weight: bold;
}

.blueEmp {
	color: #0000FF;
	font-weight: bold;
}

.redEmp {
	color: #AA3333;	
	font-weight: bold;
}

.greenText {
	color: #33AA33;
}

.blueText {
	color: #0000FF;
}

.redText {
	color: #AA3333;	
}

.dlgSectionTitle {	/* Section title of modal dialogs */
	font-size:1em;
	color: #FF0000;
	font-weight: bold;
}

.dlgInformationBlue {	/* Green information on modal dialogs */
	font-size:1.2em;
	color: #0000FF;
	font-weight: bold;
}



.dlgInformationGreen {	/* Green information on modal dialogs */
	font-size:1em;
	color: #55AA55;
	font-weight: bold;
}

.dlgInformationGray {	/* Red information on modal dialogs */
	font-size:1em;
	color: #888888;
	font-weight: bold;
}

.dlgInformationGray1 {	/* Green information on modal dialogs */
	font-size:1.2em;
	color: #555;
	font-weight: bold;
}

.dlgInformationRed {	/* Red information on modal dialogs */
	font-size:1em;
	color: #FF0000;
	font-weight: bold;
}

.dlgInformationDarkRed {	/* Red information on modal dialogs */
	font-size:1em;
	color: #AA3333;
	font-weight: bold;
}

.dlgAction {
	font-weight: bold;
}

.dlgAction a {
	text-decoration: none;
	color: #0000FF;
}

.dlgAction a:hover {
	color: #FF0000;
}

.inputbox {
	border: 1px solid #BFBFBF;
	font-family: Tahoma ,Verdana, Arial,Helvetica, sans-serif;
	font-size: 1em;
	color: #372D72;
	background-color: #F0F8FF; /*#D7E5F2*/
}

.white_box {
	background-color:#fff;
	border:1px solid #888;
	padding:3px;
}



/* ---------------------------------------- Styles for calendar ------------------------------------------ */
.calToday_desc {
	border:1px solid #000000;
	color: #3333FF;
    width: 25px;
	height: 20px;   
	padding-left: 2px;
	padding-top: 2px;
	font:100% arial;
}

.yui-skin-sam .yui-calendar td.calcell.calHoliday, .yui-skin-sam .yui-calendar td.calHoliday {
    color: #777777;
    background-color: #ffaaaa;
    text-decoration:none;
    cursor: default;
}

.calHoliday_desc {
    color: #777777;
    background-color: #ffaaaa;
    border: 1px solid #AAAAAA;
    width: 25px;
	height: 20px;    
	padding-left: 2px;
	padding-top: 2px;
    font:100% arial;
}

.calSelect_desc {
	background-color:#b3d4ff;
	color:#000;
	border: 1px solid #AAAAAA;
    width: 25px;
	height: 20px;   
	padding-left: 2px;
	padding-top: 2px;
	font:100% arial;
}

.calUnavail_desc {
	color: #AAAAAA;
	border: 1px solid #AAAAAA;	
    width: 25px;
	height: 20px;
	padding-left: 2px;
	padding-top: 2px;
	font:100% arial;
}

.calAvail_desc {
	background-color:#FFFFFF;
	color: #3333FF;
	border: 1px solid #AAAAAA;
    width: 25px;
	height: 20px;   
	padding-left: 2px;
	padding-top: 2px;
	font:100% arial;
}

.yui-skin-sam .yui-calendar td.calcell.calFull{background-color:#FFFF55;}

.calFull_desc {
	background-color:#FFFF55;
	border: 1px solid #AAAAAA;
    width: 25px;
	height: 20px;   
	padding-left: 2px;
	padding-top: 2px;
	font:100% arial;
}

.yui-skin-sam .yui-calendar td.calcell.calRsv{background-color:#BAFCA9;}

.calRsv_desc {
	background-color:#BAFCA9;;
	border: 1px solid #AAAAAA;
    width: 25px;
	height: 20px;   
	padding-left: 2px;
	padding-top: 2px;
	font:100% arial;
}

.dotlinelightblue {
	background: url(../images/dot_lightblue.gif) left top repeat-x;
	height: 1px;
	padding-bottom: 15px;
	margin-top: 10px;	
}

.dotlinegreen {
	background: url(../images/dot_green.gif) left top repeat-x;
	height: 1px;
	padding-bottom: 15px;
	margin-top: 10px;	
}

.dotlineblue {
	background: url(../images/dot_blue.gif) left top repeat-x;
	height: 1px;
	padding-bottom: 15px;
	margin-top: 10px;	
}

.dotlinegray {
	background: url(../images/dot_gray.gif) left top repeat-x;
	height: 1px;
	padding-bottom: 15px;
	margin-top: 10px;	
}

.dotlinered {
	background: url(../images/dot_red.gif) left top repeat-x;
	height: 1px;
	padding-bottom: 15px;
	margin-top: 10px;	
}

/*------------------------------ Styles for schedule ------------------------------------ */
#divScheduleCorner {
	float:left;
	position:relative;
	left:0px;
	top:0px;
	overflow:hidden;
	width:90px;
	height:20px;
	background-color:#ffffff;
	border:0px solid #00ff00;
}

#divScheduleCorner1 {
	 position:absolute;
	 top:5px;
	 left:5px;
	 width:60px;
	 height:15px;
	 text-align:center;
	 font-size:80%;
	 font-weight:bold;
}

#divCourseHeader {
	border:0px solid #0000ff;
	position:relative;
	top:0px;
	overflow:hidden;
	/*min-width:850px;
	width:auto;
	*/
	/*margin-left:15px;*/
	left:5px;
	width:350px;
	height:20px;
	background-color:#ffffff;
}

#divTimeHeader {
	float:left;
	border:0px solid #00ffff;
	float:left;
	position:relative;
	left:0px;
	top:0px;
	overflow:hidden;
	width:90px;
	height:373px;
	background-color:#ffffff;
}

.sdTimeHeader {
	position:absolute;
	text-align:center;
	border:1px solid #EF9360;
	background-color: #FFB380;
	font-weight: bold;
}

.sdCourseHeader {
	position:absolute;
	text-align:center;
	border:1px solid #DF5E7B;
	background-color: #FF8EAB;
	font-weight: bold;
	color: #FFFFFF;
}

.sdCourseHeaderEven {
	position:absolute;
	text-align:center;
	border:1px solid #DF5E7B;
	background-color: #F67898;
	font-weight: bold;
	color: #FFFFFF;
}

.sdSlotDisable {
	position:absolute;
	text-align:center;
	border:1px solid #AAAAAA;
	background-color: #EEEEEE;	
}

.sdSlotDisableEven {		/*Alternative class*/
	position:absolute;
	text-align:center;
	border:1px solid #AAAAAA;
	background-color: #DFDFDF;	
}

.sdSlotAvailable {
	position:absolute;
	text-align:center;
	border:1px solid #AAAAAA;
	background-color: #BAFCA9;
	cursor: pointer;
}

.sdSlotAvailableEven {		/*Alternative class*/
	position:absolute;
	text-align:center;
	border:1px solid #AAAAAA;
	background-color: #A9EB98;
	cursor: pointer;
}

.sdSlotFull {
	position:absolute;
	text-align:center;
	border:1px solid #AAAAAA;
	background-color: #FDFDC8;	
	cursor: pointer;
}

.sdSlotFullEven {			/*Alternative class*/
	position:absolute;
	text-align:center;
	border:1px solid #AAAAAA;
	background-color: #FDFDA8;	
	cursor: pointer;
}

/* ----------------------- Table styles ------------------------- */
	/* --- List table --- */
.greentable table {
	border-collapse:collapse;
	border:1px solid #aaaaaa;
}

.greentable table th {
	background-color:#8adb77;
}

.greentable table .tr_odd td {
	background-color:#ffffff;
}

.greentable table .tr_even td {
	background-color:#fffdcb;
}

table.grayTab {
	background-color:#aaa;
}

table.grayTab th {
	background-color:#ddd;
	padding:2px;
}

table.grayTab td {
	background-color:#fff;
	padding:2px;
}



	/* --- Input table --- */
table.yelTab
{
color:#000000;
background-color:#ffffcc;
font-size: 100%;
padding:0px;
border-top: 1px solid #bbbbbb;
border-left: 1px solid #bbbbbb;
border-bottom: 0px solid #bbbbbb;
border-right: 0px solid #bbbbbb;
}

table.yelTab th, table.yelTab td 
{
padding-bottom:2px;
padding-left: 5px;
border-top: 0px solid #bbbbbb;
border-left: 0px solid #bbbbbb;
border-bottom: 1px solid #bbbbbb;
border-right: 1px solid #bbbbbb;
line-height: 2em;
}

table td.yelTabCont 
{
	background-color:#ffffff;
}

table td.yelTabTool
{
	background-color:#dddddd;
}

table td.yelTabDelCell
{
	background-color:#aaaaaa;
	color: #888888;
}





/* --- Input table --- */
table.yelTab
{
color:#000000;
background-color:#ffffcc;
font-size: 100%;
padding:0px;
border-top: 1px solid #bbbbbb;
border-left: 1px solid #bbbbbb;
border-bottom: 0px solid #bbbbbb;
border-right: 0px solid #bbbbbb;
}

table.yelTab th, table.yelTab td 
{
padding-bottom:2px;
padding-left: 5px;
border-top: 0px solid #bbbbbb;
border-left: 0px solid #bbbbbb;
border-bottom: 1px solid #bbbbbb;
border-right: 1px solid #bbbbbb;
line-height: 2em;
}

table td.yelTabCont 
{
	background-color:#ffffff;
}

table td.yelTabTool
{
	background-color:#dddddd;
}

table td.yelTabDelCell
{
	background-color:#aaaaaa;
	color: #888888;
}


.tbhead {
	color: #0002FF;
	font: normal 14px auto Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	text-align: left;
}

.tb {
	BORDER-RIGHT: #cbd8e3 1px ridge;
	BORDER-TOP: #cbd8e3 1px ridge;
	BORDER-LEFT: #cbd8e3 1px ridge;
	BORDER-BOTTOM: #cbd8e3 ridge;
	background: #FFFFFF;
}

.tborder {
	background-color: #CCCCCC;
	/* background color of table. Old color: #cbd8e3*/
}

.td4 {
	font: normal 12px auto Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	background-color: #F6FFFF; /*#F6FFFF;*/
}

.td6 {
	font: normal 12px auto Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	height: 30px;
	background-color: #FFFFFF;
}

.shift_calendar .maintable {
	margin:5px 10px 10px 30px;
	padding:5px;
	border-collapse:collapse;
	border:1px solid #aaaaaa;
}

.shift_calendar .date {
	width: 100px;
	height: 80px;
	text-align: center;
	background-color: #ffffff;
}

.shift_calendar .title {
	background-color:#338833;
	color:#ffffff;
	height:30px;
	font-size:1.2em;
	text-align:center;
}

.shift_calendar .nosetting {
	color: #888888;	
}

.shift_calendar .has_setting {
	color: #0000ff;
	font-weight: bold;
}

.shift_calendar .dayoff {
	background-color: #ffffbb;	
}

.shift_calendar .has_setting_bg {
	background-color: #ddddff;	
}


.shift_calendar .holiday, .shift_calendar .holiday td {
	background-color:#ffaaaa;
	color:#aa0000;
	font-weight:bold;
}

/*------------------------ MISC --------------------------- */
.tabTitle {
	font-size: 1em;	
}