/*
Kainos by Trinity Interactive
Website: http://www.kainos.com
History: 2007-08-15 -> 2007-12-10

IE7 and lower get this "CSS Minimum and Maximum Sizes" script:
http://www.doxdesk.com/software/js/minmax.html

We did have a limited-range fluid layout, but IE7 broke the onResize event.
*/


/* Global Styles */
html, body {
 margin: 0;
 padding: 0;
}
html {
 font: 100%/1.25 Arial, Helvetica, sans-serif;
 border: 0; /* Suggested UI styling */
 overflow-y: scroll; /* Suggested UI styling */
}
body {
 color: #444;
 font-size: 0.625em; /* 10px */
 background: #eeeee9;
}
abbr, acronym {
 border: 0;
}


/* footerStickAlt as basis for scripted footer position */
html, body, #shadow-right {
 height: 100%;
}
#shadow {
 min-height: 100%;
 position: relative;
}



/* Main Layout */
#shadow {
 width: 726px; /* 752px + padding-left = 774px but IE7 needs it 4px narrower */
 margin: 0 auto; /* Centred */
 padding: 0 22px; /* Shadow width */
 background: #f9f9f4 url(graphics/bg.png) top left repeat-y;
}
#header { /* Logo and search boxes */
 float: left;
 width: 100%;
 height: 7em;
 text-align: right; /* Search box and nav on right */
 background: #4b6467 url(graphics/header/bg.png) left bottom no-repeat; /* Sliding Doors */
 position: relative; /* Stacking context */
}
#search {
 top: 7px;
 right: 12px;
 position: absolute;
}
#nav { /* <ul> of links across top.) */
 left: 9px; /* Align with logo */
 bottom: 0;
 position: absolute;
 margin: 0;
 padding: 0; /* 110px; Left border + logo */
}
#branding { /* Green box with text in it */
 clear: both;
 width: 100%;
 height: 97px;
 background: url(graphics/branding/bg.png) top right no-repeat;
 position: relative; /* Stacking context */
 overflow: hidden;
}
#content { /* Off-white area */
 clear: left;
 float: left;
 width: 100%;
 padding-bottom: 38px; /* Space for footer */
 position: relative; /* Stacking context */
 background: transparent url(graphics/content/left.png) top left repeat-y; /* #f9f9f4 */
 background: transparent url(graphics/content/right.png) top right repeat-y;
}
#main { /* Main content */
 float: left;
 width: 71%;
}
.search #main {
 float: none;
 width: auto;
 margin-right: 22px; /* Right border */
}
.customer #main {
 float: none;
 margin-right: 22px; /* Right border */
 width: auto;
}
#sidebar { /* Column to right of main content */
 float: right;
 width: 26%;
}
#content #nav-sectional { /* Navigation for current section */
 float: left;
 width: 18%;
 overflow: hidden;
}
.branch #main {
 width: 53%;
}
.news #main {
 width: 79%;
}
#footer { /* Copyright strip across bottom */
 clear: both;
 height: 38px;
 margin-top: -38px; /* Pull up into viewport */
 margin-left: auto; /* Centred */
 margin-right: auto; /* Centred */
 width: 770px;
 color: #ccc;
 text-align: center;
 background: #2b4447 url(graphics/footer/bg.png) top left no-repeat;
 position: relative;
}
#footer ul {
 height: 20px; /* + padding = 38 */
 margin: 0;
 padding: 18px 0 0 0; /* Top border */
}
.clear {
 clear: both;
}



/* Header (Logo; search box) */

/* - Logo */
#logo {
 float: left;
 margin: 0;
 padding-left: 6px; /* Left border */
 height: 7em;
 background: transparent url(graphics/header/left.png) bottom left no-repeat;
}
#logo img {
 margin: 0;
 padding: 0;
 vertical-align: top;
 border: 0;
}
#logo a {
 color: #fff;
}

/* - Search Box */

/* -- Controls */
#search input {
 vertical-align: middle;
}
#q {
 padding-top: 1px;
 padding-bottom: 1px;
 border: 1px solid #19977B;
}
#search-go { /* "Go" button */
 padding: 1px 1px 0 3px;
 color: #fff;
 font-weight: bold;
 font-size: 1em; /* 8px */
 text-transform: uppercase;
 background: #5f8a85;
 border: 1px solid black;
}



/* Navigation (list of links across the top.) */
#nav li {
 display: block;
 float: left;
 height: 1%; /* hasLayout */
 margin: 0;
 padding: 0;
 color: #fff;
 text-transform: uppercase;
 list-style-type: none;
 background: transparent url(graphics/nav/separator.gif) 0 35% no-repeat;
}
#nav li.first {
 background-image: none; /* No separator */
}

/* - Item Padding */
#nav a, #nav strong {
 display: block;
 padding: 9px 15px 12px 15px; /* 9px makes Home and logo touch */
}
#nav .section a { /* <li class="section"><a href><strong title> */
 padding: 0; /* Use padding from <strong> */
}
#nav li strong {
 font-weight: normal;
 background: transparent url(graphics/nav/current.gif) bottom center no-repeat;
}

/* - Links */
#nav a {
 float: left; /* Robustness */
 color: #fff;
 text-decoration: none;
}
#nav a:link, #nav a:visited {
 text-decoration: none;
}
#nav a:hover, #nav a:focus, #nav a:active {
 text-decoration: underline;
}



/* Branding (green box) */
#branding {
 color: #066;
 letter-spacing: -1px;
 background: transparent url(graphics/branding/right.png) top right no-repeat; /* Sliding Doors */
}
#branding blockquote {
 margin: 0;
 padding: 0;
 height: 97px;
 background: url(graphics/branding/left.png) top left no-repeat;
}
#branding p {
 margin: 0;
 line-height: 1.0;
 position: absolute;
}
#branding p.first {
 bottom: 42px;
 padding-left: 235px;
 padding-bottom: 0.2em;
 color: #366;
 font-size: 1.4em; /* 14px */
 text-indent: -3em;
}
#branding p.last {
 right: 30px;
 height: 45px;
 bottom: 0;
 color: #4d6b6e;
 line-height: 1.222; /* 9px -> 2px */
 font-size: 0.9em; /* 9px */
 letter-spacing: 0;
}
#branding p.last cite {
 font-style: normal;
}
/* - Rotating Banners */
#branding img {
 margin-top: 3px;
}


/* - Homepage */
.homepage #branding {
 height: 174px;
 color: #333;
 background: url(graphics/branding/homepage.png) top right no-repeat; /* Sliding Doors */
}
.homepage #branding p {
 margin: 0;
 padding: 0 55px 0 305px;
 line-height: 1.0;
 position: absolute;
 letter-spacing: -1px;
}
.homepage #branding .first {
 right: 6px;
 height: 3em;
 bottom: 85px;
 text-indent: 0;
}
.homepage #branding .last {
 right: 6px;
 height: 70px;
 bottom: 0;
 color: #066;
 line-height: 1.214;
 font-size: 1.4em; /* 14px */
 font-style: italic;
 text-align: right;
}



/* Content */
#content {
 font-size: 1.2em; /* 12px */
}
#content h1, #content h2, #content h3, #content p, #content ul {
 margin-bottom: 0.5em;
}

/* - Hyperlinks */
#content a {
 text-decoration: none;
}
#content a.more, #content .more a {
 margin-left: 0.1em;
 padding-left: 13px;
 background: url(graphics/content/arrow.gif) no-repeat 0 0.4em;
}
#content a:link, #content a:visited {
 color: #066;
}
#content a:hover, #content a:focus, #content a:active {
 text-decoration: underline;
}

/* - Headings */
h1, h2, h3, #content caption {
 margin-top: 0;
 color: #066;
 text-align: left;
 line-height: 1.0;
 font-weight: normal;
 font-family: Georgia, Times, serif;
 background: transparent url(graphics/content/border-x.gif) left bottom repeat-x;
}
h1 {
 font-size: 1.417em; /* 12px -> 17px */
}
h2, #content caption {
 font-size: 1.167em; /* 12px -> 14px */
}
h3 {
 padding-top: 1em;
 font-size: 1em; /* 12px */
}

/* - Paragraphs */
#content p {
 margin: 0;
 padding-bottom: 1em;
}

/* - Lists */
#content ul {
 margin: 0;
 padding: 0 0 1em;
 list-style: none;
}
#content ul li {
 margin: 0 0 0 1.4em; /* Indention */
 padding: 0 0 0 1.3em; /* Gap for bullet to shine through */
 background: url(graphics/content/bullet.png) 0 0.3em no-repeat; /* Background-position more reliable than list-style-image */
}

/* - Breadcrumb */
p#breadcrumb { /* Specificity win over "#content p" */
 top: -5px;
 margin: 0 0 0 22px; /* Left border */
 padding: 0 0 1em 0;
 line-height: 1.0;
 font-size: 0.9167em; /* 12px -> 11px */
 position: relative;
}

/* Sectional Navigation (left of main content on branch pages) */
#content #nav-sectional {
 margin: 1px 0 0 0; /* Nudge */
}
#content #nav-sectional ul {
 margin: 2em 0 0 22px; /* Left border */
 background: transparent url(graphics/content/border-x.gif) left top repeat-x;
}
#content #nav-sectional li {
 margin: 0;
 padding: 0;
 background: transparent url(graphics/content/border-x.gif) left bottom repeat-x;
}
#content #nav-sectional li a, #content #nav-sectional li strong {
 display: block;
 height: 1%;
 margin: 0;
 padding: 0.25em 0 0.5em 20px;
 background: url(graphics/content/arrow.gif) 7px 0.583em no-repeat;
}
/* - Inner layer */
#content #nav-sectional ul ul {
 margin: 0;
 padding: 0;
 background-image: none;
}
#content #nav-sectional li li {
 background-image: none;
}
#content #nav-sectional li li a, #content #nav-sectional li li strong {
 padding: 0 0 0.5em 40px;
 background-position: 27px 0.333em;
}



/* Main Content */
#main h1, #main h2, #main h3, #main p, #content table, #main ul, #main caption {
 margin-left: 22px; /* Left border */
}
#main h1, #main h2, #main h3, #main caption {
 color: #066;
 padding-bottom: 0.6em; /* Push border down */
}
#main .introduction {
 font-weight: bold;
}

/* - Main Content Forms */
#main form, #main fieldset {
 margin: 0;
 padding: 0;
}
#main fieldset, #main div.button {
 margin: 1em 0 1em 22px; /* Left border */
 border: 0 solid transparent;
}
#main fieldset fieldset, #main fieldset div.button {
 margin-left: 0;
}
#main fieldset legend {
 margin: 0;
 padding: 0 0 0.5em 0;
 color: #066;
 line-height: 1.0;
 font-weight: normal;
 font-family: Georgia, Times, serif;
 text-indent: 0;
 position: static;
}
fieldset div {
 clear: left;
 margin: 0 0 0.5em 0;
}
#main .dropdown label, #main .textbox label, #main .textarea label {
 float: left;
 width: 25%;
}
#main .text .checkbox {
 margin-left: 24.8%;
}
#main .text .checkbox input {
 margin-left: 1px;
 padding: 0;
}
#main .textbox input, #main textarea, #main select, #main .dropdown select {
 border: 1px solid #066;
}
#main .textbox input, #main textarea {
 width: 70%;
}
#main select, #main .dropdown select {
 width: 70.4%;
}
#main div.button {
 margin-bottom: 0.5em;
}
#main fieldset div.button {
 margin: 0;
}


/* - Homepage */
.homepage #main li {
 margin-left: 0.4em; /* Indention */
}
/* -- Columns */
#financial-services, #public-sector {
 float: left;
 width: 48%;
}
/* -- Decoration */
#recruitment {
 clear: left;
 min-height: 115px; /* Keep image visible */
 background: transparent url(graphics/content/recruitment.png) 22px 2.3em no-repeat;
}
#recruitment p {
 padding-left: 175px; /* 168px + 7px */
}

/* Customer page */

/* - Financial Services Table */
#financial-services-table {
 margin-bottom: -6px; /* Pull up bottom of #content so table ends flush with it */
 border-collapse: collapse;
 position: relative;
}
#financial-services-table .last .more a {
 padding-bottom: 1em; /* Space from end of #content */
}
#financial-services-table caption {
 background-image: none;
}
#financial-services-table td {
 padding-left: 1em;
 font-size: 0.833em; /* 12px -> 10px */
 text-align: left;
 vertical-align: middle;
}
#financial-services-table tbody th, #financial-services-table tbody td {
 border-top: 1px solid #cecece;
}
/* -- Links */
#financial-services-table td a {
 display: block;
}
#financial-services-table .more {
 padding-left: 2em;
 text-align: right;
 vertical-align: bottom;
 white-space: nowrap;
}
#content #financial-services-table .more a {
 /* IE6 only notices the 13px padding when this is a block */
 background-position: 0 0.2em;
}

/* - News Page */
.news #main h2 a {
 font-weight: bold;
 text-decoration: underline;
}
.news #main h2 a:hover, .news #main h2 a:focus, .news #main h2 a:active {
 text-decoration: none;
}
.news #main h2 {
 margin-top: 1em;
 margin-bottom: 0;
 font-size: 1em; /* 12px */
 background-image: none;
}
.news #main p .news #main p, .news #main ul {
 padding-right: 150px; /* Space for background image */
}
.news #main p.meta {
 clear: right; /* Keep below previous image */
 padding-bottom: 0;
 font-weight: bold;
 padding-right: 0px; /* Space for background image */
}
.news #main p.meta img {
 top: -1.5em;
 position: relative;
 margin: 0;
 padding: 0;
 float: right;
}
.news #main p cite {
 display: block;
 font-style: normal;
}
.news.leaf  #main p .news.leaf  #main p, .news.leaf  #main ul {
 padding-right: 0;
}

/* - Customers Page */
#financial-services-table img {
 display: block;
 border: 0;
}

/* - Employee Popup */
.employee #main {
 width: auto;
 padding-right: 22px;
 font-size: 1.2em; /* 10px -> 12px */
}
.employee #main h1 {
 padding: 0;
 background-image: none;
}
.employee #main input {
 margin-left: 22px;
}
/* - Employee New */
.employee.new {
 background: #f8f9f4;
}
.employee.new #main {
 padding: 22px 22px 22px 0;
 font: 1.25em/1.75 "Trebuchet MS", "Arial", sans-serif; /* 12px -> 15px */
}
.employee.new #main h1 {
 margin-bottom: 0.5em;
}
.employee.new #main p {
 margin-top: 0;
}
.employee.new #main .close a {
 padding-left: 16px; /* Space for graphic to shine through. */
 color: #444;
 text-decoration: none;
 background: transparent url(graphics/content/close.png) left center no-repeat;
}

/* - Search Engine Results Page (SERP) */
.search #main var {
 font-style: normal;
 font-weight: bold;
}
/* - Pagination List (Search results and FAQ content.) */
#main .pagination {
 text-align: center;
}
#main .pagination ul, #main .pagination p {
 margin: 0;
}
#main .pagination li {
 display: inline;
 margin: 0;
 padding: 0 0.2em 0 0.4em;
 font-weight: bold;
 background: none;
 border-left: 1px solid;
}
#main .pagination li a {
 font-weight: normal;
}
#main .pagination .first {
 padding: 0 0.2em 0 0;
 border-left: 0;
}


/* Sidebar Content (Column to right of #main.) */

/* - Homepage */
.homepage #sidebar {
 margin-top: -1em;
 position: relative;
}

/* - Language Picker */
#sidebar #language {
 margin: 0 22px 0 0; /* Right border */
 padding: 0 0 2.5em 0;
 font-size: 0.833em; /* 12px -> 10px */
 text-align: right;
 background: transparent url(graphics/content/border-x.gif) left bottom repeat-x;
 position: relative;
}
#sidebar #language form {
 margin: 0;
 padding: 0;
}
#sidebar #language h5 {
 display: inline;
 margin: 0 0 0 0.4em;
 font-size: 1em; /* 10px */
 font-weight: normal;
}
#sidebar #language ul, #sidebar #language li {
 display: inline;
 margin: 0;
 padding: 0;
 list-style: none;
 background-image: none;
}
#sidebar #language img {
 margin: 0;
 padding: 0;
 border: 0;
}

/* - Headings */
#sidebar h2, #sidebar h3 {
 margin: 0 22px 0 0; /* Right border */
 padding: 0;
 line-height: 1.0;
}
#sidebar h2 {
 padding: 0.2em 0 0.4em 0;
 line-height: 1.2;
 background: transparent url(graphics/content/border-x.gif) left bottom repeat-x;
}
#sidebar h2 span {
 display: block;
 margin-top: 1.5em;
 padding-top: 0.2em;
 background: transparent url(graphics/content/border-x.gif) left top repeat-x;
}
#sidebar h3 {
 margin-top: 0.3em;
 margin-bottom: 0.3em;
 line-height: 2.2;
 text-indent: 12px;
 background: transparent url(graphics/content/arrow.gif) 0 0.8em no-repeat;
}
#sidebar h3 a {
 display: block;
 padding-bottom: 77px;
 position: relative; /* Ensure images get displayed in IE6 */
}
/* -- Sidebar Pictures */
#sidebar h3#business-solutions a {
 background: transparent url(graphics/content/business-solutions.png) bottom center no-repeat;
}
#sidebar h3#latest-news a {
 background: transparent url(graphics/content/latest-news.png) bottom center no-repeat;
}
#sidebar h3#featured-case-study a {
 background: transparent url(graphics/content/featured-case-study.png) bottom center no-repeat;
}
#sidebar h3#our-people a {
 background: transparent url(graphics/content/our-people.png) bottom center no-repeat;
}

/* - Paragraphs */
#sidebar p {
 margin-right: 22px; /* Right border */
 padding-bottom: 1em;
 background: transparent url(graphics/content/border-x.gif) left bottom repeat-x;
}
#sidebar p.last {
 padding-bottom: 0;
 background-image: none;
}

/* - Forms */
#sidebar fieldset {
 margin: 1em 22px 0 0; /* Right border */
 padding: 0 5px;
}
#sidebar label {
 display: block;
}
#sidebar fieldset span {
 display: none;
}
#sidebar .textbox input, #sidebar .dropdown select {
 width: 145px;
}



/* Footer (Copyright notice at botton.) */
#footer li {
 display: inline;
 padding: 0 0.4em 0 1em;
 background: url(graphics/footer/separator.png) left center no-repeat;
}
#footer li.first {
 background-image: none;
}

/* - Links */
#footer a {
 color: #fff;
 text-decoration: none;
}
#footer a:hover, #footer a:focus, #footer a:active {
 text-decoration: underline;
}



/* Off-screen (Context aids we don't want visible.) */
#search form, #search fieldset {
 margin: 0;
 padding: 0;
 border: 0 solid transparent;
}
#search legend, #search label, thead.extra, #nav-sectional h2, .pagination h2, #footer h1 {
 left: -9999px;
 text-indent: -9999px;
 width: 0;
 height: 0;
 line-height: 0; /* Legends in Firefox */
 border: 0;
 position: absolute;
}