/* -------------------------------------------------------------------------

	Financial Ombudsman Service Screen Style Sheet - large high contrast font
	last update: 17 February 2010
	author: Bill Dashfield
	email: bill@ecru.co.uk

------------------------------------------------------------------------- */

/* colour palette ----------------------------------------------------------
		Normal	Contrst	White on Black
		======	=======	==============
grey rules 	#DEDEDE	#BBB
FOS blue 	#4B90CD	#1D2172
FOS purple: 	#1D2172
blue text 	#2B6198	#1D2172	
'black' text	#333	#080808	#F1F1F1;	
'greyer' text	#555	#1D2172	#2B6198
background	#FEFEFE 	#FEFEFE 	#1D2172;
background	#F2F2F2	#F8F8F8	#0D0D0D
active links	#999	#000	#FEFEFE 
*/

body {
	background-color: #f8f8f8;
	font-size: 150%; /* convert 16px base font size to 24px */
	line-height: 1.33em; /* 20px (12 x 1.75 = 20) */
	color: #080808;
}

#header {
	background-color: #FEFEFE;
	border-top: 4px solid #1D2172;
	border-bottom: 2px solid #BBB;
}

.large-hide {display: none;
}

.large-unhide {display: inline;
}

#panel3 h2 {
	margin: 10px 10px 5px 0;
}

/* !TYPOGRAPHY ---------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
	color: #1D2172;
}

#mainContent h1 {
	color: #1D2172;
	font-size: 1.5em;
}

#mainContent h2 {
	font-size: 1.3em;
	line-height: 1.1em;
}

#mainContent h3 {
	font-size: 1.2em;
	line-height: 1em;
	margin: 1.1em 0;
}

#mainContent h4 {
	font-size: 1.1em;
}

.rule {
	border-top: 2px solid #BBB;
	border-bottom: 2px solid #FEFEFE;
}

blockquote {
	border: 2px solid #BBB;
	background: #FEFEFE  url("../images/quote_open.gif") no-repeat 8px 8px;
}
 
blockquote p {
	color: #1D2172;
}
 
blockquote p.author {
	color: #1D2172;
}

/* hyperlinks */

a:link, a:visited,
#mainContent a:link, 
#mainContent a:visited {
	color: #1D2172;
	border-bottom: 2px solid #BBB;
}

a:hover, a:active,
#mainContent a:hover,
#mainContent a:active {
	color: #18145D;
	border-bottom: 2px solid #000;
}

/* focus styles for tabbing through links */
:focus {
	outline: 4px dotted red;
}

/* tooltips */

#tooltip {
	border: 2px solid #600;
	background-color: #C33;
}

#tooltip h3, #tooltip div {
	margin: 0;
	color: #FEFEFE  !important;
}

#accessMenu li {
	border-right: 2px solid #BBB;
}

#accessMenu {
	font-size: 0.8em;
	line-height: 1.5em;
}

/* !MAIN NAVIGATION ----------------------------------------------------- */

#mainNavigation {
	background: #F8F8F8 url(../images/transparent.gif) repeat-x;
	min-height: 45px;
	font-size: 75%;
}

#mainNavigation #navHome {
	border-left: 2px solid #BBB;
}

#mainNavigation #navContact {
	border-right: 2px solid #FEFEFE;
}

#mainNavigation a:link,
#mainNavigation a:visited {
	color: #1D2172;
	border-right: 2px solid #BBB;
	border-left: 2px solid #FEFEFE;
	border-bottom: 2px solid #BBB;
}

#mainNavigation a:hover,
#mainNavigation a:active {
	color: #000;
	background-color: #FEFEFE;
}

/* selected */

#home #mainNavigation #navHome,
#about #mainNavigation #navAbout,
#news #mainNavigation #navNews,
#complain #mainNavigation #navComplain,
#FAQs #mainNavigation #navFAQ,
#publications #mainNavigation #navPublications,
#contact #mainNavigation #navContact {
	background: url(../images/transparent.gif) repeat-x center bottom;
	background-color: #1D2172;
}


#home #mainNavigation #navHome a,
#about #mainNavigation #navAbout a,
#news #mainNavigation #navNews a,
#complain #mainNavigation #navComplain a,
#FAQs #mainNavigation #navFAQ a,
#publications #mainNavigation #navPublications a,
#contact #mainNavigation #navContact a {
	background: url(../images/transparent.gif) no-repeat center bottom;
	border-top: 1px solid #1D2172;
	color: #FEFEFE;
}

/* search */

#formSearch {
	color: #1D2172;
	font-size: 110%;
}

#formSearch label {
	margin-top: -1px;
}

#formSearch #btnSearch {
	margin-top: 5px;
}

#formSearch #search {
	border: 2px solid #BBB;
	background-color: #FEFEFE;
	color: #555;
}

#formSearch #search:focus {
	border: 2px solid #999;
	color: #000;
}

/* !SUB NAVIGATION ------------------------------------------------------ */

#subNavigation {
	border: 2px solid #BBB;
	background-color: #FEFEFE;
}

#subNavigation h2 {
	background: #1D2172 url(../images/transparent.gif) no-repeat bottom center;
	border-top: 2px solid #1D2172; 
	color: #FEFEFE;
}

/* level 1 */

#subNavigation li {
	border-top: 2px solid #BBB;
	line-height: 1.3em; 
}

#subNavigation li a:hover,
#subNavigation li a:active {
	background-color: #F8F8F8;
	color: #1D2172;
}

#subNavigation li:first-child a:hover,
#subNavigation li:first-child a:active {
	background: #F8F8F8 url(../images/blue_arrow.gif) no-repeat top center;
}

/* level 2 */

#subNavigation li li {
	line-height: 1.3em; 
}

#subNavigation li li:first-child a:hover,
#subNavigation li li:first-child a:active {
	background: #F8F8F8 url(../images/arrow_purple.gif) no-repeat 8px 0.95em;
}

#subNavigation li li a:hover,
#subNavigation li li a:active {
	background: #F8F8F8 url(../images/arrow_purple.gif) no-repeat 8px 0.95em;
	color: #1D2172;
}

/* Breadcrumb ---------------------------------------------------------- */
#breadcrumb {
	background-color: #F8F8F8;
}

/* !CONTENT PANELS ----------------------------------------------------- */

/* banner heading */

#mainContent .banner {
	background: #A6CE39 url(../images/content_banner_bg.jpg) no-repeat bottom right;
}

#mainContent .banner h1 {
	color: #080808;
}

#mainContent .banner h2 {
	color: #080808;
}

/* alert panel */

.alert {
	border: 2px solid #1D2172;
	background-color: #FEFEFE;
}

#mainContent .alert h2 {
	background: #1D2172 url(../images/transparent.gif) repeat-x 0 0;
	color: #FEFEFE;
}

/* highlight panel */

.highlight {
	border: 2px solid #1D2172;
	background-color: #FEFEFE;
}

#mainContent .highlight h2 {
	background: #1D2172 url(../images/transparent.gif) repeat-x 0 0;
	color: #FEFEFE;
}

/* !SIDEBAR PANELS ------------------------------------------------------*/ 

#rightColumn .panel {
	border: 2px solid #BBB;
	background-color: #FEFEFE;
}

#rightColumn .panel h2 {
	background: #1D2172 url(../images/transparent.gif) no-repeat bottom center;
	border-top: 2px solid #1D2172; 
	color: #FEFEFE;
}

#rightColumn .panel p {
	border-top: 2px solid #BBB;
	line-height: 1.3em; 
}

#rightColumn .panel li {
	border-top: 2px solid #BBB;
line-height: 1.3em; 
}

#rightColumn .panel li a:link,
#rightColumn .panel li a:visited {
	border-bottom: 2px solid #FEFEFE;
}

#rightColumn .panel li a:hover,
#rightColumn .panel li a:active {
	color: #1D2172;
	border-bottom: 2px solid #999;
}

/* my story panel */

#rightColumn .myStory {
	background: #FEFEFE;
}

#rightColumn .myStory h2 {
	color: #080808;
	background-color: #FEFEFE;
}

#rightColumn .myStory p {
	color: #080808;
}

#rightColumn .myStory a:link, #rightColumn .myStory a:visited {
	color: #080808;
	border-bottom: 2px solid #D3E756 !important;
}

#rightColumn .myStory a:hover, #rightColumn .myStory a:active {
	color: #000;
	border-bottom: 2px solid #FEFEFE  !important;
}

/* !FEEDBACK PANEL ------------------------------------------------------ */

.feedback {
	border: 2px solid #BBB;
	background-color: #FEFEFE;
}

.feedback #leavecomment {
	border-top: 2px solid #BBB !important;
}

.feedback #comments {
	border: 2px solid #BBB;
	background-color: #FCFCFC;
	color: #555;
}

.feedback #comments:focus {
	background-color: #FEFEFE;
	color: #000;
}

.leavefeedback {
	color: #1D2172;
}

.feedback .button {
	background: #DDD url(../images/button_bg.gif) repeat-x 0 0;
	border: 2px solid #999;
	color: #080808;
	text-shadow: #FEFEFE  0 2px 2px;
}

/* !HOMEPAGE ------------------------------------------------------------ */

/* banner */

#home #banner {
	color: #FEFEFE;
}

#home h1 {
	color: #1D2172;
	font-size: 1.5em;
}

#home h2 {
	font-size: 1.2em;
	line-height: 1.1em;
}

#home h3 {
	font-size: 1.1em;
	line-height: 1em;
	margin: 1.1em 0;
}

#home h4 {
	font-size: 1.05em;
}

#panel1, #panel2, #panel3 {
	min-height: 390px;}

#panel1 {
	background: #3170B9 url(../images/home_banner1.jpg) no-repeat;
}

#panel1 h1 {
	color: #FEFEFE;
}

#home #banner a:link,
#home #banner a:visited {
	color: #FEFEFE;
	border-bottom: 2px solid #63B5DD !important;
}

#home #banner a:hover,
#home #banner a:active {
	border-color: #FEFEFE  !important;
}

#panel2 {
	background: #1D2172 url(../images/home_banner2.jpg) no-repeat bottom right;
}

#panel2 p, #panel3 p {
	width: 210px;
}

#home #banner #panel2 a:link, #home #banner #panel2 a:visited {
	border-color: #5458B3 !important;
}

#home #banner #panel2 a:hover, #home #banner #panel2 a:active {
	border-color: #FEFEFE  !important;
}

#panel3 {
	background: #A6CE39 url(../images/home_banner3.jpg) no-repeat bottom right;
}

#panel3 h2 {
	color: #080808;
}

#panel3 p {
	color: #080808 !important;
}

#home #banner #panel3 a:link, #home #banner #panel3 a:visited {
	color: #080808;
	border-color: #D3E756 !important;
}

#home #banner #panel3 a:hover, #home #banner #panel3 a:active {
	color: #000;
	border-color: #FEFEFE  !important;
}

/* panels */

#home #leftColumn .panel,
#home #rightColumn .panel {
	border: 2px solid #BBB;
	background: #FEFEFE  url(../images/transparent.gif) no-repeat left bottom;
}

#home .panel h2 {
	border-bottom: 2px solid #BBB;
	background: #FEFEFE  url(../images/transparent.gif) repeat-x left bottom;
	border-top: 0px solid #080808;
	color: #080808;
}


#home .panel li {
	background: url(../images/arrow_purple.gif) no-repeat 0 0.6em;
}

#home .panel a:link,
#home .panel a:visited {
	border-bottom: 2px solid transparent !important;
}

#home .panel a:hover,
#home .panel a:active {
	border-bottom-color: #999 !important;
}

/* consumers panel */

/* accessibility panel */

#home #leftColumn .accessibility {
	background: #A6CE39 url(../images/accessibility_door.jpg) no-repeat bottom right;
	border: 2px solid #A6CE39;
}

#home #leftColumn .accessibility h2 {
	color: #080808 !important;
}

#home #leftColumn .accessibility a:link,
#home #leftColumn .accessibility a:visited {
	color: #080808;
	border-bottom-color: #D1E65C;
}

#home #leftColumn .accessibility a:hover,
#home #leftColumn .accessibility a:active {
	color: #000;
	border-bottom-color: #FEFEFE  !important;
}

.findinfo ul {
	width: 435px;
	float: none;
}

#home #rightColumn li {
	border-top: 0px solid #FEFEFE;
}

/* !FOOTER -------------------------------------------------------------- */

#footerContent {
	color: #666;
}

#home #footerContent {
	width: 100%;
}

#footerContent ul {
	border-top: 0px solid #F2F2F2;
	margin-bottom: 0;
}

#footerContent li a:link,
#footerContent li a:visited {
	background: url(../images/transparent.gif) no-repeat 0 2px;
	margin-left: 4px;
	margin-right: 4px;
	padding-left: 0;
	min-height: 23px;
	display: block;
}