/* -------------------------------------------------------------- 
  
   Reset.css
   * Resets default browser CSS styles.
   
   Original by Erik Meyer:
   * meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
   
-------------------------------------------------------------- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

html { height:100%; }
body { line-height: 1; color: #333; background: white; }

/* Tables still need 'cellspacing="0"' in the markup. */
table { border-collapse: separate; border-spacing: 0; vertical-align:top; }
caption, th, td { text-align: left; font-weight: normal; }

/* Remove possible quote marks (") from <q>, <blockquote>. */
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }

/* Clearing floats without extra markup
   Based on How To Clear Floats Without Structural Markup by PiE
   [http://www.positioniseverything.net/easyclearing.php] */

.clear { display: inline-block; }   
.clear:after, .container:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
* html .clear { height: 1%; }
.clear { display: block; }


#contentImg {margin: 10px;}
#contentfloatImg {margin: 10px 20px 10px 10px; float: left;}

/* -------------------------------------------------------------- 
   
   Typography.css
   * Sets some default typography.
  
-------------------------------------------------------------- */   

body {
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.5; /* Unitless for proper inheritance */
  color: #000;
/*  letter-spacing: -0.4px;*/
}

/* This is where you set your desired font size. The line-height 
   and vertical margins are automatically calculated from this. 
   
   You have to add an extra calculation here because of IE, so that 
   all users may resize text manually in their browsers.
   
   The top one is for IE: The percentage is of 16px (default IE text size)
   10px is 62.5%, 12px is 75%, 13px is 81.25%, and so forth).
   The second value is what all other browsers see (the wanted font size). */
   
body          { font-size: 75%; line-height:1.2em; }   /* IE */
html > body   { font-size: 12px; line-height:1.2em; }  /* Other browsers */


/* Headings
-------------------------------------------------------------- */

h1,h2,h3,h4,h5,h6 { 
  font-family: Arial, Helvetica, sans-serif;
  font-weight:bold;
}

h1 { font-size: 1.2em; margin-bottom:1em; }
h2 { font-size: 20px; margin-bottom: 10px; line-height: 24px;}
h3 { font-size: 1em; }
h4 { font-size: 1em; }
h5 { font-size: 1em; }
h6 { font-size: 1em; }


/* Text elements
-------------------------------------------------------------- */

p           { margin: 0 0 1em 0; line-height:1.3em; }
p.last      { margin-bottom:0; }
p img       { float: right; margin: 0em 0em 1.5em 1.5em; padding:4px; border:1px solid #343434; background: #ddd; }
p img.top   { margin-top:0; } /* Use this if the image is at the top of the <p>. */

ul, ol      { margin: 0 0 1.5em 1.5em; }
ol          { list-style-type: decimal; }
dl          { margin: 1.5em 0; }
dl dt       { font-weight: bold; }

a           { text-decoration: none; outline: none; color: #0040a1; }
a:hover     { text-decoration: none; color: #ff0141; }

blockquote  { margin: 0em 0 1.8em 0em; font-style: normal; font-size:1em; }
strong      { font-weight: bold; }
em          { font-style: italic; }
pre         { margin-bottom: 1.3em; background: #eee; border:0.1em solid #ddd; padding:1.5em; }
code        { font:0.9em Monaco, monospace; }

/* Use this to create a horizontal ruler across a column. */
hr {
  background: #B2CCFF; 
  color: #B2CCFF;
  clear: both; 
  float: none; 
  width: 100%; 
  height: 0.1em;
  margin: 0 0 1.4em 0;
  border: none; 
}
* html hr { margin: 0 0 1.2em 0; } /* IE6 fix */


/* Tables
-------------------------------------------------------------- */

table   { margin-bottom: 0em; border-top:0.0em solid #ddd; border-left:0.0em solid #ddd; }
th,td   { padding:0; border-bottom:0.0em solid #ddd; border-right:0.0em solid #ddd; }
th      { font-weight:bold; }


/* Forms
-------------------------------------------------------------- */

label     { font-weight: normal; cursor: pointer; }
/*textarea  { height: 180px; width: 300px; }*/


/* Some default classes
-------------------------------------------------------------- */

p.small   { font-size: 0.8em; margin-bottom: 1.875em; line-height: 1.875em; }
p.large   { font-size: 1.2em; line-height: 2.5em; }
p.quiet   { color: #666; }
.hide     { display: none; }
h2.signature { font-weight:normal; color: #97999c; }
p.link { margin-top:30px; font-size:0.8em; }
.strong,
.bold { font-weight:bold; }


/* Extra fancy typography
-------------------------------------------------------------- */

/* For great looking type, use this code instead of asdf: 
   <span class="alt">asdf</span>  
   Best used on prepositions and ampersands. */
  
.alt { 
  color: #666; 
  font-family: "Warnock Pro", "Goudy Old Style","Palatino","Book Antiqua", serif; 
  font-size: 1.2em;
  line-height: 1%; /* Maintain correct baseline */
  font-style: italic;
}

/* For great looking quote marks in titles, replace "asdf" width:
   <span class="dquo">&#8220;</span>asdf&#8221;
   (That is, when the title starts with a quote mark). 
   (You may have to change this value depending on your font size). */  
   
.dquo { margin-left: -.7em; } 


/* Reduced size type with incremental leading
   (http://www.markboulton.co.uk/journal/comments/incremental_leading/)

   This could be used for side notes. For smaller type, you don't necessarily want to 
   follow the 1.5x vertical rhythm -- the line-height is too much. 
   
   Using this class, it reduces your font size and line-height so that for 
   every four lines of normal sized type, there is five lines of the sidenote. eg:

   New type size in em's:
     10px (wanted side note size) / 12px (existing base size) = 0.8333 (new type size in ems)

   New line-height value:
     12px x 1.5 = 18px (old line-height)
     18px x 4 = 72px 
     60px / 5 = 14.4px (new line height)
     14.4px / 10px = 1.44 (new line height in em's) */

p.incr, .incr p {
	font-size: 0.83333em; /* font size 10px */
	line-height: 1.44em;  
	margin-bottom: 1.8em; /* Still 1.5 x normal font size as baseline */
}


/* Caution! Ensure accessibility in print and other media types... */
@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
    .tabs-hide {
        display: none;
    }
}

/* Hide useless elements in print layouts... */
@media print {
    .tabs-nav {
        display: none;
    }
}

/* Skin */
.tabs-nav {
    list-style: none;
    margin: 0;
    padding: 0 0 0 4px;
}
.tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */
    display: block;
    clear: both;
    content: " ";
}
.tabs-nav li {
    float: left;
    margin: 0 0 0 1px;
    min-width: 84px; /* be nice to Opera */
}
.tabs-nav a, .tabs-nav a span {
    display: block;
    padding: 0 10px;
    background: url(/images/tab.png) no-repeat;
}
.tabs-nav a {
    position: relative;
    top: 1px;
    z-index: 2;
    padding-left: 0;
    color: #0040a1;
    font-size: 12px;
    font-weight: bold;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    white-space: nowrap; /* required in IE 6 */    
}
.tabs-nav .tabs-selected a {
    color: #ff0141;
}
.tabs-nav .tabs-selected a, .tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active {
    background-position: 100% -150px;
    outline: 0; /* prevent dotted border in Firefox */
}
.tabs-nav a, .tabs-nav .tabs-disabled a:hover, .tabs-nav .tabs-disabled a:focus, .tabs-nav .tabs-disabled a:active {
    background-position: 100% -100px;
}
.tabs-nav a span {
    width: 64px; /* IE 6 treats width as min-width */
    min-width: 64px;
    height: 18px; /* IE 6 treats height as min-height */
    min-height: 18px;
    padding-top: 6px;
    padding-right: 0;
}
*>.tabs-nav a span { /* hide from IE 6 */
    width: auto;
    height: auto;
}
.tabs-nav .tabs-selected a span {
    padding-top: 7px;
}
.tabs-nav .tabs-selected a span, .tabs-nav a:hover span, .tabs-nav a:focus span, .tabs-nav a:active span {
    background-position: 0 -50px;
}
.tabs-nav a span, .tabs-nav .tabs-disabled a:hover span, .tabs-nav .tabs-disabled a:focus span, .tabs-nav .tabs-disabled a:active span {
    background-position: 0 0;
}
.tabs-nav .tabs-selected a:link, .tabs-nav .tabs-selected a:visited, .tabs-nav .tabs-disabled a:link, .tabs-nav .tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
    cursor: text;
}
.tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active { /* @ Opera, we need to be explicit again here now... */
    cursor: pointer;
}
.tabs-nav .tabs-disabled {
    opacity: .4;
}
.tabs-container {
	border: 1px solid #97a5b0;
    border-top: 1px solid #97a5b0;
    padding: 0;
    background: #fff url('/images/background.wheel.jpg') center center; /* declare background color for container to avoid distorted fonts in IE while fading */
}
.tabs-loading em {
    padding: 0 0 0 20px;
    background: url(/images/loading.gif) no-repeat 0 50%;
}


/* -------------------------------------------------------------- 
  
   CSS Framework
   
   * Native site styles *
      
-------------------------------------------------------------- */



/* -------------------------------------------------------------- 
	Body and Site wrapper
---------------------------------------------------------------*/
body { background: #ff002e url('/images/background.jpg') top left repeat-x; }
/*body { background: #fff url(''); }*/
.wrapper { width: 870px; margin:0px auto; }


/* -------------------------------------------------------------- 
	Brand colours
---------------------------------------------------------------*/
.blue { color: #0040a1; }
.pink { color: #ff0141; }


/* -------------------------------------------------------------- 
	Utility styles
---------------------------------------------------------------*/
.icon { vertical-align:middle; }


/* -------------------------------------------------------------- 
	Styles
---------------------------------------------------------------*/

.headerstrip { border-top:1px solid #ff1040; background: #0040a1; pading:5px 20px; font-size:13px; color: #fff; }
.headerstrip .callus { float:left; color: #fff; margin-left:20px; padding:3px; }
.headerstrip .quicklinks { float:right; margin-right:20px; padding:3px; }
.headerstrip .quicklinks a { color: #fff; text-decoration:none; }
.headerstrip .quicklinks a:hover { color: #fff; text-decoration:underline; }

.header { }
.header .logo { float:left; }
.header .partnerlogos { float:right; }

.footer { clear:both; margin-top:10px; color: #000; }
.footer_contactdetails { font-size: 1.7em; text-align:center; }

.pagebody { min-height:200px; }



.subnavigation { float:left; width:150px; margin-top:5px; margin-bottom:5px; }
.subnavigation ul { list-style:none; margin:0; padding:0;  }
.subnavigation ul li { margin:0; padding:0;  }
.subnavigation ul li a { display:block; color:#0040a1; background:#c5d8f3; padding:5px; border-bottom:1px ridge #a4b9d9; }
.subnavigation ul li a.indent { padding-left:15px; }
.subnavigation ul li a:hover { background: #a7c1e8; }
.subnavigation ul li a.selected { background: #fff; color: #ff0141; }
.subnavigation ul li a.selected:hover { background: #fff; color: #ff0141; }
.subnavigation ul li a.subheader { padding:20px 0px 0px 5px; background: #fff url('/images/subnavigation.top.jpg') top right no-repeat; text-align:left; height:30px; font-weight:bold; font-size:1.2em; }
.subnavigation ul li a.subfooter { padding:0px; background: #fff; border:0px; }
.maincontent { margin-left:175px; padding:5em 10em 5em 3em; color: #333333; }

.list-type-1 li { margin-bottom:1em; }

h1 { font-size:3em; font-style:italic; font-family:Tahoma, Geneva, sans-serif; color: #454545; line-height:1em; }

.homepage_navigation { list-style:none; padding:0; margin:0; }
.homepage_navigation li a { display:block; padding:3px; color: #000; font-size:1.4em; font-weight:bold; }
.homepage_navigation li a.first { paddin-top:0; }
.homepage_navigation li a:hover { color: #0040a1; }


.sitecredit { float:right; font-size:9px; }
.sitecredit a { color: #000; border:0; }
.sitecredit a:hover { color: #000; border-bottom:1px dotted #000; }





#slideshow {
    position:relative;
    height:185px;
}

#slideshow IMG {
    position:absolute;
    top:0;
    left:0;
    z-index:8;
    opacity:0.0;
}

#slideshow IMG.active {
    z-index:10;
    opacity:1.0;
}

#slideshow IMG.last-active {
    z-index:9;
}