/* 
	CCCS-INC.ORG Style Definitions
	Copyright 2009 - The Connextion
	Created by: Aaron Louks
*/

/* GENERICS */
* { margin: 0px; padding: 0px; outline: none; font-family: Arial, Helvetica, sans-serif; }

h1 { }
h2 { color: #1f64a3; font-size: 18px; padding: 15px 15px 5px 15px; letter-spacing: 1px; }
h3 { padding: 10px 0 0 15px; }
h4 { font-size: 16px; padding: 15px 15px 0px 15px; }

.clear { clear: both; }

img { border: none; }
img a { border: none; }

a:link { color: #1b1b1b; text-decoration: none; cursor: pointer; }
a:visited { color: #1b1b1b; text-decoration: none; cursor: pointer; } 
a:hover { color: #1b1b1b; text-decoration: underline; cursor: pointer; }
a:active { color: #1b1b1b; text-decoration: none; cursor: pointer; }

.float-left { float: left; }
.float-right { float: right; }
.clear { clear: both; }

input { font-family: Arial, Helvetica, sans-serif; }
textarea { font-family: Arial, Helvetica, sans-serif; }

.quick-alert {
   width: 50%;
   margin: 1em 0;
   padding: .5em;
   background: #FFC;
   border: 1px solid #FC0;
   color: #333;
   font-weight: bold;
   display: none;
 }
 
ul.list, dl.list { font-size: 14px; margin: 5px 20px; }
ul.list li, dl.list dt { list-style:square; padding: 6px 3px; margin: 3px 20px; font-weight: bold; }

ul { font-size: 14px; margin: 5px 20px; }
ul li { list-style:square; padding: 6px 3px; margin: 3px 20px; font-weight: bold; }
ul ul { padding: 5px 0px; margin: 3px 5px; }
ul li li { list-style:square; padding: 5px 5px; margin: 0 15px; color: #F60; }

body { background: #fffbf5; }

.hr { height: 1px; width: 90%; background: #000; border: none; }
.underline { border-bottom: 1px solid #333; margin: 10px 5px 0 5px; }
.underline h4 { padding: 0 0 0 10px; }

/* LAYOUT */
.wrapper { margin: 0 auto; width: 894px; background: url(../img/footer_bg.jpg) no-repeat bottom right; }

.header { height: 138px; width: 100%; background: url(../img/header.jpg) no-repeat top left; }

.content { z-index: 1; }

.content-left { float: left; width: 603px; }

.content-left-inner { float: left; width: 249px; }

.content-left-inner p { padding: 10px; font-size: 14px; }

.content-right { float: right; width: 291px; }

.content-right-inner { float: right; width: 642px; }

.main { background: url(../img/bg-main.jpg) no-repeat top left; }

.main p { padding: 7px 15px; font-size: 14px; line-height: 1.7em; }

.content-left .first_main p.front-text { padding: 1px 15px; }

.main table { font-size: 14px; line-height: 1.7em; }

.main table tr td { } 

.footer { border-top: solid 5px #1d5b93; margin-top: 15px; padding: 10px 0px; }

.links { float: right; padding: 3px 40px 0 0; text-align: center; }

.connext { width: 163px; height: 21px; background: url(../img/connext.jpg) no-repeat top left; float: right; }

.info { font-size: 12px; letter-spacing: .5px; font-style: italic; float: left; }

.logos { 
	margin-left: 100px; 
	float: left; 
}

.logos img {
	margin: 0 2ex;
}

/* PAGE SPECIFICS */

/* ADMIN SECTION */
.admin_left { background: url(../img/admin_menu_bg.jpg) no-repeat top left; }
.admin_left h3 { padding: 15px 0px 5px 15px; }
ul.admin_menu { font-size: 13px; margin: 3px 0px;  }
ul.admin_menu li { list-style: none; padding: 3px 0px 3px 15px; margin: 0; font-weight: bold; }
ul.admin_menu li ul { margin: 3px 3px; }
ul.admin_menu li ul li { font-weight: normal; padding: 6px 3px; margin-left: 10px; }

/* HOME */
/* left */
.first_main { height: 249px; background: url(../img/content.jpg) no-repeat top left; margin-bottom: 5px; }
.first_main h2 { color: #1f64a3; font-size: 18px; padding: 15px 5px 5px 15px; margin-bottom: 0ex; letter-spacing: 1px; }
.first_main p { padding: 15px; font-size: 11px; }
ul.help { padding: 0px 35px; margin: 0; }
ul.help li { padding: 1px 0px; font-size: 16px; letter-spacing: 1px; }

.donate a { background: url(../img/sb_donate.jpg) no-repeat top left; width: 247px; height: 84px; float: left; text-indent: -9999px; }
.donate a:hover { background-position: 0px -84px; cursor: pointer; }
.donate_front a { background: url(../img/donate_front.jpg) no-repeat top left; width: 247px; height: 67px; margin-bottom: 3px; float: left; text-indent: -9999px; }
.donate_front a:hover { background-position: 0px -67px; cursor: pointer; }
.appointment a { background: url(../img/appointment_left.jpg) no-repeat top left; width: 247px; height: 67px; float: left; text-indent: -9999px; }
.appointment a:hover { background-position: 0px -67px; cursor: pointer; }
.knowledge a { background: url(../img/knowledge_left.jpg) no-repeat top left; width: 247px; height: 84px; float: left; text-indent: -9999px;
margin-top: 3px; }
.knowledge a:hover { background-position: 0px -84px; cursor: pointer; }
.pic { float: right; background: url(../img/pic02.jpg) no-repeat top left; width: 351px; height: 157px; }

.blue_block_left { float:left; }
.bbl_payment { background: url(../img/bbl_online_payments.jpg) no-repeat top left; width: 247px; height: 54px; margin-top: 7px; }
.bbl_payment:hover { background-position: 0px -54px; cursor: pointer; }
.bbl_ff { background: url(../img/bbl_financial_fitness.jpg) no-repeat top left; width: 247px; height: 44px; }
.bbl_ff:hover { background-position: 0px -44px; cursor: pointer; }
.bbl_app { background: url(../img/bbl_appointment.jpg) no-repeat top left; width: 247px; height: 57px; margin-bottom: 7px; }
.bbl_app:hover { background-position: 0px -57px; cursor: pointer; }
.randomimg { width: 247px; height: 370px; float: left; margin-bottom: 10px; }

/* right */
.pic_right { float: right; width: 285px; height: 222px; background: url(../img/pic01.jpg) no-repeat top left; margin-bottom: 5px; }
.blue_block { float:right; }
.payment_bb a { background: url(../img/payment_blueblock.jpg) no-repeat top left; width: 285px; height: 74px; float: right; text-indent: -9999px; }
.payment_bb a:hover { background-position: 0px -74px; cursor: pointer; }
.checklist_bb a { background: url(../img/checklist_blueblock.jpg) no-repeat top left; width: 285px; height: 42px; float: right; text-indent: -9999px; }
.checklist_bb a:hover { background-position: 0px -42px; cursor: pointer; }
.appointment_bb a { background: url(../img/appointment_blueblock.jpg) no-repeat top left; width: 285px; height: 71px; float: right; text-indent: -9999px; }
.appointment_bb a:hover { background-position: 0px -71px; cursor: pointer; }

/* LOCATIONS */
.location_link, .location_link:hover, .location_link:active, .location_link:link, .location_link:visited { text-decoration: none; }
.location_link_div { padding: 10px 11px; height: 140px; }
.location_link_div:hover { background: #eaffb5; cursor: pointer; }
.directions { padding: 5px 15px; background: #CCC; border: 1px solid #333; color: #000; width: 130px; text-align: center; margin: 10px auto; }

/* BOARD OF DIRECTORS */
table.bod { padding: 13px; }
table.bod tr td { padding: 0 0 15px 0; }

/* COUNSELING SERVICE */
ul.counsel_service li { list-style: none; }

/* FINANCIAL TOOLS */
ul.financial_tools { font-size: 14px; margin: 5px 20px; }
ul.financial_tools li { list-style:square; padding: 6px 3px; margin: 3px 20px; font-weight: bold; }
ul.financial_tools ul { padding: 5px 0px; margin: 3px 5px; }
ul.financial_tools li li { list-style:square; padding: 5px 5px; margin: 0 15px; color: #F60; }

/* BUDGET */
ul.budget { font-size: 14px; margin: 5px 20px; }
ul.budget li { list-style:square; padding: 7px 3px; margin: 0 20px; font-weight: bold; }
.prepare_budget { border: 1px solid #cccccc; margin: 0 auto; padding: 3px 10px; background: #eaffb5; text-align: center; width: 350px; }
.prepare_budget:hover { background: #d4f581; }

/* CLIENT SERVICES / PAYMENT OPTIONS */
.button { border: 1px solid #cccccc; margin: 0px; padding: 3px 10px; background: #eaffb5; text-align: left; width: 280px; }
.button:hover { background: #d4f581; cursor: pointer; text-decoration: none; }
ul.client_payment { font-size: 14px; margin: 5px 20px; }
ul.client_payment li { list-style:square; padding: 8px 3px; margin: 0 20px; }
ul.client_payment li em { font-weight: bold; }
.cl_pay { height: 62px; }
.cl_pay img { margin-top: 10px; }
.cl_pay p { margin: 11px 0 0 35px; font-weight: bold; }
.DMS { height: 62px; }
.DMS img { margin-top: 8px; }
.DMS p { margin: 11px 0 0 35px; font-weight: bold; }

/* RESOURCES */
ul.resources { font-size: 14px; margin: 5px 20px; }
ul.resources li { list-style:square; padding: 6px 3px; margin: 3px 20px; font-weight: bold; }
ul.resources ul { padding: 5px 0px; margin: 3px 5px; }
ul.resources li li { list-style:square; padding: 5px 5px; margin: 0 15px; color: #F60; }
.button_resources { border: 1px solid #cccccc; margin: 0 auto; padding: 3px 7px; background: #eaffb5 url(/img/arrow.gif) no-repeat right; background-position: 430px 14px; text-align: left; width: 490px; }
.button_resources:hover { background: #d4f581 url(/img/arrow.gif) no-repeat right; background-position: 430px 14px; text-decoration: none; cursor: pointer; }
.button_resources p strong { width: 475px; }
.resources-left { float: left; margin-left: 100px; }
.resources-right { float: right; margin-right: 100px; }

/* EDUCATORS */
dl.edu_primary_set { padding: 15px; }
dl.edu_primary_set dt { padding: 7px 0px; font-size: 14px; }
dl.edu_intermediate_set { padding: 15px; }
dl.edu_intermediate_set dt { padding: 7px 0px; font-size: 14px; }

/* HELPFUL LINKS */
ul.helpful_links { font-size: 14px; margin: 5px 20px; }
ul.helpful_links li { list-style:square; padding: 6px 3px; margin: 3px 20px; font-weight: bold; }

/* NEWSLETTER */
ul.newsletter { font-size: 14px; margin: 5px 20px; }
ul.newsletter li { list-style:square; padding: 6px 3px; margin: 3px 20px; font-weight: bold; }

/* EDUCATIONAL VIDEOS */
ul.edu_videos { font-size: 14px; margin: 5px 20px; }
ul.edu_videos li { list-style:square; padding: 6px 3px; margin: 3px 20px; font-weight: bold; }

/* CONTACT FORM */
.contact_form { margin: 0 25px; }

/* CALCULATORS */
ul.calc_tools { font-size: 14px; margin: 5px 20px; }
ul.calc_tools li { list-style:square; padding: 6px 3px; margin: 3px 20px; font-weight: bold; }
ul.calc_tools ul { padding: 5px 0px; margin: 3px 5px; }
ul.calc_tools li li { list-style:square; padding: 5px 5px; margin: 0 15px; color: #F60; }

/* TOOLS: CREDIT COSTS */
ul.credit_costs { font-size: 14px; margin: 5px 20px; }
ul.credit_costs li { list-style:square; padding: 6px 3px; margin: 3px 20px; font-weight: bold; }
ul.credit_costs ul { padding: 5px 0px; margin: 3px 5px; }
ul.credit_costs li li { list-style:square; padding: 5px 5px; margin: 0 15px; color: #F60; }

/* TOOLS: SAVING EARLY */
table.saving_early, table.interest { padding: 3px 0px; margin: 0; background: none; }
table.interest { margin: 0 15px; width: 610px; }
table.saving_early tr td, table.interest tr td  { padding: 3px 5px; }
form table.savings, form table.savings tr td { border: none; padding: 3px 2px; }
.alternate1 { background: #ddd; }
.alternate2 { background: #CF9 }

/* --End PAGE SPECIFICS */

/* MENU */
/* Menu Generics */
.sf-menu, .sf-menu * {
	position: relative;
	margin:			0;
	padding:		0;
	list-style:		none;
	z-index: 90;
}
.sf-menu {
	line-height:	1.0;
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	margin-top: 	5px;
	width:			10em; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
	width:			100%;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
	position: relative;
	z-index: 90;
}
.sf-menu li {
	float:			left;
	position:		relative;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			2.5em; /* match top ul list item height */
	z-index:		3;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}

.nav { 
	background: url(../img/nav.jpg) no-repeat top left;
	height: 64px;
	margin-bottom: 3px;
	z-index: 2;
}

.sf-menu {
	float:			right;
	margin-bottom:	1em;
	margin:			13px 5px 0px 0px;
}
.sf-menu a {
	color:			#1b1b1b;
	font-size:		12px;
	letter-spacing: 1px;
	padding: 		15px 12px;
	text-decoration:none;
}
.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
	color:			#1b1b1b;
}
.sf-menu li {
}
.sf-menu li li {
	background:		#c3ec5e;
}
.sf-menu li li a:hover, .sf-menu li li a.sfHover { background: #d5fb78; }
.sf-menu li li a { font-size: 11px; padding: 7px 15px; }
.sf-menu li ul li ul { }
.sf-menu li li li {
	background:		#c3ec5e;
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	background:		#c3ec5e;
	outline:		0;
}

/*** arrows **/
.sf-menu a.sf-with-ul {
	padding-right: 	2.25em;
	min-width:		1px; /* trigger IE7 hasLayout so spans position accurately */
}
.sf-sub-indicator {
	position:		absolute;
	display:		block;
	right:			.75em;
	top:			1.05em; /* IE6 only */
	width:			10px;
	height:			10px;
	text-indent: 	-999em;
	overflow:		hidden;
	background:		url(../img/arrows-ffffff.png) no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}
a > .sf-sub-indicator {  /* give all except IE6 the correct values */
	top:			.8em;
	background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
}

/*** shadows for all but IE6 ***/
.sf-shadow ul {
	background:	url(../img/shadow.png) no-repeat bottom right;
	padding: 0 8px 9px 0;
	-moz-border-radius-bottomleft: 17px;
	-moz-border-radius-topright: 17px;
	-webkit-border-top-right-radius: 17px;
	-webkit-border-bottom-left-radius: 17px;
}
.sf-shadow ul.sf-shadow-off {
	background: transparent;
}


/* CONTACT FORM */
form table, form table tr td { border: none; padding: 3px 5px 3px 7px; }
.left { float: left; width: 150px; }
.left ol li { margin: 6px 0px; text-align: right; }
.right { float: left; }

/*Form Layout Elements*/
.contact_form { width: 600px; margin: 0px auto 50px auto; padding: 0px 20px; }
.contact_form ol { }
.contact_form ol li { list-style: none; padding: 7px 10px; }
.contact_form ol li em { color:#C30; font-size: 11px; padding: 8px; }

.contact_form select { margin: 2px 10px 0px 10px; }
.contact_form input { margin: 2px 10px 0px 10px; }
.contact_form input.submit { margin: 13px 10px 0px 10px; }
.contact_form textarea { margin: 2px 10px 0px 10px; }

/*Forms defaults - change as needed*/
input, textarea {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#404040;
}
label {
	color:#666;
	cursor:pointer;
	padding-left:2px;
	line-height:16px;
}
label.chosen {color:#333;}
fieldset { margin: 15px; padding: 7px 0px; }
legend { background:#666; padding: 2px 5px; margin-left: 10px; color:#fff; }
legend.error { background:#C30; padding: 2px 5px; margin-left: 10px; color:#fff; }
legend.success { background:#090; padding: 2px 5px; margin-left: 10px; color:#fff; }