<!--
/* 
Dark grey = #6c6c6c
Light grey = #b5b5b5
Red = #90181b
*/
body {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: #fff;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
	line-height: 130%;
}

.container {
	width: 100%; 
	background: #fff;
	margin: 0;
	padding: 20 20 20 20;
	text-align: left; /* this overrides the text-align: center on the body element. */
}

/* header image */
.header img {
	margin: 0px 0 0px 10px;
	float: left;
	clear: none;

	}


/* mainNav */

.mainNav {
	margin: 10px 0 5px 320px;
}

.mainNav p {
	display: inline;
	padding: 4px 18px 4px 20px;
	color: #6c6c6c;
	text-decoration: none;
	background: #fff;
	letter-spacing: .1em;
	font-weight: normal;
	border:2px solid;
	border-color:#fff;
	clear: none;
}

.mainNav p a {
	display: inline;
	padding: 4px 18px 4px 20px;
	color: #6c6c6c;
	text-decoration: none;
	background: #fff;
	letter-spacing: .1em;
	font-weight: bold;
	border:1px solid;
	border-color:#fff;
	clear: none;
}

.mainNav p a:hover {
	background:#b5b5b5;
	background-image:url(../images/buttonGrad.png);
	color: #90181b;
	border-color:#f3f3f3 #6c6c6c #6c6c6c #f3f3f3;	
}

.loginBox {
	margin: 0px 0 20px 430px;
	
}

.loginBox p {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 80%;	
}

/* I have 2 types of buttons here. A Submit button and a Do button. 
Submit is for a form that takes you to a different page. 
Do is for an action that stays on this page. 
Can't get the text color to change in the hover of the Do button 
for some reason, but that will probably look different soon anyway.
*/

.submitButton a {
	display: inline;
	padding: 3px 14px 3px 16px;
	color: #6c6c6c;
	text-decoration: none;
	background: #fff;
	font-weight: bold;
	border:1px solid;
	border-color:#fff;
	clear: none;
	font-size: 80%;
}

.submitButton a:hover {
	background:#b5b5b5;
	background-image:url(../images/buttonGrad.png);
	color: #90181b;
	border-color:#f3f3f3 #6c6c6c #6c6c6c #f3f3f3;
}

.doButton a {
	display: inline;
	padding: 3px 5px 3px 7px;
	color: #6c6c6c;
	text-decoration: none;
	background: #fff;
	font-weight: bold;
	border:1px solid;
	border-color:#fff;
	clear: none;
	font-size: 80%;
}

.doButton a:hover {
	background:#fff;
	color: #90181b;
}


.mainContent {
	margin: 10px 0px 0px 15px;
	padding: 0px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
}

.mainContent h2 {
	font-size:16px;
	color: #000;
	}
	
.mainContent h3 {
	font-size:16px;
	color: #90181b;
}

.mainContent h4 {
	font-size:16px;
	color:#666666;
}
	
.mainContent p {
	font-size: 14px;
	margin-left: 20px;
	width: 600px;
	}
	
.mainContent a {
	color: #6c6c6c;
	text-decoration: none;
	}
	
.mainContent a:hover, a:active {
	color: #90181b;
	text-decoration: none;
	}
	
.mainContent ul {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	font-size: 90%;
	width: 600px;
	}
	
	
table {
	font: Verdana, Arial, Helvetica, sans-serif;
	font-size: 80%;
	}
	
.footer {
	margin: 0;
	padding: 20 20 20 20;
	text-align: left; /* this overrides the text-align: center on the body element. */
}

.footer a {
	display: inline;
	padding: 4px 18px 4px 20px;
	color: #6c6c6c;
	text-decoration: none;
	font-weight: normal;
	font-size: 80%;
}

.footer a:hover {
	color: #90181b;
	}
	
#clickData {
	display: none;
	margin-left: 5%;
	margin-right:10%;
	padding: 0px 0px 10px 10px;
	}
	
#groupData {
	display:none;
	margin-left: 5%;
	margin-right:10%;
	padding: 0px 0px 10px 10px;
	}
	
-->