/***************************
 * 	   Eric Meyer Reset
 * -------------------------
 ***************************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td
{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

form, label {
	display: block;
}

label.checkbox input {
	float: left;
	margin-right: 1em;
}

label:hover {
	cursor: pointer;
}

body {
	line-height: 1;
}

div, ul {
	overflow: hidden;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}

del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

a {
	text-decoration: none;
	color: #d01919;
	font-weight: 900;
}

a:hover {
	text-decoration: none;
}

p, h1, h2, h3, h4, h5, h6 {
	margin-bottom: .6em;
}

hr {
	visibility: hidden;
}

/***************************************************************
scalable Inman Flash Replacement (sIFR) version 3.
Copyright 2006 Ã¢â‚¬â€œ 2008 Mark Wubben, <http://novemberborn.net/>

This software is licensed and provided under the CC-GNU LGPL.
See <http://creativecommons.org/licenses/LGPL/2.1/>

****************************************************************/

@media screen {
	
  .sIFR-flash {
    visibility: visible !important;
    margin: 0;
    padding: 0;
	background: transparent;
  }
  
  .sIFR-replaced, .sIFR-ignore {
    visibility: visible !important;
	background: transparent;
  }
  
  .sIFR-alternate {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 0;
    display: block;
    overflow: hidden;
	background: transparent;
  }
  
  .sIFR-replaced div.sIFR-fixfocus {
    margin: 0pt; 
    padding: 0pt; 
    overflow: auto; 
    letter-spacing: 0px; 
    float: none;
	background: transparent;
  }
  
  .sIFR-active .verlag_bold {
  	font-size: 18px;
    font-family: "Helvetica Neue", Helvetica, Arial, serif;
	color: #d01919;
	background: transparent;
  }

  .sIFR-active .v_black {
   	font-size: 13px;
    font-family: "Helvetica Neue", Helvetica, Arial, serif;
	color: #0f327a;
    visibility: hidden;
	background: transparent;
  }

  .sIFR-active .verlag_light {
   	font-size: 42px;
    font-family: "Helvetica Neue", Helvetica, Arial, serif;
	color: #474747;
    visibility: hidden;
	background: transparent;
  }
  
}

@media print {
  .sIFR-flash {
    display    : none !important;
    height     : 0;
    width      : 0;
    position   : absolute;
    overflow   : hidden;
  }
  
  .sIFR-alternate {
    visibility : visible !important;
    display    : block   !important;
    position   : static  !important;
    left       : auto    !important;
    top        : auto    !important;
    width      : auto    !important;
    height     : auto    !important;
	background: transparent;
  }
}


/***************************
 * 		jCarousel
 * -------------------------
 ***************************/

/**
 * This <div> element is wrapped by jCarousel around the list
 * and has the classname "jcarousel-container".
 */
.jcarousel-container {
    position: relative;
}

.jcarousel-clip {
    z-index: 2;
    padding: 0;
    margin: 0;
    overflow: hidden;
    position: relative;
}

.jcarousel-list {
    z-index: 1;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

.jcarousel-list li,
.jcarousel-item {
    float: left;
    list-style: none;
    /* We set the width/height explicitly. No width/height causes infinite loops.*/
}

.jcarousel-skin-casa .jcarousel-item-placeholder {
    background: #fff;
    color: #000;
}

div.jcarousel-skin-casa,
.jcarousel-skin-casa .jcarousel-container-horizontal {
    width: 710px;
	overflow: visible;
}

.jcarousel-skin-casa .jcarousel-clip-horizontal {
    width: 710px;
}

.jcarousel-skin-casa .jcarousel-item {
	margin: 0;
	padding: 0 10px;
	font-size: 12px;
}

/**
 * The buttons are added dynamically by jCarousel before
 * the <ul> list (inside the <div> described above) and
 * have the classnames "jcarousel-next" and "jcarousel-prev".
 */
.jcarousel-next, .jcarousel-prev {
    z-index: 3000;
    display: none;
}

.jcarousel-next-disabled,
.jcarousel-prev-disabled {
    display: none !important;
}

.jcarousel-skin-casa .jcarousel-next,
.jcarousel-skin-casa .jcarousel-prev {
	border: 0;
    width: 19px;
    height: 20px;
	padding: 0;
    position: absolute;
    top: 80px;
	outline: 0;
	cursor: pointer;
    background: transparent url(/img/common/arrow_blue_right.png) no-repeat 0 0;
	right: 0px;
}

.jcarousel-skin-casa .jcarousel-prev {
    background: transparent url(/img/common/arrow_blue_left.png) no-repeat 0 0;
	left: -10px;
}


/***************************
 * 		Common
 * -------------------------
 * 	red		-	#d01919
 *	blue	-	#0f327a
 * -------------------------
 ***************************/

label {
	display: block;
	margin: 0 0 .6em 0;
	font-weight: 900;
}

label input {
	margin: .2em 0 0 0;
}

br.clear {
	display: block;
	clear: both;
}

h2.verlag_light {
	margin-bottom: .4em;
}

h3.v_black {
	color: #0f327a;
	font: 900 13px Helvetica, sans-serif small-caps;
}

.sprite {
	display: block;
	text-indent: -9999px;
	background-repeat: no-repeat;
}

.icon_16 {
	width: 16px;
	height: 16px;
	background-image: url(/img/common/sprite_social_media_icons_16x16.png);
}

.flash {
	margin: 2em;
	padding: 20px;
	font: 900 16px Helvetica, sans-serif;
	color: #d01919;
	background-color: #fcd8d8; 
}

a.more {
	width: 57px;
	height: 19px;
	display: block;
	background: transparent url(/img/common/button_more.png) no-repeat;
	text-indent: -9999px;
}	

a.more:hover {
	background-position: 0 -19px;
}

.button_prev, .button_next {	
	width: 19px;
	height: 20px; 
}

.button_prev {	
	background: transparent url(/img/common/arrow_blue_left.png);	
}

.button_next {	
	background: transparent url(/img/common/arrow_blue_right.png);
}

.list h3 {
	margin-bottom: 0;
}

.list li {
	margin-bottom: .6em;
}

.item div, .list div, .list hr {
	margin-bottom: 1.8em;	
}

.sidebar a {
	font-size: 12px;	
}

.sidebar a {
	color: #000;
	font-weight: 500;	
}

.sidebar a:hover {
	font-weight: 900;	
}

/* Grid */
.c2 .item, .c3 .item {
	float: left;
	position: relative;
	line-height: 1.3;	
}

.c2 .item {
}

.item:first-child, .item.i1, .item.first {
	margin-left: 0;
	padding-left: 0;
}

.col_full .c2 .item {
	width: 340px;
	margin-right: 20px;
	font-size: 13px;
}

.col_left {
	margin-right: 30px;
}

.col_left div {
	margin-bottom: 1.8em;
}

.col_left .c2 .item {
	width: 290px;
}

.col_left .c2 .item:first-child {
	margin-right: 60px;
}

.item.last {
	margin-right: 0;
	padding-right: 0;
}

.c2 .item a.more {
	bottom: 0;
}

.c3 .item {
	width: 220px;
	margin-right: 10px;
}

.vsec {
	margin-bottom: 2em;
	padding-bottom: 2em;
	border-bottom: 2px solid #ccc;
}

.copy {
	margin-top: .6em;
}

.img_placeholder {
	background-color: #ccc;	
}

/***************************
 * 		Structure
 * -------------------------
 ***************************/

html {
	height: 100%;
	font: 62.5% "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #474747;
}

body {
	font-size: 1em;
	height: 100%;
}

a.acc {
	position: absolute;
	top: -100%;
	visibility: hidden;
}

div#backdrop {
	width: 100%;
	height: 100%;
	min-height: 800px;
}

div#box_page {
	width: 100%;
	min-height: 800px;
	padding: 6px 0 2em 0;
	position: absolute;
	overflow: visible;
	font-size: 1.3em;
	line-height: 1.5;
	background: transparent url(/img/common/bg_gradient_white.png) repeat-x;
}

div#backdrop {
	position: fixed;
}

div#box_page, ul#utility_nav, #nav, div#box_content, div#footer {
	position: relative;
}

#utility_nav, #nav {
	margin-left: 40px;
}

h1#masthead {
	width: 190px;
	height: 95px;
	margin: 0 18px;
	float: left;
	background: transparent url(/img/common/masthead.png) no-repeat;
	text-indent: -9999px;
}

#box_content {
	width: 932px;
	margin: 54px 0 0 18px;
	padding: 12px 22px 22px 22px;
	border: 1px solid #eee;
	background: transparent url(/img/common/bg_pixel_opacity80.png);
}

#box_page.donate #box_content,
#box_page.volunteer #box_content {
	background: transparent url(/img/common/bg_pixel_opacity95.png);
}

#footer {
	width: 966px;
	margin: 1em 0 0 30px;
	font-weight: 900;
	font-size: 0.83em;
	color: #222;
}

#box_page.home #footer {
	width: 922px;
	margin: 1em 0 0 10px;	
}

#footer .icon_16 {
	margin-left: 12px;
	float: right;
}

#icon_facebook { background-position: 0 0; }
#icon_twitter { background-position: -16px 0; }
#icon_youtube { background-position: -32px 0; }

.col_left {
	width: 648px;
	float: left;
}

.sidebar {
	border-left: 1px solid #ccc;
	font-size: 12px;
}

.sidebar li, .sidebar h3, .sidebar p, .sidebar label {
	padding-left: 10px;
}

.sidebar li.active {
	background: transparent url(/img/common/bg_arrow_sidebar.png) no-repeat left center;	
}

/***************************
 * 		Navigation
 * -------------------------
 ***************************/

ul#utility_nav li, #nav li  {
	float: left;	
}

ul#utility_nav, #nav {
	display: block;
	clear: right;
	margin-left: 40px;
}

ul#utility_nav li, ul.subnav li  {
	padding-right: 1em;
	margin-right: 1em;
}

ul#utility_nav {
	z-index: 999;
	font-size: 11px;
}

ul#utility_nav a, ul.subnav a {
	color: #474747;
	font-weight: 500;
}

ul#utility_nav a:hover, ul.subnav a:hover {
	color: #000;
}

#nav {
	height: 48px;
	margin-top: 27px;
	z-index: 1000;
}

#nav > li {
	background: transparent url(/img/common/nav.png) no-repeat;
	text-indent: -9999px;
}

#nav > li > a {
	height: 16px;
	display: block;
}

/*
#nav > li:hover, #nav.active {
	background-position: 0 -18px;
}
*/

#nav li#about {
	width: 120px;
	background-position: 0 0; 
}

#nav li#about:hover, #nav li#about.active {
	background-position: 0 -18px; 
}

#nav li#stories {
	width: 152px;
	background-position: -120px 0;
}

#nav li#stories:hover, #nav li#stories.active {
	background-position: -120px -18px; 
}

#nav li#news {
	width: 70px;
	background-position: -272px 0; 
}

#nav li#news:hover, #nav li#news.active {
	background-position: -272px -18px; 
}
#nav li#events {
	width: 100px;
	background-position: -342px 0; 
}
#nav li#events:hover, #nav li#events.active {
	background-position: -342px -18px; 
}

#nav li#volunteer {
	width: 146px;
	background-position: -452px 0; 
}

#nav li#volunteer:hover, #nav li#volunteer.active {
	background-position: -452px -18px; 
}

#nav li#donate {
	width: 166px;
	background-position: -598px 0;
}

#nav li#donate:hover, #nav li#donate.active {
	background-position: -598px -18px; 
}

#nav li a:hover, #nav li a:focus {
	
}

#nav li ul {
	height: 24px;
	position: absolute;
	top: 24px;
	overflow: hidden;
	display: none;
	text-indent: 0;
	font-size: 16px;
}

#nav > li:hover {
	height: 48px;
}

#nav li:hover ul.subnav {
	display: block;
}

#nav li ul li {
	height: 24px;
	border-right: 1px solid #333;
}

#nav li ul li.last {
	border-right: none;
}


/***************************
 * 		Homepage
 * -------------------------
 ***************************/

body.home div#box_content {
	margin-top: 0;
	padding: 0;
	border: none;
	position: absolute;
	bottom: 5%;
	background-image: none;
}

/*  Statistics  */
#stat {
	width: 750px;
	height: 220px;
	margin-left: 22px;
	background-color: transparent;
	top:50px;
	position:relative;
}

#stat, #intro, #outro {
	display: block;
}

#stat span, #stat em {
	font: 900 36px Arial, Helvetica, sans-serif;
	line-height: 1.1;
	text-indent: -9999px;
	opacity: 0;
}

#intro {
	margin-bottom: .4em;
	color: #000;
}

#outro {
	font-family: "Arial Black", Helvetica, sans-serif;
	color: #0f327a;
}

#intro.stat_fiveK,
#intro.stat_criminal,
#intro.stat_cost,
#intro.stat_little_league,
#intro.stat_ptsd { 
	height: 73px;
}
#intro.stat_homeless, #intro.stat_jails { height: 109px; }
#intro.stat_limited { height: 104px; }

#outro.stat_fiveK { height: 65px; }
#outro.stat_cost, #outro.stat_little_league { height: 72px; }
#outro.stat_criminal, #outro.stat_ptsd { height: 29px; }
#outro.stat_homeless { height: 76px; }
#outro.stat_jails { height: 36px; }
#outro.stat_limited { height: 33px; }

#box_home {
	margin-top: 16px;
	padding: 0;
	overflow: visible;
	background: transparent url(/img/common/bg_pixel_opacity80.png);
	border: 1px solid #eee;
}

#box_intro {
	width: 412px;
	padding: 20px;
	float: left;
}

#box_features {
	margin-left: 450px;
	overflow: visible;
	position: relative;
	bottom: 16px;
}

#intro_line {
	height: 41px;
	background: transparent url(/img/common/h_foster_care.png) no-repeat;
	text-indent: -9999px;	
}

#coming_up {
	height: 18px;
	margin: 0;
	background: transparent url(/img/common/h_coming_up.png) no-repeat;
	text-indent: -9999px;	
}

div.feature, div.feature_solo {
	margin-bottom: -16px;
	padding: 10px 8px 16px 8px;
	font-size: 0.924em;
	line-height: 1.4;
}

div.feature {
	width: 220px;
	float: left;
}

div.feature_solo {
}

div.feature img, div.feature_solo img {
	margin-bottom: .6em;
}

div#feature_1 {
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	padding-right: 9px;
}

div#feature_2 {
	padding-left: 9px;
	padding-right: 0;
}


/***************************
 * 		About
 * -------------------------
 ***************************/

/**** FAQ ****/
#box_faqs > li {
	padding: .8em 50px 0 0;
	border-bottom: 1px solid #8f8f8f;
	background: transparent url(/img/common/arrow_grey_down.png) no-repeat right center;
	cursor: pointer;
}

#box_faqs li:first-child {
	padding-top: 0;
}

#box_faqs li .a {
	display: none;
	padding-bottom: .8em;
}

#box_faqs li .a ul {
	list-style: disc outside;
	margin: 0 0 1em 2em;
}

#box_faqs li .a ul li {
	margin-left: 1em;
}


/**** Board ****/
body.board h4 {
	margin: 1em 0 0 0;
	color: #0f327a;
}

/**** Resources ****/
#resources h4, #resources a, #resources span, #resources em {
	margin: 0;
	display: block;
}

#resources li {
	margin-bottom: 1.2em;
}

/** Contact **/

body.contact h4 {
	margin: 0;
}


/***************************
 * 		Our Stories
 * -------------------------
 ***************************/

#box_children, #box_advocates {
	width: 770px;
}

#box_children {
	margin-bottom: 2.4em;
}

/*  jCarousel  */
#box_children .item, #box_children .jcarousel-item {
    width: 340px;
}

#box_advocates .jcarousel-item {
    width: 219px;
}

#box_children .item, #box_advocates .item {
	min-height: 240px;
	margin-right: 10px;
	padding: 0 10px 0 0;
}

#box_children .item.first, #box_advocates .item.first {
	padding-left: 0;
}

#box_children .item.last, #box_advocates .item.last {
	margin-right: 0;
	padding-right: 0;
}

.story.advocate h5 {
	margin-bottom: 0;
}

#timeline {
	margin-top: 2.4em;
	overflow: hidden;
}

.sprite.timeline
{
	height: 10px;
	margin: 0 15px 0 0;
	padding-right: 14px;
	border-right: 1px solid #999;
	float: left;
	background: transparent url(/img/common/sprite_headings_timeline.png) no-repeat;
}

#h_one { width: 94px; background-position: 0 0; }
#h_two { width: 87px; background-position: -115px 0; }
#h_three { width: 91px; background-position: -225px 0; border-right: 0; }
	
#h_one:hover, #h_one.active { background-position: 0 -11px; }
#h_two:hover, #h_two.active { background-position: -115px -11px; }
#h_three:hover, #h_three.active { background-position: -225px -11px; }

#sections {
	height: inherit;
	margin: .6em 0;
	padding: 1em 0;
	border-top: 1px solid #999;
}

#sections .section {
	display: none;
}

#sections .section.active {
	display: block;
}

#sections h4 {
	display: none;
}


/***************************
 * 		News/Events
 * -------------------------
 ***************************/

body.news h4.verlag_bold {
	margin: 0;
}

#box_recent .item {
	margin-bottom: 1.2em;
	border-bottom: 2px solid #ccc;
	padding-bottom: 1.2em;
}

.dateline {
	font-size: 11px;
}

#box_upcoming {
	padding-bottom: 2em;
	border-bottom: 1px solid #ccc;
	margin-bottom: 2em;
}


/***************************
 * 		Volunteer
 * -------------------------
 ***************************/

body.volunteer div#box_content {
	border-top: 12px solid #D01919;
}

#methods {
	width: 600px;
	float: left;
}

#methods p {
	padding-bottom: 1em;
	border-bottom: 1px solid #d01919;
}

#methods label strong {
	vertical-align: middle;
}

#methods label input {
	margin: 0 0 0 1.6em;
	vertical-align: middle; 
}

#contact {
	margin-left: 700px;
	font-size: 12px;
}

#contact p {
	color: #999;
	line-height: 1.2;
}

.sidebar input {
	width: 215px;
	background-color: #FCD8D8;
}

.sidebar input.zip {
	width: 80px;
}

#contact label.checkbox input, #contact #submit {
	width: auto;
}

#contact #submit {
	width: 68px;
	height: 19px;
	border: none;
	background: transparent url(/img/common/button_sign_up.png) no-repeat;
}


/***************************
 * 		Donate
 * -------------------------
 ***************************/

body.donate div#box_content {
	border-top: 12px solid #0F327A;
}

body.donate form {
	margin-bottom: 2em;
	padding-bottom: 2em;
	border-bottom: 2px solid #ccc;
	overflow: hidden;
	clear: both;
}

#donate label {
	width: 290px;
	height: 150px;
	float: left;
	background-image: url(/img/common/sprite_donate.png);
}

#donate label:hover {
	cursor: pointer;
}

#label_25 { margin-bottom: 60px; }
#label_50 { background-position: 0 -150px; margin: 0 0 60px 30px; }
#label_100 { background-position: 0 -300px; }
#donate #label_600 { height: 180px; background-position: 0 -450px; margin-left: 30px; }

#donate input {
	float: left;
	position: relative;
	top: 15%;
}

.submit {
	clear: left;
	float: right;	
}

body.donate h4 {
	margin-bottom: .4em;
}

#donate_custom input {
	margin-right: 1em;
	vertical-align: middle;
}

#donate_amt_custom {
	position: relative;
	bottom: 8px;
}

#donate_other > div {
	width: 190px;
	margin-right: 30px;
	float: left;
	font-size: 12px;
	line-height: 1.4;
}

#donate_other a.more {
	margin: 1em 0;
	float: right;	
}

#donate_other div.last {
	margin-right: 0;
}
