/* 
Color Scheme CSS Document for Archant - Canal Boat

This file requires "styles.css", This file will apply all 
images and colors that are specific to each magazine. 
In this instance "Canal Boat" 

Author: 		Adam Collison [adam.collison@soup.co.uk]
Client: 		Archant
Project:		Canal Boat
Last Modified: 	19-04-2006

Contents:

1) Generic Styles
2) Header Styles
3) Site Tools Styles
4) Nav Styles
5) Sub Nav Styles
6) Calout Column Styles
7) Main Content (general) Styles
8) Editorial Styles Within main content
	  a) List Variation
	  b) Homepage Variation
	  c) Features Variation
9) Two column styles (within inner content)
10) Default form styles
11) Footer styles
12) Misc styles

*/

/* *********************** Generic Styles **************************************** */
/* ******************************************************************************* */

h3.section_label {
	background:				url(../images/bg_h3.gif) bottom left repeat-x;
}

h3.section_label span {
	background-color:		#003464;
	color:					#fff;
}

/* ******************************************************************************* */
/* ************************ End Generic Styles *********************************** */


/* ************************ Header Styles **************************************** */
/* ******************************************************************************* */

#header h2, h2 {
	border-bottom-color:	#fff;
	background:				#003464;
}

#header h1 {
	background-color:		#8B0913;
}

/* ******************************************************************************* */
/* ************************ End Header Styles ************************************ */


/* ************************ Site Tools Styles ************************************ */
/* ******************************************************************************* */

.site_tools .header {
	background:				#fff; 
}

.site_tools .header div {
	background-color:		#8C0001;
	color:					#fff;
}

.site_tools .header div a {
	color:					#fff;
	background: 		    url(../images/bg_sitetools_a.gif) 100% 50% no-repeat;
}

.site_tools .header div a:hover {
	background: 		    url(../images/bg_sitetools_a_hover.gif) 100% 50% no-repeat;
}

/* ******************************************************************************* */
/* ************************ Site Tools Styles ************************************ */


/* ************************ Nav Styles ******************************************* */
/* ******************************************************************************* */

#nav {
	background-color:		#8C0001;
}

#nav li a {
	color:					#fff;
}

#nav li a:hover, #nav li.selected a {
	background-color:		#fff;
	color:					#4D5C6B;
}

/* ******************************************************************************* */
/* ************************ End Nav Styles *************************************** */

/* ************************ Sub Nav Styles *************************************** */
/* ******************************************************************************* */

#subnav h3.section_label span {
	background:				#003464;
}

#subnav ul li {
	background:				url(../images/bg_subnav_li.gif) bottom left repeat-x;
}

#subnav ul li.last {
	background:				url(../images/bg_bottom_dots_lrg.gif) bottom left repeat-x;
}

/* Normal Styles */
#subnav ul li a {
	color:					#8C0001;
	background:				url(../images/bg_subnav_li_a.gif) 98% 50% no-repeat;
}
#subnav ul li a:hover {
	color:					#FABF2B;
	background:				url(../images/bg_subnav_li_a_hover.gif) 98% 50% no-repeat;
}

/* Highlight Styles */
#subnav ul li.highlight a, #subnav ul li.highlight a:hover {
	color:					#FABF2B;
	background:				url(../images/bg_subnav_li_a_highlight.gif) 98% 50% no-repeat;
}

/* Selected Styles */
#subnav ul li.dropdown a {
	background:				 url(../images/bg_subnav_li_a_dropdown.gif) 98% 50% no-repeat;
}
#subnav ul li.dropdown a:hover {
	background:				 url(../images/bg_subnav_li_a_dropdown_hover.gif) 98% 50% no-repeat;
}

/* Sublevel Styles */
#subnav ul li ul li {
	background:				none;
}

/* Sublevel highlight styles */
#subnav ul li.dropdown ul li.highlight a,#subnav ul li.dropdown ul li.highlight a:hover {
	background:				url(../images/bg_subnav_li_a_highlight.gif) 7% 50% no-repeat;
	color:					#FABF2B;
}

#subnav ul li.dropdown ul li a {
	background:				url(../images/bg_subnav_li_a.gif) 7% 50% no-repeat;
	color:					#8C0001;
}
#subnav ul li.dropdown ul li a:hover {
	background:				url(../images/bg_subnav_li_a_hover.gif) 7% 50% no-repeat;
	color:					#FABF2B;
}





/* ********************************************************************************************* */
/* NEW STYLES ********************************************************************************** */
/* ********************************************************************************************* */

#subnav ul li.selected ul li.selected a {
	color:					#005C9C;
	background:				url(../images/bg_subnav_li_a_dropdown.gif) 7% 50% no-repeat;
}

#subnav ul li.selected ul li.selected a:hover {
	color:					#005C9C;
	background:				url(../images/bg_subnav_li_a_dropdown_hover.gif) 7% 50% no-repeat;
}

#subnav ul li.selected ul li.dropdown_highlight a, #subnav ul li.selected ul li.dropdown_highlight a:hover {
	color:					#c00;
	background:				url(../images/bg_subnav_li_a_dropdown_hover.gif) 7% 50% no-repeat;
}

#subnav ul li.selected ul li.highlight ul li a, #subnav ul li.selected ul li.selected ul li a {
	color:					#666;
	background:				url(../images/bg_subnav_li_a.gif) 10% 50% no-repeat;
}

#subnav ul li.selected ul li.highlight ul li a:hover, #subnav ul li.selected ul li.selected ul li a:hover {
	color:					#005C9C;
	background:				url(../images/bg_subnav_li_a_hover.gif) 10% 50% no-repeat;
}

#subnav ul li.selected ul li.selected ul li.highlight a, #subnav ul li.selected ul li.selected ul li.highlight a:hover {
	color:					#c00;
	background:				url(../images/bg_subnav_li_a_hover.gif) 10% 50% no-repeat;
}
/* ********************************************************************************************* */
/* END NEW STYLES ****************************************************************************** */
/* ********************************************************************************************* */






/* ******************************************************************************* */
/* ************************ End Sub Nav Styles *********************************** */


/* ************************ Calout Column Styles ********************************* */
/* ******************************************************************************* */

.callout_column div.callout_panel {
	background:				url(../images/bg_bottom_dots_lrg.gif) bottom left repeat-x;
}

.callout_column div a {
	color:					#fff;
}

.callout_column h5 a {
	color:					#036;
	background:				url(../images/bg_h5_a.gif) 0 50% no-repeat;
}

.callout_column h5 a:hover {
	color:					#fff;
	background:				#036 url(../images/bg_h5_a.gif) 0 50% no-repeat;
}

.callout {
	background:				#8C0001;
	color:					#fff;
}	

div.callout_column .callout hr {
	background:				#8C0001;
	color:					#8C0001;
}

.callout_panel .callout a:hover {
	background:				#fff;
	color:					#4D8DBA;
}

/* ******************************************************************************* */
/* ************************ End Calout Column Styles ***************************** */


/* ************************ Main Content (general) Styles ************************ */
/* ******************************************************************************* */

#structure th {
	background-image:		none;
	border-color:			#F9BA29;
}

#structure th.site_tools {
	background-image:		url(../images/bg_site_tools.gif);
}

/* ******************************************************************************* */
/* ************************ End Main Content (general) Styles ******************** */


/* ************************ Editorial Styles Within main content ***************** */
/* ******************************************************************************* */

.editorial_panel div {
	color:					#333;
}

.editorial_panel div a, .editorial_panel a {
	color:					#036;
}

.editorial_panel div a:hover, .editorial_panel a:hover {
	color:					#fff;
	background:				#036;
}

.editorial_panel div span {
	color:					#036;
}

/* ------------------------------------------------------------------------------- */
/* ------------------------ List Variation --------------------------------------- */
.list {
	background:				url(../images/bg_editorial_panel_list.gif) bottom left repeat-x;
}

/* ------------------------------------------------------------------------------- */
/* ------------------------ Classifieds Variation -------------------------------- */
.classifieds {
	background:				url(../images/bg_editorial_panel_classifieds.gif) bottom left repeat-x;
}

.coloured  {
	background:				#FDF3F3 url(../images/bg_editorial_panel_classifieds.gif) bottom left repeat-x;
}

.coloured hr {
	color:					#FDF3F3;
	background:				#FDF3F3;
}

.classifieds > a:hover {
	background:				none;
}



/* ------------------------------------------------------------------------------- */
/* ------------------------ Homepage Variation ----------------------------------- */
.home div h4 {
	color:					#036;
}

/* ------------------------------------------------------------------------------- */
/* ------------------------ Features Variation ----------------------------------- */
.features div h4 {
	background:				url(../images/bg_editorial_panel_features_h4.gif) bottom left repeat-x;
}

.features div h4 span {
	color:					#d50000;
}

.features div ul li {	
	background:				url(../images/bg_editorial_panel_features_li.gif) bottom left repeat-x;
}

.features div ul li.even {
	background:				#F2F3F4 url(../images/bg_editorial_panel_features_li.gif) bottom left repeat-x;
}

/* ************************ End Editorial Styles Within main content ************* */
/* ******************************************************************************* */


/* ******************************************************************************* */
/* ************************ Two column styles (within inner content) ************* */

.two_column td.captions a {
	color:					#036;
}

.two_column td.captions a:hover {
	background:				#036;
	color:					#fff;
}

/* ************************ End Two column styles (within inner content) ********* */
/* ******************************************************************************* */


/* ******************************************************************************* */
/* ************************ Default form styles ********************************** */

#content form a {
	color:					#d50000;
}

#content form a:hover {
	background:				#d50000;
	color:					#fff;
}

/* ************************ End Default form styles ****************************** */
/* ******************************************************************************* */


/* ******************************************************************************* */
/* ************************ Footer styles **************************************** */

#footer div, #footer_popup div {
	border-color:			#fff;
	background:				#8C0001;
}

#footer ul li a, #footer div p {
	color:					#fff;
}

#footer ul li a:hover, #footer ul li a.highlight {
	background-color:		#fff;
	color:					#4D5C6B;
}

#footer p a {
	color:					#B7BDC3;
}

#footer ul, #footer_popup ul {
	color:					#fff;
}

#footer, #footer p {
	border-top-color:		#F9BA29;
}

/* ************************ End Footer styles ************************************ */
/* ******************************************************************************* */


/* ******************************************************************************* */
/* ************************ Misc styles ****************************************** */

/* Currently second lightest */
.highlight_a {
	background-color:		#4D8DBA;
	color:					#fff;
}

div.callout_column .highlight_a hr {
	background:				#4D8DBA;
	color:					#4D8DBA;
}

.specification {
	background:				#FDF3F3;
	border-bottom:			10px solid #FDF3F3;
}

/* Currently lightest blue */
.highlight_b {
	background-color:		#B72226;
	color:					#fff;
}

div.callout_column .highlight_b hr {
	background:				#B72226;
	color:					#B72226;
}

.flash_banner_bottom {
	background:				url(../images/bg_bottom_dots_lrg.gif) top left repeat-x;
}

.section_end {
	background:				url(../images/bg_bottom_dots_lrg.gif) bottom left repeat-x;
}

.page_nav a {
	color:					#036;
}

.page_nav span {
	color:					#fff;
}

.page_nav a:hover {
	background:				#036;
	color:					#fff;
}

.page_nav a.selected {
	color:					#999;
}

div.error {
	color:					#fff;
	background:				#d50000 url(../images/bg_div_error.gif) 5px 50% no-repeat;
}

tr.error td {
	background:				#F2B2B2;
}

.ad_tools {
	background:				url(../images/bg_editorial_panel_list.gif) top left repeat-x;
}

.ad_tools li.selected a {
	color:					#d50000;
}


.highlight_c {
	color:					#d50000;
}