/* Remove all margins and padding for consistency */
* {
	margin: 0px;
	padding: 0px;
}

html {
	height: 101%;
}

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 62.5%; /* reset to 10px to account for em usage later. from http://www.clagnut.com/blog/348/ 0.875em;*/
	color: #666666;
	text-align: center; /* IE 6 trick to center the frame since IE applies text align to elements and not just text */
}

p {
	margin: 10px 0px 10px 0px;
}

a {
	color: #37939B;
	text-decoration: none;
}

a img {
	border: 0px;
}

h1, h2, h3, h4, h5, h6 {
	color: #37939B;
	padding-bottom: 10px;
}

h1 {
	font-size: 1.5em;
}

fieldset {
	border-width: 1px 1px 1px 10px;
	border-color: black;
	border-style: solid;
	width: 60%;
	margin-bottom: 10px;
}

legend {
	text-transform: uppercase;
	padding: 5px 10px 5px 10px;
	border-width: 1px 1px 1px 10px;
	border-color: black;
	border-style: solid;
}

label {
	cursor: pointer;
	font-weight: bold;
}

label.required-input:after {
	content: " * ";
}

input[type=text], input[type=password], textarea {
	border: solid #CCCCCC 1px;
	width: 250px;
	font-size: 16px;
	padding: 6px;
	
	-moz-border-radius-bottomleft: 6px;
	-moz-border-radius-bottomright: 6px;
	-moz-border-radius-topleft: 6px;
	-moz-border-radius-topright: 6px;
	
	-webkit-border-bottom-left-radius: 6px;
	-webkit-border-bottom-right-radius: 6px;
	-webkit-border-top-left-radius: 6px;
	-webkit-border-top-right-radius: 6px;
}

input[type=submit] {
	border: 2px solid black;
	padding: 10px;
	font-weight: bold;
}

input[type=text]:focus, input[type=password]:focus, textarea:focus {
	background-color: #FAFAFA;
}

input + span, select + span, textarea + span, form p span {
	padding-left: 10px;
	color: #CBCBCB;
	font-weight: bold;
}

select {
	border: solid #CCCCCC 1px;
	font-size: 14px;
	padding: 4px 15px 4px 4px;
}

#wrap {
	width: 980px;
	margin: 0 auto;
	text-align: left; /* IE 6 has already centered the frame so go back to standard alignment */
	font-size: 1.2em;
}

#header {
	width: 980px;
	padding: 25px 0px 20px 0px;
}

#logo {
	float: left;
}

#other_header_images {
	float: right;
	padding-top: 50px;
}

#header p {
	width: 260px;
	float: right;
	padding-top: 50px;
}

#navigation {
	width: 980px;
	height: 23px;
	background-color: #37939B;
	border-top: 6px solid #E3E3E3;
	border-bottom: 6px solid #E3E3E3;
}

#navigation ul {
	height: 23px;
}

#navigation ul li {
	display: block;
	float: left;
	height: 23px;
	line-height: 23px;
	list-style-type: none;
	text-align: center;
}

#navigation ul li a {
	text-transform: uppercase;
	color: #FFFFFF;
	padding: 0px 15px 0px 15px;
	text-decoration: none;
	font-size: 0.9em;
	font-weight: bold;
}

#header_picture {
	width: 980px;
}

#main_section {
	width: 978px;
	border-left: 1px solid #DDDDDD;
	border-right: 1px solid #DDDDDD;
	border-bottom: 1px solid #DDDDDD;
	overflow: hidden; /* this will fix the extra space created by the huge paddings and margins in the two sub divs */
}

#content {
	float: left;
	width: 678px;
	padding: 20px 10px 0px 20px;
	
	/* Use large padding and margins to create auto height divs from http://www.positioniseverything.net/articles/onetruelayout/equalheight */
	padding-bottom: 32767px;
	margin-bottom: -32767px;
}

#big_content ul, #big_content ol, #content ul, #content ol {
	margin-left: 20px; /* indent lists in the main content section only */
}

#sidebar {
	float: right;
	width: 240px;
	padding: 20px 10px 0px 20px;
	
	/* Use large padding and margins to create auto height divs from http://www.positioniseverything.net/articles/onetruelayout/equalheight */
	padding-bottom: 32767px;
	margin-bottom: -32767px;
}

/* do not show the sidebar in the admin section */
#big_content {
	width: 948px;
	padding: 10px 20px 10px 20px;
}

#footer {
	clear: both;
	text-align: center;
	margin-top: 20px;
	font-size: 0.9em;
}

/*
*** CLASSES ***
*/
.errorInput {
	background-color: #FFC0CB;
	background-image: url('../images/exclamation.png');
	background-repeat: no-repeat;
	background-position: center right;
}

.goodInput {
	background-color: #DFF5DE;
	background-image: url('../images/check.png');
	background-repeat: no-repeat;
	background-position: center right;
}

/* YUI draggable list control */
ul.draggable_list { 
	position: relative;
	width: 400px; 
	list-style: none;
	margin: 0;
	padding: 0;
	/*
	   The bottom padding provides the cushion that makes the empty 
	   list targetable.  Alternatively, we could leave the padding 
	   off by default, adding it when we detect that the list is empty.
	*/
	padding-bottom: 20px;
}

ul.draggable_list li {
	margin: 3px;
	cursor: move;
	padding: 3px;
}

li.draggable_li {
	background-color: #D1E6EC;
	border: 1px solid #7EA6B2;
}

.error_message {
	background-color: #FFDC7D;
	padding: 10px;
	
	-moz-border-radius-bottomleft: 6px;
	-moz-border-radius-bottomright: 6px;
	-moz-border-radius-topleft: 6px;
	-moz-border-radius-topright: 6px;
	
	-webkit-border-bottom-left-radius: 6px;
	-webkit-border-bottom-right-radius: 6px;
	-webkit-border-top-left-radius: 6px;
	-webkit-border-top-right-radius: 6px;
}

.clear {
	clear: both;
	width: 100%;
	height: 10px;
	visibility: hidden;
}

.bordered-box {
	border: 1px solid gray;
	margin-bottom: 20px;
	padding: 10px;
	
	-moz-border-radius-bottomleft: 6px;
	-moz-border-radius-bottomright: 6px;
	-moz-border-radius-topleft: 6px;
	-moz-border-radius-topright: 6px;
	
	-webkit-border-bottom-left-radius: 6px;
	-webkit-border-bottom-right-radius: 6px;
	-webkit-border-top-left-radius: 6px;
	-webkit-border-top-right-radius: 6px;
}

button {
	background-color: #37939B;
	border: 3px solid black;
	padding: 6px;
	color: #FFF;
	font-family: Verdana, sans-serif;
	font-size: 115%;
	text-transform: uppercase;
	font-weight: bold;
	cursor: pointer;
	text-shadow: 0 -1px 1px #222;
	
	-moz-box-shadow: 0 1px 3px #999;
	-webkit-box-shadow: 0 1px 3px #999;

	-moz-border-radius-bottomleft: 6px;
	-moz-border-radius-bottomright: 6px;
	-moz-border-radius-topleft: 6px;
	-moz-border-radius-topright: 6px;
	
	-webkit-border-bottom-left-radius: 6px;
	-webkit-border-bottom-right-radius: 6px;
	-webkit-border-top-left-radius: 6px;
	-webkit-border-top-right-radius: 6px;
}