
/* RESET elements */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, figure, footer, header, 
hgroup, menu, nav, section, menu,
time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}   

/* always force a scrollbar in non-IE */
html { overflow-y: scroll; }               

article, aside, figure, footer, header, 
hgroup, nav, section { display:block; }

nav ul { list-style:none; }

blockquote, q { quotes:none; }

blockquote:before, blockquote:after,
q:before, q:after { content:''; content:none; }

a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }

ins { background-color:#ff9; color:#000; text-decoration:none; }

mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }

del { text-decoration: line-through; }

abbr[title], dfn[title], acronym { border-bottom:1px dotted #000; cursor:help; }

/* tables still need cellspacing="0" in the markup */
table { border-collapse:collapse; border-spacing:0; font-size:inherit; font:100%; }

input, select { vertical-align:middle; }

html { -webkit-font-smoothing: antialiased; }

a:hover, a:active { outline: none; }

select, input, textarea { font:99% sans-serif; vertical-align: middle; }

textarea { overflow: auto; }

pre, code, kbd, samp { font-family: monospace, sans-serif; }

label, input[type=button], input[type=submit], button { cursor: pointer; }

input[type="radio"] { vertical-align: text-bottom; }
input.radio { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; *vertical-align: baseline; }
input.checkbox { vertical-align: bottom; *vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }
input.password {margin-left: 0;}
input.radio, input.checkbox {border: 0;}

sub { vertical-align: sub; font-size: smaller; line-height: 0; }
sup { vertical-align: super; font-size: smaller; line-height: 0; }

pre { 
  white-space: pre; /* CSS2 */
  white-space: pre-wrap; /* CSS 2.1 */
  white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
  word-wrap: break-word; /* IE */
}

button {  width: auto; overflow: visible; }

/* bicubic resizing for non-native sized IMG: 
   code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/ */
.ie7 img { -ms-interpolation-mode: bicubic; }

legend {*text-indent: -0.3em;} /* IE7 */
legend {_text-indent: 0; _margin-left: -0.5em;} /* IE6 */
legend {margin-left /*\**/: 0em\9;} /* IE8 */

/* END RESET CSS */
/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin:			0;
	padding:		0;
	list-style:		none;
}
.sf-menu {
	line-height:	1.0;
	width: 960px;
	height: 33px;
	/*background: #cbd1d4 url("menus/horiz-dropdown-bg.gif") repeat-x;*/
	background: #dfdfdf url("menus/horiz-dropdown-bg-lighter.gif") repeat-x;
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			10em; /* left offset of submenus need to match (see below) */
    z-index:500;
}
.sf-menu ul li {
	width:			100%;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative; 
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			2.5em; /* match top ul list item height */
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}

/*** DEMO SKIN ***/
.sf-menu {
	float:			left;
	margin-bottom:	1em;
    z-index:1000;
}
.sf-menu a {
	
	border-top:		0px;
	/*padding: 		14px 1em 13px 1em;*/
    /*padding: 		8px 1em 13px 1em;*/
    /*padding: 		8px 1em 8px 1em;*/
    padding: 		10px 1em 8px 1em;
	text-decoration:none;
}
.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
	color:			#556269;
}
.sf-menu li {
	background:		transparent;
	border-right:	1px solid #ccc;

	height: 33px;
}
.sf-menu li li {
	height: auto;
}
.sf-menu li li li {
	background:		#f6f6f6;
	border-bottom:	1px solid #ccc;
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	background:		#f6f6f6;
	outline:		0;
}
.sf-menu ul li:hover, .sf-menu ul li.sfHover,
.sf-menu ul a:focus, .sf-menu ul a:hover, .sf-menu ul a:active { /* subs over */
	background:		#e9e9e9 !important;
	outline:		0;
}
.sf-menu ul li.current:hover, .sf-menu ul li.current li:hover, .sf-menu ul li.current li.sfHover,
.sf-menu ul li.current a:focus, .sf-menu ul li.current a:hover, .sf-menu ul li.current a:active { /* subs over */
	background:		#e9e9e9 !important;
	outline:		0;
}

/*** arrows **/
.sf-menu a.sf-with-ul {
	padding-right: 	2.25em;
	min-width:		1px; /* trigger IE7 hasLayout so spans position accurately */
    padding-bottom:10px;
}
.sf-sub-indicator {
	position:		absolute;
	display:		block;
	right:			.75em;
	top:			1.05em; /* IE6 only */
	width:			10px;
	height:			10px;
	text-indent: 	-999em;
	overflow:		hidden;
	background:		url('arrows-grey.gif') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}
a > .sf-sub-indicator {  /* give all except IE6 the correct values */
	top:			0.9em;
	background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
}

/*** shadows for all but IE6 ***/
.sf-shadow ul {
	background:	url('shadow.png') no-repeat bottom right;
	padding: 0 8px 9px 0;
	-moz-border-radius-bottomleft: 17px;
	-moz-border-radius-topright: 17px;
	-webkit-border-top-right-radius: 17px;
	-webkit-border-bottom-left-radius: 17px;
}
.sf-shadow ul.sf-shadow-off {
	background: transparent;
}



/* ADDITIONAL STYLES :) */

/*.sf-menu li a:active {height: 17px;}
.sf-menu li li a:active {height: auto;}*/

.sf-menu li.current a:link, .sf-menu li.current a:visited, .sf-menu li.current a { /* level 1 current */
	color: #317edc;
	background:		#f1f1f1 url("menus/level1-current-bg.gif") repeat-x;
    /*padding:8px 10px 12px 10px;*/
    padding-bottom:10px;
}
.sf-menu li li.current a:link, .sf-menu li li.current a:visited {
	background:		transparent; 
}
.sf-menu li.current li a:link, .sf-menu li.current li a:visited 
{
    color: #404a4f; /* reset color on sub flyouts */
    background: #f6f6f6;
}
.sf-menu li.current li.current a:link, .sf-menu li.current li.current a:visited 
{
    color: #317edc; /* highlight colour on .current sub flyouts */
}
.sf-menu li.current li li a:link, .sf-menu li.current li li a:visited 
{
    color: #404a4f !important; /* reset color on sub flyouts */
}
.sf-menu li.current li.current li.current a:link, .sf-menu li.current li.current li.current a:visited 
{
    color: #317edc !important; /* reset color on sub flyouts */
}


/* Left + Right shadow on level 1 tabs. */

/* hide shadow touches if no js, show if js */
.sf-menu .menu-shadow-left, .sf-menu .menu-shadow-right {background: transparent; padding: 0; margin: 0;} /* NOTE use of .js on html tag (applied when JavaScript is active!) */

.js .sf-menu li.current .menu-shadow-left {padding: 0 0 0 0px; background: url("menus/horiz-level1-tab-shad-l.gif") no-repeat top left; display: inline-block; height: 33px;} 

.js .sf-menu li.current .menu-shadow-right {padding: 0 0px 0 0; background: url("menus/horiz-level1-tab-shad-r.gif") no-repeat top right; display: inline-block; height: 33px;} 


/*** adding the class sf-navbar in addition to sf-menu creates an all-horizontal nav-bar menu ***/
.sf-navbar {
	background:		#cdd3d6 url("menus/nav-bar-bg.gif") repeat-x;
	height:			77px;
	padding-bottom:	0;
	position:		relative;
	width: 100%;
}
.sf-navbar li {
	background:		transparent;
	position:		static;
	height: 37px !important;
	border: 0;
	margin-right: 0;
}
.sf-navbar a:link, .sf-navbar a:visited {       /* LEVEL 1 */
	border-top:		none;
	color: #404a4f;
	font-size: 14px;
	font-weight: bold;
	background: transparent !important;
}
.sf-navbar ul a:link, .sf-navbar ul a:visited   /* LEVEL 2 */
{
    font-size: 12px;
    font-weight: normal;
    background: transparent;
    margin-top: 4px;
    _margin-top: 0;
    padding: 10px 2.3em 9px 1em;
    _padding: 14px 2.3em 14px 1em;
}
.sf-navbar li ul {
	width:			70em; /*IE6 soils itself without this*/
	margin-top: 5px;
}
.sf-navbar li li {
	  /* Secondary (not current) */
	position:		relative;
    height: 40px !important;
}
.sf-navbar li li ul {
	width:			13em;
}
.sf-navbar li li li {
	background:		background:	#f1f1f1 url("menus/level1-current-bg.gif") repeat-x;
	width:			100%;
}
.sf-navbar ul li {
	width:			auto;
	float:			left;
	white-space:    nowrap;
}
.sf-navbar a:link, .sf-navbar a:visited {
	border:			none;
}
.sf-navbar li.current {
	background:		#f1f1f1; /* (not level 1) important to override superfish.css if necessary */
}
.sf-navbar li.current a:link, .sf-navbar li.current a:visited {
	background:		transparent !important; /* (not level 1) important to override superfish.css if necessary */
	color: #317edc;
}
.sf-navbar li.current li a:link, .sf-navbar li.current li a:visited 
{
    color: #404a4f; /* reset color on sub flyouts */
}
.sf-navbar li.current li.current a:link, .sf-navbar li.current li.current a:visited 
{
    color: #317edc; /* highlight colour on .current sub flyouts */
}
.sf-navbar li:hover,
.sf-navbar li.sfHover,
.sf-navbar li li.current,
.sf-navbar a:focus, .sf-navbar a:hover, .sf-navbar a:active { /* incs .current */
	background:		#f1f1f1 url("menus/level1-current-bg.gif") repeat-x; 
}

.sf-navbar ul li:hover,
.sf-navbar ul li.sfHover,
ul.sf-navbar ul li:hover li,
ul.sf-navbar ul li.sfHover li,
.sf-navbar ul a:focus, .sf-navbar ul a:hover, .sf-navbar ul a:active {
	background:		#f6f6f6; /* Sub over bg */
}
ul.sf-navbar li li li:hover,
ul.sf-navbar li li li.sfHover,
.sf-navbar ul li li a:focus, .sf-navbar ul li li a:hover, .sf-navbar ul li li a:active {
	background:		#e9e9e9; /* dropdown sub over */
}
.sf-navbar li li.current li.current {}
ul.sf-navbar .current ul,
ul.sf-navbar ul li:hover ul,
ul.sf-navbar ul li.sfHover ul {
	left:			0;
	top:			2.5em; /* match top ul list item height */
}
ul.sf-navbar .current ul ul {
	top: 			-999em;
}

.sf-navbar li li.current > a {
	/*font-weight:	bold;*/
}

/*** point all arrows down ***/
/* point right for anchors in subs */
.sf-navbar ul .sf-sub-indicator { background-position: -10px -102px; }
.sf-navbar ul a > .sf-sub-indicator { background-position: 0 -102px; }
/* apply hovers to modern browsers */
.sf-navbar ul a:focus > .sf-sub-indicator,
.sf-navbar ul a:hover > .sf-sub-indicator,
.sf-navbar ul a:active > .sf-sub-indicator,
.sf-navbar ul li:hover > a > .sf-sub-indicator,
.sf-navbar ul li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -102px; /* arrow hovers for modern browsers*/
}

/*** remove shadow on first submenu ***/
.sf-navbar > li > ul {
	background: transparent;
	padding: 0;
	-moz-border-radius-bottomleft: 0;
	-moz-border-radius-topright: 0;
	-webkit-border-top-right-radius: 0;
	-webkit-border-bottom-left-radius: 0;
}


.sf-sub-indicator {
	background:		url("arrows-grey.gif") no-repeat -10px -100px; /*override superfish.css */
}

/* Left + Right shadow on level 1 tabs.

/* .menu-shadow-left {padding: 0 0 0 5px; background: url("menus/nav-bar-level1-tab-shad-l.gif") no-repeat top left; display: inline-block; height: 40px;} */

/* .menu-shadow-right {padding: 0 5px 0 0; background: url("menus/nav-bar-level1-tab-shad-r.gif") no-repeat top right; display: inline-block; height: 40px;} */



/* hide shadow touches if no js, show if js */
.sf-navbar .menu-shadow-left, .sf-navbar .menu-shadow-right {background: transparent; padding: 0; margin: 0;} /* NOTE use of .js on html tag (applied when JavaScript is active!) */

.js .sf-navbar li:hover .menu-shadow-left,
.js .sf-navbar li.sfHover .menu-shadow-left,
.js .sf-navbar a:focus .menu-shadow-left, .js .sf-navbar a:hover .menu-shadow-left, .js .sf-navbar a:active .menu-shadow-left {
	padding: 0 0 0 5px; background: transparent url("menus/nav-bar-level1-tab-shad-l.gif") no-repeat top left; display: inline-block; height: 40px; margin-left: -5px; _margin-left: 0;
}
.js .sf-navbar li:hover .menu-shadow-right,
.js .sf-navbar li.sfHover .menu-shadow-right,
.js .sf-navbar a:focus .menu-shadow-right, .js .sf-navbar a:hover .menu-shadow-right, .js .sf-navbar a:active .menu-shadow-right {
	padding: 0 5px 0 0; background: transparent url("menus/nav-bar-level1-tab-shad-r.gif") no-repeat top right; display: inline-block; height: 40px; margin-right: -5px; _margin-right: 0;
}



/*** adding sf-vertical in addition to sf-menu creates a vertical menu ***/
.sf-vertical {height: auto;}
.sf-vertical, .sf-vertical li {
	/*width:	10em;*/
	width: 200px;
	margin: 0 2em 2em 0;
	margin-top: -20px;
    z-index:1; *z-index:-1;
    position:relative;
}
/* this lacks ul at the start of the selector, so the styles from the main CSS file override it where needed */
.sf-vertical li:hover ul,
.sf-vertical li.sfHover ul {
	left:	200px; /* match ul width */
	top:	0;
}

/*** alter arrow directions ***/
.sf-vertical .sf-sub-indicator { background-position: -10px 0; } /* IE6 gets solid image only */
.sf-vertical a > .sf-sub-indicator { background-position: 0 0; } /* use translucent arrow for modern browsers*/

/* hover arrow direction for modern browsers*/
.sf-vertical a:focus > .sf-sub-indicator,
.sf-vertical a:hover > .sf-sub-indicator,
.sf-vertical a:active > .sf-sub-indicator,
.sf-vertical li:hover > a > .sf-sub-indicator,
.sf-vertical li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
	/*background:		url('arrows-blue.gif') no-repeat -10px -100px;*/
    background:		url('arrows-blue.gif') no-repeat -10px 0px;
}

.sf-vertical li, .sf-vertical li a:link, .sf-vertical li a:visited {/*background: #e2ebf0 !important;*/ background: #dfdfdf url("menus/horiz-dropdown-bg-lighter.gif") repeat-x; margin: 0;}


.sf-vertical li {border-bottom: 1px solid #cccccc !important; _border-bottom: 1px solid #cccccc !important;}
.sf-vertical li li {/*border-bottom: 0 !important;*/border-bottom: 1px solid #cccccc !important;}

.sf-vertical li a:link, .sf-vertical li a:visited {border-right: 1px solid #ccc;}
.sf-vertical li a:hover, .sf-vertical li a:focus, .sf-vertical li a:active {background: #f6f6f6 !important;}

.sf-vertical ul li:hover, .sf-vertical ul li.sfHover,
.sf-vertical ul a:focus, .sf-vertical ul a:hover, .sf-vertical ul a:active { /* subs over */
	background:		#e9e9e9 !important;
	outline:		0;
}

.sf-vertical ul li.current:hover, .sf-vertical ul li.sfHover,
.sf-vertical ul li.current a:focus, .sf-vertical ul li.current a:hover, .sf-vertical ul li.current a:active { /* subs over */
	background:		#e9e9e9 !important;
	outline:		0;
}


.sf-vertical .sf-sub-indicator {background-image: url('arrows-blue.gif');}

/* j */

.sf-menu ul ul {
width:100%; display:block; float:none; 
}
.sf-menu ul {
display:block; float:none;
}
﻿.tabs
{
    overflow: hidden;
    height: 1%;    
    margin: 0;
    /*_margin-bottom: 1em;
    _height: 3.2em;*/
    padding: 0;
    border-bottom: 1px solid #317EDC;
}
        
.tabs li
{
    list-style-type: none;
    margin: 0;
    float: left;
    /*_height: 30px;*/
    border-right:1px solid #ccc;
}

.tabs li a:link, .tabs li a:visited
{
    color: #556269;
    display: block;
    font-size: 14px;
    /*padding: 14px 1em;*/
    padding: 8px 1em;
    line-height: 1em;
    text-decoration: none;
    background-image: url("menus/tab-bg.gif");
    background-repeat: repeat-x;    
}

.tabs li a:hover
{
    text-decoration: none;
    background-image: url("menus/tab-current-bg.gif");
}

.tabs li.current a:link, .tabs li.current:visited, .tabs li a.current:link, .tabs li a.current:visited
{
    text-decoration: none;
    background-image: url("menus/tab-current-bg.gif");
}

.tabs li.current a:link, .tabs li.current a:visited, .tabs li a.current:link, .tabs li a.current:visited 
{
    color: #317edc;
    padding: 8px 1em;
}

.js .tabs li.current .menu-shadow-left {padding: 0 0 0 5px; background: url("menus/tab-shad-l.gif") no-repeat top left; display: inline-block;} 

.js .tabs li.current .menu-shadow-right {padding: 0 5px 0 0; background: url("menus/tab-shad-r.gif") no-repeat top right; display: inline-block;}

.tabsContent 
{
    background: #e2ebf0;
    margin: 0;
    padding: 1em 2em 2em 2em;
    border: 1px solid #e2ebf0;
}
/*

Main / logo blue: #317edc;
Turquoise blue: #3ca8e9;
Light blue: #e2ebf0;
Solid grey: #cdd3d6;
Grey text: #556269;
Dark grey: #404a4f;
Red: #c41230;
Green: #459f37;
Yellow (text): #906800;
Yellow (borer): #f8b80d;

*/
/* ---------- General / Global CSS styles ---------- */

body 
{
    font-size: 13px;
    font-family: "Arial Unicode MS","Arial","Helvetica",sans-serif;
    line-height: 1.4em;
    color:#556269;
    padding: 0 0 0 0;
    margin: 0;
}

/* Main TNS body text colour */ 
body, select, input, textarea { color:#556269; }

/* LINKS */
a, a:active, a:visited { color:#317EDC; }
a:hover { color:#404A4F; }
/*  j.mp/webkit-tap-highlight-color */
a:link { -webkit-tap-highlight-color: #317EDC; } 

/* Heading links */
h1 a:link, h1 a:visited, h2 a:link, h2 a:visited, h3 a:link, h3 a:visited, h4 a:link, h4 a:visited, h5 a:link, h5 a:visited, h6 a:link, h6 a:visited
{
    text-decoration: none;
}
h2 a:link, h2 a:visited {color: #404A4F;}

h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover  
{
    color: #404a4f;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #a6adb0;
}

/* Headings */
h1,h2,h3,h4,h5,h6 
{
    font-weight: bold;
    /*text-rendering: optimizeLegibility;*/
    font-family: "Arial Unicode MS","Arial","Helvetica",sans-serif;
    padding: 0.8em 0 0.3em 0;
}
h1 
{
    font-size: 2.3em;
    line-height: 1.3em;
    letter-spacing: -1px;
    color: #317EDC;
    clear: both;
}
h1 span.sub-color {color: #A6ADB0;}
h2 
{
    font-size: 2em;
    line-height: 1.3em;
    letter-spacing: -1px;
    color: #404A4F;
}
h3 
{
    font-size: 1.6em;
    line-height: 1.3em;
    letter-spacing: -1px;
    color: #317EDC;
}

p 
{
    margin: 0 0 0.8em 0;
    font-size:12px; line-height:18px;
}

h1,h2,h3,h4,h5,h6, p {clear: both;}

blockquote 
{
    background: #ebebeb;
    width: 300px;
    margin: 1em;
    padding: 1em 1em 0.5em 1em;
    border-left: 2px solid #317edc;
}
blockquote .quotee 
{
    font-style: italic;
}

hr 
{
    display:block;
    height:1px; 
    border:0; 
    border-top:1px solid #cdd3d6; 
    margin:1em 0; 
    padding:0; 
}

dl { margin: 0 0 1em 10px; }
dl dt {font-weight: bold;}
dl dd {margin-left: 2em;}
ul { margin: 0 0 1em 30px; }
ol { margin: 0 0 1em 30px; list-style-type: decimal; }

dl a:link, dl a:visited, ul a:link, ul a:visited, ol a:link, ol a:visited 
{
    text-decoration: none;
}

small { font-size: 85%; }

strong, th { font-weight: bold; }

td, td img { vertical-align:top; }

pre { padding: 15px; }

/* These selection declarations have to be separate. No text-shadow. */
::-moz-selection{ background: #317EDC; color:#fff; text-shadow: none; }
::selection { background:#317EDC; color:#fff; text-shadow: none; }



/* ---------- GENERAL STYLES CLASSES ---------- */

.bold {font-weight: bold;}

.highlight {background: #fff799;}

.blue {color: #317edc;}
.turquoise-blue, .turquoiseBlue {color: #3ca8e9;}
.light-blue, .lightBlue {color: #e2ebf0;}
.bg-grey, .bgGrey, .BGgrey {color: #cdd3d6;}
.text {color: #556269;} /* grey */
.red {color: #c41230;}
.green {color: #459f37;}

.required {font-weight: normal;}





 /* ---------- MAIN LAYOUT STYLES ---------- */

#container /* Master container with set width and to centralise pages */
{
    position: relative;
    width: 960px;
    margin: 20px auto 0 auto;
    padding: 0 0 0 0;
    overflow: hidden;
    min-height: 800px;
}

.center, .centre {margin-right: auto; margin-left: auto;}

.left {float: left;}

.right {float: right;}

.group {overflow: hidden; zoom: 1;}
body.ie6 .group {zoom: 1;}

.inline {display:inline;}

.inline-block {display: inline-block;}

.clear, .clear-both {clear: both;}
.clear-left, .clearLeft {clear: left;}
.clear-right, .clearRight {clear: right;}
.clear-none, .clearNone {clear: none;}

/* ---------- SPECIFIC LAYOUT CLASSES ---------- */

.fullWidth {width: 960px;}
.fullWidth p {width: 440px;} /* consistent with main global website */

.halfWidth {width: 471px;} /* 960px - 18px gap / 2 = 471px */

.thirdWidth {width: 308px;} /* 960px - (18px gap * 2) / 3 = 308px */

/* GAP (margin between elements) = 18px */

.twothirdsWidth, .twoThirdsWidth, .twothirdWidth {width: 634px;}


/* Widths for tables  - based on %s */

table.fullWidth {width: 100%;}
table.halfWidth {width: 50%}
table.thirdWidth {width: 33%;}
table.twothirdsWidth, table.twoThirdsWidth, table.twothirdWidth {width: 66%;}



.breadcrumb 
{
    margin: 0em 0 0em 0; 
    color: #317edc; 
    clear: both;
}
.group .breadcrumb 
{
    margin-top: 0;
}
.breadcrumb a:link, .breadcrumb a:visited 
{
    color: #556269; 
    text-decoration: underline;
}
.breadcrumb a:hover, .breadcrumb a:focus, .breadcrumb a:active 
{
    text-decoration: underline;
}

/* Brand */
#brand 
{
    margin: 2px 0 34px 0;
    position: relative;
}
#brand img.tns-logo {margin: 0 0 0 0;}
#brand h1 {
    color: #999999;
    font-size: 17px;
    font-style: italic;
    font-weight: normal;
    letter-spacing: 0.01em;
    margin: -3px 0 0 0;
	padding: 0;
}
#brand h1 a:link, #brand h1 a:visited 
{
    color: #999;
    text-decoration: none;
}
#brand h1 a:hover, #brand h1 a:focus, #brand h1 a:active 
{
    color: #999;
    text-decoration: none;
    border: 0;
}


/* Sign in */
#signinDetails 
{
    position: absolute;
    top: 0;
    right: 0;
    text-align: right;
    color: #317edc;
}
#signinDetails .user {}
#signinDetails .signInOut {}
#signinDetails a:link, #signinDetails a:visited 
{
    text-decoration: none;
}

/* Search bar */

#searchbar 
{
    position: absolute;
    top: 44px; right: 0;
}
body.ie6 #searchbar {text-align: right;}
#searchbar form 
{
    background: transparent; 
    margin: 0; 
    padding: 0;
}
body.ie6 #searchbar form {width: 300px;}
#searchbar input 
{
    background: url("search.gif") no-repeat; 
    border: 0; 
    width: 128px; 
    height: 22px; 
    padding: 0 10px;
    line-height: 22px;
}
body.ie6 #searchbar input, body.ie7 #searchbar input {margin-top: -2px;}
#searchbar button 
{
    background: #fff; 
    border: 0; 
    color: #999; 
    height: auto; 
    padding: 0; 
    margin: 0 0 0 4px; 
    font-weight: normal;
}

/* Footer */
#footer 
{
    background: #dfdfdf url("menus/menu-blue-bevel.gif") top center no-repeat;
    padding: 3px 0 0 0;
    margin: 2em 0 0 0;
    clear: both;
}
#footer .inner {
	background: #dfdfdf url("footer-inner-bg.gif") repeat-y;
	color: #317edc;
	padding: 15px 15px 20px 15px;
    margin: 0;
}
#footer ul 
{
    display: inline-block;
    text-align: center;
	margin: 10px 0 0 0;
	padding: 0 0 0 0;
	width: 715px;
}
#footer  ul li 
{
    display: inline;
    color: #317edc;
    margin: 0 2em;
}
#footer  ul li a:link, #footer  ul li a:visited {color: #317edc; text-decoration: none;}
#footer  ul li a:hover, #footer  ul li a:focus {color: #317edc; text-decoration: underline;}
#footer h3.logo {
	width: 207px;
	height: 35px;
	background: url("TNS-footer-logo.png") no-repeat;
	display: inline-block;
	float: left;
	text-indent: -9999px;
	overflow: hidden;
	margin: 0;
	padding: 0;
}


/* ---------- FORMS ---------- */

fieldset 
{
    margin: 0 0 1.5em 0;
    display: block;
}

legend 
{
    font-weight: bold;
    padding-bottom: 1em;
}

form 
{
    /*background: #cdd3d6;  light grey */
    /*background: #e2ebf0;*/ /* light blue */
    background: #f2f2f2;
    padding: 1em 2em 2em 2em;
    margin-top: 0;
    float:left;
}
fieldset.blueform form, form.blueform {background: #e2ebf0;} /* BLUE BACKGROUND FORMS */
form.halfWidth 
{
    width: 419px; 
}
body.ie6 form.halfWidth {overflow: hidden;}

/* margins */
form p, select, div.radio, div.checkbox 
{
    margin: 0 0 0.8em 0;
}
/* override for... */
p.radio, p.checkbox, p.select 
{
    margin-bottom: 0em;
}

label 
{
    font-weight: normal;
    font-size: 1em;
}

span.errorMessage {
    color:#C41230;
    float:right;
}

/* FORM INPUT FOCUS */
input.text:focus, textarea:focus, input.password:focus 
{
    border: 1px solid #317EDC; 
    background: #fff799;
}

/* INPUTS */
/* Various inputs (use classes to be ie6 & 7 compatible, using input[type="text"] doesn't work in ie6 - infact it will cause the selector to fail completely in ie6 */
input.text, textarea, input.password, input.file /*  */
{
    border: 1px solid #a3a3a3;
    width: 896px;
    padding: 0.2em 4px 0.3em 4px;
    font-size: 1em;
}

textarea  /* override reset */
{
    height: 10em;
    vertical-align: top;
} 
input.password 
{
    width: auto; 
    padding-right: 17px;
}
input.file 
{
    background: #fff; 
    color: #556269; 
    font-size: 0.9em; 
    padding: 7px;
}

/* RADIO AND CHECKBOXES */
/* border divs */
form div.radio, form div.checkbox
{
    border: 1px solid #a3a3a3;
    background: #fff;
    line-height: 2em;
}

form div.radio {padding: 3px 9px 4px 2px; margin-top: 2px;}
body.ie6 form div.radio, body.ie7 form div.radio {padding-bottom: 8px; zoom: 1;}

form div.checkbox {padding: 5px 9px 5px 4px; margin-top: 2px;}
body.ie6 form div.checkbox, body.ie7 form div.checkbox {padding-bottom: 9px; zoom: 1;}

form div.radio input, form div.checkbox input {vertical-align: baseline;}
div.radio input, div.checkbox input {border: 0;}
input.checkbox { vertical-align: text-bottom; }

div.checkbox label, div.radio label { display: block; font-weight: normal; height: 1.74em; font-size: 1em;}
div.checkbox.multi-column, div.radio.multi-column { overflow: auto; }            
div.checkbox.multi-column label, div.radio.multi-column label { float: left; }            
div.checkbox.two-column label, div.radio.two-column label { width: 50%; }
div.checkbox.three-column label, div.radio.three-column label { width: 33%; }
div.checkbox.four-column label, div.radio.four-column label  { width: 25%; }
            
/* SELECT BOX */
form select 
{
    border: 1px solid #a3a3a3;
    padding: 2px;
    margin-bottom: 0.8em;
    margin-top: 2px;
}
body.ie6 form select, body.ie7 form select {border: 0; margin-bottom: 0; margin-top: 4px;}
body.ie8 form select {margin-bottom: 0;}

form div.selectWrapper 
{
    display: inline-block;  
    float: left; 
    margin: 0 20px 0 0; 
}
body.ie6 form div.selectWrapper, body.ie7 form div.selectWrapper {padding-bottom: 12px;}
body.ie8 form div.selectWrapper {margin-bottom: 6px;}


form div.select /* CLASS! */
{
    display: inline;
}
body.ie6 form div.select, body.ie7 form div.select {border-top: 1px solid #a3a3a3; border-right: 2px solid #a3a3a3; border-bottom: 2px solid #a3a3a3; border-left: 2px solid #a3a3a3;} /* other browser apply border directly */

/* FORM BUTTONS */
p.buttons {}
input.submit, button.submit, button
{
    margin: 1.5em 0.5em 0 0;
    background: #EBF1F4;
    border: 0px solid #317EDC;
    color: #fff;
    padding: 5px 8px;
    font-weight: bold;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    height:35px;
    width:120px;
    background-repeat:repeat-x;
    background-position:0px 2px;
    background-image:url('form-button-submission.gif');
    /* CSS PIE does not work on buttons it seems :( */
}

input.submit:hover,button.submit:hover
input.submit.ie6-hover, button.ie6-hover,
input.submit:focus, button.submit:focus
{
    background-position:0px -33px;
	outline: none;
    color:#fff; 
}
 
input.cancel, input.clear,
button.cancel, button.clear
{
    margin: 1.5em 0.5em 0 0;
    background: #EBF1F4;
    border: 0px solid #317EDC;
    color: #fff;
    padding: 5px 8px;
    font-weight: bold;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    height:35px;
    width:120px;
    background-repeat:repeat-x;
    background-position:0px 2px;
    background-image:url('form-button-submission.gif');
    /* CSS PIE does not work on buttons it seems :( */
}
body.ie6 input.cancel, body.ie6 input.clear, body.ie6 button.cancel, body.ie6 button.clear {border-color: #CDD3D6;}

input.cancel:hover, input.clear:hover,
button.cancel:hover, button.clear:hover,
input.cancel.ie6-hover,
input.cancel:focus, input.clear:focus, button.cancel:focus, button.clear:focus
{
    background-position:0px -33px;
	outline: none;
    color:#fff;
}

button.disabled
{
    height:35px;
    margin: 1.5em 0.5em 0 0;
    background: #ccc;
    border: 2px solid #aaa;
    color: #999;
    padding: 5px 8px;
    font-weight: bold;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    width:inherit;
    /* CSS PIE does not work on buttons it seems :( */
}

button.disabled:hover, button.disabled:focus
{
    background: #ccc;
	outline: none;
	text-decoration: line-through;
	cursor: default;
}

button#warning-button, button#information-button, button#error-button, button#success-button {
    width:200px;
    background: url("form-button-submission-longer.gif") repeat-x scroll 0 2px #EBF1F4;
} 
button#warning-button:hover,
button#warning-button.ie6-hover,
button#warning-button:focus
{
    background-position:0px -33px;
	outline: none;
    color:#fff;
}
button#information-button:hover,
button#information-button.ie6-hover,
button#information-button:focus
{
    background-position:0px -33px;
	outline: none;
    color:#fff;
}
button#error-button:hover,
button#error-button.ie6-hover,
button#error-button:focus
{
    background-position:0px -33px;
	outline: none;
    color:#fff;
}
button#success-button:hover,
button#success-button.ie6-hover,
button#success-button:focus
{
    background-position:0px -33px;
	outline: none;
    color:#fff;
}


/* FORM TYPOGRAPHY */
form h2 {font-size: 1.4em;}

/* FORM ELEMENT VARIATIONS */
fieldset.left {margin-right: 18px;}
body.ie6 fieldset.left {margin-right: 14px;}
/* halfWidth */
fieldset.halfWidth {width: 471px;}
body.ie6 fieldset.halfWidth {overflow: hidden;}
.halfWidth input.text, .halfWidth textarea, .halfWidth input.password, .halfWidth input.file {width: 407px;} /* .halfWidth */
/* thirdWidth */
.thirdWidth input.text, .thirdWidth textarea, .thirdWidth input.password, .thirdWidth input.file {width: 95%;}
.thirdWidth form input.password {width: 95% !important; padding-right: 4px;}
/* Sign in - user icon */
h2.signin {background: url("icons/32/user_32.png") no-repeat; _background: url("icons/32/user_32.gif") no-repeat; padding-top: 8px; margin-top: 4px; text-indent: 38px}



/* ----- TABLES ----- */

table 
{
    border: 2px solid #a3a3a3;
    margin: 10px auto;
    border-collapse: collapse;
	table-layout: fixed; /* Prevent unwanted expansion */
}
table caption 
{
    padding: 5px;
    color: #317edc;
    font-size: 1.2em;
    font-weight: bold;
    letter-spacing: -1px;
}
table thead
{    
}
table thead th 
{
    color: #3ca8e9;
    background: #fff;
    padding: 2px;
    border-bottom: 2px solid #3ca8e9;
}
table tfoot 
{
    
}
table tfoot th 
{
    padding: 0;
    background: #d3dae3;
    font-size: 0.85em;
}
table tbody 
{
    
}
table tbody tr {}
table tbody tr td
{
    text-align: center;
    background: #fff; /* lighter stripe */
    border-bottom: 1px solid #ddd;
	vertical-align: middle;					/* May want to override */
}
table tbody tr.alt td {background: #e2ebf0;} /* darker stripe */
table tbody tr.over td {background: #c6ced2;}
table tbody tr.highlight.over td, table tbody tr.over td.highlight  {background: #e3e3b5;  /* alt highligh colour */} /* CSS chaining in ie6 doesn't work, ie ALL instances of .highlight will be altered to this new colour instead of JUST instances of .highligh that ALSO have .over class (rolled over) - so override ie6 back to normal highligh colour. (Have moved this next to .highlight definition for convenience). */
body.ie6 table tbody tr.highlight.over td, body.ie6 table tbody tr.over td.highlight {background: #c6ced2;}
body.ie6 table tbody tr.highlight td, body.ie6 table tbody tr.over td.highlight  {background: #fff799; /* Revert ie6 .over.highlight definition because ie6 doesn't support CSS chaining. Boo. Not a major problem: rolled over .highlight classes will remain same colour instead of having tint.*/}
table td 
{
    padding: 2px 4px;
    border-right: 1px solid #eee;
    border-left: 1px solid #eee;
    font-size: 0.85em;
}
table.vertCenter td, table tr.vertCenter td, td.vertCenter 
{
    vertical-align:middle;
}
/* TABLE ROW COLOURS AND LINKS */
table td a:link, table td a:visited {color: #556269;}
table tr.red td, 
table tr.red td a:link, table tr.red td a:visited {color: #c41230;} /* red rows */
table  tr td.red, 
table  tr td.red a:link, table  tr td.red a:visited {color: #c41230 !important;} /* red cells */
table tr.green td, 
table tr.green td a:link, table tr.green td a:visited {color: #459f37;} /* green rows */
table tr td.green, 
table tr td.green a:link, table tr td.green a:visited {color: #459f37 !important;} /* green cells */
table tr.highlight td, table td.highlight {background: #fff799;} /* match general .highlight class color




/* ----- FEEDBACK: Warning, information, error boxes----- */

/* General */
.warning, .information, .error, .callToAction, .download, .success, p.warning-overlay, span.error-overlay
{
    /*padding: 1em 15px 1em 55px;*/
    padding: 9px 9px 9px 55px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
/* Do not use behaviour for these elements - causes layout issues */ /*body.ie6 .warning, body.ie6 .information, body.ie6 .error, body.ie6 .callToAction, body.ie6 .download, body.ie6 p.warning-overlay, body.ie6 span.error-overlay,
body.ie7 .warning, body.ie7 .information, body.ie7 .error, body.ie7 .callToAction, body.ie7 .download, body.ie7 p.warning-overlay, body.ie7 span.error-overlay,
body.ie8 .warning, body.ie8 .information, body.ie8 .error, body.ie8 .callToAction, body.ie8 .download, body.ie8 p.warning-overlay, body.ie8 span.error-overlay {behavior: url("/PIE.htc"); */
body.ie6 .warning, body.ie6 .information, body.ie6 .error, body.ie6 .callToAction, body.ie6 .download, body.ie6 .success, body.ie6 p.warning-overlay, body.ie6 span.error-overlay,
body.ie7 .warning, body.ie7 .information, body.ie7 .error, body.ie7 .callToAction, body.ie7 .download, body.ie7 .success, body.ie7 p.warning-overlay, body.ie7 span.error-overlay {padding-bottom: 1.3em;}

div.warning, div.information, div.error, div.callToAction, div.download, div.success {padding: 1em 15px 0.2em 55px;}
body.ie6 div.warning, body.ie6 div.information, body.ie6 div.error, body.ie6 div.callToAction, body.ie6 div.download, body.ie6 div.success
body.ie7 div.warning, body.ie7 div.information, body.ie7 div.error, body.ie7 div.callToAction, body.ie7 div.download, body.ie7 div.success {padding-bottom: 0.5em;}

p.warning, p.information, p.error, p.callToAction, p.download, p.success {padding: 1em 15px 1em 55px;}
body.ie6 p.warning, body.ie6 p.information, body.ie6 p.error, body.ie6 p.callToAction, body.ie6 p.download, body.ie6 p.success,
body.ie7 p.warning, body.ie7 p.information, body.ie7 p.error, body.ie7 p.callToAction, body.ie7 p.download, body.ie7 p.success {padding-bottom: 1.3em;}

.thirdWidth .warning, .thirdWidth .information, .thirdWidth .error, .thirdWidth .callToAction, .thirdWidth .download,.thirdWidth .success {width: 236px;}
.halfWidth .warning, .halfWidth .information, .halfWidth .error, .halfWidth .callToAction, .halfWidth .download, .halfWidth .success {width: 399px;}
.twoThirdWidth .warning, .twoThirdWidth .information, .twoThirdWidth .error, .twoThirdWidth .callToAction, .twoThirdWidth .download, .twoThirdWidth .success {width: 562px;}

.warning, p.warning-overlay
{
    border: 1px solid #f8b80d;
    color: #906800;
    background: #fef8e6 url("icons/32/warning_32.png") 12px 1em no-repeat;
}

.information 
{
    border: 1px solid #317edc;
    color: #317edc;
    background: #eaf2fb url("icons/32/info_32.png") 12px 1em no-repeat;
}

.error, span.error-overlay
{
    border: 1px solid #c41230;
    color: #c41230;
    background: #f9e7ea url("icons/32/error_32.png") 12px 1em no-repeat;
}

.callToAction 
{
    border: 1px solid #459f37;
    color: #459f37;
    background: #e3f1e1 url("icons/32/right_32.png") 12px 1em no-repeat;
}

.download 
{
    border: 1px solid #459f37;
    color: #459f37;
    background: #e3f1e1 url("icons/32/down_32.png") 12px 1em no-repeat;
}

.success 
{
    border: 1px solid #459f37;
    color: #459f37;
    background: #e3f1e1 url("icons/32/tick_32.png") 12px 1em no-repeat;
}

/* Common to all dialogue boxes */
.warning, .information, .error, .callToAction, .download, .success {
	min-height: 3em;
	display: inline-block;
}

/* Heading margins in dialogue boxes */
.warning h2, .information h2, .error h2, .callToAction h2, .download  h2, .success h2 {
	margin-top: 0;
	padding-top: 5px;
}

/* In forms (excluding fieldsets) */
form p.warning, form p.information, form p.error, form p.callToAction, form p.success
{
    width: 844px;
    background: #eee;
    padding: 0.5em 20px 0.5em 40px;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    border-width: 1px;
    border-top: 0px solid #ddd;
    margin-top: -1em;
    position: relative;
    top: -1px;
}
body.ie6 form p.warning, body.ie6 form p.information, body.ie6 form p.error, body.ie6 form p.callToAction, body.ie6 form p.success
body.ie7 form p.warning, body.ie7 form p.information, body.ie7 form p.error, body.ie7 form p.callToAction, body.ie7 form p.success {padding-bottom: 0.5em !important; display: inline; float: left;}

/* Smaller feedback for inline form */

form p.warning 
{
    background: #fef8e6 url("icons/16/warning_16.png") 12px 0.55em no-repeat;
    display: block;
    min-height:18px; height:18px;
}

form p.information 
{
    background: #eaf2fb url("icons/16/info_16.png") 12px 0.55em no-repeat; 
    display: block;
    min-height:18px; height:18px;
}

form p.success 
{
    background: #eaf2fb url("icons/16/tick_16.png") 12px 0.55em no-repeat; 
    display: block;
    min-height:18px; height:18px;
}

form p.error 
{
    background: #f9e7ea url("icons/16/error_16.png") 12px 0.55em no-repeat; 
    display: block;
    min-height:18px; height:18px;
}

/* overlay validation */

form input.error-overlay
{
	border-color: #C41230 !important;
	cursor: pointer;
}

form p.warning-overlay
{
    display: none;
	width: 260px;
	-webkit-box-shadow: #333 0 0 5px;
	-moz-box-shadow: #333 0 0 5px;
	box-shadow: #333 0 0 5px;
}
span.error-overlay
{
	/*display: block;*/
	display: none;
	width: 260px;
	-webkit-box-shadow: #333 0 0 5px;
	-moz-box-shadow: #333 0 0 5px;
	box-shadow: #333 0 0 5px;
	border-width: 2px;
	position: absolute;
	margin-top: -5px;
}
        
html.ie6 span.error-overlay, html.ie6 form p.warning-overlay,
html.ie7 span.error-overlay, html.ie7 form p.warning-overlay,
html.ie8 span.error-overlay, html.ie8 form p.warning-overlay
{
	behavior: url("/PIE.htc");
}
        
form p.warning-overlay
{
	position: fixed;
	top: 20px;
	border-width: 3px;
	z-index: 100;
}
        
form p.warning-overlay a.close
{
	float: right;
}

/* Specific feedback layout styles */

fieldset.halfWidth form p.warning, fieldset.halfWidth form p.information, fieldset.halfWidth form p.error {width: 355px;} /* fieldset.halfWidth */
form.halfWidth p.warning, form.halfWidth p.information, form.halfWidth p.error {width: 355px;} /* form.halfWidth */

/* Superfish menus -- additional styles */
.sf-menu 
{
    margin-bottom: 25px;
}

.menu-bevel, .bevel
{
    width: 960px;
    height: 5px;
    background: #317edc url("menus/menu-blue-bevel.gif") no-repeat;
    line-height: 0; font-size: 0;
}
.bevel {margin-bottom: 20px;}

/* Header nav links */
ul#headNavLinks 
{
    text-align: right;
    margin-right: -0.5em;
    position: absolute;
    top: 44px;
    right: 0;
}
ul#headNavLinks li 
{
    display: inline;
}
ul#headNavLinks li a:link, ul#headNavLinks li a:visited 
{
    color: #556269;
    font-weight: bold;
    font-size: 1.1em;
    padding: 0.5em;
}
ul#headNavLinks li.current a:link, ul#headNavLinks li.current a:visited, ul#headNavLinks li.current a:hover, ul#headNavLinks li.current a:focus 
{
    color: #317edc;
}
ul#headNavLinks li a:focus, ul#headNavLinks li a:hover, ul#headNavLinks li a:active 
{
    color: #556269;
    text-decoration: underline;
}
ul#headNavLinks li.downloadnow a:link, ul#headNavLinks li.downloadnow a:visited, ul#headNavLinks li.downloadnow a:hover, ul#headNavLinks li.downloadnow a:focus 
{
	background: url("icons/16/down_16.png") no-repeat right center;
	padding-right: 20px;
	margin-right: 0.5em;
	color: #459f37;
}
#searchbar.navLinks 
{
    position: absolute;
    top: 0;
    right: 170px;
}

/* Vertical expanded list menu */
ul.vertical-expanded-list-menu 
{
    float: left;
    margin: 0 2em 2em 0;
    width: 308px;
}
ul.vertical-expanded-list-menu-scrollable {
	width: 300px !important;
	overflow-y: scroll;
	height: 500px;
}
ul.vertical-expanded-list-menu ul, ul.vertical-expanded-list-menu li {list-style: none; margin: 0; padding: 0;}
ul.vertical-expanded-list-menu li {background: #e2ebf0; font-weight: bold; border-top: 5px solid #fff;} /* level 1 */
body.ie6 ul.vertical-expanded-list-menu li {border-bottom: 1px solid #fff;}
ul.vertical-expanded-list-menu li li {background: #fff; font-weight: normal; border-bottom: 1px solid #d3d6d7; padding-bottom: 0.5em;} /* level 2 */
ul.vertical-expanded-list-menu li li li {background: #fff; padding-left: 2em; border-bottom: 0; padding-bottom: 0; font-style: italic;} /* level 3 */
body.ie6 ul.vertical-expanded-list-menu li li li {display: inline-block;}
ul.vertical-expanded-list-menu li.current a:link, ul.vertical-expanded-list-menu li.current a:visited {color: #317edc;}
ul.vertical-expanded-list-menu li.current li a:link, ul.vertical-expanded-list-menu li.current li a:visited {color: #556269;}
ul.vertical-expanded-list-menu li.current li.current a:link, ul.vertical-expanded-list-menu li.current li.current a:visited {color: #317edc;}
ul.vertical-expanded-list-menu li.current li.current li a:link, ul.vertical-expanded-list-menu li.current li.current li a:visited {color: #556269;}
ul.vertical-expanded-list-menu li.current li.current li.current a:link, ul.vertical-expanded-list-menu li.current li.current li.current a:visited {color: #317edc;}
ul.vertical-expanded-list-menu a.current:link, ul.vertical-expanded-list-menu a.current:visited {color: #317edc !important;} /* in case .current class is applied to link */

ul.vertical-expanded-list-menu li a:link, ul.vertical-expanded-list-menu li a:visited 
{
    color: #556269;
    padding: 0.3em 0.8em; 
    display: block;
    text-decoration: none;
}
ul.vertical-expanded-list-menu li a:focus, ul.vertical-expanded-list-menu li a:hover, ul.vertical-expanded-list-menu li a:hover 
{
    background: #e3e3e3;
}  

/* Step menu */
ul.step-menu 
{
    margin: 0 0 2em 0;
    padding: 0;
    background: #e2ebf0;
    overflow: hidden;
    width: 100%;
}
ul.step-menu li 
{
    display: inline;
    float: left;
    padding: 1em;
}
            
ul.step-menu li em {font-style: normal; font-weight: bold;}
            
ul.step-menu li a:link, ul.step-menu li a:visited {text-decoration: none;}
ul.step-menu li a:link em, ul.step-menu li a:visited em {text-decoration: underline;}
ul.step-menu li a:focus, ul.step-menu li a:hover, ul.step-menu li a:active {text-decoration: underline;}
            
ul.step-menu li.done {background: #317edc;}
ul.step-menu li.done, ul.step-menu li.done a:link, ul.step-menu li.done a:visited {color: #215696;}
            
ul.step-menu li.current {background: #3ca8e9;}
ul.step-menu li.current, ul.step-menu li.current a:link, ul.step-menu li.current a:visited {color: #fff;}
                        
ul.step-menu li.to-do {background: #e2ebf0;}            
ul.step-menu li.to-do, ul.step-menu li.to-do a:link, ul.step-menu li.to-do a:visited {color: #a7adb1;}

ul.step-menu li.next {background: #e2ebf0 url('step-arrow.png') left center no-repeat; padding-left: 2em; margin-left: -1em;}
ul.step-menu li.next, ul.step-menu li.next a:link, ul.step-menu li.next a:visited {color: #a7adb1;}


/* Tooltips */

.tooltip 
{
    /* element that triggers tooltip, not the tooltip itself */
}
.tooltipElement 
{
    background: #3ca8e9;
    color: #fff;
    padding: 0.3em 0.5em;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-shadow: #666 0 0 5px;
	-moz-box-shadow: #666 0 0 5px;
	box-shadow: #666 0 0 5px;
}
body.ie6 .tooltipElement, body.ie7 .tooltipElement, body.ie8 .tooltipElement {behavior: url("/PIE.htc");}

/* Pagination */

ol.pagination {
	margin: 1em 0;
	padding: 0;
	width: 100%;
	text-align: center;
}
ol.pagination li {
	list-style-type: none;
	display: inline;
	color: #317edc;
}
ol.pagination li a:link, ol.pagination li a:visited {
	padding: 0.3em 0.5em;
	background: #317edc;
	color: #fff;
}
ol.pagination li a:hover, ol.pagination li a:focus,  ol.pagination li a:active {
	background: #3ca8e9;
}
ol.pagination li.next, ol.pagination li.previous {

}
ol.pagination li.current {

}
ol.pagination li.current a:link, ol.pagination li.current a:visited {
	background: #e2ebf0;
	border-bottom: 2px solid #317edc;
	color: #317edc;
}
ol.pagination li.current a:hover, ol.pagination li.current a:focus,  ol.pagination li.current a:active {
	background: #3ca8e9;
	color: #fff;
}

ol.pagination li.next a:link, ol.pagination li.next a:visited,
ol.pagination li.previous a:link, ol.pagination li.previous a:visited {
	background: none;
	color: #317edc;
}
ol.pagination li.next a:hover, ol.pagination li.next a:focus,  ol.pagination li.next a:active,
ol.pagination li.previous a:hover, ol.pagination li.previous a:focus,  ol.pagination li.previous a:active {
	text-decoration: underline;
}








/* 
 * Non-semantic helper classes 
 */

/* for image replacement */
.ir { display:block; text-indent:-999em; overflow:hidden; background-repeat: no-repeat; }

/* Hide for both screenreaders and browsers
   css-discuss.incutio.com/wiki/Screenreader_Visibility */
.hidden { display:none; visibility:hidden; } 

/* Hide only visually, but have it available for screenreaders 
   www.webaim.org/techniques/css/invisiblecontent/ 
   Solution from: j.mp/visuallyhidden - Thanks Jonathan Neal! */
.visuallyhidden { position:absolute !important;    
  clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
  clip: rect(1px, 1px, 1px, 1px); }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* >> The Magnificent CLEARFIX << */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; } /* Hides from IE-mac \*/
.clearfix { display: block; }

.page-break { display:none; }

.print {display: none;}

.noprint {display: auto;}


/* END */
