
/********* Structural Styles *********/

#header1 {
	height: 182px;
	background: #FFF url(/bhcv2/bhcadmin.nsf/images/hdr_bground/$file/hdr_bground.gif) no-repeat 0 0; /* Homepage has a shorter header area */
}

#footer { 
	background: url(/bhcv2/bhcadmin.nsf/images/footer_bground_relatfam/$file/footer_bground.gif) no-repeat 0 0; /* Creates the spanning column illusion */
}

/* Banner */
#header .pagetitle h1 {
	background: url(/bhcv2/bhcadmin.nsf/images/h1_relationships/$file/h1_relationships.jpg) no-repeat 0 0; 
	width: 212px;
	height: 23px;
}

/********* Banner *********/

#banner, #parentingbanner {
	background: #cde37f;
	float: left;
	width: 826px;
	height: 186px;
	padding: 8px 11px 0 8px;
	margin: 0 0 20px 0;
}

/*The parentingbanner is for parenting page only*/
#parentingbanner {
height: auto;
padding: 10px;
}

#parentingbanner img {
float: left;
border: 1px solid #FFF;
}

#parentingbanner .feature {
background: #FFF;
margin-left: 20px;
float: left;
width: 395px;
padding: 10px;
min-height: 174px;
}

#parentingbanner .feature p {
font-size: 140%;
color: #43595E;
}

#parentingbanner .feature p.seealso {
margin: -10px 0 10px 0;
padding-left: 20px;
background: url(/bhcv2/bhcadmin.nsf/images/seealso/$file/seealso.gif) no-repeat 0 4px;
font-size: 100%;
}

#banner .hero {
	float: left;
	width: 530px;
}

#banner .hero .heroimage {
	background: url(/bhcv2/bhcadmin.nsf/images/hero_img_relatfam/$file/hero_img.jpg) no-repeat 0 0;
	width: 379px;
	height: 166px;
	padding: 0 0 0 10px;
	border: 1px solid #FFF;
	float: left;
}

#banner .hero .heroimage ul {
	list-style-type: none;
}

#banner .hero .heroimage ul li {
	display: inline;
	float: left;
}

#banner .hero .heroimage ul li a {
	padding: 0.1em 0.6em 0.3em 0.6em;
	margin: 0 0.7em 0 0;
	background: #38545E;
	font-size: 0.75em;
	font-weight: bold;
	color: #FFF;
}

#banner .hero .heroimage ul li a:hover {
	background: #FFF;
	color: #38545E;
	text-decoration: none;
}

#banner .hero .heronav {
	float: left;
	width: 139px;
}

#banner .hero .heronav ul {
	list-style-type: none;
}

#banner .hero .heronav ul li {
	margin: 0 0 0.2em 0;
	line-height: 1.2;
}

#banner .hero .heronav ul li a {
	background: #d9e3b3;
	border: 1px solid #b1c46e;
	border-left: none;
	color: #171740;
	display: block;
	font-size: 0.8em;
	display: block;
	width: 133px;
	height: 29px;
	padding: 5px 0 0 5px;
}

#banner .hero .heronav ul li a {
	background-color: #d9e3b3;
	background-repeat: no-repeat;
	background-position: 95% 0;
}
#banner .hero .heronav ul li a:hover {
	background-color: #FFF;
	text-decoration: none;
}

#banner .hero .heronav ul li.item1 a {
	background-image: url(/bhcv2/bhcadmin.nsf/images/shell_icon/$file/shell_icon.png);
}
#banner .hero .heronav ul li.item2 a {
	background-image: url(/bhcv2/bhcadmin.nsf/images/families_icon/$file/families_icon.png);
}
#banner .hero .heronav ul li.item3 a {
	background-image: url(/bhcv2/bhcadmin.nsf/images/camera_icon/$file/camera_icon.png);
}
#banner .hero .heronav ul li.item4 a {
	background-image: url(/bhcv2/bhcadmin.nsf/images/bomb_icon/$file/bomb_icon.png);
}

#banner .hero .imagerselector {
	color: #18191F;
	font-size: 0.8em;
	float: right;
	margin: 2px 0 0 0;
}

#banner .hero .imagerselector .pag {
	float: left;
	margin: 2px 0 0 0;
}

#banner .hero .imagerselector .arrows {
	float: left;
}

#banner .hero .imagerselector a.prev {
	background: url(/bhcv2/bhcadmin.nsf/images/banner_prev_btn_inactive/$file/banner_prev_btn_inactive.gif) no-repeat 0 0;
	width: 17px;
	height: 16px;
	display: block;
	float: left;
	margin: 0 3px 0 5px;
}

#banner .hero .imagerselector a.next {
	background: url(/bhcv2/bhcadmin.nsf/images/banner_next_btn_active/$file/banner_next_btn_active.gif) no-repeat 0 0;
	width: 17px;
	height: 16px;
	display: block;
	float: left;
}

#banner ul.feature {
	list-style-type: none;
	float: right;
	width: 275px;
	margin: 3px 0 0 0;
}

#banner ul.feature li {
	float: left;
	display: block;
	line-height: 1.2em;
	margin: 0 0 7px 0;
}

#banner ul.feature li .featureimage {
	float: left;
	width: 81px;
}

#banner ul.feature li .featureimage img {
	margin: 2px 0 0 0;
}

#banner ul.feature li .featurecopy {
	width: 175px;
	float: left;
	margin: 0 0 0 10px;
	
}

#banner ul.feature li .featurecopy a {
	color: #4A5731;
	font-size: 0.9em;
	line-height: 1.1;
}

#banner ul.feature li .featurecopy h6 a {
	margin-bottom: 0.2em;
	font-size: 1em;
	color: #000;
}


/********* Beginning of 3 Column area *********/

#content .main { /* Is the repeating image for the background skin-coloured column */
	background: url(/bhcv2/bhcadmin.nsf/images/1_col_bground_rpt_relatfam/$file/1_col_bground_rpt.gif) repeat-y 0 0;
	width: 845px;
	float: left;
}

#content .col_1_top { /* Is the top of the background skin-coloured column */
	background: url(/bhcv2/bhcadmin.nsf/images/1_col_top_bground_relatfam/$file/1_col_top_bground.gif) no-repeat 0 0;
	width: 805px;
	padding: 0 20px;
	padding-top: 1px;
	float: left;
}

#content .col_3_bground_top { /* Is the background for the 3 top columns */
	background: url(/bhcv2/bhcadmin.nsf/images/3_col_bground_top_relatfam/$file/3_col_bground_top.gif) no-repeat 0 100%;
	width: 805px;
	float: left;
	margin: 0 0 1em 0;
}

#content .col_3_bground_bot { /* Is the background for the 3 bottom columns */
	background: url(/bhcv2/bhcadmin.nsf/images/3_col_bground_bot_relatfam/$file/3_col_bground_bot.gif) no-repeat 0 100%;
	width: 805px;
	float: left;
	margin: 0 0 1em 0;
}

#content .main .leftcol, #content .main .centrecol, #content .main .rightcol { 
	background: url(/bhcv2/bhcadmin.nsf/images/3_col_top_bground_relatfam/$file/3_col_top_bground.gif) no-repeat 0 0;
	width: 225px; 
	padding: 15px;
	padding-top: 0;
	float: left;
	margin: 0 20px 0 0;
}

#content .main .rightcol { 
	margin: 0;
}

/*This is for the parenting page - using four columns - Ling Krah*/

#content .col_4_bground { /* Is the background for the 4 columns */
	background: url(/bhcv2/bhcadmin.nsf/images/4_col_bground_parenting/$file/4_col_bground.gif) no-repeat 0 100%;
	width: 804px;
	float: left;
	margin: 0 0 1em 0;
}

#content .main .firstcol, #content .main .secondcol, #content .main .thirdcol, #content .main .fourthcol { 
	background: url(/bhcv2/bhcadmin.nsf/images/4_col_top_bground_parenting/$file/4_col_top_bground.gif) no-repeat 0 0;
		width: 166px; 
	padding: 10px;
	padding-top: 0;
	float: left;
	margin: 0 20px 0 0;
} 

#content .main .fourthcol { 
	margin: 0;
}

#content .main .firstcol .babies, 
#content .main .secondcol .children, 
#content .main .thirdcol .youngpeople, 
#content .main .fourthcol .parents {
	padding: 10px 0 0 0;
}


/*End of Parenting specific styles.*/
#content .main h2 { 
	margin: 5px 0 4px 0;
}

#content .main .leftcol .relationships, 
#content .main .centrecol .sex, 
#content .main .rightcol .pregnancy, 
#content .main .leftcol .parenting,
#content .main .centrecol .carers {
	padding: 12px 0 0 0;
}

/* Generic content styles */

#content .main p {
	margin: 0 0 0.8em 0;
}

#content .main img { 
	border: 1px solid #c7d2d5;
}

#content .main span {
	color: #3a5561;
	font-size: 0.65em;
}

#content .main hr {
	background: #cfc4c0;
  	color: #cfc4c0;
	height: 2px;
}

#content .main form {
	margin: 0 0 1.5em 0;
}

#content .main form select{
	width: 180px;
	font-size: 0.9em;

}

#content .main form input.find {
	/*float: left;*/
	/*Ling Krah - added input.find to use for the go button*/
	background: #f2ebe8;
	width: 25px;
	/*margin: 18px 0 0 0;*/
	cursor: pointer;
	font-size: 0.9em;
	border: 1px solid;
	border-color:#cfc4c0;
}

#content .main .articles h3 {
	margin: 0;
}

#content .main .articles span {
	color: #6c9fb3;
	margin: 0 0 1em 0;
	font-size: 0.9em;
}

#content .main .articles p {
	font-size: 0.9em;
	color: #3A5561;
	line-height: 1.3;
}

#content .main .articles p a {
	font-size: 1.1em;
}

#content .main .articles p.more {
	margin: 2em 0 0 0;
}

#content .main .articles p.more a {
	font-size: 0.9em;
}


/* Keep up to date styles */

#content .main .rightcol-custom {   
	width: 240px; 
	padding: 8px 0 0 15px;
	float: left;
	margin: 0;
	font-size: 0.9em;
}

#content .main .rightcol-custom .email {   
	background: url(/bhcv2/bhcadmin.nsf/images/newsletter_icon/$file/newsletter_icon.jpg) no-repeat 0 2px;
	padding: 0 0 0 18px;
	margin: 10px 0 15px 0;
}

#content .main .rightcol-custom .email form {   
	margin: 4px 0 0 0;
}

#content .main .rightcol-custom .email form label {   
	display: block;
}

#content .main .rightcol-custom .email form input.textbox {   
	font-size: 1em;
	width: 200px;
}

#content .main .rightcol-custom .email form input.subscribe {   
	border: 1px solid #FFF;
	background: #64a4b0;
	font-size: 1em;
	color: #FFF;
	cursor: pointer;
	margin: 5px 0 0 0;
}

#content .main .rightcol-custom .rss {   
	background: url(/bhcv2/bhcadmin.nsf/images/rss/$file/rss.png) no-repeat 0 2px;
	padding: 0 0 0 18px;
	margin: 0 0 15px 0;
}

#content .main .rightcol-custom .twitter {   
	background: url(/bhcv2/bhcadmin.nsf/images/twitter_icon/$file/twitter_icon.jpg) no-repeat 0 2px;
	padding: 0 0 0 18px;
	width: 200px;
}

#content .main .rightcol-custom .twitter span {   
	color: #668da8;
	font-size: 0.9em;
}
