@import"css/reset.css";

/*  
Theme Name: Reachout
Theme URI: http://we-reachout.org/
Description: Firm Media Template custom designed for Reachout
Version: 1.0
Author: Thom Meredith
Author URI: http://firm-media.com/


*/

/* Colors 
Green #96bf27
Bright Green #a6e34d
Navy #213364
Blue #0082c6
Follow Blue #60b6e6
Involved: #00082b
Support: #00256f
News & Events: #0b7fc0
Text: #1f3764
text hover: #bed73b
*/

/*********************/
/** COLOR USAGE **/
/*********************/
body {
	background: #96bf27 url(img/basic/body-bg.jpg) repeat-y top center;}

.content, .textblock h3, #snav .current_page_item a, #mnav a {
	color: #213364;}

.social #follow {
	color: #60b6e6;}
	
#boxes {
	color: #ffffff;}
	
#boxes #involve {
	background: #003365 url(img/basic/involved-btm.gif) no-repeat bottom left;}
	
#boxes a {
	color: #ffffff;}
	
#boxes a span {
	color: #bed73b;}
	
#involve h2 {
	background: #002350 url(img/basic/involved-bg.gif) no-repeat top left;}
	
#boxes #support {
	background: #0d56a0 url(img/basic/support-btm.gif) no-repeat bottom right;}

#support h2 {
	background: #21347a url(img/basic/support-crnr.gif) no-repeat top right;}
	
#boxes #events {
	background: #0b7fc0 url(img/basic/events-btm.gif) no-repeat bottom left;}
	
#events h2 {
	background: #2a3d8c url(img/basic/news-event-crnr.gif) no-repeat top right;}
	
#pnav a, #fnav a, #pnav li, #fnav li, .post .title, .post h1, .post h2, .quotes blockquote, .quotes .attribution, .textblock p, #snav a, content a, a, .blue {
	color: #0082c6;}
	
#boxes a:hover, a:hover {
	color: #bed73b;}
	
#fnav a {
	border-right-color: #0082c6;}
	
.contact p, .contact a {
	color: #003464; }
	
#program-list li {
	background: transparent url(img/basic/ingot.gif) no-repeat top left;}
	
#program-list ul {
	background: transparent url(img/basic/ingot.gif) no-repeat bottom left;}

.post blockquote {
	margin: 0 40px;
}

/*********************/
/** TYPOGRAPHY **/
/*********************/
body {
	font-family: Arial, Helvetica, sans-serif;}

strong {
	font-weight: bold;}

#program-list h3 + div {
	padding-top: 10px;
}

em {
	font-style: italic;}

a {
	text-decoration: none;}
	
.current_page_item, .current_page_item a, .current_page_item a:hover {
	font-weight: bold !important;
	text-decoration: none !important;
	border: 0px;}
	
#mnav, #pnav, #fnav {
	text-transform: uppercase;}
	
#mnav li a {
	color: #213364;
	font-size: 1.4em;
	letter-spacing: .05em;}
	
#pnav li, #fnav li {
	font-size: 1.1em;
	letter-spacing: .05em;
	font-weight: bold;}
	
#pnav li a, #fnav li a {
	font-weight: normal;}
	
#footer p {
	font-size: 1.1em;
	line-height: 1.45em;}

#statement h1 {
	font-size: 1.8em;
	line-height: 1.4em;
	color: #ffffff;
	text-align: right;}
	
.social #follow {
	font-size: 1.8em;
	text-transform: uppercase;
	letter-spacing: .05em;}
	
#boxes h2 {
	font-size: 2.0em;
	text-transform: uppercase;
	letter-spacing: .05em;}
	
#boxes p, #boxes li {
	font-size: 1.2em;
	line-height: 1.333em;}
	
#boxes li:hover {
	background-color: #00529c;}
	
.post .title, .post h1, .post h2 {
	font-size: 2.0em;}
	
.post .content {
	font-size: 1.2em;
	line-height: 1.5em;}
	
.quotes blockquote, .quotes .attribution, .textblock {
	font-size: 2.0em;
	line-height: 1.8em;}
	
.quotes .attribution {
	font-style: italic;}
	
.contact p {
	font-size: 1.2em;
	line-height: 1.333em;}
	
#snav li {
	font-size:1.4em;
	line-height: 1.285em;
	text-transform: uppercase;
	letter-spacing: .05em;}

.textblock .title {
	text-transform: uppercase;
	letter-spacing: .05em;}
	
.subtitle {
	font-family: Georgia, Times, serif;
	font-size: 1.333em;
	line-height: 1em;
	font-style: italic;}
	
.post .emphasis {
	font-weight: bold;
	font-size: 1.1666em;
	line-height: 1.2857em;}
	
#mnav a:hover, #pnav a:hover, #snav a:hover {
	padding-bottom: 2px;
	border-bottom: 1px solid;}
	
#fnav a:hover {	
	text-decoration: underline;}
	
.contactform h4 {
	font-size: 2.0em;
	letter-spacing: .05em;
	text-transform: uppercase;}

/*********************/
/** STRUCTURE **/
/*********************/

.clearfloat {
	clear: both;}

#rap {
	width: 976px;
	margin: 0 auto;
	position: relative;}

#rap {
	background: transparent url(img/basic/rap-bg.gif) repeat-y top left;}
	
#header {
	margin-top: 30px;
	background: transparent url(img/basic/body-top.jpg) no-repeat top left;
	padding: 13px 17px 13px 12px;}
	
#logo {
	width: 236px;
	height: 74px;}
	
#mnav, #pnav {
	float: right;
	display: inline;}
	
#mnav li, #pnav li, #fnav li{
	float: left;
	display: inline;}

#mnav {
	margin-top: 30px;}
	
#mnav li {
	margin-left: 44px;}

#pnav {
	margin-top: -105px;}
	
#pnav li {
	margin-left: 28px;}
	
#body {
	padding: 0 17px 16px;
	overflow: auto;
	background: transparent url(img/basic/body-btm.jpg) no-repeat bottom left;}
	
#statement, #vid, .social {
	float: left;
	display: inline;}	
	
#statement {
	position: relative;
	margin-right: 10px;}
	
#statement h1 {
	position: absolute;
	top: 82px;
	right: 20px;
	width: 268px;
	height: 170px;}
	
#vid {
	margin-bottom: 8px;}
	
.social {
	width: 310px;
	height: 63px;
	background: transparent url(img/basic/social-bg.png) no-repeat top left;}
	
.social #follow, .social #twitter, .social #facebook, .social #flickr {
	float: left;
	display: inline;
	margin-top: 15px;}
	
.social #follow {
	padding-top: 9px;
	margin: 15px 24px 0 19px;}
	
.social #twitter, .social #facebook, .social #flickr {
	margin-right: 4px;}
	
#boxes {
	padding-top: 8px;
	width: 940px;
	overflow: auto;}
	
#boxes div {
	float: left;
	display: inline;
	width: 313px;
	min-height: 224px;}
	
#boxes #support {
	width: 314px;}
	
#boxes p {
	margin-bottom: 12px;
	padding: 0 16px;}
	
#boxes li {
	margin: 0px 16px 0px 9px;
	padding: 3px 40px 3px 7px;}
	
#boxes li a{
	padding: 0px;}
	
#boxes h2  {
	padding: 16px 16px 12px;}
	
#boxes #events h2 {
	margin-bottom: 17px;}
	
#boxes h2 {
	font-size: 2.0em;
	text-transform: uppercase;
	letter-spacing: .05em;
	margin-bottom: 20px;}
	
#content-section {
	background: #ffffff url(img/basic/content-bg.gif) no-repeat bottom left;
	margin-top: 35px;
	padding-bottom: 72px;
	overflow: auto;}
	
.home #content-section{
	padding-bottom: 0;
}
	
#leftCol, #rightCol {
	display: inline;
	float: left;}
	
#leftCol {
	width: 557px;
	margin-right: 67px;
	padding-left: 16px;}
	
.post .title {
	margin-bottom: 16px;}
	
.second .post .title {
	margin-top: 0px;}
	
.second .post h1, .second .post h2 {
	margin-top: 32px;
	margin-bottom: 4px;}
	
.post .content p, .post .content ul {
	margin-bottom: 14px}
	
#rightCol {
	width: 275px;}
	
.quotes, .textblock {
	margin-bottom: 30px;}
	
.contact p {
	margin-bottom: 12px;}
	
#footer {
	width: 895px;
	margin: 24px auto 100px;}

#fnav {
	margin-bottom: 16px;}

#fnav a{
border-right:1px solid;
margin-right:15px;
padding:3px 15px 4px 0;}
	
#footer p {
	width: 580px;}
	
#firm-media {
	margin: 16px 0 0 -30px;
	padding: 4px 0px 6px 30px;
	background: transparent url(img/basic/firm-media.gif) no-repeat top left;}
	
/* Secondary Pages*/
.second #content-section {
	margin-top: 0px;}

.second #leftCol {
	width: 614px;
	margin-right: 7px;
	padding-left: 0px;}
	
.second #leftCol .post .content {
	padding: 21px 54px 0 16px;}

.second #rightCol {
	background: transparent url(img/basic/sidebar-top.gif) no-repeat top left;
	padding-top: 5px;
	width: 321px;}
	
.second #rightCol .wrapper {
	background: transparent url(img/basic/sidebar-bg.png) repeat-x top left;
	padding: 13px 18px 0;
	min-height: 800px;}
	
#snav {
	margin-bottom: 30px;}
	
.textblock .title {
	margin-bottom: 0px;}
	
.second #rightCol .contactform {
	width: 321px;
	padding-top: 4px;
	margin-left: -18px;
	background: transparent url(img/basic/contact-form-top.png) no-repeat top left;}
	
.second #rightCol .contactform .wrapper {
	background: transparent url(img/basic/contact-form-btm.png) no-repeat bottom left;
	padding: 0 0 4px 0;
	min-height: 190px;}
	
.contactform h4 {
	margin-bottom: 24px;}
	
.contactform form {
	width: 285px;
	padding: 15px 18px 6px;
	overflow-y: auto;
	overflow-x: hidden;
	padding-bottom: 10px;
	background-color: #eff2c8;}
	
input, textarea {
	background: #ffffff none no-repeat top left;
	border: 0px;
	width: 270px;
	padding: 6px;
	margin-bottom: 8px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;}
	
button {
	background: none;
	border: none;
	margin-top: 10px;
	float: right;
	margin-right: -10px;}
	
.post ul {
	padding-left: 12px;}
	
.post ul li {
	list-style-type: disc;}
	
#program-list ul{
	padding-left: 0px;
	padding-bottom: 1px;}

#program-list li {
	padding-top: 22px;
	margin-bottom: 15px;
	list-style-type: none;}
	
#support-list ul {
	padding-left: 0px;
	overflow: auto;}
	
#support-list li {
	list-style-type: none;
	float: left;
	display: inline;
	margin-right: 6px;
	width: 130px;}
	
#support-list li:last-child {
	margin-right: 0px;}
	
#news li {
	padding-bottom: 16px;
}

#fax {
	display: none;
}