
/*** GENERAL STYLES ***/

body {background: #ccc; text-align: center; margin: 0; padding: 0 0 20px 0;}
body, th, td, h1, h2, h3, h4, h5, h6, select, input, textarea {font-family: arial, helvetica, sans-serif; font-size: 13px; color: #222;}
body, th, td, h1, h2, h3, h4, h5, h6 {line-height: 18px;}
form, h1, h2, h3, h4, h5, h6 {margin: 0; padding: 0;}

img, table, fieldset {border: 0;}
ul, ul li {list-style: none; margin: 0; padding: 0;}
p {margin: 0 0 1.5em 0;}
a {color: #369; text-decoration: none;}
a:hover {text-decoration: underline;}
a.arrowlink {padding-left: 10px; background: url(../images/arrow-blue.gif) 0 4px no-repeat;}
a.backlink {padding-left: 10px; background: url(../images/arrow-back.gif) 0 4px no-repeat; position: absolute; right: 25px; top: 78px;}

.hide {display: none;}
.alert {color: #c00;}
.small {font-size: 11px;}
.large {font-size: 14px;}

.floatleft {float: left;}
.floatright {float: right;}
.imgleft {float: left; margin: 0 15px 15px 0;}
.imgright {float: right; margin: 0 0 15px 15px;}
.spacer {float: none; clear: both; height: 1px; overflow: hidden;}
.clear {float: none; clear: both;}

.half {width: 50%;}
.third {width: 33%;}
.quarter {width: 25%;}

.ir {display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
a .ir {cursor: pointer;}


/*** STRUCTURAL STYLES ***/

#outer {position: relative; width: 986px; margin: 0 auto; text-align: left; background: #fff; border: solid #fff; border-width: 0 2px;}

#top {position: relative; height: 102px; border-bottom: 1px solid #fff; background: url(../images/top.jpg); text-transform: uppercase;}
#top h1 a {position: absolute; left: 0; top: 0; width: 175px; height: 67px; padding-top: 35px; font-size: 15px; line-height: 20px; text-align: center; color: #aaa;}
#top h1 strong {display: block; color: #24427c; font-size: 27px;}
#top h1 .ir {background: url(../images/logo.gif);}
#top ul {position: absolute; right: 20px; top: 45px; overflow: hidden; font-size: 11px;}
#top li {float: left; position: relative; left: 1px; border-right: 1px solid #24427c; line-height: 14px;}
#top li a {padding: 0 10px; color: #24427c;}

#nav {height: 57px; background: #849fc0; border-bottom: 2px solid #fff;}
#nav .spacer {height: 6px; background: #888; border-bottom: 2px solid #fff;}
#nav h2 {float: right; padding: 0 20px; line-height: 49px; color: #fff; font-size: 18px; font-weight: normal;}
#nav ul {text-transform: uppercase;}
#nav li {float: left; border-right: 1px solid #fff;}
#nav a {display: block; border-top: 6px solid #849fc0; padding: 14px 15px 0 15px; color: #fff;}
#nav li.on a {color: #222;}
#nav a:hover {border-color: #b1c9e1; text-decoration: none;}

#content {position: relative; float: right; width: 704px; padding: 25px 25px 35px 25px;}
	body.home #content {float: left; width: 609px; padding: 35px;}
#sidebar {float: left; width: 230px; padding: 49px 0 35px 0;}
	body.home #sidebar {float: right; width: 305px; padding: 0 0 35px 0;}


/*** CONTENT STYLES ***/

#content ul {margin: 1.5em 20px;}
#content ul li {position: relative; padding-left: 10px; background: url(../images/bullet.gif) 0 8px no-repeat; margin-bottom: 5px;}
#content #homelist {position: relative; overflow: hidden; margin-top: .5em; margin-left: 0; height: 18px;}
#content #homelist li {float: left; position: relative; right: 15px; padding: 0 11px 0 15px;}
#content h1 {background: #888; line-height: 49px; padding: 0 20px; color: #fff; font-size: 18px; font-weight: normal; margin: -25px -25px 25px -25px;}
#content h2 {font-size: 18px; font-weight: normal; line-height: 22px; margin-bottom: 1em; color: #24427c;}
	body.home #content h2 {font-size: 15px; font-weight: bold; line-height: 18px;}
#content h3 {color: #24427c; font-size: 12px; margin: 20px 0 5px 0; text-transform: uppercase;}

#casephotos {position: relative; height: 300px; border-bottom: 1px solid #eee; padding-bottom: 20px;}
#casephotos .thumb {position: absolute; left: 87px; width: 100px; height: 75px; text-align: right;}
	#casephoto1 {top: 0;}
	#casephoto2 {top: 90px;}
	#casephoto3 {top: 180px;}
#casephotos .thumb img {width: 100px; height: 75px;}
#casephoto0 {position: absolute; left: 202px; top: 0; width: 400px; padding-left: 15px; height: 300px; text-align: center; border-left: 1px solid #eee;}
#casephoto0 img {width: 400px; height: 300px;}
#caseinfo h3 {text-transform: none; font-size: 14px; color: #666; margin-bottom: 10px;}
#caseinfo .clear strong {float: left; width: 80px; padding-right: 10px;}

#content blockquote {margin: 2em 0; padding: 0 0 0 17px; background: url(../images/blockquote.gif) 0 0 no-repeat;}
#content blockquote p {margin-bottom: .8em;}
#content blockquote cite {font-size: 11px; color: #444; font-style: normal; line-height: 14px;}
#content blockquote cite strong {font-size: 12px;}
.endquote {position: relative; margin-left: 3px; top: 4px; color: #ccc; font-size: 22px; font-family: "times new roman", times, serif; font-weight: bold; line-height: 1px;}

.pagephoto {border-top: 6px solid #849fc0; margin: 0 0 30px 30px;}
.caption {background: #849fc0; padding: 10px; font-size: 11px; line-height: 13px; color: #fff;}

.team {clear: both; padding: 0; margin: 0;}
.team .photo {float: right; width: 79px; margin: 20px 0 1.5em 0;}
.team .photo img {width: 79px; height: 100px;}
.team .bio {float: left; width: 605px;}

.community {clear: both; border-top: 1px solid #eee; padding: 1em 0; margin: 0;}
.community .logo {float: right; width: 120px; text-align: center; margin-bottom: 1em;}
.community .description {float: left; width: 564px; margin-bottom: 1em;}

#content ul.newslist li {margin-bottom: 10px;}

#contactform {margin: 2em 0;}
#contactform div {clear: left; padding-top: 5px;}
#contactform label {float: left; width: 70px; padding-left: 15px;}
#contactform .required {background: url(../images/required.gif) left center no-repeat;}
#contactform input, #contactform textarea {width: 250px; border: 1px solid #ccc;}
#contactform textarea {height: 100px;}
#contactform #contactsubmit {margin-left: 85px; width: 80px; background: #849fc0; color: #fff; font-size: 12px; text-transform: uppercase; font-weight: bold;}


/*** SIDEBAR STYLES ***/

#sidebar {background: no-repeat;}
	body.home #sidebar {background: none;}
	body.projects #sidebar {background-image: url(../images/sidebar-projects.jpg);}
	body.about #sidebar {background-image: url(../images/sidebar-about.jpg);}
	body.news #sidebar {background-image: url(../images/sidebar-news.jpg);}
	body.contact #sidebar {background-image: url(../images/sidebar-contact.jpg);}

#subnav {background: #eee; font-size: 12px; line-height: 15px; border-top: 2px solid #fff;}
#subnav li {border-bottom: 1px solid #ddd;}
#subnav a {display: block; padding: 7px 15px; color: #222; text-transform: uppercase; text-decoration: none; width: 200px;}
#subnav a:hover {background: #849fc0; color: #fff;}
#subnav li.on {background: #ddd;}
#subnav ul {padding-bottom: 3px; display: none;}
#subnav li.on ul {display: block;}
#subnav ul li {border: 0;}
#subnav li.on ul a {padding: 5px 15px 5px 25px; text-transform: none; background: url(../images/arrow-888.gif) 15px 7px no-repeat; width: 190px;}
#subnav li.on ul a:hover {background: #888 url(../images/arrow-fff.gif) 15px 7px no-repeat;}
#subnav ul li.on a {color: #fff; background-color: #849fc0; background-image: url(../images/arrow-fff.gif);}

#sidebar blockquote {margin: 0; padding: 25px; color: #369; font-weight: bold; background: url(../images/blockquote.gif) 10px 25px no-repeat;}
	body.home #sidebar blockquote {padding: 20px; background-position: 5px 20px;}
#sidebar blockquote cite {font-size: 11px; color: #888; font-style: normal; font-weight: normal; line-height: 12px;}
#sidebar blockquote cite strong {font-size: 12px;}

#rightbar {float: right; width: 220px; padding: 30px; background: url(../images/rightbar.gif) no-repeat; min-height: 200px; position: relative; left: 25px; top: -23px; font-size: 12px; margin: 0 0 20px 30px;}
	body.contact #rightbar {width: 150px; padding: 30px 25px; margin: 0 0 10px 10px;}
#rightbar h3 {margin: 0 0 15px 0; text-transform: none; font-size: 14px;}
#rightbar ul {margin: 5px 0; line-height: 14px;}
#rightbar ul li {margin-bottom: 8px; background-position: 0 5px;}


/*** HOME STYLES ***/

#homehero {margin: -35px -35px 35px -35px; background: #222;}
#homehero h3 {font-size: 18px; color: #fff; line-height: 50px; padding: 0 35px; margin: 0; border-top: 2px solid #fff;}

#homenews {position: relative; background: #888; padding: 15px; border-bottom: 2px solid #fff;}
#homenews * {color: #fff;}
#homenews h4 {padding: 10px 20px; background: #777; margin: -15px -15px 10px -15px; line-height: 16px;}
#homenews h4 strong {text-transform: uppercase;}
#homenews h4 a {position: absolute; right: 15px; top: 0; font-size: 11px; line-height: 36px;}
#homenews h4 a:hover {text-decoration: underline;}
#homenews ul {font-size: 11px; line-height: 14px;}
#homenews li a {display: block; padding: 8px 5px; width: 265px;}
#homenews a:hover {background: #777; text-decoration: none;}

#homefeature {background: #eee; color: #888; font-size: 12px;}
#homefeature img {border-bottom: 2px solid #fff; width: 305px;}
#homefeature h4 {float: left; width: 85px; padding: 0 0 0 15px; color: #aaa; font-size: 20px; line-height: 50px; font-weight: normal; text-transform: lowercase; }
#homefeature p {float: right; width: 175px; padding: 10px 30px 10px 0; margin: 0; line-height: 16px;}
#homefeature a {color: #888; text-decoration: none;}
#homefeature a:hover {color: #369; text-decoration: underline;}


/*** FOOTER STYLES ***/

#footer {border-top: 4px solid #eee; line-height: 50px; text-align: right;}
#footer p {margin: 0; padding: 0 20px; font-size: 11px; color: #888;}
#footer a {color: #888; text-decoration: underline;}
#footer a:hover {color: #369;}
