/*  
Theme Name: Custom Theme
Theme URI: http://www.allisonbowlus.com/
Description: Custom Theme for JusticeWorks YouthCare
Version: 1.0
Author: Allison Bowlus
Author URI: http://www.allisonbowlus.com/

*/

/*********************************************************************************
BODY*/

h1, h2, h3, h4, h5, h6, blockquote, p, img {
	margin: 0;
	padding: 0;
}

blockquote.post	{
	border-left:4px solid #9ca8b4;
	padding:0 0 0 15px;
	margin-left:12px;
}


h1 {
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:bold;
	color:#38547a;
	margin:0 0 10px 0;
}

h1 em {
	font-size:14px;
	margin:0 0 5px 0;
	color:#333;
	font-family:Arial, Helvetica, sans-serif;
	font-style:normal;
}

h2 {
	font-size:12px;
	margin:0 0 5px 0;
	color:#333;
}



h3 {
	font-size:12px;
	margin:0 0 5px 0;
	color:#333;
	font-weight:normal;
}

h2 em {
	font-size:13px;
	margin:0 0 5px 0;
	color:#333;
	font-family:Arial, Helvetica, sans-serif;
	font-style:normal;
}

body {
	background-image:url(img/bg_body.png);
	margin:0 auto;
	padding:0;
	font-family:Arial, Helvetica, sans-serif;
}


a:link {
	font-weight:900;
	color:#2d4a72;
	text-decoration:none;
}

a:active {
	font-weight:900;
	color:#2d4a72;
	text-decoration:none;
}

a:visited {
	font-weight:900;
	color:#2d4a72;
	text-decoration:none;
}

a:hover {
	font-weight:900;
	color:#2d4a72;
	text-decoration:underline;
}

hr {
	height:1px;
	border:0px;
	background-color:#9ca8b4;
	margin:15px 0 15px 0;
	clear:left;
}

#alignleft {
	float:left;
}


#alignright {
	float:right;
}

/*********************************************************************************
BACKGROUND IMAGERY*/

div#gradient {
	background-image:url(img/bg_grad.png);
	background-repeat:repeat-x;
	margin:0 auto;
	padding:0;
	width:100%;
	height:auto;
	min-height:600px;
}

div#smooth {
	background-image:url(img/bg_smooth.png);
	background-repeat:no-repeat;
	background-position:top;
	margin:0 auto;
	padding:0;
	max-width:1286px;
	min-height:325px;
}
/*********************************************************************************
CONTENT IMAGERY*/
table#content {
	margin:0 auto;
	padding:0;
	width:786px;
	height:auto;
	border:0;
	background-image:url(img/bg_content.jpg);
	background-repeat:repeat-y;
}

span.postInfo {
	font-size:12px;
	font-style:italic;
	padding:0px;
	margin:7px 30px 0px 0px;
}

a img.header {
	border:0px;
	text-decoration:none;
}

img.post {
	width:450px;
	height:auto;
}

.post small {
	font-weight:bold;
}

img.bio {
	float:left;
	clear:right;
	margin:6px 8px 8px 0;
}

img#values {
	padding:0;
}

#banner {
	margin:0;
	padding:0;
	height:319px;
	width:786px;
}

/*********************************************************************************
SIDE DIV*/

td#sideBar {
	border:0px solid #000;
	width:197px;
	vertical-align:top;
}

td#sideBar ul {
	margin:0;
	padding:0;
	list-style-type:none;
}

div.sidebarHeader {
	margin:15px 0 4px 0;
	padding:0;
	list-style-type:none;
	font-size:12px;
	font-weight:bold;
	color:#2d4a72;
}

li.sidebarListItem {
	margin:0;
	padding:0;
}

li.sidebarListItem ul li {
	margin:5px 0 5px 0;
	padding:0;
	list-style-type:none;
	font-size:11px;
}


li.sidebarListItem a:link {
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight:bold;
	color:#333;
}

li.sidebarListItem a:visited {
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight:bold;
	color:#333;
}

li.sidebarListItem a:hover {
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight:bold;
	color:#333;
}


li.sidebarListItem a:visited {
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight:bold;
	color:#333;
}

/*********************************************************************************
SEARCH FORM*/
#searchsubmit {
	margin:5px 0;
}

#s {
	margin:0;
	padding:0;
}

/*********************************************************************************
CATEGORIES DIV*/
li#categories {
	margin-bottom:30px;
	list-style-type:none;
}

li#categories ul li a:link {
	font-family:Arial, Helvetica, sans-serif;
	color:#333;
	font-size:11px;
}
li#categories ul li a:visited {
	font-family:Arial, Helvetica, sans-serif;
	color:#333;
	font-size:11px;
}

li#categories ul li a:active {
	font-family:Arial, Helvetica, sans-serif;
	color:#333;
	font-size:11px;
}

li#categories ul li a:hover {
	font-family:Arial, Helvetica, sans-serif;
	color:#333;
	font-size:11px;
	
}

li#categories ul li {
	margin:5px 0 0 0;
	padding:0px;
}

/*********************************************************************************
META DIV*/
li#meta {
	padding-bottom:30px;
	list-style-type:none;
}

li#meta h2 {
	margin:5px 0;
	padding:0px;
}

li#meta ul li  {
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight:700;
	color:#333333;
	margin:5px 0 0 0;
	padding:0px;
}

li#meta ul li a:link {
	font-family:Arial, Helvetica, sans-serif;
	color:#333;
	font-size:11px;

}

li#meta ul li a:visited {
	font-family:Arial, Helvetica, sans-serif;
	color:#333;
	font-size:11px;

}

li#meta ul li a:active {
	font-family:Arial, Helvetica, sans-serif;
	color:#333;
	font-size:11px;

}

li#meta ul li a:hover {
	font-family:Arial, Helvetica, sans-serif;
	color:#333;
	font-size:11px;

}


/*********************************************************************************
NAVIGATION*/


div#navigation {
	margin:0;
	padding:0 6px 30px 0;
	height:278px;
	width:173px;
	border:0px;
}


span#navHome {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) 0px 0px;
}

span#navHome:hover {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -176px 0px;
}

span#navHomePage {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -345px 0px;
}

span#navValues {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -0px -34px;
}

span#navValues:hover {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -176px -34px;
}

span#navValuesPage {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -345px -34px;
}


span#navWecanhelp {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -0px -68px;
}

span#navWecanhelp:hover {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -176px -68px;
}

span#navWecanhelpPage {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -345px -68px;
}

span#navOurprograms {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -0px -102px;
}

span#navOurprograms:hover {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -176px -102px;
}

span#navOurprogramsPage {
	float:left;
	margin:0px;
	padding:0px;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -345px -102px;
}

span#navEducation {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -0px -136px;
}

span#navEducation:hover {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -176px -136px;
}

span#navEducationPage {
	float:left;
	margin:0px;
	padding:0px;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -345px -136px;
}

span#navOutcomes {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -0px -170px;
}

span#navOutcomes:hover {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -176px -170px;
}

span#navOutcomesPage {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -345px -170px;
}

span#navManagementteam {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -0px -204px;
}

span#navManagementteam:hover {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -176px -204px;
}

span#navManagementteamPage {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -345px -204px;
}

span#navEmployment {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -0px -238px;
}

span#navEmployment:hover {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -176px -238px;
}

span#navEmploymentPage {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -345px -238px;
}


span#navContactus {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -0px -272px;
}

span#navContactus:hover {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -176px -272px;
}

span#navContactusPage {
	float:left;
	margin:0px;
	padding:0 6px 0 0;
	border:0px;
	height:34px;
	width:173px;
	background:url(../../../../img/nav_menu.gif) -345px -272px;
}

/*********************************************************************************
SIDE DIV*/

td#sideBar {
	border:0px solid #000;
	width:197px;
	vertical-align:top;
}

td#sideBar ul{
	margin:0px 0 0 18px;
	padding:0px;
}

td#sideBar ul ul li a:link {
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight:bold;
	color:#333;
}

td#sideBar ul ul li a:visited {
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight:bold;
	color:#333;
}

td#sideBar ul ul li a:hover {
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight:bold;
	color:#333;
}


td#sideBar ul ul li a:visited {
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	font-weight:bold;
	color:#333;
}

/*********************************************************************************
CONTENT DIV*/

div.container {
	padding:15px 0 0 16px;
	width:535px;
}

div.container small {
	font-size:12px;
	margin:3px 0;
}

div.container p {
	line-height:20px;
	margin:0 55px 0 10px;
	font-size:12px;
	padding:5px 0 9px 0;
}

td#bodyCopy {
	height:auto;
	margin:0;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#404040;
	vertical-align:top;
}

td#bodycopy h1 {
	font-size:15px;
	font-weight:700;
	color:#333333;
	margin:5px 20px 10px 27px;
}

td#bodycopy h2 {
	font-size:14px;
	font-weight:700;
	color:#333333;
	margin:5px 20px 10px 35px;
}

td#bodycopy p {
	line-height:20px;
	margin:5px 30px 20px 35px;
}

ul.page {
	margin:0 50px 0 10px;
	padding:10px 0 30px 30px;
	background-color:#dbe5ec;
}

ul.page li {
	width:410px;
	padding:10px 15px 0 0;
	line-height:20px;
	margin:0;
	color:#264861;
	vertical-align:top;
	list-style-type:none;
	vertical-align:top;
}


/*********************************************************************************
FOOTER*/

div#content h2 {
	padding:0px;
	margin:10px 0 10px 0;
}

div#footerBottom {
	padding-bottom:40px;
}

div#footerBottom div {
	font-size:10px;
	padding:10px 0;
}

ul#footerNav {
	margin:5px 0 0 0;
	padding:0 0 30px 0;
	text-align:right;
}


ul#footerNav li {
	list-style-type:none;
	margin:0px;
	padding:3px 0px;
	float:left;
	min-width:12px;
}

img#footerImg {
	margin:0 0 0 0;
	padding:0px;
	border:0px;
}

ul#footerNav a:link {
	font-size:10px;
	margin:0 4px 0 4px;
	color:#2d4a72;
	text-decoration:none;
	font-weight:300;
}

ul#footerNav a:visited {
	font-size:10px;
	margin:0 4px 0 4px;
	color:#2d4a72;
	text-decoration:none;
	font-weight:300;
}

ul#footerNav a:active {
	font-size:10px;
	margin:0 4px 0 4px;
	color:#2d4a72;
	text-decoration:none;
	font-weight:300;
}

ul#footerNav a:hover {
	font-size:10px;
	margin:0 4px 0 4px;
	color:#2d4a72;
	text-decoration:underline;
	font-weight:300;
}

div#footerNav {
	margin:15px 7px 0 0;
}

/*********************************************************************************
COMMENTS*/

.comments-template	{
	margin: 10px 0 0;
	padding: 10px 0 0;
	}

.comments-template ol	{
	margin: 0;
	padding: 0 0 15px;
	list-style: none;
	}

.comments-template ol li	{
	margin: 10px 0 0;
	line-height: 18px;
	padding: 0 0 10px;
	border-bottom: 1px solid #ccc;
	}

.comments-template h2, .comments-template h3	{
	font-family:Arial, Helvetica, sans-serif;
	font-size: 14px;
	}

.commentmetadata	{
	font-size: 12px;
	}

.comments-template p.nocomments	{
	padding: 0;
	}

.comments-template textarea	{
	font-family: Arial, Helvetica, Georgia, Sans-serif;
	font-size: 12px;
	}

/* SpryCollapsiblePanel.css - version 0.5 - Spry Pre-Release 1.6.1 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/* This is the selector for the main CollapsiblePanel container. For our
 * default style, the CollapsiblePanel is responsible for drawing the borders
 * around the widget.
 *
 * If you want to constrain the width of the CollapsiblePanel widget, set a width on
 * the CollapsiblePanel container. By default, our CollapsiblePanel expands horizontally to fill
 * up available space.
 *
 * The name of the class ("CollapsiblePanel") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style the
 * CollapsiblePanel container.
 */
.CollapsiblePanel {
	margin:0 50px 0 25px;
	padding: 0px;
	border:0px;
}

/* This is the selector for the CollapsiblePanelTab. This container houses
 * the title for the panel. This is also the container that the user clicks
 * on to open or close the panel.
 *
 * The name of the class ("CollapsiblePanelTab") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * CollapsiblePanel panel tab container.
 */
 
.CollapsiblePanelTab {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:100;
	color:#475272;
	margin:5px 0 10px 10px;
	padding:0;
	cursor:pointer;
}

/* This is the selector for a CollapsiblePanel's Content area. It's important to note that
 * you should never put any padding on the content area element if you plan to
 * use the CollapsiblePanel's open/close animations. Placing a non-zero padding on the content
 * element can cause the CollapsiblePanel to abruptly grow in height while the panels animate.
 *
 * The name of the class ("CollapsiblePanelContent") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style a
 * CollapsiblePanel content container.
 */
.CollapsiblePanelContent {
	margin:0 10px 0 20px;
	line-height:20px;
	padding: 0px;
	font-size:12px;
}

/* An anchor tag can be used inside of a CollapsiblePanelTab so that the
 * keyboard focus ring appears *inside* the tab instead of around the tab.
 * This is an example of how to make the text within the anchor tag look
 * like non-anchor (normal) text.
 */
.CollapsiblePanelTab a {
	text-decoration: none;
}



.calloutQuote {
	padding:2px 0 2px 20px;
	margin:5px 0 5px 10px;
	background:url(img/bg_calloutQuote.jpg) repeat-y 0px 0px;
}