/*-- HTML DEFINITIONS --*/ 

html, body{
    background: #fff;
    margin : 0px; 
    padding : 0px; 
}

h1{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1em;
    color: #000;
	margin:0;
	padding:0;
}

h2{
    font-family: Arial, Helvetica, sans-serif;
    font-size: .9em;
    color: #000;
	margin:0;
	padding:0;
}

h3{
	font-family: Arial, Helvetica, sans-serif;
    font-size: .7em;
    color: #000;
	font-weight:bold;
	text-decoration: none;
	margin:0;
	padding:0;
}

h4{
    font-family: Arial, Helvetica, sans-serif;
    font-size: .8em;
    color: #000;
	margin: 0 0 4px 0;
	padding:0;
}

/* HOLLY HACK - only applied to IE on Windows - see http://www.positioniseverything.net/explorer/escape-floats.html */
/* Hides from IE-mac \*/
* html h4 {margin: 3px 0 ;}
/* End hide from IE-mac */

p, .notes-rowbody ul li, #notes-content ul li {
    font-family: Arial, Helvetica, sans-serif;
    font-size: .7em;
    color: #000;
	text-align:left;
	margin:0;
	padding:10px 0 5px 0;
}

a {
    font-family: Arial, Helvetica, sans-serif;
    font-size: .7em;
    color: #fff;
	font-weight:bold;
	text-decoration: none;
	margin:0;
	padding:0;
}

a:hover{
    font-family: Arial, Helvetica, sans-serif;
    font-size: .7em;
   	color: #fff;
	font-weight:bold;
	text-decoration:underline;
}

label {
	font-family: Arial, Helvetica, sans-serif;
    font-size: .7em;
    color: #000;
	font-weight:bold;
	text-decoration: none;
	margin:0;
	padding:0;
}

/*BACK AND HOME BUTTONS*/

#back-home{
	position:relative;
	width:421px;
	height:14px;
}
	
#back-home #back a, #back-home #home a {
	float:right;
	display:block;
	width:40px;
	margin:6px 0 6px 10px; 
	padding:0 0 0 21px;
	color:#000;
	text-decoration: none;
}

#back-home #home a:hover {	background-position: 0 -36px; text-decoration:underline;}
#back-home #back a:hover {	background-position: 0 -35px; text-decoration:underline;}
#back-home #home a {background:url("images/home-butt.gif") top left no-repeat;}
#back-home #back a {background:url("images/back-butt.gif") top left no-repeat;}

/*STRUCTURAL DIVS FOR COMMNOTES.PHP*/

#notes-topleft-image {
	position:absolute;
	width:286px;
	height:266px;
	left:0px;
	top:0px;
	padding:0;
	margin:0;
}
.learn{background:url("images/learn-top-left.jpg");width:286px;	height:266px;}
.notes{background:url("images/comm-top-left.jpg");width:286px; height:266px;}
.topics{background:url("images/topics-top-left.jpg");width:286px; height:266px;}
.help{background:url("images/help-top-left.jpg");width:286px; height:266px;}
.selfass{background:url("images/selfass-top-left.jpg");width:286px; height:266px;}

#notes-header {
	position:relative;
	width:474px;
	height:92px;
	background:url("images/comm-header.gif");
	padding:0;
	margin:0 0 0 286px;
}

#notes-strip {
	position:absolute;
	width:15px;
	height:174px;
	background:url("images/comm-lime-strip.gif");
	top:92px;
	left:286px;
	padding:0;
	margin:0;
}

#notes-content, #help-content {
	position:relative;
	width:421px;
	padding:27px 0 0 12px;
	margin:0 0 0 301px;
	min-height:158px;
}
/* we want to see the text of links!!!! */
#notes-content a, #help-content a {color: #000;}
#help-content p a, #notes-content p a {font-size:1em;}
#help-content a:hover { text-decoration:underline;}
#notes-content a:hover { text-decoration:underline;}

/*NOTES-SUB-NAV BUTTONS*/

#notes-sub-nav, #help-sub-nav, #topic-sub-nav {
	position:absolute;
	width:261px;
	padding:0;
	top:266px;
	left:40px;
}

#notes-sub-nav a, #help-sub-nav a, #topic-sub-nav a {
	display:block;
	width:10em;
	margin: 1em 0; 
	padding:3px 0 3px 32px;
	color:#000;
	text-decoration: none;
}

#notes-sub-nav a {background:url("images/comm-buttons.gif") top left no-repeat;}
#help-sub-nav a {background:url("images/pink-buttons.gif") top left no-repeat;}
#topic-sub-nav a {background:url("images/orange-buttons.gif") top left no-repeat;}

#notes-sub-nav a:hover, #help-sub-nav a:hover, #topic-sub-nav a:hover {background-position: 0 -72px; text-decoration:underline;}

.topic-sub-nav-head {font-size:0.9em; font-weight:bold; width:10em; margin: 1em 0; padding:3px 0 3px 32px; background-color:#fff; color:#ffb13c; text-align:left;}
.help-sub-nav-head {font-size:0.9em; font-weight:bold; width:9em; color:#e472d5;}

.inputmargin {margin:0 0 0 32px;}

/*.CURRENT DISPLAYS THE CURRENT PAGE AS HIGHLIGHTED*/

.current {
	display:block;
	width:10em;
	margin: 1em 0; 
	padding:3px 0 3px 32px;
	color:#000;
	background:url("images/comm-buttons.gif") top left no-repeat;
	background-position: 0 -72px;
	text-decoration: none;
	font-weight:bold;
}

/*HEADER HOME LINK*/

#header-home-link{
	float:right;
	width:186px;
	height:60px;
}

/*NOTES-NAV BUTTONS*/

#notes-nav{
	position:absolute;
	min-width:448px;
	min-height:25px;
	background-color:#000;
	left:286px;
	top:64px;
	white-space:nowrap;
	padding:3px 0 0 0;
	width:448px;
	voice-family: "\"}\"";
	voice-family:inherit;
	width:auto;
}
/* HOLLY HACK - only applied to IE on Windows - see http://www.positioniseverything.net/explorer/escape-floats.html */
/* Hides from IE-mac \*/
* html #notes-nav {height: 25px;}
/* End hide from IE-mac */

#notes-life, #notes-comm, #notes-help, #curr-life, #curr-comm, #curr-help { position:relative; height:25px; }

#notes-nav ul {margin:0; padding:0; display:inline;}
#notes-nav ul li { margin:0 28px 0 0; padding:0; display:inline; list-style:none;}

#notes-life a, #notes-comm a, #notes-help a {color:#fff;}

#notes-life a:hover, #curr-life a:hover, #framework h4 {color:#c1c130; text-decoration:underline;}
#notes-comm a:hover, #curr-comm a:hover{color:#ffb13c; text-decoration:underline;}
#notes-help a:hover, #curr-help a:hover{color:#e472d5; text-decoration:underline;}

#curr-life a {color:#c1c130;}
#curr-comm a {color:#ffb13c;}
#curr-help a {color:#e472d5;}

/*STRUCTURAL DIVS FOR COMMINFO.PHP*/

#info-container{
	position:relative;
	width:710px;
	margin:0 0 0 24px;
}

#info-intro-text{
	position:relative;
	margin: 0 0 0 24px;
	width:481px;
	height:68px;
	z-index: 2;
}

#info-logo{position:absolute; width:155px; height:64px; left:555px; top:0;}

#info-imghold{
	position:relative;
	width:710px;
	margin:0;
}

#info-column01{ position:absolute; width:265px; left:0; top:0; }
#info-column02{ position:absolute; width:264px; left:265px; top:0; }
#info-column03{ position:absolute; width:181px; left:529px; top:0; }

#info-image01{ position:relative; width:265px; height:230px; background:url("images/info-image01.jpg");}
#info-image02{ position:relative; width:264px; height:230px; background:url("images/info-image02.jpg");}
#info-image03{ position:relative; width:181px; height:230px; background:url("images/info-image03.jpg");}

#info-content01 a, #info-content02 a, #info-content03 a {color: #000;}
#info-content01 a:hover {color:#c1c130; text-decoration:underline;}
#info-content02 a:hover {color:#ffb13c; text-decoration:underline;}
#info-content03 a:hover {color:#e472d5; text-decoration:underline;}

#info-content02 ul li a { color: #000; font-weight:normal;}
#info-content02 ul li a:hover { color: #000; text-decoration:underline;}

#info-content01{
	position:relative;
	margin:0 10px 0 48px;
	width:207px;
}

#info-content02{
	position:relative;
	margin:0 10px 0 27px;
	width:227px;
}

#learntopics ul, #info-content02 ul { width:227px; display:block; margin:0; padding:0; }
#learntopics ul li, #info-content02 ul li { width:227px; display:block; margin:0; padding:0; list-style:none; }

#info-content03{
	position:relative;
	margin:0 10px 0 26px;
	width:145px;
}

#limestrip{
	position:absolute;
	width:14px;
	height:111px;
	background:url("images/info-limestrip.gif");
	top:230px; left:22px;
}
#orangestrip{
	position:absolute;
	width:14px;
	height:111px;
	background:url("images/info-orangestrip.gif");
	top:230px; left:0px;
}
#pinkstrip{
	position:absolute;
	width:14px;
	height:111px;
	background:url("images/info-pinkstrip.gif");
	top:230px; left:0px;
}

input {border:1px solid #000;}

.img-nobord {border:0; margin:0; padding:0;}

#self-ass, #self-ass02{
	position:relative;
	padding:0;
}

#self-ass { width:140px;}
#self-ass02 { width:100px; text-align:right; padding:0 40px 0 0;}

#self-ass a, #self-ass02 a {
	display:block;
	margin: 1em 0; 
	padding:3px 0 3px 0;
	color:#000;
	text-decoration: none;
}

#self-ass a { width:140px; background:url("images/pinkbut.gif") no-repeat;}
#self-ass02 a {	width:100px; background:url("images/pinkbut02.gif") no-repeat; }

#self-ass a:hover, #self-ass02 a:hover {background-position: 0 -72px; color:#000; text-decoration:underline;}
.pinkbut {float:right; border:0; margin:0; padding:0;}

/*FRAMWORK STRUCTURE*/

#framework{
	position:relative;
	margin:0 0 0 40px;
	padding:0;
	width:710px;
}

#framework #back-home {width:710px; clear: both;}

.row{
	float:left; 
	width: 223px;
	margin: 15px 0 0 0;
	/*border: 1px solid #000;*/
}

.row p{margin:0; padding:0;}

.col1, .col1-no-border, .col1-no-left-border, .col-spacer-top-border, .col-spacer { width:213px; height:20px;  margin:0; padding:0;}

.col1 { border: 1px solid #c1c130; border-top:0;}
.col1-no-left-border { border-bottom: 1px solid #c1c130;}
.col-spacer-top-border { border-top: 1px solid #c1c130;}
.col-spacer { border-left: 1px solid #c1c130; border-right: 1px solid #c1c130;}

/* We want to see the text of links !!! */

.col1 h2, .col1 h4 { margin-left:5px;}
.col1 a, .col-spacer a { color:#000; margin-left:5px;}
.col1 a:hover, .col-spacer a:hover { color:#000; text-decoration:underline; }

/*NOTES COLUMNS*/

.notes-col{
	float: left;
	width: 136px;
	margin: 15px 0 0 0;
}
.notes-rowhead, .notes-rowbody { width:136px;  margin:0; padding:0; border-left: 1px solid #c1c130; }
.notes-rowhead { height:30px;}
.notes-rowhead h2, .notes-rowbody p { margin: 0 8px 0 4px; }
.notes-rowhead h2 { font-size: .8em; }

.notes-rowbody ul, #notes-content ul{	margin: 0; padding: 0px;}
.notes-rowbody ul li, #notes-content ul li{ margin:0 8px 0 18px ; padding:0; list-style: circle; }

/*TOPICS*/

#notes-content .col2{width:421px; text-align:left;}
#notes-content .col2 a {color:#000;}
#notes-content .col2 a:hover { text-decoration:underline;}

#topic-strip {
	position:absolute;
	width:15px;
	height:174px;
	background:url("images/topic-orange-strip.gif");
	top:92px;
	left:286px;
	padding:0;
	margin:0;
}

/*HELP*/

#help-strip {
	position:absolute;
	width:15px;
	height:174px;
	background:url("images/help-pink-strip.gif");
	top:92px;
	left:286px;
	padding:0;
	margin:0;
}

#learnmore {
	position:relative;
	width:261px;
	height:41px;
	background:url("images/learnmore.gif");
}

#learntopics {position:relative; margin:34px 0 0 0;}
#learntopics a {display:block; color:#000;}
#learntopics a:hover { text-decoration:underline;}
#learn-self-ass {position:relative; border: 1px solid #E472D5; padding:7px; margin:3px; width:120px; text-align:center;}

