/*----------------------------------------------------------
The base color for this template is #5c87b2. If you'd like
to use a different color start by replacing all instances of
#5c87b2 with your new color.
----------------------------------------------------------*/
/*****************************
Template Styles
*****************************/

body {
	background: #888 url("images/grad.jpg") repeat-x scroll top left;
	margin: 0 auto;
	text-align: center;
	font-family: arial,verdana,trebuchet MS,sans-serif;
}

#home a {
	color: #D2222A;
}

#reg a {
	color: #F58220;
}

#sched a {	
	color: #ffe022;
}

#account a {
	color: #00AEEF;
}

#header {
	margin: 0 auto;
	padding: 0;
	width: 100%; /*(816px;*/
	height: 100px;
	overflow: hidden;
	z-index: -1;	
}

#header-left {
	float: left;
	margin: 0;
	width: 394px;
	height: 95px;
	background: transparent url("images/spectrum_logo10.png") no-repeat scroll top left;
}

#header-right {
	float: right;
	margin: 0 20px;
	width: 400px;
	height: 130px;
	background: transparent url("images/spectrum2008.png") no-repeat scroll right top;
}

#login-block {
	float: right;
	padding: 1px 5px;
	background: #fff url("images/login_bg.png") repeat-x scroll bottom left;
	border: 1px #CCC solid;
	border-top: none;
	color: #333;
	height: 20px;
}

#page {
	display: block;
	height: 100%;
	margin: 0 auto;
	/*overflow: hidden;*/
	padding: 2px;
	width: 816px;
	background-color: #FFF;
	border: 2px #666 solid;
	z-index: 1;
	text-align: left;
}

#main {
	padding: 20px;
}

/* Page Heading */
div#page-heading {
	display: block;	
	height: 200px;
}

#home div#page-heading {
	background: url("images/bg_red.png");
}

#reg div#page-heading {
	background: url("images/bg_orange.png");
}

#sched div#page-heading {
	background: url("images/bg_yellow.png");
}

#account div#page-heading {
	background: url("images/bg_blue.png");
}

div#page-heading h3 {
	margin: 0;
	border: 2px #333 solid;
	background-color: #666;
	color: #FFF;
	width: 55%;
	font-size: 150%;
	line-height: 30px;
	padding: 0 20px;
}

div#page-heading #open-area {
	background-color: transparent;
	background-repeat: no-repeat;
	background-attachment:scroll;
	background-position: top right;
	height: 200px;
}

#home div#page-heading #open-area {
	background: transparent url("images/bg1.jpg") no-repeat scroll top right;
}

#reg div#page-heading #open-area {
	background-image: url("images/bg2.jpg");
}

#sched div#page-heading #open-area {
	background-image: url("images/bg4.jpg");
}

#account div#page-heading #open-area {
	background-image: url("images/bg3.jpg");
}

/* Navigation */
#nav {
	margin: -11px 0 11px 0;
	padding: 0;
}

#nav-holder {
	list-style: none;
	margin: 0;
	padding: 0;
	display: inline;
}

#nav-holder li {
	display: block;
	float: left;
	margin: 0;
	background-color: #CCC;
	border-top: 2px #333 solid;
	border-bottom: 2px #333 solid;
	padding: 0 0 0 5px;
}

#nav-holder li.left {
	border-left: 2px #333 solid;
}

#nav-holder li.right {
	border-right: 2px #333 solid;
}

#nav-holder li a {
	display: block;	
	text-decoration: none;
	color: #333;
	font-size: 12pt;
	font-weight: 600;
	line-height: 20px;
	padding: 5px 15px 5px 10px;
}

#nav-holder li a:hover {
	color: #999;
}

#nav-holder li.red a {
	background: transparent url("images/navdot_red.png") no-repeat scroll left center;
}

#nav-holder li.orange a {
	background: transparent url("images/navdot_orange.png") no-repeat scroll left center;
}

#nav-holder li.yellow a {
	background: transparent url("images/navdot_yellow.png") no-repeat scroll left center;
}

#nav-holder li.green a {
	background: transparent url("images/navdot_green.png") no-repeat scroll left center;
}

#nav-holder li.blue a {
	background: transparent url("images/navdot_blue.png") no-repeat scroll left center;
}

/* Schedule Page */

#schedule-holder {
	margin: 20px auto;
	padding: 0;
	width: 700px;
	border: 1px #333 solid;
	overflow: visible;
}

ul#day-list {
	list-style: none;
	margin: -10px 0 0 0;
	padding: 0;
}

#day-list li {
	display: block;
	float: left;
	margin: 0 10px 20px -1px;
	z-index: 110;
}

#day-list li a {
	display: block;
	padding: 3px 5px;
	font-size: 12pt;
	font-weight: 600;
	color: #999;
	text-decoration: none;
	background-color: #e5e5e5;
	border: 2px #999 solid;
}

#day-list li.current a, #day-list li a:hover {
	color: #333;
	border: 2px #333 solid;
	background-color: #CCC;
}

.session-time {
	margin: 10px 10px;
	color: #000;
	font-size: 14pt;
}

#sched .session-name {
	margin: 8px 0 8px 20px;
	padding: 0;
	font-size: 12pt;
	z-index: 101;
}


/* FORM LAYOUT ELEMENTS   
----------------------------------------------------------*/

fieldset 
{
    margin: 1em 0;
    padding: 1em;
    border: 1px solid #CCC;
}

fieldset p 
{
    margin: 2px 12px 10px 10px;
}

fieldset label, #account label
{
    display: block;
    float: left;
    width: 200px;
    text-align: right;
    margin-right: 10px;
    color: #666;
    font-weight: 600;
    clear: left;
}

fieldset label.inline 
{
    display: inline;
}

legend 
{
    font-size: 1.1em;
    font-weight: 600;
    padding: 2px 4px 8px 4px;
}

input, select, textarea
{
	font-size: 1em;
}

input[type="text"] 
{
    width: 200px;
    border: 1px solid #CCC;
}

input[type="password"] 
{
    width: 200px;
    border: 1px solid #CCC;
}

#reg textarea 
{
	width: 250px;
	height: 100px;
}

.button {
	text-decoration: none;
	padding: 5px;
	font-weight: 600;
	font-size: 1.2em;
	border: 1px #333 solid;
}

#home .button {
	background-color: #D2222A;
	color: #FFF;
}

#reg .button {
	background-color: #F58220;
	color: #FFF;
}

#sched .button {
	background-color: #FFF100;
	color: #333;
}

#sched a.button {
	padding: 5px;
	font-size: 12pt;
	font-weight: 600;
	text-decoration: none;
	margin: 5px 40px;
}

#account .button {
	background-color: #00AEEF;
	color: #FFF;
}


/* TABLE
----------------------------------------------------------*/

table 
{
  border: solid 1px #e8eef4;
  border-collapse: collapse;
}

table td 
{
  padding: 5px;   
  border: solid 1px #e8eef4;
}

table th
{
  padding: 6px 5px;
  text-align: left;
  background-color: #e8eef4; 
  border: solid 1px #e8eef4;   
}

/* MISC  
----------------------------------------------------------*/
.clear
{
    clear: both;
}

.error
{
    color:Red;
}

#menucontainer
{
    margin-top:40px;
}

div#title
{
    display:block;
    float:left;
    text-align:left;
}

#logindisplay
{
    font-size:1.1em;
    display:block;
    text-align:right;
    margin:10px;
    color:White;
}

#logindisplay a:link
{
    color: white;
    text-decoration: underline;
}

#logindisplay a:visited
{
    color: white;
    text-decoration: underline;
}

#logindisplay a:hover
{
    color: white;
    text-decoration: none;
}

.field-validation-error
{
    color: #ff0000;
}

.input-validation-error
{
    border: 1px solid #ff0000;
    background-color: #ffeeee;
}

.validation-summary-errors
{
    font-weight: bold;
    color: #ff0000;
}

.dialog 
{
	display: none;
	font-size: .9em;
	text-align: left;
}

#session_details_dialog a 
{
	color: #666;
}

.dialog_heading 
{
	padding: 2px 0;
	font-size: 1.2em;
	width: 70%;
	color: #666;
	border-bottom: 1px solid #999;
}

.loader 
{
	display: none;
}

.action 
{
	text-align: right;
}

#schedule-holder a
{
	color: #666;
}

#schedule-holder a:hover 
{
	text-decoration: none;
}

.message 
{
	margin: 10px;
	padding: 5px;
	background-color: #CFF;
	border: 1px solid #009;
}

#account-info-holder, #my-schedule-holder {
	border:1px solid #333333;
	margin:10px auto 20px;
	width:650px;
}

#account-info-holder h3, #my-schedule-holder h3 {
	background-color:#E5E5E5;
	border:2px solid #333333;
	margin:-10px 0 10px -1px;
	padding:5px;
	width:400px;
}

.time_range 
{
	color: #666;
	font-weight: 600;
}

.remove_link 
{
	font-size: .8em;
}

.my_schedule li
{
	margin-bottom: 10px;
}