/* Colour palette: http://www.colourlovers.com/palette/23901/Say_Yes
 * Dark Blue: #0B3641
 * Bright Blue: #0067A1 (From logo)
 * Light Yellow/Green: #E0E15B
 * Deep Red: #621514
 * Orange: #DB4327
 */

/* top elements */
* { padding: 0; margin: 0; }
body {margin: 20px 0; padding: 0; font: normal .72em/1.5em 'Trebuchet MS', sans-serif; color: #444; background: #D1B685; text-align: center; height: 100%;}

/* links */
a { background: inherit; color: #0067A1; text-decoration: none; }
a:hover { background: inherit; color: #006699; text-decoration: underline; }

/* HTML */
h1, h2, h3 {font: bold 1em 'Trebuchet MS', Tahoma, Sans-serif; color: #333;}
h1 { font-size: 1.4em; }
h2 { font-size: 1.2em; text-transform: uppercase;}
h3 { font-size: 1.2em; }
p, h1, h2, h3 {margin: 10px 15px;}
ul, ol {margin: 10px 30px; padding: 0 15px;}
blockquote {margin: 15px; padding: 0 0 0 20px; background: #FAFAFA url("../images/icons/quote.gif") no-repeat 3px 5px; border: 1px solid #eee; font: bold 1.2em/1.5em 'Trebuchet MS', Tahoma, sans-serif; color: #666666;}

/* images */
img {border: 1px solid #DDD; padding: 5px; background-color: #FFF;}
img.float-right {margin: 5px 0px 5px 15px;}
img.float-left {margin: 5px 15px 5px 0px;}

/* start - table */
table {border-collapse: collapse; margin: 15px;}
th strong {color: #fff;}
th {background: #0067A1; height: 29px; padding-left: 12px; padding-right: 12px; color: #FFF; text-align: left; border-left: 1px solid #E0E15B; border-bottom: solid 2px #FFF;}
tr {height: 30px;}
td {padding-left: 11px; padding-right: 11px; border-left: 1px solid #E8E8E8; border-bottom: 1px solid #DFDFDF;}
td.first,th.first {border-left: 0px;}
tr.row-a {background: #F8F8F8;}
tr.row-b {background: #EFEFEF;}

/* form elements */
form {margin:10px 15px; padding: 0; border: 1px solid #eee; background-color: #FAFAFA;}
label {display:block; font-weight:bold; margin:5px 0;}
input {padding: 2px; border:1px solid #eee; font: normal 1em 'Trebuchet MS', verdana, sans-serif; color:#777;}
textarea {width:400px; padding:2px; font: normal 1em 'Trebuchet MS', verdana, sans-serif; border:1px solid #eee; height:100px; display:block; color:#777;}
input.button {margin: 0; font: bold 1em Arial, Sans-serif; border: 1px solid #CCC; background: #FFF; padding: 2px 3px; color: #333;}

/* search form */
.searchform {background-color: transparent; border: none; margin: 0; padding: 0;}
.searchform p { margin: 10px; padding: 0;}
.searchform input.textbox {width: 130px; color: #333; height: 20px; padding: 2px; vertical-align: top;}
.searchform input.button {font: bold 12px Arial, Sans-serif; color: #333; width: 60px; height: 26px; border: none; padding: 3px 5px; vertical-align: top;}

/* layout */
#container {width: 770px; margin: 0 auto; background: #FFF url("../images/layout/wrap-bg.jpg") repeat-y;}
#header {position: relative; height: 176px; text-align: left; margin: 0; padding: 0; background: #FFF;}
img#logo {border: 0; padding: 0px;}

#header .headerphoto {position: absolute; right: 15px ; top: 15px; width: 740px; height: 157px; background: #FFF url(../images/cci_banner.jpg) no-repeat;}
#logo-box #slogan {
	position: absolute;
	font: bold 12px 'Trebuchet Ms', Sans-serif;
	text-transform: none;
	color: #FFFFCC;
	margin: 10px;
	padding: 0;
	top: 72px;
	left: 37px;
	width: 129px;
}

/* header menu */
#menu {clear: both; margin: 0; padding: 0 0 10px 0; width: 200px; background: #FFF url("../images/layout/wrap-bg.jpg") repeat-y; float: left;}
#menu ul {
	font: bolder 13px 'Trebuchet MS', sans-serif;
	width: 200px;
	color: #FFF;
	margin: 0 15px;
	padding: 0;
	display: block;	
}
#menu li {
	float: left;
	list-style: none;
	display: block;
	background-color: #0B3641;
	width: 200px;
	text-align: left;
}
/*The code below formats the current page menu item to a lighter blue.*/
#menu li.menu-current {
	background-color: #0067A1;
	color: #FFF;
}

#menu li a {display: block; padding: 5px 15px; color: #FFF; text-decoration: none;}
#menu li a:hover {background: #E0E15B; color: #FFF;}
#menu li a:active {background: #0067A1; color: #FFF;}
/*The code below formats the submenus so that they line up with the parent by reducing the margin by 15px. The text is indented by 15px*/
#menu ul li ul li {
	width: 200px;
	color: #FFF;
	margin: 0 -15px;
	padding: 0;
	display: block;
	text-indent: 15px;
}

/* content */
#content-wrap {clear: both; float: left; width: 100%; background: #FFF url("../images/layout/content.jpg") repeat-y;}
#content {width: 740px; clear: both; text-align: left; padding: 0; margin: 0 auto;}

/* sidebar main menu */
#sidebar {
	width: 200px;
	margin: 0 0 10px 15px;
	padding: 0;
}
#sidebar h1 {padding: 10px 0px 5px 10px; margin: 0; color: #0067A1;}
.sidebox {margin-bottom: 10px;}

/* sidebar menu */
#sidebar ul.sidemenu {list-style:none; margin: 10px 0 15px 0; padding: 0;}
#sidebar ul.sidemenu li {padding: 0px 10px;}
#sidebar ul.sidemenu a {display:block; font-weight:normal; color: #333; height: 1.5em; padding:.3em 0 .3em 15px; line-height: 1.5em; border-bottom: 1px dashed #D5D5D5; text-decoration:none;}
#sidebar ul.sidemenu a.top{border-top: 1px dashed #D5D5D5;}
#sidebar ul.sidemenu a:hover {padding: .3em 0 .3em 10px; border-left: 5px solid  #0067A1; color: #0067A1;}

/* main content window */
#main {
	float: right;
	width: 530px;
	margin: 10px 15px 10px 0;
	padding: 0;
	text-align: left;
}
#main h1 {padding: 10px 0 5px 5px; margin: 0 0 0 10px; border-bottom: 1px dashed #D5D5D5;}
#main ul li {list-style-image:  url("../images/icons/bullet.gif");}

/* footer */
#footer {clear: both; margin: 0; padding: 12px 0 0 0; font: normal .92em/1.5em 'Trebuchet MS', Tahoma, Arial, sans-serif; height: 45px; background:  url("../images/layout/footer-bg.jpg") no-repeat left bottom; color: #666666; text-align: center;}
#footer p {margin: 0; padding: 0;}
#footer a {text-decoration: none; color: #777;}
#footer a:hover {text-decoration: underline; color: #333;}

/* additional classes */
.float-left {float: left;}
.float-right {float: right;}
.align-left {text-align: left;}
.align-right {text-align: right;}
.clear {clear: both;}
.gray {color: #BFBFBF;}
