@charset "UTF-8";
/* CSS for layout */

body {background: #ffffff; margin: 0; padding: 0;}
.clear {clear: both;}
.hidden {display: none;}

#header {background: #0033CC url(images/header-bg.png) top repeat-x; position: relative; width: /*800px*/ 80%; height: 81px; color: #FFFFFF; margin: 10px auto 4px auto;}
#headerLogo {position: absolute; bottom: 0; left: 0; color: #FFFFFF; text-decoration: none; font-size: 2em; text-transform: uppercase; font-weight: bold;}
#headerLogo img {border: 0;}
#headerRight {position: absolute; top: 0; right: 0; height: 81px; width: 118px; background: url(images/header-right.png);}

#menu {background: #6699FF url(images/menu-bg.png) top repeat-x; height: 34px; line-height: 34px;}
#menuBar {width: /*800px*/ 80%; margin: 0 auto; background: url(images/menu-logo.png) 54px 0 no-repeat; height: 34px; position: relative;}
#menuRight {position: absolute; top: 0; right: 6px; height: 34px; width: 112px; background: url(images/menu-right.png) top no-repeat;}
.MenuBarHorizontal {padding-left: 100px !important; /*position: relative;*/}
.MenuBarHorizontal li {padding: 0; margin: 0; width: auto !important; background: none !important; position: relative; display: inline-block;}
.MenuBarHorizontal li a {background: transparent !important; text-align: center; width: auto; padding: 0 10px; height: 34px; color: #ffffff; display: block; margin: 0;}
.MenuBarHorizontal li a:hover, .MenuBarHorizontal li:hover {background: url(images/menu-active.png) top repeat-x !important;}
.MenuBarHorizontal li ul {background: #f0f0f0; border: none; width: 180px; opacity: 0.95;}
.MenuBarHorizontal li ul li {width: 180px !important; padding: 0; text-align: left;}
.MenuBarHorizontal li ul li a {color: #000000 !important; padding: 0 10px; text-align: left; width: 160px;}
.MenuBarHorizontal li ul li a:hover, .MenuBarHorizontal li ul li:hover {background: #ccd6df !important; color: #000000;}
.more {position: absolute; top: 0; right: 10px;}
.MenuBarHorizontal .more {display: none;}
.MenuBarHorizontal li ul li .more {display: block;}

#body {background: #f1f1f2 url(images/body-bg.png) top repeat-x; width: /*800px*/ 80%; margin: 4px auto;}
#content {margin: 0 50px; padding: 10px; background: #ffffff;}
.angel {background: #e17c7c url(images/angel-bg.png) top repeat-x !important;}
#body.angel h1 {color: #E17C7C !important;}
#body.angel h1:first-letter {color: #C1272D !important;}
.sycamore {background: #8ac58d url(images/sycamore-bg.png) top repeat-x !important;}
#body.sycamore h1 {color: #39B54A !important;}
#body.sycamore h1:first-letter {color: #009245 !important;}
#body.narrow #content {margin: 0 270px 0 50px;}
#sidebar {float: right; width: 250px; padding: 10px;}
#sidebar p {margin: 0; padding: 0 0 10px 0;}

#applicationForm p label {display: inline-block; width: 180px;}
#applicationForm input[type=text], #applicationForm textarea {border: 1px inset #a0a0a0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
#applicationForm p textarea {width: 100%; height: 100px; font-family: sans-serif; font-size: 1em;}
#applicationForm p textarea.address {width: 400px; vertical-align: top;}
#applicationForm p input.shortInput {width: 20px;}
#applicationForm h2 {border-top: 1px dotted #6091C2; padding-top: 20px; margin-top: 20px;}
#applicationForm .highlightable:hover {background: #f0f0f9;}
#applicationForm p.highlightable {margin: 0; padding: 6px 0;}
#applicationForm tr.highlightable td {padding: 6px 0;}
#applicationForm .req {color: #900000;}
.errors {background: #ffe0e0; border: 1px solid #a03030; padding: 5px; margin: 0 0 10px 0;}
.required {background: #ffe0e0;}

.article {background: #f0f0f0; padding: 10px; margin: 0 0 10px 0; -moz-border-radius: 6px; -webkit-border-radius: 6px;}
.article h3 {margin: 0; padding: 0;}
.article h3 a {color: #6091C2; text-decoration: none; font-size: 1.2em; letter-spacing: -0.04em;}
.article .articleDate {color: #606060; font-size: 0.9em; font-style: italic; margin-bottom: 6px;}

.jot-comment {clear: left; padding: 10px 0;}
.jot-user {float: left; width: 17%; margin-right: 20px;}
.jot-username {font-size: 1.2em; font-weight: bold;}
.jot-content {float: left; width: 79%; background: #6091C2; -webkit-border-radius: 10px;}
.jot-message, .jot-extra {padding: 10px; color: #ffffff;}

.jot-form fieldset {border: 0; background: #f0f0f0; -webkit-border-radius: 10px; padding: 10px;}
.jot-form label {display: block; padding: 5px 0; width: 400px; text-align: right;}
.jot-form label input, .jot-form label textarea {width: 300px; margin-right: 5px; vertical-align: top;}
.jot-captcha {margin-left: 200px;}
.jot-form input[type=submit] {margin-left: 100px;}

#questions {border: 1px solid #6091C2; padding: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; margin: -30px 0 10px 0; background: #ffffff;}
.question, .answer {display: none; cursor: pointer;}
.question .answer {padding: 5px 0 0 20px; color: #606060;}
.question .hint {color: #c0c0c0; font-size: 0.8em; float: right;}

#footer {background: #6699FF url(images/menu-bg.png) top repeat-x; height: 34px; line-height: 34px; width: /*800px*/ 80%; margin: 0 auto 4px auto; color: #ffffff; font-size: 0.85em;}
#footerLeft {float: left; padding-left: 10px;}
#footerRight {float: right; padding-right: 10px;}
#footer a {color: #FFFFFF; text-decoration: none;}
#footer a:hover {text-decoration: underline;}