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

Child and Family Services Review Board				 
December 2007				
BY 76design			


***************************************************
	GENERIC
	*/


HTML {
	font: 62.5%/140% Verdana, Arial, Helvetica, sans-serif;   
	background:#FFF url('../images/header_bkg.gif') repeat-x;
	color: #222222;
	}
	
BODY {
	margin: 0px;
	padding: 0px;
	text-align: center;
	}
	
A{
	color:#1d6db3;
	text-decoration:none;
		}
A:hover{color:#67b8ff;}

A IMG {border:0;}

.left {float:left;}
.right {float:right;}
.noborder {border:none !important;}
.bold 			{ font-weight:bold; }
.italic 		{ font-style:italic; }
.underline 		{ border-bottom:1px solid; }
.highlight 		{ background:#ffc; }
	
H1,H2,H3,H4,H5,H6,UL,LI,OL,BLOCKQUOTE,IMG {
	margin:0;
	padding:0;
	list-style:none;
	}
.clearfix {
	clear:both;
}
/***************************************************
	TABLES
	 */

TABLE{
		clear: both;
		margin:20px 0;
		width: 100%;
		padding:0;
		border-collapse: collapse;
				font-size:90%;
		}	
TABLE THEAD {
	background:url(../images/table-bkg.gif) no-repeat;
	}
	
TABLE THEAD TH {		
		line-height:120%;

		}

TABLE TBODY TR {
		color:#AAA;
		}


	
TABLE TH {
		padding:0 5px;
		margin:0;
		vertical-align:middle;
		color:#222;
		font-weight:bold;
		border-bottom: 1px solid #c8c8c8;

		}

TABLE TR TD {
		font-size: 100%; line-height: 140%;
		margin:0;
		padding:2px 5px;
		border-bottom: 1px solid #c8c8c8;
		}
		
/***************************************************
	FORMS
	 */
LABEL {
		display:block;
		float:left;
		width:120px;
		color:#4b626d;
		font-weight:bold;

		clear:both;
		}
	
INPUT,
TEXTAREA {
		border: 1px solid #CCC;
		color: #222;
		font-size:100%;
		margin:0;
		padding:0 6px;
	
		color:#787878;
		}
		
.submit {
	background:#1D6CB1;
	border:none;
	color:#FFF;
	}

#sendtofriend-form TEXTAREA {
	width:150px;
	}

	
/***************************************************
	WRAPPER
	 */
#wrapper {
	width:870px;
	margin: 0px auto;
	text-align:left;
	overflow:hidden;
	}

/***************************************************
	HEADER
	*/
#header {
	padding:20px 0 0 0;
	margin:0 0 20px 0;
	overflow:hidden;
	}
	
.logo {
	float:left;
	margin:5px 0 0 0;
	width:231px;

}
/***************************************************
	UTILITY MENU
	*/

#utility {
	overflow:hidden;
	margin:0 0 10px 0;
	zoom:1;
	
	}

#utility LI  {
	list-style:none;
	float:right;
	padding:0 10px 0 0;
	margin:0 10px 0 0;
	border-right:solid 1px #ccc;
	}
	
#utility LI.last {
	border-right:none;
	margin:0;
	padding:0;
	}
	
#utility A {
	display:block;
	color:#787878;
	text-decoration:none;
	}
	
#utility A:hover {
	color:#c60b46;
	}

/***************************************************
	MAIN MENU
	*/

#topmenu {
	float:right;
	overflow:hidden;
	height:25px;
	}

#topmenu LI  {
	height:25px;
	line-height:25px;
	margin:0 4px;
	list-style:none;
	float:left;
	background:url(../images/topmenu-left.gif) top left no-repeat;

	}
	
#topmenu A {
	display:block;
	padding:0 15px;
	margin:0;
	font-size:120%;
	color:#222;
	font-weight:bold;
	text-decoration:none;
	background:url(../images/topmenu-right.gif) top right no-repeat;
	}
	
#topmenu A:hover {
	color:#c60b46;
	}
	
/***************************************************
	SIDEBAR
	 */
#sidebar {
 	width:200px;
	margin:30px 30px 0 0;
	float:left;
	}
 
 #sidebar LI {
	border:solid 1px #CCC;
	margin:5px 0;
	line-height:20px;

	}
	
 #sidebar LI A {
	display:block !important;
	height:1%;
	}

 #sidebar LI A:hover {
	background:#c60b46;
	color:#fff;
	}
	
#sidebar H3 {
	background:url(../images/sidebar-h2-blue.jpg) no-repeat;
	width:180px;

	margin:0;
	font-size:110%;
	color:#1D6CB1;
	padding:5px 0 5px 20px;
	}
	
#sidebar .active-scenario {
	border:solid 1px #ccc;
	margin-top:0;
	}
	
#sidebar .active-scenario LI{
	margin:0;
	border:0;
	background:url(../images/active-scenario-border.gif) bottom left no-repeat;
	
	}
	
#sidebar .active-scenario LI A{
	font-weight:normal;
	color:#222;
	display:block;
	padding:5px 0 5px 30px;
	background:url(../images/bullet-blue.gif) 15px 8px no-repeat;
	} 
	
#sidebar .active-scenario LI A:hover {
	color:#1d6db3;
	background:#dbe9f5 url(../images/bullet-blue.gif) 15px 8px no-repeat;
	}
	
#sidebar UL{
	margin:15px 0;
	}
	
#sidebar .site-links LI{
	background:#f4f4f4;
	}
	
.default #sidebar .site-links{
	margin-top: 0;
	}	


#sidebar .active-scenario .selected A{
	background:#1d6db3;
	color:#fff;
	}



#sidebar ul.scenarios li.orange A:link,
#sidebar ul.scenarios li.orange A:visited{
	background: #ffa800;
	color:#FFF;
}
#sidebar ul.scenarios li.orange A:hover{
	background: #ffc75b;
}

#sidebar ul.scenarios li.blue A:link,
#sidebar ul.scenarios li.blue A:visited{
	background: #1d6db3;
	color:#FFF;
}
#sidebar ul.scenarios li.blue A:hover{
	background: #67b8ff;
}

#sidebar ul.scenarios li.green A:link,
#sidebar ul.scenarios li.green A:visited{
	background: #a3b179;
	color:#FFF;
}
#sidebar ul.scenarios li.green A:hover{
	background: #ced9ad;
}

#sidebar ul.scenarios li.purple A:link,
#sidebar ul.scenarios li.purple A:visited{
	background: #af0a7f;
	color:#FFF;
}
#sidebar ul.scenarios li.purple A:hover{
	background: #ce79b5;
}

#sidebar ul.scenarios li.pink A:link,
#sidebar ul.scenarios li.pink A:visited{
	background: #cd3e6b;
	color:#FFF;
	}

#sidebar ul.scenarios li.pink A:hover{
	background: #ce79b5;
	}

#sidebar LI A {
	padding:6px 0 6px 10px;
	font-weight:bold;
	font-size:110%;
	color:#c60b46;
	line-height:120%;} 
	

 
/***************************************************
	HOMEPAGE » FEATURE
 	*/
	
#feature {
	width:870px;
	height:292px;
	position:relative;
	}
	
.cfsrb {background:url(../images/cfsrb/header-cfsrb.jpg) no-repeat;}
.crb {background:url(../images/crb/header-crb.jpg) no-repeat;}
	
#feature #crb-button-en,
#feature #cfsrb-button-en,
#feature #crb-button-fr,
#feature #cfsrb-button-fr{
	position:absolute;
	right:10px;
	bottom:0;
	height:52.5px;
	width:225px;
	display:block;
	text-indent:-9000px;
	}
#feature #crb-button-en{	background:url(../images/crb-button-en.gif) top left no-repeat;}		
#feature #crb-button-fr{	background:url(../images/crb-button-fr.gif) top left no-repeat;} /* should be -fr, leave en for now */
#feature #cfsrb-button-en{	background:url(../images/cfsrb-button-en.gif) top left no-repeat;}		
#feature #cfsrb-button-fr{	background:url(../images/cfsrb-button-fr.gif) top left no-repeat;} /* should be -fr, leave en for now */
	
#feature #crb-button:hover {
	background:url(../images/crb-button.gif) bottom left no-repeat;
	}
	
/***************************************************
	HOMEPAGE » SCENARIOS
 	*/

.orange .more {background:#ffa800}
.orange .more:hover {background:#ffc75b}
.orange H2 {color:#ffa800;}
.orange .scenario-header{background:#ffa800 url(../images/scenario-header.gif) top left no-repeat;}
.blue H2 {color:#1d6db3;}
.blue .more {background:#1d6db3}
.blue .more:hover {background:#67b8ff}
.blue .scenario-header{background:#1d6db3 url(../images/scenario-header.gif) top left no-repeat;}
.green h2 {color:#a3b179;}
.green .more {background:#a3b179}
.green .more:hover {background:#ced9ad}
.green .scenario-header{background:#a3b179 url(../images/scenario-header.gif) top left no-repeat;}
.purple H2 {color:#af0a7f;}
.purple .more {background:#af0a7f}
.purple .more:hover {background:#ce79b5}
.purple .scenario-header{background:#af0a7f url(../images/scenario-header.gif) top left no-repeat;}
.pink H2 {color:#cd3e6b;}
.pink .more {background:#cd3e6b}
.pink .more:hover {background:#c37d93}
.pink .scenario-header{background:#cd3e6b url(../images/scenario-header.gif) top left no-repeat;}
.brown H2 {color:#630523;}
.brown .more {background:#630523}
.brown .more:hover {background:#997f6b}
.brown .scenario-header{background:#630523 url(../images/scenario-header.gif) top left no-repeat;}

.scenario-header {
	display:block;
	height:8px;
	overflow:hidden;
	}

.scenario-text {
	margin:0 0 0 26px;
	display:block;
	}

.more {
	padding:4px;
	color:#FFF; 
	font-weight:bold;
	}
.more:hover {
	color:#FFF;
	}

#scenarios {
	margin:20px 0;
	padding:0;
	}
#scenarios H2 {
		height:30px;
		}
#scenarios LI{
	float:left;
	
	width:275px;
	margin:0 20px 0 0;
	overflow:hidden;
	}
#wrapper.en #scenarios LI {
	height:350px;
}
#wrapper.fr #scenarios LI {
	height:400px;
}
	
#scenarios LI.last {
	margin:0;
	}
	
#scenarios LI H2 {
	margin:20px 0 10px 0;
	}
#scenarios BLOCKQUOTE {
	overflow:hidden;
	}
#wrapper.en #scenarios BLOCKQUOTE {
	height:220px;
}
#wrapper.fr #scenarios BLOCKQUOTE {
	height:270px;
}
	
/***************************************************
	CONTENT
 	*/
.default #content,
.scenarios #content{
	font-size:120%;

	}
	
.thin{
	width:550px;
	float:left;
	margin:20px 50px 20px 0;
	}
#content.scenarios  {
	width:440px;
	float:left;
	margin:20px 30px 0 0;
}
.wide{
	width:620px;
	float:left;
	margin:20px 0px 0 0;
	}
.default #content UL,
.default #content OL {
	margin:10px 0 10px 10px;
	padding:10px;
	}
.default #content UL LI {
	display:block;
	padding:2px 0 2px 30px;
	background:url(../images/bullet-blue.gif) 15px 8px no-repeat;
	}	
.default #content OL LI {
	list-style-type:decimal;
	margin:10px 0 10px 20px;
	}	
	
#content {
	font-size:110%;
	line-height:160%;
	}
	
#content H1 {
	font-size:240%;
	line-height:120%;
	margin:10px 0;
	color:#1D6CB1;
	}
	
#content H2{
	font-size:140%;
	margin:10px 0;
	}
	
#content H3 {
	font-size:130%;
	margin:10px 0;
	}
	
#content BLOCKQUOTE {
	font-size:100%;
	line-height:160%;
	color:#9e9e9e;
	margin:15px 0;
	}
	
.brown .more,.pink .more,.green .more,.purple .more,.blue .more,.orange .more,
.brown .more:hover,.pink .more:hover,.green .more:hover,.purple .more:hover,.blue .more:hover,.orange .more:hover {
	color:#FFF;
	}
	
/***************************************************
	CONTENT » ORANGE
 	*/
.orange INPUT.submit {
	background:#ffa800;
	}
	
.orange A {
	color:#ffa800;
	}
	
.orange A:hover {
	color:#ffc75b;
	}
	
.orange #sidebar H3 {
	background:url(../images/sidebar-h2-orange.jpg) no-repeat;
	color:#ffa800;

	}
.orange #sidebar .active-scenario LI.selected A{
	background:#ffa800 url(../images/bullet-white.gif) 15px 8px no-repeat;
	color:#FFF;
	
}	
.orange #sidebar .active-scenario LI A{
	background:url(../images/bullet-orange.gif) 15px 8px no-repeat;
	}
.orange #sidebar .active-scenario LI A:hover {		
	background:#f0d49e url(../images/bullet-orange.gif) 15px 8px no-repeat;
	color:#ffa800;
	}
.orange #sidebar .active-scenario .selected A{
	background:#ffa800;
	color:#fff;
}
/***************************************************
	CONTENT » PINK
 	*/
.pink INPUT.submit {
	background:#cd3e6b;
	}
.pink A {
	color:#cd3e6b;
	}
.pink A:hover {
	color:#c37d93;
	}
.pink #sidebar H3 {
	background:url(../images/sidebar-h2-pink.jpg) no-repeat;
	color:#cd3e6b;
	}
.pink #sidebar .active-scenario LI.selected A{
background:#cd3e6b url(../images/bullet-white.gif) 15px 8px no-repeat;
color:#FFF;
}	
.pink #sidebar .active-scenario LI A{
	background:url(../images/bullet-pink.gif) 15px 8px no-repeat;
	}
.pink #sidebar .active-scenario LI A:hover {		
	background:#eecad5 url(../images/bullet-pink.gif) 15px 8px no-repeat;
	color:#cd3e6b;
	}	
.pink #sidebar .active-scenario .selected A{
	background:#cd3e6b;
	color:#fff;
	}
	
/***************************************************
	CONTENT » BROWN
 	*/
.brown INPUT.submit {
	background:#630523;
	}
.brown A {
	color:#630523;
	}
.brown A:hover {
	color:#997f6b;
	}
.brown #sidebar H3 {
	background:url(../images/sidebar-h2-brown.jpg) no-repeat;
	color:#630523;
	}
.brown #sidebar .active-scenario LI.selected A{
background:#630523 url(../images/bullet-white.gif) 15px 8px no-repeat;
color:#FFF;
}
.brown #sidebar .active-scenario LI A{
	background:url(../images/bullet-brown.gif) 15px 8px no-repeat;
	}
.brown #sidebar .active-scenario LI A:hover {		
	background:#faded7 url(../images/bullet-brown.gif) 15px 8px no-repeat;
	color:#630523;
	}	
.brown #sidebar .active-scenario .selected A{
	background:#630523;
	color:#fff;
	}	

/***************************************************
	CONTENT » GREEN
 	*/
.green INPUT.submit {
	background:#a3b179;
	}
.green A {
	color:#a3b179;
	}
.green A:hover {
	color:#ced9ad;
	}
	
.green #sidebar H3 {
	background:url(../images/sidebar-h2-green.jpg) no-repeat;
	color:#a3b179;
	}
.green #sidebar .active-scenario LI.selected A{
	background:#a3b179;
	color:#FFF:
}	
.green #sidebar .active-scenario LI A{
	background:url(../images/bullet-green.gif) 15px 8px no-repeat;
	}
.green #sidebar .active-scenario LI A:hover {		
	background:#e9f1d2 url(../images/bullet-green.gif) 15px 8px no-repeat;
	color:#a3b179;
	}
.green #sidebar .active-scenario  LI.selected A{
	background:#a3b179 url(../images/bullet-white.gif) 15px 8px no-repeat;
	color:#fff;
	}	
/***************************************************
	CONTENT » PURPLE
 	*/
.purple INPUT.submit {
	background:#af0a7f;
	}
.purple A {
	color:#af0a7f;
	}
.purple A:hover {
	color:#ce79b5;
	}
	
.purple #sidebar H3 {
	background:url(../images/sidebar-h2-purple.jpg) no-repeat;
	color:#af0a7f;
	}
.purple #sidebar .active-scenario LI.selected A {
	color:#FFF;
	background:#af0a7f url(../images/bullet-white.gif) 15px 8px no-repeat;
	}
	
.purple #sidebar .active-scenario LI A{
	background:url(../images/bullet-purple.gif) 15px 8px no-repeat;
	}
	
.purple #sidebar .active-scenario LI A:hover {		
	background:#f4d3eb url(../images/bullet-purple.gif) 15px 8px no-repeat;
	color:#af0a7f;
	}	
.purple #sidebar .active-scenario .selected A{
	background:#af0a7f;
	color:#fff;
	}
	
/***************************************************
	CONTENT » BLUE
	
	Blue is the default, but it has also been defined as white.
	I realize this is confusing - not my call.
	
 	*/
	
.blue INPUT.submit {
	background:#1d6db3;
	}
.blue A {
	color:#1d6db3;
	}
.blue A:hover {
	color:#67b8ff;
	}
	
.blue #sidebar H3 {
	background:url(../images/sidebar-h2-blue.jpg) no-repeat;
	color:#1d6db3;
		line-height:140%;
		display:block;
	}
#sidebar .active-scenario LI.selected A,
.white #sidebar .active-scenario LI.selected A,
.blue #sidebar .active-scenario LI.selected A {
	background:#1d6db3 url(../images/bullet-white.gif) 15px 8px no-repeat;
	color:#FFF;
	}
	
.blue #sidebar .active-scenario LI A{
	background:url(../images/bullet-blue.gif) 15px 8px no-repeat;
	}
.blue #sidebar .active-scenario LI A:hover {		
	background:#dbe9f5 url(../images/bullet-blue.gif) 15px 8px no-repeat;
	color:#1d6db3;	
	}
	
.blue #sidebar .active-scenario .selected A{
	background:#1d6db3;
	color:#fff;
}

/***************************************************
	RIGHT-COLUMN
 	*/
#right-column {
	margin:70px 0 0 0;
	float:left;
	width:170px;
	
	}

#right-column UL {
	margin:0 0 50px 0;
	}
#right-column  LI {
	font-size:110%;
	margin:15px 0;
	}

#right-column H3 {
	color:#1d6db3;
	}

#right-column A {
	color:#000;
	padding:2px 0 2px 20px;
	//background:url(../images/bullet-blue.gif) 5px 8px no-repeat;
	display:block;
	}


#right-column A.send-to-friend  {
	background:#efefef url('../images/email.gif') no-repeat 5px 50%;
	padding:5px 5px 5px 30px;
	//cursor:pointer;
	}
	
#right-column TEXTAREA {
	height:80px;
	font-size:120%;
}
#right-column #comments{
	height:200px;
}

/***************************************************
	CONTENT » RESULTS
 	*/
.default #content OL.results{
margin:0;
padding:0;
}
.default #content OL.results LI{
	list-style:none;
	margin:0;
	padding:18px;
	border-top:solid 1px #e5e5e5;
	}

.default #content OL.results LI H5 A{
	font-size:160%;
	font-weight:normal;
	}


.record_nav  P {
	padding:5px;
	text-align:right;
	margin:0;
	}
.record_nav  P.viewing {
	border-top:solid 1px #e5e5e5;
	padding:2px 5px;
	background:#fbfbfb;
	font-size:90%;
	margin:0 0 30px 0;
}

.record_nav P A.next{
	padding:2px 5px;
}

.record_nav P A.prev{
	padding:2px 5px;
}
		
.dark {
	background:#F5f5f5;}
	

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

#footer {
	margin-top:40px;
	background:#f5f5f5;
	padding:5px;
	}
	
#footer P {
	float:right;
	margin:5px 10px;
	padding:0;
	}

	
#footer A{
	color:#5f5f5f;
	text-decoration:none;
	display:block;
	float:left;
	padding:10px;
	}
	
#footer A:hover {
	color:#cd3e6b;
	}