/*	default behaviors for generic elements	*/

BODY  {
	color: Black;
	background-color: White; 
	font-family: Helvetica, Geneva, Arial, sans-serif;
	font-size: 13px;
}

TD, TH  {
	color: Black;
	/*background-color: White;*/ 
	font-family: Helvetica, Geneva, Arial, sans-serif;
	font-size: 13px;
}

 P	{
	font-family: Helvetica, Geneva, Arial, sans-serif;
	font-size: 13px;
	margin-left: 0.5em;
	margin-right: 0.5em;
	}
	
IMG, TABLE	{
	border: none;
	padding: 0px;
	}

TD {
	vertical-align: top;
	}
/* override classes for default table behavior */
.middle	{
	vertical-align: middle;
	}
.bottom {
	vertical-align: bottom;
	}
.center {
	text-align: center;
	}

/* class for default positioned li elements ---
	use this instead of <p><li>whatever <p><li>next item
	*/
.li {
	margin-top: 3pt;
	}
.lis {
	margin-top: 2pt;
	}
.lix {
	margin-top: 1pt;
	}

/* class to move right-side course images down a bit below header bar */
.imgright {
	margin-top: 4px;
	}

/*	
	we define two master hard-positioned DIV classes in which all content resides
	.menu and .body
*/

.menu {
	position:absolute; 
	background-image: url("Images/Interface/leftbar.jpg");
	margin-left:0;
	margin-right:0;
	width:130px; 
	height:575px; 
	z-index:3; 
	left: 0px; 
	top: 0px; 
	visibility: visible;
	} 


.body {
	position:absolute; 
	margin-left:0;
	margin-right:0;
	width:670px; 
	height:575px; 
	z-index:3; 
	left: 130px; 
	top: 0px; 
	visibility: visible;
	} 

/*	the .body DIV is divided into three tables with header, content, and footer	*/
/* header is wider because we want it to go all the way to the edge of the screen */
.header {
	background-image: url("Images/Interface/topbar.jpg");
	width: 670px;
	height: 124px;
	}

.header2 {
	background-image: url("Images/Interface/topbar.jpg");
	margin-top:0px;
	margin-bottom:0px;
	width: 670px;
	/* height: 88px; */
	}


.content {
	background-image: url("Images/Interface/bodybg.gif");
	width: 660px;
	height: 400px;
	}

/*
	the footer is positioned ABSOLUTELY so that the location of next/back
	remains consistent no matter what happens with the graphics
*/
.footer {
	/*background-image: url("Images/Interface/bodybg.gif");*/
	position:absolute; 
	left: 420px;
	top: 523px;
	width: 235px;
	height: 30px;
	/*background-color: cyan;*/
	}
.footer2 { /*includes dlink */
	/*background-image: url("Images/Interface/bodybg.gif");*/
	z-index:10; 
	position:absolute; 
	left: 477px;
	top: 523px;
	width: 308px;
	height: 30px;
	/*background-color: cyan;*/
	}

/* 
	because we need to position the rollovers for coursemap and menu elements exactly, 
	we set up layers for them, too.  
	REMEMBER that the "absolute" position is relative to the layer that these objects are in!
*/

/*	course tools	*/
.coursemap {
	position:absolute; 
	margin-left:0;
	margin-right:0;
	width:20px; 
	height:20px; 
	z-index:3; 
	left: 275px; 
	top: 43px; 
	visibility: visible;
	} 

.glossary {
	position:absolute; 
	margin-left:0;
	margin-right:0;
	width:20px; 
	height:20px; 
	z-index:3; 
	left: 392px; 
	top: 43px; 
	visibility: visible;
	} 

.help {
	position:absolute; 
	margin-left:0;
	margin-right:0;
	width:20px; 
	height:20px; 
	z-index:3; 
	left: 492px; 
	top: 43px; 
	visibility: visible;
	} 

.exit {
	position:absolute; 
	margin-left:0;
	margin-right:0;
	width:20px; 
	height:20px; 
	z-index:3; 
	left: 566px; 
	top: 43px; 
	visibility: visible;
	} 

/*	menu items	*/
.mod1 {
	position:absolute; 
	margin-left:0;
	margin-right:0;
	width:20px; 
	height:20px; 
	z-index:3; 
	left: 11px; 
	top: 92px; 
	visibility: visible;
	} 
.mod2 {
	position:absolute; 
	margin-left:0;
	margin-right:0;
	width:20px; 
	height:20px; 
	z-index:3; 
	left: 11px; 
	top: 122px; 
	visibility: visible;
	}
.mod3 {
	position:absolute; 
	margin-left:0;
	margin-right:0;
	width:20px; 
	height:20px; 
	z-index:3; 
	left: 11px; 
	top: 152px; 
	visibility: visible;
	}
.mod4 {
	position:absolute; 
	margin-left:0;
	margin-right:0;
	width:20px; 
	height:20px; 
	z-index:3; 
	left: 11px; 
	top: 182px; 
	visibility: visible;
	}
		
/*	define the appearance of some elements that are common to many pages */

/* module title */	
.modtitle {
	margin-left: 6px;
	/* margin-top: 28px; */
	font-weight: bold;
	color: Black;
	font-family:  Helvetica, Geneva, Arial, sans-serif;
	font-size: 16px;
	}
/* lesson title */	
.lessontitle {
	margin-left: 6px;
	/* margin-top: 18px;  */
	margin-bottom: 0px; 
	font-weight: bold;
	color: Black;
	font-family:  Helvetica, Geneva, Arial, sans-serif;
	font-size: 15px;
	}
/* screen x of y */	
.scrpos {
	text-align: right;
	margin-bottom: 0px; /* was 6 */
	margin-right: 1em;
	color: Black;
	font-size: 14px;
	}
/* topic title */
.topictitle {
	margin-top: 2px;
	margin-left: 6px;
	font-weight: bold;
	font-size: 14px;
	}

/* default link behaviors */

A:LINK { color:blue; text-decoration : underline; } 
A:VISITED { color:blue; text-decoration : underline; } 
A:ACTIVE { color:blue; text-decoration : underline; } 
A:HOVER { color:green; font-weight: bold;text-decoration : underline; } 


/* now we define classes for behavior of elements */

.dlink
{ color:blue; font-weight: normal;text-decoration : none; } 

/*
.dlinkhidden
{color:white; background-color:white; font-weight:normal; text-decoration:none;}
*/
A:LINK.dlinkhidden, A:VISITED.dlinkhidden, A:HOVER.dlinkhidden  {
	color:white; background-color:white; 
	font-weight:normal; text-decoration:none;
	}


.glosslink
{ color:blue; font-weight: bold;text-decoration : underline; } 

.indent	
	{
	margin-left: 16px;
	margin-right: 16px;
	}
.indentdeep	
	{
	margin-left: 32px;
	margin-right: 32px;
	}
.leftindent	
	{
	margin-left: 16px;
	}
.leftindentdeep	
	{
	margin-left: 32px;
	}


.slightsqueezed	/* squeeze things closer to fit on page */
	{
	margin-top: 10px;
	margin-bottom: 10px;
	}

.squeezed	/* squeeze things closer to fit on page */
	{
	margin-top: 8px;
	margin-bottom: 8px;
	}

.topictitlesqueezed {
	margin-top: 0px;
	margin-left: 2px;
	margin-bottom: 0px;
	font-weight: bold;
	font-size: 14px;
	}

.indentsqueezed
	{
	margin-top: 8px;
	margin-bottom: 8px;
	margin-left: 16px;
	margin-right: 16px;
	}
.leftindentsqueezed
	{
	margin-top: 8px;
	margin-bottom: 8px;
	margin-left: 16px;
	}
.verysqueezed	/* squeeze things closer to fit on page */
	{
	margin-top: 6px;
	margin-bottom: 6px;
	}

.extrasqueezed	/* squeeze things closer to fit on page */
	{
	margin-top: 4px;
	margin-bottom: 4px;
	}

.squeezedflush	/* squeeze things closer to fit on page */
	{
	margin-top: 0px;
	margin-bottom: 8px;
	}

.verysqueezedflush	/* squeeze things closer to fit on page */
	{
	margin-top: 0px;
	margin-bottom: 6px;
	}

.extrasqueezedflush	/* squeeze things closer to fit on page */
	{
	margin-top: 0px;
	margin-bottom: 4px;
	}

/* popup boxes */

.popupbox {  text-align: left; vertical-align: top; margin-top: 5px; margin-left: 10px; margin-right: 10px;padding-top: 5px; padding-left: 10px; padding-right: 10px}

.popdef 
	{
	z-index:5;
	text-align: left; 
	vertical-align: top;
	padding: 20px;
	position: absolute;
	color: black;
	/*background-color: silver;*/
	}

.closer1 {
	z-index: 100;
	position: absolute;
	visibility: hidden;
	/*background-color: magenta;*/
	width: 74px;
	height: 24px;
	}



/* special things for special screens */

.login {
	position: relative;
	width: 800px;
	height: 600px;
	/* klugey offset for 800x600 screens -- should be trivial on higher res.*/
	left: -5px;
	margin-top:0;
	margin-left:0;
	background-image: url('Images/Global/registration.jpg');
	background-repeat: no-repeat;
	}
	/*background-color:#F9F6FE;
	}*/

.risksheet {
	/*
	background-image: url(Images/Global/registration.jpg);
	background-repeat: no-repeat;
	*/
	background-color:#F9F6FE;
	}

.logintbl {
	position:absolute; 
	/* background-color:#F9F6FE; */
	margin-left:0;
	margin-right:0;
	width:772px; 
	height:252px; 
	z-index:3; 
	left: 16px; 
	top: 116px; 
	visibility: visible;
	} 

.loginbtn {
	position:absolute;
	margin-left:0;
	margin-right:0;
	width:80px;
	height:43px;
	z-index:3;
	left: 32px;
	top: 152px;
	visibility:visible;
	}

.checkmark {
	list-style-type: disc;
	list-style-image: url(Images/Global/checkmark.jpg);

}
.numberedList {
	list-style-type: decimal;
}
.squeezedList {
	margin: 7px 0px 7px 40px;
}
hr {
	margin-left: 7px;
}

/* table colors */

/* use span class="white" instead of font color="#FFFFFF" */
.white {
	color: white;
	}
.black {
	color: black;
	}
.purple {
	color:#990099;
	}
.blue {
	color:#0000FF;
	}
.dkteala {
	color:#099999;
	}
.dktealb {
	color:#009999;
	}
.yellow {
	color:#FFFF00;
	}

.boldcyan {
	color:#099999;
	font-weight:bold;
	}
.greentbl {background-color:#33CC33;}

.lightpurpletbl {background-color: #EFE3EF;}


.greenTeal {
	color: #009999;
}
.purpletbl {
	color: #FFFFFF;
	background-color: #990099;
}
.graytbl {
	background-color: #CCCCCC;
}
.borderBlack {
	border: 1px solid #000000;
}
.bluegreentbl {
	color: #990000;
	background-color: #00FFFF;
}
.bluetbl {
	color: #FFFFFF;
	background-color: #0000FF;
}
.blueTextRiskSheet {
	color: #000099;
}
.redBorderTop {
	border-top-width: 3px;
	border-right-width: 3px;
	border-bottom-width: 1px;
	border-left-width: 3px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #FF0000;
	border-right-color: #FF0000;
	border-bottom-color: #000000;
	border-left-color: #FF0000;
}
.redBorderBottom {
	border-top-width: 0px;
	border-right-width: 3px;
	border-bottom-width: 3px;
	border-left-width: 3px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #FF0000;
	border-right-color: #FF0000;
	border-bottom-color: #FF0000;
	border-left-color: #FF0000;
}
.ListAlignedLeft {
	margin-right: 40px;

}
.leftAlignedCheckmark {
	margin-left: 20px;
	list-style-image: url(Images/Global/checkmark.jpg);
}
.darkBlueTbl {
	background-color: #000099;
	color: #FFFFFF;

}
.redText {
	color: #FF0000;
}
.pinkTbl {
	color: #FFFF00;
	background-color: #FF00FF;
}
.redtbl {
	color: #FFFF00;
	background-color: #FF0000;
}
.redBorderSide {
	border-top-width: 0px;
	border-right-width: 3px;
	border-bottom-width: 0px;
	border-left-width: 3px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #FF0000;
	border-right-color: #FF0000;
	border-bottom-color: #FF0000;
	border-left-color: #FF0000;
}
.darkGreenTbl {
	color: #FFFFFF;
	background-color: #009999;
}
.borderRed {
	border: 3px solid #FF0000;
}
.grayBorder {
	border: 1px solid #666666;
}