@import url("nav.css");

html { height: 100%; }
body { background:url(../images/bg-top.gif) repeat-x top left; padding: 0; margin: 0; height: 100%; color: #535353; font: 1em Verdana, Arial, Helvetica, sans-serif; }

#wrap { width: 760px; background:url(../images/bg-leftpanel-blue.gif) repeat-y top left; position: relative; min-height: 100%; margin: 0; padding: 0; padding-right: 200px; overflow: hidden; }
* html #wrap{ height: 100%; overflow: visible; }

#header { height: 246px; border-bottom: #fff solid 3px; background: url(../images/banner-boy.gif) no-repeat right bottom; }
#header h1 { width: 181px; float: left; margin: 0; padding: 0; border-right: 3px #fff solid; }

#content-area { width: 555px; float: right; display: block; margin: 0 0 10.6em 0; padding: 0 0 40px 0; }
#content-area h1 { font: 4em/0.9em "Trebuchet MS", Arial, Helvetica, sans-serif normal; color: #00B9F1; letter-spacing: -3px; padding: 0; margin: 15px 0 25px 0; }
#content-area p, #left-panel span, address, span.quote  { font-size: 0.7em; line-height: 1.5em; padding: 0; margin: 5px 0 15px 0; }
#content-area ul li, #content-area ol li { font-size: 0.7em; line-height: 1.5em; }


ul.rows { list-style: none; margin: 0 0 20px 0; padding: 0; }
ul.rows li { overflow: hidden; clear: both; margin: 0 0 8px 0; }

img.left { float: left; margin: 0 20px 10px 0; } 

div.column-narrow, div.column-wide { float: right; }
div.column-wide { width: 360px; margin: 0 0 0 15px; }
div.column-narrow { width: 180px; margin: 0 0 20px 0;}

#story-column { width: 260px; float: left; margin: 20px 0 0 0; }
.story-box { border-bottom: 1px dotted #ddd; width: 260px; float: left; margin: 0 0 10px 0;}
.story-box h2 { letter-spacing: -1px; color: #00b9f1; font: 1.8em/0.9em "Trebuchet MS", Arial, Helvetica, sans-serif normal; margin: 0 0 10px 0; padding:15px 0 0 0; background: url(../images/bg-img-btm.gif) no-repeat top right;  }
.story-box img.thb { border: 5px solid #d9d9d9; margin: 0 0 -3px 0; padding: 0;}
p b.lead { color: #333; font: 1.2em/1.3em "Trebuchet MS", Arial, Helvetica, sans-serif; font-weight: bold;}
p span.drop-cap { display: block; float: left; margin: 0 5px 5px 0; font-size: 3em; padding: 10px 5px 4px 0;}

#snippet-column { width: 260px; float: right; margin: 20px 0 0 0;}
#snippet-column h2 { padding: 2px 10px 10px 30px; background: url(../images/icon-arrow-down-snippet.gif) no-repeat left 2px; color: #ef5ba1; margin: 0; font: 2em/0.9em "Trebuchet MS",sans-serif; font-weight: bold; }

#snippets { list-style: none; margin: 10px 0 0 0; padding: 0; }
#snippets li { margin: 8px 0 15px 0; float: left;}
#snippets li span.more { clear: both; display: block; height: 20px; background: url(../images/bg-more.gif) repeat-x left top; margin: 0; }
#snippets li span.more a { width: 47px; height: 20px; display: block; float: right; background: url(../images/btn-more-pink.gif) no-repeat left top; }
#snippets li a img { float: left; margin: 5px 0 15px 5px; border: 4px #ededed solid; }
#snippets li a:hover img { border: 4px #ef5ba1 solid; }
#snippets li p { margin: 0 0 0 105px; font-size: 1em; }

#banner-area { width: 260px; height: auto; background: #ccc; margin: 0 0 20px 0;}

div.thumb-area { border-top: 1px dotted #ddd; padding: 7px 0; clear: both; }
div.thumb-area img { margin: 7px 7px; }

div.article-list { clear: both; padding: 7px 0; }
div.article-list h2 { color: #ef5ba1; border-bottom: 1px dotted #8d5a97; font: 1em "Trebuchet MS", Arial, Helvetica, sans-serif; font-weight: bold; padding: 0 0 11px 30px; background: url(../images/icon-arrow-down.gif) no-repeat 5px 3px; margin: 0;}
div.article-list ul { margin: 0 0 10px 0; padding: 0; list-style: none; }
div.article-list ul li { margin: 0; padding: 0; display: inline; }
div.article-list li a { color: #535353; background: url(../images/icon-plus-grey.gif) no-repeat 7px center; font-size: 1.2em; text-decoration: none; display: block; border-bottom: 1px dotted #f1befb; padding: 5px 5px 5px 30px; margin: 0; }
div.article-list li a:hover { background: #fff5c1 url(../images/icon-plus-white.gif) no-repeat 7px center ; }

div.news-block { margin: 10px 0 30px 0; clear: both; overflow: visible; }
div.next-prev-nav { clear: both; }
div.next-prev-nav a span { display: none; }
div.next-prev-nav a { display: block; height: 13px; }
a.prev { float: left; background: url(../images/btn-prev.gif) no-repeat left top; width: 96px; }
a.recent { float: right; background: url(../images/btn-recent.gif) no-repeat left top; width: 85px; }

ul.rows strong.sub-heading { font-size: 1em; color: #a066ab; margin: 0 0 4px 0; }
ul.rows img.left { margin-bottom: 20px; }
strong.question, strong.sub-heading, .news-block h2 { color: #ef5ba1; font-size: 0.9em; display: block; margin: 0 0 10px 0; }
address { font-style: normal; }

p a, address a { color: #0288b0; text-decoration: underline; }
p a:hover, address a:hover { color: #004b61; }
p strong.sub-heading { font-size: 1em; margin: 0; }
ul li .sub-heading a { text-decoration: none; color: #ef5ba1; }
span.fine-print, span.fine-print-desc { font-size: 9px; display: block; }

span.back { display: block; }
span.quote { display: block; padding: 20px; background: #e9f8fd; font-style: italic; font-size: 11px; }
span.top { clear: both; margin: 5px 0 10px 0; display: block; background: url(../images/dot-light-purple.gif) repeat-x center center; height: 15px; }
span.top a { display: block; height: 15px; width: 31px; float: right; background: url(../images/btn-top.gif) no-repeat top left;;}

#left-panel { display: block; float:left; width: 181px; margin: 0 0 0 0; text-align: center; padding-bottom: 12em; }
#left-panel h2 { text-align: center; height: 36px; margin: 0 0 15px 0; }
#left-panel h2 span { display: none; }
#left-panel span { padding:2px; margin: 15px; text-align: left; display: block; }
#left-panel span.form { padding: 5px 5px 30px 5px; background: #00b9f1; margin: 10px; }
#left-panel span.form label { color: #fff; display: block; margin: 0;}
#left-panel span.form em.fine-print { padding: 0 0 10px 0; color: #fff; font-size: 9px; line-height: 12px; font-style: normal; display: block; border-bottom: 1px dotted #ddd; }
#left-panel span.form em.fine-print a { color: #fff; }
#left-panel span.form input.textfield { width: 142px; margin: 0 0 10px 0; border: #03a0cf 1px solid; padding: 3px; font-size: 11px;}

#donate-box { background: #ffd400; padding: 0 0 20px 0; border-bottom: 3px #fff solid; }
#donate-box h2 { background: #e20025 url(../images/heading-donate.gif) no-repeat center center;  }

#newsletter-box { clear: both;  }
#newsletter-box h2 { background: #00b9f1 url(../images/heading-newsletter.gif) no-repeat center center; }

#footer { height: 170px; position: relative; margin: -10.6em 0 0 0; background: #ef5ba1 url(../images/bg-footer.gif) repeat-x top left; }
#footer ul { padding: 0; list-style-type: none; padding: 20px 0 19px 0; margin: 0 0 0 200px; color: #fff; }
#footer ul li { display: inline; margin: 0 5px; font-size: 0.7em; }
#footer a { color: #f8deea; text-decoration: none; border-bottom: dotted #fff 1px; }
#footer a:hover { color: #fff; border-bottom: solid #fff 1px; }
/* html #footer { margin-top: -5em; } */

.user-form { clear: both; display: block; margin: 0 0 10px 0; padding: 0; }
.user-form span.legend-replace { color: #ef5ba1; letter-spacing: -1px; font: 1em "Trebuchet MS", Arial, Helvetica, sans-serif; font-weight: bold; display: block; background: #fff5c1 url(../images/icon-arrow-form.gif) no-repeat 15px 10px; padding: 7px 10px 10px 40px; margin: 0 -500px 0 0;}
.user-form em, span.key { color: #e5405b; }
.user-form ol { list-style: none; margin: 0; padding: 0; }
.user-form li {	padding: 7px 4px 10px 20px; clear: both; overflow: hidden; display: block; }

*html .user-form li { overflow: visible; }

.user-form li.odd { background: #fffef8; }
.user-form li label, .user-form li .radio-legend { display: block; float: left; width: 150px; margin: 0; }
.user-form input.textfield, .user-form textarea, .textfield-s, .textfield-s2 { background: #fbfbfb; width: 370px; border: #c5c5c5 1px solid; padding: 3px; margin: 0; }

.user-form input:focus.textfield, .user-form textarea:focus, .textfield-s:focus, .textfield-s2:focus { border: #ef5ba1 1px solid; background: #fff; }
.user-form li label.description { width: 470px; float: none; padding: 0 20px 0 0; margin: 0; }

*html .user-form li label.description { margin-top: -15px; }

.user-form li input.radio-left { float: left; margin: 0; clear: none; width: 15px;}

legend { display: none; }
span.key { display: block; margin: 0; padding: 7px; background: #fffef8; border: 1px solid #fff;}
fieldset { border: none; padding: 0; margin: 0 0 10px 0; background: #fffadd; }
.user-form li.odd fieldset { background: none; }

.textfield-s { width: 50px; }
.textfield-s2 { width: 150px; }

.btn-right { float: right; margin: 5px 0 10px 0; }
.btn-right-tight { float: right; margin: -15px 15px; clear: both; overflow: hidden; }

#donate-lead { float: left; width: 232px; background: #fff5c1 url(../images/bg-donate-lead.gif) repeat-x top left; margin: 0 20px -10px 0; padding: 12px 20px 20px 20px;}
#donate-lead strong { letter-spacing: -1px; font: bold 1.5em "Trebuchet MS", Arial, Helvetica, sans-serif; color: #a066ab; }

#banner {
	position: absolute;
	padding-top: 20px;
	left: 780px;
}

#brickTile {
	padding-left: 0px;
}
#brickTile h2 {
	margin: 0px;
	padding: 0px;
}
#brickTile #tileContent {
	border: 0px solid magenta;
	position: relative;
	top: 0px;
	background: url(../images/brick2.jpg) bottom right no-repeat;
}
#brickTile #tileContent img {
	position: absolute;
	bottom: 0px;
	right: 1px;
}
#brickTile p {
	margin: 0px;
	margin-right: 303px;
	padding: 4px 0px;
}
#brickTile img.right {
	float: right;
	clear: both;
	border: 1px solid cyan;
}
#brickTile h2 img {
	float: none;
}
#brickContent {
	clear: both;
}
.user-form span.legend-replace {
	margin: 0px;
}

span.print-field { display: none; }