/****************************************************************************
 *  Base styles
 ****************************************************************************/
html { height:100.1%; }

body {
	margin: 0;
	padding: 0;
	background: #fff url(../img/supergraphics/blue.jpg) no-repeat center 227px;
	color: #333;
}

img, fieldset { border: 0; }

a {
	text-decoration: none;
	outline: none;
}

a:hover {
	text-decoration: underline;
}

p, fieldset {
	margin: 0;
	padding: 0;
}

.hr, hr {
	display: none;
}

ul {
	list-style-type:none;
}

ul, ol, li {
	margin: 0;
	padding: 0;
}
h4 {
	margin: 7px 0 -7px;
}
h5 {
	margin: 15px 0 7px;
}
.hidden {
	left: -3000em;
	position: absolute;
}
/****************************************************************************
 *  Header
 ****************************************************************************/

/*  Skip links */

#skipLinks {
	height: 0; /* hide from ie */
}

#skipLinks ul {
	margin: 0;
	padding: 0;
	height:0;
}

#skipLinks li {
	display: block;
}

#skipLinks a {
	position: absolute;
	z-index: 10;
	left: -100em;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

#skipLinks a:focus {
	width: 100%;
	height: auto;
	overflow: auto;
	margin: 0 auto;
	left: 0;
	display: block;
	outline: none;
	background-color: blue;
	color: white;
	padding: 2em 0;
	text-indent: 2em;
	border-bottom: 5px solid #333;
}

/*  Sitewide navigation */
#sitewideNav {
	padding: 0 0 2px;
	background-color: #eee;
}

#sitewideNav p {
	position: absolute;
	top: -100em;
}

#sitewideNav ul {
	margin: 0 auto;
	width: 960px;
	text-align: right;
}

#sitewideNav li {
	margin: 0;
	border-right: 1px solid #d7d7d7;
	display: inline;
}

#sitewideNav li a {
	padding: 0 10px;
}

#sitewideNav .last {
	border-right: none;
}

#sitewideNav .last a {
	padding-right: 0;
}

#header {
	padding: 14px 0 0 0;
}

#header h1 {
	margin: 0;
	padding: 0;
	line-height: inherit;
}

#header .logo {
	margin:0;
	
}

#header .logo a {
	margin: 5px 0 16px;
	padding: 0;
	display: block;
	float: left;
}

#header .topnav {
	margin: 0;
	padding: 6px 0 0;
	border-top: 1px solid #e5e5e5;
	clear: both;
	background: #e0e0e0 url(../img/layout/header/tabs.png) repeat-x 0 -251px;
	overflow: hidden;
}

#header .topnav ul {
	margin: 0;
	padding: 3px 0 0 14px;
	list-style: none;
}

#header .topnav li {
	margin: 1px 11px 0 0;
	padding: 0;
	float: left;
}

#header .topnav li a {
	margin: 0;
	padding: 2px 12px 5px;
	display: block;
}

#header .topnav .selected {
	background: transparent url(../img/layout/header/tabs.png) no-repeat 0 -150px;
	margin-top: 2px;
}

#header .topnav .selected a {
	background: transparent url(../img/layout/header/tabs.png) no-repeat right -200px;
	padding: 3px 12px 3px 12px;
	color:#00a1e4;
}

/* Breadcrumbs */
#breadcrumb {
	margin: 8px 0 10px 14px;
	clear:both;
}

#breadcrumb span {
	color: #888;
	font-size:0.688em;
}

#breadcrumb ul {
	margin: 0 2px 0 0;
	display:inline;
	list-style: none;
}
#breadcrumb ul li {
	display: inline-block;
	padding: 0 4px 0 0;
	background: transparent url(../img/layout/nav/breadcrumb.gif) no-repeat right 3px;
	color: #888;
}
#breadcrumb ul li.last {
	background: 0;
	border-top:0;
}

#hiddenBreadcrumb {
	position: absolute;
	left: -100em;
}

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

#footer {
	margin: 0;
	padding: 0 0 50px 0;
	clear: both;
}

#footer p {
	line-height: 1.4em;
	margin-bottom: 0.5em;
}

.explore {
	overflow: hidden;
}

.explore h2 {
	padding-left: 23px;
	margin: .4em 0 .5em;
  	float: left;
	text-decoration: none;
	line-height: 1.7;
	background: transparent url(../img/icons/right_arrow.gif) no-repeat 0 -1px;
}

.explore h2.open {
	background-image: url(../img/icons/down_arrow.gif);
}

.explore p {
	padding: 1px 0 0;
	float: right;
}

.explore ul.nav {
	margin: 0;
	padding: 0 0 0 25px;
	clear: both;
	overflow: hidden;
}

.explore ul.nav li {
  padding: 6px 10px 0 0;
  width: 170px;
}

.explore ul li {
  padding: 0;
  float: left;
  list-style-type: none;
}

.explore ul li ul {
  padding: 0;
  margin: 0;
}

.explore ul.nav li li {
  padding: 0;
  float: none;
  border: 0;
  width: auto;
}

.explore ul li a {

	color: #555;
	font-weight: bold;
}

.explore ul ul li a {
	padding: 0;
	display: block;
	font-weight: normal;
}


#footer p.footnote {
	padding:0 0 5px 23px;
	background: url(../img/icons/external.png) no-repeat 0 0;
	display:inline-block;
}

#footer .explore {
	margin: 20px 0 0 0;
	padding: 0;
	border-top: 1px solid #e5e5e5;
	border-bottom: 1px solid #e5e5e5;
}
 
#footer .explore p {
	margin: .4em 0 .5em;
	text-align: right;
}


/* --------------------------------------------------------------------------------------------------- */
/* --- button styles - GLOBAL button set --- */
/* --------------------------------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------------------------------- */
/* --- regular (large) link button and regular (large) <button> button --- */
/* --------------------------------------------------------------------------------------------------- */

a.button {
	margin: 0;
	padding: 0 11px 0 0;
	display: inline;
	float: left;
	background-repeat: no-repeat;
	background-position: right -60px;
	text-decoration: none;
	cursor: pointer;
}

a.button span {
	margin: 0;
	padding: 4px 0 0 11px;
	display: block;
	float: left;
	height: 22px;
	background-position: left top;
	background-repeat: no-repeat;
	cursor: pointer;
}

/* --------------------------------------------------------------------------------------------------- */
/* --- hover styles --- */
/* --------------------------------------------------------------------------------------------------- */
a.button:hover {
	background-position: right -90px;
	text-decoration: none;
}

a.button:hover span {
	background-position: left -30px;
}

/* --------------------------------------------------------------------------------------------------- */
/* --- regular (large) form button --- */
/* --------------------------------------------------------------------------------------------------- */

span.button {
	margin: 0;
	padding: 0;
	display: block;
	float: left;
	background-repeat: no-repeat;
	background-position: right -60px;
}

span.button span {
	margin: 0 11px 0 0;
	padding: 0;
	display: block;
	background-position: left top;
}

span.button input {
	margin: 0 -11px 0 0;
	padding: 0 11px 3px 11px;
	border: 0;
	height: 25px;
	background-color: transparent;
	text-align: center;
	width: auto !important;
	overflow: visible;
	cursor: pointer;	
}

/* --- hover styles --- */

span.button:hover,
span.buttonover {
	background-position: right -90px;
}

span.button:hover span,
span.buttonover span {
	background-position: left -30px;
}

/* --------------------------------------------------------------------------------------------------- */
/* --- regular (large) button button --- */
/* --------------------------------------------------------------------------------------------------- */

/* --- ONLY IMPORT IF ACTUALLY BEING USED --- */

/* --------------------------------------------------------------------------------------------------- */
/* --- small variant link button --- */
/* --------------------------------------------------------------------------------------------------- */
a.btnSmall span,
a.btnCallSmall span,
a.btnFunctionSmall span,
#header a.btnRegister span,
a.btnRegisterSmall span,
a.btnLogin span,
a.btnLogout span,
a.btnDefaultSmall span,
a.btnFreedomSmall span,
a.btnDefaultOrangeSmall span {
	padding-top: 3px;
	height: 20px;	
}

/* --------------------------------------------------------------------------------------------------- */
/* --- small variant form button --- */
/* --------------------------------------------------------------------------------------------------- */
span.btnSmall input, 
span.btnFunctionSmall input, 
span.btnCallSmall input,
span.btnDefaultSmall input,
span.btnFreedomSmall input,
span.btnDefaultOrangeSmall input {
	padding-top: 0;
	height: 22px;	
}

/* --------------------------------------------------------------------------------------------------- */
/* --- Default background colours --- */
/* --------------------------------------------------------------------------------------------------- */
a.button, a.button span,
span.button, span.button span
 {
	background-image: url(../img/buttons/large_green_08.png);
}

a.btnSmall, a.btnSmall span, 
span.btnSmall, span.btnSmall span
 {
	background-image: url(../img/buttons/small_green_08.png);
}

/* --------------------------------------------------------------------------------------------------- */
/* --- button styles --- */
/* --------------------------------------------------------------------------------------------------- */

a.btnDefault, a.btnDefault span,
span.btnDefault, span.btnDefault span {
	background-image: url(../img/buttons/large_green_08.png);
}

a.btnDefaultSmall, a.btnDefaultSmall span,
span.btnDefaultSmall, span.btnDefaultSmall span {
	background-image: url(../img/buttons/small_green_08.png); 
}

/* --------------------------------------------------------------------------------------------------- */
/* --- button colour and style variants --- */
/* --------------------------------------------------------------------------------------------------- */

/* --- call to action button --- */


a.btnCall, a.btnCall span, span.btnCall, span.btnCall span {
	background-image: url(../img/buttons/large_white_08.png);	
}

a.btnCallSmall, a.btnCallSmall span,
span.btnCallSmall, span.btnCallSmall span {
	background-image: url(../img/buttons/small_white_08.png);	
}

/* --- function buttons --- */

a.btnFunction, a.btnFunction span, span.btnFunction, span.btnFunction span {
	background-image: url(../img/buttons/large_grey_08.png);	
}
a.btnFunctionSmall, a.btnFunctionSmall span, span.btnFunctionSmall, span.btnFunctionSmall span {
	background-image: url(../img/buttons/small_grey_08.png);	
}


/* --- login register log out --- */

a.btnRegister, a.btnRegister span {
	background-image: url(../img/buttons/large_blue_08.png);		
}

a.btnRegisterSmall, a.btnRegisterSmall span,
#header a.btnRegister, #header a.btnRegister span {
	background-image: url(../img/buttons/small_blue_08.png);		
}

a.btnLogin, a.btnLogin span {
	background-image: url(../img/buttons/small_green_08.png);		
}
a.btnLogout, a.btnLogout span {
	background-image: url(../img/buttons/small_white_08.png);		
}

a.btnLogin, a.btnLogout {
	padding-right: 30px;
	background-position: right -120px;
}
a.btnLogin span, a.btnLogout span {

}
a.btnLogin:HOVER, a.btnLogout:HOVER {
	background-position: right -150px;
}

/* --------------------------------------------------------------------------------------------------- */
/* --- TYPOGRAPHY: buttons --- */
/* --------------------------------------------------------------------------------------------------- */
/* - repeat in typography */
a.button, 
a.button:VISITED,
a.button:HOVER,
span.button span input,
span.button input {
	color: #fff;
	font-weight: bold;
}

a.btnCall, a.btnCall:VISITED, a.btnCall:HOVER,
a.btnCallSmall, a.btnCallSmall:VISITED, a.btnCallSmall:HOVER,
a.btnLogout, a.btnLogout:VISITED, a.btnLogout:HOVER,
span.btnCall input, span.btnCallSmall input {
	color: #555;
}

/* --------------------------------------------------------------------------------------------------- */
/* --- FREEDOM variant: buttons (including AS legacy class name) --- */
/* --------------------------------------------------------------------------------------------------- */
a.btnFreedom, a.btnFreedom span,
span.btnFreedom, span.btnFreedom span {
	background-image: url(../img/buttons/large_orange_08.png);
}

a.btnFreedomSmall, a.btnFreedomSmall span,
span.btnFreedomSmall, span.btnFreedomSmall span,
a.btnDefaultOrangeSmall, a.btnDefaultOrangeSmall span,
span.btnDefaultOrangeSmall, span.btnDefaultOrangeSmall span {
	background-image: url(../img/buttons/small_orange_08.png);
}  /* nb. btnDefaultOrangeSmall is class name used in AS/Secure */

/* --------------------------------------------------------------------------------------------------- */
/* --- New window buttons (LARGE only) --- */
/* --------------------------------------------------------------------------------------------------- */
a.btnNewWindow {
	background-position: right -120px;
	padding-right: 35px;
}

a.btnNewWindow:hover {
	background-position: right -150px;
}

/* --------------------------------------------------------------------------------------------------- */
/* --- end of file --- */
/* --------------------------------------------------------------------------------------------------- */
/* Overlays */
.ui-widget-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.ui-widget-overlay {
	background-color: #ffffff; 
	opacity: .50;
	filter:Alpha(Opacity=50);
}

.ui-dialog-titlebar,
.ui-dialog-content,
.ui-dialog-buttonpane {
	background-color: transparent;
}

.ui-dialog-titlebar {
	position: absolute;
	right: 26px;
	top: -8px;
}

.ui-dialog-titlebar-close .ui-icon {
	background: transparent url(../img/layout/jquery-dialog/close.gif) no-repeat 0 0;
	width: 65px;
	height: 20px;
	display: block;
	text-indent: -100em;
	cursor: pointer;
}

#dialog {
	width: 1000px;
	height: 200px;
	display: none;
}

.youTubeDialog {
	padding: 34px 15px 17px;
	background: transparent url(../img/layout/jquery-dialog/youtube-bg.png) no-repeat 0 0;
}

.youTubeDialog .ui-dialog-titlebar {
	right: 17px;
}

.galleryDialog {
	padding: 37px 15px 17px;
	width: 643px;
	background: transparent url(../img/layout/jquery-dialog/gallery-bg.png) no-repeat 0 0;
}

.galleryDialog .ui-dialog-titlebar {
	right: 18px;
}

.galleryDialog img {
	border: 1px solid #808080;
}

.galleryOverlay {
	width: 642px;
	height: 428px;
	overflow: hidden;
}

.galleryOverlay ul {
	position: relative;
	margin-left:-9px;
}

.galleryOverlay li {
	text-align:center;
	float: left;
	display: inline;
	margin-right: 20px;
	width:660px;
}

.galleryOverlay li img {
	cursor: pointer;
}

.galleryOverlay h1 {
	display: block;
	margin: 0;
	padding: 0;
}

.galleryInfo {
	margin-top: 23px;
}

.galleryInfo h1 {
	margin-bottom: 0;
}

.galleryInfo .prev,
.galleryInfo .next {
	padding-left: 28px;
	padding-bottom: 1px;
	float: right;
	background: transparent url(../img/icons/prev.gif) no-repeat 0 0;
	margin-right: 11px;
	color: #333;
}

.galleryInfo .controls {
	position: absolute;
	right: 16px;
	bottom: 27px;
}

.galleryInfo .next {
	background-image: url(../img/icons/next.gif);
	background-position: right 0;
	border-left: 1px solid #999;
	padding-left: 11px;
	padding-right: 28px;
	margin-right: 0;
}

.galleryInfo .controls a:hover {
	color: #00a1e4;
}

/****************************************************************************
 *  Global layout structure
 ****************************************************************************/

#page {
	margin: 0 auto;
	width: 960px;
	background-color: transparent;
}

#bd {
	background: transparent url(../img/layout/background-shell/home-outer-shell_32.png) no-repeat 0 0;
	margin: 0 0 33px;
	width: 696px;
	float:left;
}

.content #bd {
	background-image: none;
	margin-bottom: 21px;
}

.section {
	padding-top: 37px;
}

.oneColumn .section {
	padding-top: 10px;
}

h1 {
	margin: 0 0 10px;
}

.oneColumn h1.hub,
.threeColumn h1.hub {
	top:-999px;
	position:absolute;
}

.threeColumn h1.logo {
	position:relative;
	top:0;
}

/****************************************************************************
 *  Content pages
 ****************************************************************************/

.content .section {
	padding-top:0;
}

.content .csA {
	background: url(../img/layout/background-shell/4col_inner_shell_tile_32.png) repeat-y left top;
	margin:0 -5px;
	width:706px;
}

.content .csB {
	background: url(../img/layout/background-shell/3col_inner_shell_top_32.png) no-repeat left top;
	margin:0;
	padding:5px 0 0;
}

.content .csC {
	background: #fff url(../img/layout/background-shell/shell_inner_gradient.png) repeat-x left bottom;
	margin: 0 5px;
	padding: 0 28px 1px;
}

.csFooter {
	background: url(../img/layout/background-shell/4col_inner_shell_footer_32.png) no-repeat left bottom;
	margin:0 -5px;
	padding: 1px 7px 3px;
	overflow:hidden;
	clear:both;
}
.content .csFooter {
	padding-top:9px;
}

.oneColumn .halfContentPromos .csFooter,
.halfContentPromos .csFooter {
	padding-top:94px;
	margin-bottom:-94px;
}

.halfContentPromos .promos {
	overflow:hidden;
	margin:0;
	clear: both;
}
.halfContentPromos .promos .mod {
	float:left;
	margin:0 0 0 18px;
	display:inline;
}
.content .contentMain .contentMainHeader {
	background: url(../img/layout/background-shell/top_border.gif) no-repeat center top;
	height:6px;
	position:absolute;
	top:-6px;
	width:100%;
	left:0;
}
.content .contentMain .footer {
	background: url(../img/layout/background-shell/footer.gif) no-repeat scroll center top;
	height:20px;
	padding: 0 10px;
	position:absolute;
	bottom:-6px;
	width:100%;
	left:-5px;
	overflow:hidden;
}
.project .contentMain {
	width: 653px;
	position:absolute;
	margin-left:-6px;
	background:#fff;
	padding-bottom:14px;
}
.project .contentMain .contentMainHeader {
	background: url(../img/layout/background-shell/top_border.gif) no-repeat center top;
	height:8px;
	position:absolute;
	top:-6px;
	left:0;
}
.project .contentMain .footer {
	background: url(../img/layout/background-shell/footer.gif) no-repeat scroll center top;
	height:20px;
	padding: 0 10px;
	position:absolute;
	bottom:-6px;
	width:653px;
	left:-10px;
}

.content p {
	margin:10px 2px;
}

.content .contentMain p {
	margin:10px 0;
}

h1.alt {
	float:left;
	padding-bottom:0;
}


/****************************************************************************
 *  Header
 ****************************************************************************/

#header .secure {
	float: right;
	min-height: 23px;
	margin: 0;
}

#header .secure dt {
	display: inline;
	float: left;
	margin-top: 1px;
}

#header .secure dd {
	display: inline;
	margin: 0;
}

#header .secure .button {
	margin-left: 9px;
}

#header .site {
	margin: 18px 8px -1px 0;
	padding: 0;
	clear: right;
	float: right;
	list-style: none;
	overflow: hidden;
	position: relative;
	z-index: 1;
	display: inline;
}

#header .site li {
	margin: 0 12px 0 0;
	padding: 0;
	float: left;
	display: inline;
}

#header .site a {
	margin: 0;
	padding: 1px 16px 8px;
	display: block;
}

#header .site .selected {
	background: #fff url(../img/layout/header/tabs.png) no-repeat 0 -50px;
}

#header .site .selected a {
	padding: 5px 16px 5px 16px;
	background: transparent url(../img/layout/header/tabs.png) no-repeat right -100px;
}
/* --------------------------------------------------------------------------------------------------- */
/* --- HR --- */
/* --------------------------------------------------------------------------------------------------- */
.tabPanel .hr,
.line,
.genInfo .hr {
	border-top: 1px solid #E5E5E5;
	clear: both;
	height: 1px;
	display: block;
	margin: 1em 0 .6em;
}
/* --------------------------------------------------------------------------------------------------- */
/* --- footer --- */
/* --------------------------------------------------------------------------------------------------- */

/****************************************************************************
 *  Module dimensions for 3 column and one column  grids
 ****************************************************************************/

.oneColumn #breadcrumb, 
.threeColumn #breadcrumb {
	float:left;
 } 
.threeColumn h1 {
	margin-left:28px;
	margin-top:0;
	clear:both;
}

.oneColumn #bd, .threeColumn #bd {
	width:960px;
	padding:0 5px;
	position:relative;
	left:-5px;
}
.threeColumn #bdInner {
	margin:0 12px;
	clear:both;
}

.oneColumn #bd {
	background-image: none;
}

.oneColumn .csA {
	background: url(../img/layout/background-shell/full-col-inner-shell-tile_32-fs8.png) repeat-y left top;
	margin:0 -5px;
	width: 970px;
	overflow:hidden;
	clear:both;
}

.oneColumn .csB {
	background: url(../img/layout/background-shell/full-col-inner-shell-top_32-fs8.png) no-repeat left top;
	margin:0;
}

.oneColumn .csC {
	background: #fff url(../img/layout/background-shell/full-shell-inner-gradient.png) repeat-x left bottom;
	margin: 0 5px;
	padding: 0 28px;
	overflow:hidden;
}

.oneColumn .csFooter {
	background: url(../img/layout/background-shell/4-col-outer-shell-footer_32-fs8.png) no-repeat left bottom;
	margin:0 -5px;
	padding: 6px 7px 3px;
	overflow:hidden;
	clear:both;
}

.threeColumn .modContainer,
.threeColumn .accordion {
	margin: 0 10px;
	overflow: hidden;
	float: left;
	width: 292px;
	display: inline;
}


/****************************************************************************
 *  Module dimensions for 4 column grid
 ****************************************************************************/
.threeColumn .section,
.fourColumn .section {
	padding-top: 20px;
	clear: both;
	overflow: visible;
}

.fourColumn #bd {
	width:960px;
	padding:0 5px;
	position:relative;
	left:-5px;
}

.fourColumn.content #bd {
	width:696px;
}

.content .fourColumn {
    margin: 0 0 20px;
    width: 696px;
    float: left;
}

.content .fourColumn {
    margin: 0;
    padding: 0 28px;
}
 /*background image not correctly referenced in original build so hidden - this element only found in in checksheet*/
.fourColumn .csFooter {
   /* background: transparent url(../img/layout/background-shell/4col_inner_shell_footer_32.png) left bottom no-repeat; */
    margin: 0 -5px;
    overflow: hidden;
    padding: 1px 7px 3px;
	width: 706px;
}


.oneColumn .csC {
	padding: 0 22px;
}

.threeColumn .modContainer .tickList .bd {
	width: 250px;
	height: 267px;
}


/****************************************************************************
 * three columns in content area 
 ****************************************************************************/

.oneColumn .leftColumn {
	width:224px;
	float:left;
	margin:30px 0 0;
}

.oneColumn .middleColumn {
	float:left;
	margin:30px 0 0 40px;
	width:308px;
}

.oneColumn .rightColumn {
	float:left;
	width:302px;
	margin:30px 0 0 20px;
}

.oneColumn .leftColumn p, .oneColumn .middleColumn p, .oneColumn .rightColumn p  {
	margin:0 0 10px;
	padding:0;
}

.oneColumn .leftColumn h2, .oneColumn .middleColumn h2, .oneColumn .rightColumn h2 {
	margin:0 0 5px;
	padding:0;
}

.profile .text p {
	margin-bottom:0.5em;
}

/****************************************************************************
 *  Module dimensions for 4 column grid
 ****************************************************************************/

.fourColumn #bdInner {
	margin:0 12px;
	clear:both;
}

.fourColumn.content #bd {
	width:696px;
}

.fourColumn .modContainer,
.fourColumn .accordion {
	margin: 0 10px;
	overflow: hidden;
	float: left;
	width: 214px;
	display: inline;
}

.fourColumn .mod .hd {
	width:214px;
}

.content .fourColumn {
    margin: 0 0 20px;
    width: 696px;
    float: left;
}

.content .fourColumn {
    margin: 0;
    padding: 0 28px;
}
.accordion .modContainer,
.fourColumn .accordion .modContainer {
	display: block;
	float: none;
	margin: 0 0 10px;
}

.accordionEnabled .modContainer,
.fourColumn .accordionEnabled .modContainer {
	margin: 0;
}

/****************************************************************************
 *  Sidebar
 ****************************************************************************/
div#sidebar {
	padding: 0;
	float: right;
	width: 222px;
	margin-right:21px;
	display:inline;
	margin-bottom: 33px;
}

#sidebar .modContainer {
	width:222px;
	overflow: hidden;
	float: left;
	display:inline;
	margin: 0 0 10px;
}

#sidebar .modContainer .hd {
	background-position:0 -221px;
	width:222px;
}

#sidebar .modContainer .hd h2 {
	border: 0;
	width: 190px;
	border-bottom: 1px solid #D3D3D3;
}

#sidebar .modContainer .bd {
	width: 219px;
	height: auto;
	background: #fff url(../img/layout/nav/repeat.gif) repeat-x 0 0;
}

#sidebar .modContainer div.last {
	background-image:none;
}

#sidebar .modContainer .ft {
	background-position:0 -26px;
	width:221px;
	margin:0;
	position:static;
}

#sidebar .retailSearch .bd {
	background: transparent url(../img/promos/retail_search.png) no-repeat left bottom;
	padding: 10px 0 20px;
	width: 221px;
	border: 0;
}
#sidebar .retailSearch .bd div input {
	width: 175px;
}
#sidebar .retailSearch .bd div {
	margin-bottom: 10px;
}

/****************************************************************************
 *  Module shell
 ****************************************************************************/

.mod {
	position: relative;
}

.mod .hd {
	background: transparent url(../img/layout/module/header-border.gif) no-repeat 0 0;
	width: 292px;
}

.mod .hd .last {
	background: none;
}

.mod .hd h2 {
	padding: 11px 15px  10px;
	border-bottom: 1px solid #d3d3d3;
	background: transparent url(../img/layout/module/header-background1.gif) repeat-x 0 bottom;
	margin: 0 1px;
}

.mod .bd {
	border-left: 1px solid #d3d3d3;
	border-right: 1px solid #d3d3d3;
}

.mod .bd p {
	margin:0;
}


.mod .bd h3 {
	margin: 0 20px 0.333em;
	padding-top: 1em;
}

.mod .button {
	margin: 10px 0 0 19px;
}

/* Override for 1/3 size module */

.threeColumn .mod .hd {
	background-position: 0 -80px;
}

.modContainer .bd {
	width: 212px;
	height: 300px;
	background-color:White;
	background-repeat: no-repeat;
	position: relative;
}

.modContainer .ft {
	position: absolute;
	left:0;
	width: 214px;
	height: 8px;
	margin-left: -1px;
	margin-right: -1px;
	bottom: 0;
	background: transparent url(../img/layout/module/image-promo-bottom.gif) no-repeat 0 0;
}

.modContainer .RelInfo {
	background-color:#f7f7f7;
}

.modContainer .text p {
	margin:0 20px 2px;
}

.modContainer .text p.separate {
	margin-top:12px;
}

.modContainer .text ul.bullet1 {
	padding-top:10px;
}

.modContainer .text ul.bullet1 li a {
	padding-left:10px;
}

.modContainer .text a.action {
	padding-left:13px;
}

/* Override for 1/4 size module */
.fourColumn .modContainer .bd {
	height: 240px;
}


/* The modules do not set their own padding etc, no first element can have a top margin */
.modContainer .text p.firstElement {
	padding-top:1.25em;
}

.modContainer ul.bullet1 {
	padding:20px 20px 0;
}

.modContainer ul.bullet1 li {
	margin-bottom:6px;
}

/* Overrides for 1/3 size image promo module */

.threeColumn .modContainer .bd {
	width: 290px;
}

.threeColumn .modContainer .ft {
	background-position: 0 -18px;
	width: 292px;
}

/* Overrides for half size promo module */

.halfContentPromos .modContainer .bd {
	width: 314px;
}

.halfContentPromos .modContainer .mod .hd {
	width: 316px;
	background-position: 0 -281px;

}

.halfContentPromos .modContainer .ft {
	background-position: 0 -39px;
	width: 316px;
}

.oneColumn .halfContentPromos .promos .modContainer .bd {
	width: 250px;
}

.oneColumn .halfContentPromos .modContainer .mod .hd {
	width: 292px;
	background-position: 0 -80px;

}

.oneColumn .halfContentPromos .modContainer .ft {
	background-position: 0 -17px;
	width: 292px;
}


/* Form styles in modules */
.modContainer form {
	margin: 0 15px;
}

.modContainer form label {
	color: #444;
	display: block;
}

/* Special layout for anchors etc */
a.action,
.sitemap li a {
	padding-left: 10px;
	background: url(../img/icons/right-link-arrow.png) no-repeat 0 .48em;
	display: inline-block;
}
#timeline a.action {
	margin-top:10px;
}
a.playVideo {
	padding-left: 27px;
	background: url(../img/icons/play-button-sm.png) no-repeat 0 0;
	display: inline-block;
}

a.external {
	padding: 0 0 5px 23px;
	background: url(../img/icons/external.png) no-repeat 0 0;
	display: block;
}

/****************************************************************************
 *  Lists
 ****************************************************************************/

ul.tick {
	padding:0;
}
ul.tick li {
	background: url(../img/icons/tick.gif) 0 5px no-repeat;
	margin:0;
	padding:0 0 5px 30px;
}
ul.dash {
	padding: 0;
}
ul.dash li {
	background: url(../img/icons/dash.gif) 0 6px no-repeat;
	margin: 0;
	padding: 0 0 5px 10px;
}

.description li,
.genInfo .tick li,
ul.tickList li,
div.tickList li {
	background: transparent url(../img/icons/tick.gif) no-repeat scroll left 0.5em;
	margin-bottom: 4px;
	padding: 3px 0 3px 29px;
}
ul.linkList li
{
	padding: 3px 0;
}

ol {
	margin-left: 35px;
}

ol li {
	padding: 0 0 8px;
}
.description li {
	background: none;
	padding-left: 0;
	margin-bottom: 2px;
}
.popup .content ul li,
ul.bulletedList li,
.genInfo li
{
	background: transparent url(../img/icons/bullets.gif) no-repeat 35px .4em;
	padding: 3px 0 3px 55px;
}

a.link,
.contactDetails a, 
.tabHeroPanel .columnFooter li,
.tabHeroPanel .sideColumnPanel li,
.genInfo .link li,
.errorPanel .link li,
.genInfo .linkList li,
.linkList li {
	background: transparent url(../img/icons/right-link-arrow.png) no-repeat 0 .7em;
	padding-left: 10px;
}

.genInfo ul {
	margin-bottom: 20px;
}

.feature a.link  {
	background-position:  0 .35em;
}

.contactDetails a,
.tabHeroPanel .columnFooter li {
	background-position:  0 .5em;
}

.tel1 {
	margin: 0 0 5px;
}

body.content p:last-child {
	margin-bottom: 0;
}

.contentHeader p:last-child {
	margin-bottom: 1em;
}

body.content h1 {
	line-height:1.16em; /*left in for IE7*/
}

body.content h1 {
	line-height: inherit;
	margin-bottom: 0.65em;
	margin-top: 0;
}
a.action {
	background: url(../img/icons/right_purple_link_arrow.gif) no-repeat 0 5px;
}

/* --------------------------------------------------------------------------------------------------- */
/* --- Article Page --- */
/* --------------------------------------------------------------------------------------------------- */
.article p {
	padding: 7px 0;
}

.content .csA .article h2,
.article h2 {
	padding: 20px 0 5px;
}
/****************************************************************************
 *  Typography - font sizes, font colours and font weights
 ****************************************************************************/

body {
    line-height: 1.33;
	font-family: tahoma, helvetica, arial, sans-serif;
	font-size: 100%;
}
input {
	font-family: tahoma, helvetica, arial, sans-serif;
}

/****************************************************************************
 *  Font sizes
 ****************************************************************************/
/* 32px */
.investor p.price {
	font-size: 2em;
}

/* 25px */
h1 {
	font-size: 1.5625em;
}

/* 23px */
#heroLinks li {
	font-size: 1.4375em;
}

/* 20px */
#skipLinks a,
.mediaContacts .bd p.contact span {
	font-size: 1.5em;
}

/* 18px */
.oneColumn .panelOne h2,
.oneColumn .panelTwo h2 {
	font-size: 1.125em;
}

/* 16px */
.content .csA h2,
.content .news h2,
.gallery h2,
.project .contentMain ul,
.profile .text p,
.oneColumn .leftColumn h2,
.flashReplace ul.contacts li h2,
#timeline li p,
.sitemap ul,
.content .csA .infoPanel .bd h2,
.content #bd .globalPresence li.feature h2 {
	font-size:1em;
}

/* 15px */
.mod .hd h2,.mod1 .hd1 h2,
.mod .bd h3,.mod1 .bd1 h3,.mod1 .bd2 h3,
.content .globalPresence p.intro,
.investor p.relLinks,
.navList2 p,
.modContainer .text p.intro,
.multiColDetail p.intro2,
.content .projectDetails .contentHeader p,
.content .multiColDetail .intro .txt p,
body.halfContentPromos .promos p,
.oneColumn .middleColumn h2, 
.oneColumn .rightColumn h2,
.oneColumn .panelOne h3,
.oneColumn .panelTwo h3,
.galleryInfo h1 {
	font-size: .9375em;
}

/* 14px */
.featuredNavList h3 {
	font-size: .875em;
}

/* 13px */
h4,
p.addionalInfo,
.content p.info,
.content .contentHeader p,
.content h2.mapLink,
.mod ul.bullet1,
.news p,
.products p,
.navList2 .bd li a,
.flashReplace ul.letters li,
.oneColumn .panelOne p,
.oneColumn .panelTwo p,
.modContainer .thumbList li p.title {
	font-size: 0.813em;
}

/* 12px */
.contentMain ul,
.sitemap,
#header li,
h5,
p,
.project .features li li,
#sidebar .navList .hd h2,
#sidebar .mod h2,.mod1 h2,
.tabPanel li,
.tabPanel .description li,
.content .multiColDetail h3,
.content .projectDetails h3,
.content .projectDetails p,
.multiColDetail ul.bullet1,
.content .freeRunning h3,
.freeRunning ul.bullet1, 
.features a.external,
.mediaContacts .bd p.contact,
.feature h3,
.selection span,
.selection ul li,
.mod .bd ul.tick,
.profile .text p.title,
.flashReplace ul.contacts,
.flashReplace ul.switchView,
.flashReplace ul.partners li,
.oneColumn .panelOne #fcBarclaycardFlashVideoPlayer span,
.oneColumn .panelTwo #fcBarclaycardFlashVideoPlayer span,	
.content h3,.oneColumn .panelOne #flashcontent p,
.oneColumn .panelTwo #flashcontent p,
.heroImagePromo .bd,
.popup .content ul li,	
.investor p.date, .bd2 div {
    font-size: .75em;
}

.popup ol li h4,
div#contentBody div.panel ol li p {
    font-size: 1em;
}

/* 11px */
#breadcrumb p,
#breadcrumb li,
span.button span input,
.mod .button,.mod1 .button,
#header dl,
#footer p,
#footer h2,
#footer li a,
.footnote,
.modContainer .globalPresence .bd p,
.news p.date,
.navList .bd li a,
.fourColumn .modContainer .news p.date,
#sidebar .navList .bd p,
.thumbList p.date,
.thumbList p.desc,
#sidebar .mod ul.bullet1,
.multiImg .last p,
.content .projectDetails .contentHeader .partner p,
.mediaContacts .bd p,
.news p.date,
ul.gallery li p,
span.rss a,
.pagination p,
.pagination label,
.pagination input,
.pagination span,
.investor p.delay,
.fourColumn .investor p.date,
#sidebar .modContainer .imageTextPromo .bd a.action,
#bd a.btnRegister span,
#bd a.btnLogin span,
a.btnFreedom,
.galleryInfo a,
.galleryInfo p {
	font-size: .6875em;
}

/* 10px */
#sitewideNav li,
.fourColumn .investor p.delay,
.videoLink a.flashMovieLink em,	
.galleryInfo .prev,
.galleryInfo .next {
	font-size: .625em;
}

.videoLink a.flashMovieLink em  {
	font-size: .667em;
	margin-left: 10px;
}

/****************************************************************************
 *  Font colours
 ****************************************************************************/

a,
h1,
.navList li a:hover,
#header .site .selected a,
.content .csA h2,
.features li h2,
.ui-state-active h2,
.mediaContacts .bd p.contact,
.content .news a.action:hover,
.profile .text p.name,
.oneColumn .leftColumn h2,
.oneColumn .middleColumn h2, 
.oneColumn .rightColumn h2,
.flashReplace ul.contacts h3,
.flashReplace a.totop:hover,
ul.sitemap li a:hover {
	color: #00a1e4;
}

#header .site a,
.mod .bd h3,
.content h2.mapLink,
.content .globalPresence .feature a.action,
.feature h3,
ul.gallery li p,
.pagination label,
.selection .pagination span,
body.halfContentPromos .promos p,
.content .news a.action,
#timeline li h2,
ul.sitemap li a,
.investor p.date,
.oneColumn .panelOne h2,
.oneColumn .panelTwo h2,
.galleryInfo h1 {
	color: #333;
}

#header .topnav  a {
	color: #444;
}

.mod .bd, .mod1 .bd1, .mod1 .bd2,
.navList li a,
span.button input,
.multiImg .last a, 
.selection span,
.flashReplace a.totop,
.mod h2,.mod1 h2,
h2.active,
h2 a.active,
.accordionEnabled .ui-state-default h2,
.accordionEnabled .ui-state-default h2 a {
	color: #555;
}

.footnote,
#sidebar .mod h2,
#footer p,
.investor p.delay {
	color: #666;
}

#breadcrumb {
	color: #888;
}


.heroImagePromo .bd {
	color:#fff;
}

.profile .text {
	color:#ccc;
}

/****************************************************************************
 *  Font weights
 ****************************************************************************/

#header .logo a,
#header dl dt,
#header .topnav .selected a,
.modHero li a,
span.button input,
#sidebar .mod h2,
.content .csA h2.mapLink,
.news p.date,
ul.gallery li p.date,
.selection span,
.thumbList p.date,
.profile .text p.title,
.flashReplace ul.partners li p.hd,
.sitemap li,
.galleryInfo .prev,
.galleryInfo .next {
 	font-weight: bold;
}
h1,
.mod .hd h2,
.mod1 .hd1 h2,
.mod .bd h3,
.content .csA h2,
.content .csA .infoPanel h2,
ul.gallery h2,
.pagination span,
.flashReplace ul.contacts h2,
.flashReplace ul.contacts h3,
.leftColumn h2, 
.middleColumn h2, 
.rightColumn h2,
.oneColumn .panelOne h3,
.oneColumn .panelTwo h3,
.sitemap li li {
	font-weight: normal;
}

/****************************************************************************
 *  Font family
 ****************************************************************************/

.modHero li {
	font-family: verdana, tahoma, helvetica, arial, sans-serif;
}
/* 25px */
.mybarclaycardStatus p {
	font-size: 1.5625em;
}

/* 23px */
.tabHeroPanel .sideColumnPanel p.tel1 {
	font-size: 1.44em;
}

/* 20px */
.tabHeroPanel .feature div span,
.tabHeroPanel .largeText,
.tabHeroPanel .content h2,
.tabHeroPanel .features .additonalPrice p span,	
.columnHeader .product span,
.halfContentPromos .contentAside .bd h2 {
	font-size: 1.252em;
}
/* 18px */
.tel1,
.feature p.tel1 {
	font-size: 1.13em;
}

.contactDetails td {
	font-size: 1.165em;
}

/* The size is a little bigger than 16px so Windows renders the font bolder but Safari does not */
.tabHeroPanel h3,
.overlayBody h2,
.myBarclaycard h2,
.screenshots h2 {
	font-size: 1.04em;
}

/* 16px */
.tabPanel .answer,
h2,
.altProduct h3,
.tabHeroPanel .columnFooter .description,
.tabHeroPanel .sideColumnPanel .inPageHelp li a,	
.contactAdditionalInfo h3,
.tabHeroPanel .altProduct h4,
.popup h1,
div.genericCallout p.heading,
p .removeExistingCustomer {
	font-size: 1em;
}

.columnHeader .product strong {
	font-size: 1.6em;
}

/* 15px */
.tabHeroPanel .columnFooter a,
.tabHeroPanel .intro,
.content .info,
.videoLink a.flashMovieLink span,	
.myBarclaycard .demoLinks a {
	font-size: .9375em;
}

/* 14px */
.sideColumnPanel .tel2,
.popup .intro p,	
.feature p.tel2,	
.twoColumn .inlineImagePromo .bd p, .threeColumn .inlineImagePromo .bd p,
.popup ul.fileActions li.print a,
.columnHeader .description .highLight,
.contactDetails span {
	font-size: .875em;
}

#comparisonTable tr.apr td strong {
	font-size: 1.228em;
}

.contactDetails span {
	font-size: 1.272em;
}

.overlayBody .apr span {
	font-size: 1.4em;
}

/* 13px */
.tabHeroPanel .sideColumnPanel .addition,
.contactDetails th,
.article h2,
.content .csA .article h2,
.modContainer .iconList p,
#comparisonTable thead th {
	font-size: .8125em;
}

.modContainer .iconList .feature strong {
	font-size: 1em;
}
.modContainer .iconList .feature p strong {
	font-size: 1.084em;
}

.tabHeroPanel .sideColumnPanel li a {
	font-size: 1.185em;
}

/* 12px */
h3,
.featuredNavList li a,
.popup .content h2,
.content .csA .infoPanel p,
.content .csA .infoPanel a,
.tabHeroPanel p,
.tabHeroPanel h4,
.popup #bdInner li,
.popup ul.fileActions li,	
.genInfo ul li,
.errorPanel ul li,
.tick li,
.tickList ul li,
.dash li,
.tabHeroPanel .feature .link,
.tabHeroPanel .branding,
.tabHeroPanel .feature div,	
.tabHeroPanel .columnFooter a.pdfLink,
.tabHeroPanel .features .additonalPrice p,
.mybarclaycardStatus div p,
.modContainer a.external,
.modContainer .iconList .feature p,
ol li {
    font-size: .75em;
}

.tabHeroPanel .columnFooter p a.pdfLink {
	font-size: 1em;	
}
.tabHeroPanel .columnFooter ul a {
	font-size: .917em;	
}

/* 11px */
#protectInsure .overlayBody li,
.navList .bd p,
.popup .button span,
.tabHeroPanel .button span,
.contactAdditionalInfo .button span,
.validatePhoneNumber form span.button input,
.tabHeroPanel .footnote,
.intro .partner p,
.tabHeroPanel .smallText,
.tabHeroPanel .description .button,
.overlayBody .button,
.myBarclaycard .registerAside .button,
.sideColumnPanel .inPageHelp li,
#comparisonTable th,
#comparisonTable td,
.myBarclaycard .customerQuote cite,
.mybarclaycardStatus .button span,
.tabHeroPanel .proDescription .linkList li a,	
#sidebar .modContainer .general .bd p {
	font-size: .6875em;
}

.tabHeroPanel .proDescription .linkList li a { 	
	font-size: .924em;
}
.sideColumnPanel .tel2 span {
	font-size: .79em;
}

/* 11px */
.altPanel .link,
.feature p.tel2 span,
.tabHeroPanel .buttonContainer a.button,
.tabHeroPanel .linkContainer a.button,
.tabHeroPanel .branding p,
.modContainer form label,
.btnDiv .button span,	
.btnDiv a.button {
	font-size: .735em;          	
}

.article p.date,
.modContainer form label {
	font-size: .687em;
}

.contactDetails a {
	font-size: .59em;
}

/* 10px */
.tabHeroPanel .note,
.tabHeroPanel .backToTop a,	
.contactDetails p,
.sideColumnPanel .inPageHelp .external,
#sidebar .bd div input,
#comparisonTable tr.apr td {
	font-size: 0.714em;
}

.columnHeader .product p,
#sidebar .retailSearch .bd div input,
.tabHeroPanel .note {
	font-size: .625em;
}

.contactDetails p {
	font-size: .59em;
}

.myBarclaycard .demoLinks a span {
	font-size: 0.6666em;
}

.overlayBody .apr {
	font-size: 0.625em;
}

/****************************************************************************
 *  Font colours
 ****************************************************************************/
h2,
.mod .hd h2,.mod1 .hd1 h2,
.tabHeroPanel h3,
.tabHeroPanel .sideColumnPanel .contacts h3,
.stackedTabs .header li.selected a,	
.mod .bd .highlight,
.largeText,
.smallText,
.columnHeader .product p,
.tabHeroPanel .columnFooter p.description,
.tabHeroPanel .columnFooter .description .info,
.popup ul.fileActions li.print a:hover,
div.genericCallout p.heading,
#comparisonTable thead th,
#comparisonTable tr.apr td,
.contactDetails td,	
.contactDetails span,
#comparisonTable em,
.overlayBody .apr,
.explore ul ul li a,
.feature p.tel1,
.tel1,
.tabHeroPanel .sideColumnPanel p.tel1,
.tabHeroPanel .sideColumnPanel p.tel2,
.tabHeroPanel .columnFooter ul a:hover,
.mybarclaycardStatus p {
	color: #00a1e4;
}

.content .community h2,
.tabHeroPanel .content h2,
.tabHeroPanel .header li a,
.contactDetails th,
.popup .content h2,	
.tabHeroPanel .sideColumnPanel p.tel2 span,
.sideColumnPanel .inPageHelp .external,
.mybarclaycardStatus div p,
.tabHeroPanel .columnFooter .description p,
.btnCall span {
	color: #333;
}

#termsConditions,
.navList .hd h2,
.contactDetails p,
.stackedTabs .header li a,
.accordionEnabled .ui-state-default h2,
.popup ul.fileActions li.print a,
.tabHeroPanel .note,
.tabHeroPanel .columnFooter ul a,
#sidebar .retailSearch .bd div input,
.myBarclaycard .customerQuote div {
	color: #666;
}

.lightText,
.myBarclaycard .demoLinks a,
.noFlash p {
	color:#fff;
}
.tabHeroPanel .features .additonalPrice p,
.inPageHelp a.question,
.halfContentPromos .contentAside .bd h2,
.tabHeroPanel .sideColumnPanel h3,	
.tabHeroPanel .feature div,
.tabHeroPanel .content h2,
.contactAdditionalInfo h3,
.altProduct h3,
.altProduct h4 {
	color: #534e78;
}
.tabHeroPanel .backToTop a,
a.btnCall span {
	color: #555;
}

.myBarclaycard .demoLinks a span {
	color: #ccc;
}

/****************************************************************************
 *  Font weights
 ****************************************************************************/

.navList .bd p,	
.article h2,
.content .csA .article h2,
.popup .content h2,
#comparisonTable .apr,
.tabHeroPanel .feature div,
.overlayBody .apr span  {
 	font-weight: bold;
}

h2,
.tabHeroPanel h3,
.contactAdditionalInfo h3,	
.tabHeroPanel .altProduct h4,
.contactDetails th,
.popup ul.fileActions li a,
#comparisonTable .apr span,
.tabHeroPanel .feature div span,	
.mybarclaycardStatus strong {
    font-weight: normal;
}

/****************************************************************************
* 	Font decorations
****************************************************************************/
.inPageHelp ul li a.question:hover{
	text-decoration:none;	
	color:#999;
}

.inPageHelp ul li a.question.over {
	color:#999;
}

#comparisonTable em,
.myBarclaycard .customerQuote cite {
	font-style: normal;
}
/****************************************************************************
*  Main pages content styles
****************************************************************************/
.content .contentMain {
	position:relative;
}

.content .contentHeader, .project .contentHeader  {
	border-bottom: 0;
	padding-bottom: 9px;
}

.content .intro2, .project .intro2 {
	border-bottom:#e2e2e2 solid 1px;
	padding-bottom:16px;
	margin-bottom:13px;
}

.content .csA h2 {
	margin: 0 0 10px;
	padding-top:14px;
	display:block;
	clear:both;
}

.content .features {
	margin-bottom:0;
}

.project .features h2 {
	clear:none;
	padding-top:0;
}

.features h3, .feature h3 {
	margin-top:18px;
	margin-bottom:0;
}

.features ul {
	padding:0 15px 0 2px;
}

.project .features ul {
	border-width:0 1px;
	border-color:#ccc;
	border-style:solid;
}

.project .features li {
	min-height: 115px;
	clear:both;
	overflow:hidden;
	padding: 15px 0;
	border:0;
	border-bottom: #e2e2e2 solid 1px;
	position: relative;
}

.features li.first {
	padding:10px 0 15px;
}

.features li.last {
	padding:15px 0 0;
	border-bottom:none;
}

.features li img {
	float:left;
	margin: 0 15px;
	border:#e2e2e2 solid 1px;
}

.features li a.youTube {
	margin: 0 15px;
	float: left;
	position: relative;
}

.features li a.youTube img {
	float: none;
	margin: 0;
}

.features li a.lightbox img {
	height: 115px;
}
.features li div ul {
	padding-left: 0;
}
.project .features li div li {
	height: auto;
	min-height: inherit;
	clear: none;
	overflow: hidden;
	border: 0;
	position: static;
	background: transparent url(/freedom/assets/global/img/icons/bullets.gif) no-repeat 0 .9em;
	margin: 0;
	padding: 5px 0 5px 15px;
}

.features li div a.action {
	margin-right: 20px;
}

.lightbox,
.youTube {
	display: block;
}

.genInfo .youTube {
	width: 191px;
	height: 141px;
}

.genInfo .lightbox,
.genInfo .youTube {
	position: relative;
}

.videoLink .youTube span,
.genInfo .lightbox span,
.genInfo .youTube span,
.features .youTube span {
	background: transparent url(../img/icons/play.png) no-repeat left top;
	display: block;
	height: 31px;
	left: 78px;
	position: absolute;
	top: 58px;
	width: 36px;
}

.videoLink .youTube span {
	left: 130px;
	top: 85px;
}

.features li p {
	margin: 0;
}

.features li div {
	float: left;
	width: 430px;
}

.contentMain .features li div p {
	margin: 5px 0;
}

/* Tab Panels */
.tabPanel .header {
	margin: 0;
	padding: 0 0 5px;
	overflow:hidden;
}

.tabPanel .contentMain {
	border-color:#e2e2e2;
	border-style:solid;
	border-width:0 1px;
	background:white;
	padding:0 20px 10px;
}

.tabPanel .content {
	padding-top:1px;
}

.tabPanel .header p,
.content .tabPanel .header p {
	float: left;
	padding: 0;
	margin: 0;
}

.tabPanel .header ul {
	margin: 0 0 0 10px;
	padding: 0;
	list-style: none;
	overflow: hidden;
}

.tabPanel .header li {
	margin: 0 3px 0 0;
	padding: 0;
	list-style: none;
	float: left;
}

.tabPanel .header li a {
	margin: 0 0 0 4px;
	padding: 0 14px;
	text-decoration: none;
	/* changed to inline-block so that hover area is bigger in IE6. Move to IE6.css if problems occur  */
	/* display: inline; */
	display: inline-block;
}

span.rss  {
	padding:3px 0 0 27px;
}

span.rss a {
	background:url(../img/icons/rss.gif) left top no-repeat;
	padding:3px 0 3px 25px;
}

ul.gallery {
	width: 926px;
	padding: 14px 0 20px;
	margin-right: -22px;
	overflow: hidden;
	clear: both;
}
ul.gallery li {
	width: 211px;
	padding: 0;
	margin: 0 15px 25px 0;
	display: inline-block;
	position: relative;
	vertical-align: top;
}

ul.gallery li a {
	display:block;
}
ul.gallery li a span.thumb {
	display:block;
	text-align:center;
	background:#eeeeee;
	width:209px;
	height:118px;
	border:#e2e2e2 solid 1px;
	margin-bottom:15px;
}
ul.gallery li a span.thumb img {
	border:none;
	margin-bottom:0;
	width: 209px;
	height: 118px;
}
ul.gallery li a img {
	border:#e2e2e2 solid 1px;
	display:block;
	margin-bottom:15px;
}
ul.gallery li p {
	line-height:1.2em;
	margin-top:5px;
}
ul.gallery li p.date {
	margin: 2px 0 10px;
}

ul.gallery li span.play {
	background:url(../img/icons/play.png) top left no-repeat;
	width:36px;
	height:31px;
	display:block;
	position:absolute;
	top:65px;
	left:88px;
}

/* error pages */
body.error h1 {
	margin: 0 0 20px;
}
.error div.message {
	background: url(../img/icons/error.gif) top left no-repeat;
	padding-left: 71px;
	min-height: 400px;
}
.error div.message a {
	padding-left: 10px;
	background: url(../img/icons/right-link-arrow.png) no-repeat 0 5px;
}
.error div.message p.mid {
	padding:10px 0;
}

.js-only {
	display: none;
}

/****************************************************************************
 *  Existing customer
 ****************************************************************************/

.removeExistingCustomer {
	float: right;
	position: relative;
	top: 10px;
	right: 12px;
}

/****************************************************************************
 *  Video panel
 ****************************************************************************/
.videoPanel {
	-border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	background-color: #EFEFEF;
	border: 1px solid #CCC;
	margin: 23px 0 20px;
	padding: 10px;
}

/* --------------------------------------------------------------------------------------------------- */
/* --- Button Div --- */
/* --------------------------------------------------------------------------------------------------- */
.btnDiv {
	overflow: auto;
	padding-bottom: 20px;
}
.btnDiv a.button {
	margin-right: 20px;
}
/* --------------------------------------------------------------------------------------------------- */
/* --- tab panels --- */
/* --------------------------------------------------------------------------------------------------- */

.content div.tabPanel {
	padding: 0;
}
/* --------------------------------------------------------------------------------------------------- */
/* --- Tab Hero Panel --- */
/* --------------------------------------------------------------------------------------------------- */
.tabHeroPanel {
	margin: 0;
	padding: 0;
	width: 918px;
}

.tabHeroPanel .header {
	margin: -32px 0 0;
	padding: 0;
	position: relative;
	width: 100%;
	background: transparent url(../img/layout/tab/top.png) center top no-repeat;
}

.tabHeroPanel .content {
	padding: 0;
	margin: 0;
	width: 918px;
	background: transparent url(../img/layout/tab/repeater.gif) 0 0 repeat-y;
	overflow: hidden;
}
.sideColumn .content {
	background-image: url(../img/layout/tab/repeater_grey.gif);
}

.tabHeroPanel .footer {
	height: 20px;
	background: transparent url(../img/layout/tab/corners.gif) 0 bottom no-repeat;
}
.sideColumn .footer {
	background-image: url(../img/layout/tab/corners_grey.gif);
}

.modHeroBanner .buttonContainer {
	position: absolute;
	top: 125px;
	left: 18px;
}

.modHeroBanner .buttonContainer .button {
	position: static;
	bottom: auto;
	left: auto;
	clear: both;
}

.tabHeroPanel .header ul {
	background: transparent url(../img/layout/tab/corners.gif) 0 48px no-repeat;
	border-style: none;
	text-align: center;
	padding: 0 0 5px;
	margin: 0;
	list-style: none;
	overflow: hidden;
	height: 55px;
}
.sideColumn .header ul {
	background-image: url(../img/layout/tab/corners_grey.gif);
}

.tabHeroPanel .header li {
	margin:  0;
	text-align: left;
	list-style: none;
	display: inline-block;
	background: transparent url(../img/layout/tab/border.gif) 0 15px no-repeat;
	float: none;
}

.tabHeroPanel .header li.first {
	background: none;
}

.tabHeroPanel .header li a {
	text-decoration: none;
	margin: 0 ;
	padding: 18px 17px 32px;
}

.tabHeroPanel .header .selected a {
	font-weight: bold;
	display: block;
	background: transparent url(../img/layout/tab/notch.gif) center 48px no-repeat;
}

.columnHeader .product p {
	margin-right: 0;
}

.tabHeroPanel .features .additonalPrice {
	clear: both;
	overflow: hidden;
	margin: 0 0 20px 102px;
}

.tabHeroPanel .features .additonalPrice p {
	margin: 0 0 10px;
}

.tabHeroPanel .product p strong {
	display: block;
}

.tabHeroPanel .header p {
	display: none;
}

.tabHeroPanel h2 {
	margin-left: 30px;
}

.tabHeroPanel .backToTop {
	width: 615px;
	border-top: 1px solid #E5E5E5;
	margin: 20px 30px 0;
	position: relative;
	clear: both;
}

.tabHeroPanel .backToTop a {
	background: white url(../img/icons/up-link-arrow.gif) 5px 8px no-repeat;
	position: absolute;
	padding: 0 10px 0 20px;
	right: 0;
	top: -12px;
}

.tabHeroPanel .sideColumnPanel {
	float: left;
	width: 195px;
	margin-left: 20px;
}

.tabHeroPanel .sideColumnPanel .bulletedList {
	margin-left: 6px;
}

.tabHeroPanel .sideColumnPanel .bulletedList li {
	padding-left: 17px;
	background-position: 0 0.45em;
}

.tabHeroPanel .sideColumnPanel .additionProduct {
	clear: both;
	overflow: hidden;
}

.tabHeroPanel .sideColumnPanel .altLinks li {
	padding: 0 0 20px 12px;
	background-position: 0 .6em;
}

.tabHeroPanel .sideColumnPanel .altLinks {
	margin-bottom: -12px;
}
.tabHeroPanel .sideColumnPanel li a {
	display: block;
}

.sideColumnPanel .inPageHelp ul li {
	padding: 3px 0;
}

.sideColumnPanel .inPageHelp .external{
	margin-top: 10px;
}

.sideColumnPanel .inPageHelp li a.action {
	padding: 0 0 0 11px;
	background-position: 0 .5em;
}

.sideColumnPanel a.btnCall {
	 margin: 20px 0 30px;
}

.tabHeroPanel .mainColumn {
	float: left;
	margin: 0;
	padding: 0;
	width: 915px;
}
.sideColumn .mainColumn {
	width: 675px;
}
.tabHeroPanel .column1,
.tabHeroPanel .column2 {
	float: left;
	width: 390px;
	margin:  0;
	padding: 0 ;
}

.sideColumn .column1,
.sideColumn .column2 {
	width: 325px;
}
.preApplication {
	float: left;
	padding-top: 0;
	margin: 0 0 20px;
}

.tabHeroPanel .preApplication .firstColumn,
.tabHeroPanel .preApplication .secondColumn,
.tabHeroPanel .preApplication .thirdColumn {
	float: left;
	padding: 0 30px;
}

.tabHeroPanel .preApplication .firstColumn {
	padding-left: 0;
	width: 272px;
}

.tabHeroPanel .preApplication .secondColumn {
	border-left: 1px solid #e2e2e2;
	border-right: 1px solid #e2e2e2;
	padding: 0 29px;
	width: 245px;
}

.tabHeroPanel .preApplication .thirdColumn {
	padding-right: 30px;
	width: 245px;
}

.tabHeroPanel .firstColumn .tick {
	margin: 10px 0 0 30px;
}
.tabHeroPanel .preApplication h3 {
	margin: 0;
}
.tabHeroPanel .preApplication .firstColumn h3 {
	margin: 0 0 0 50px;
}
.tabHeroPanel .preApplication .secondColumn .btnCall {
	margin-top: 5px;
}

.tabHeroPanel .preApplication ol {
	margin: 18px 0 8px 20px;
}
.tabHeroPanel .preApplication h3 span {
	margin-left: -20px;
}
.tabHeroPanel .preApplication p {
	margin: 10px 0;
}

.tabHeroPanel .columnFooter,
.tabHeroPanel .columnHeader {
	width: 915px;
	clear: both;
	/*float: left;*/
	margin: 20px 0 0;
	padding: 35px 0 10px;
	border-top: 1px solid #e2e2e2;
}

.tabHeroPanel .columnFooter {
	padding: 35px 30px 10px;
	width: 860px;
}

.tabHeroPanel .columnFooter h2 {
	margin-top: -10px;
	margin-left: 0;
}

/*.sideColumn .altProduct,*/
.sideColumn .columnHeader {
	width: 675px;
}

.sideColumn .columnFooter {
	width: 615px;
}
.tabHeroPanel .columnHeader {
	border-top: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	float: left;
}
.tabHeroPanel .columnFooter .button {
	clear: both;
	margin-bottom: 10px;
}

.tabHeroPanel .product {
	margin: 0 15px 0 0;
	float: left;
	width: 150px;
}
.tabHeroPanel .branding {
	padding:  0 0 0 20px;
	margin: 0;
	float: left;
	width: 140px;
	border-left: 1px solid #e2e2e2;
}
.tabHeroPanel .branding p {
	margin: 3px 0 10px;
}
.tabHeroPanel .description {
	margin: 0 20px 0 0;
	width: 490px;
}
.tabHeroPanel .columnHeader .description {  	
	float: left;
}
.tabHeroPanel .proDescription {
	margin: 0 20px 0 0;
	float: left;
	width: 490px;
}

.tabHeroPanel .description p {
	margin: 5px 10px 0 30px;
}
.tabHeroPanel .columnFooter .description p,
.tabHeroPanel .columnFooter p.description  {
	margin-top: 0;
	clear: both;
	width: 100%;
}
.tabHeroPanel .description .btnSmall {
	margin-top: 20px;
}

.tabHeroPanel h3 {
	margin: 15px 30px;
}

.tabHeroPanel .product img {
	margin: 0 0 0 30px;
}

.tabHeroPanel .sideColumnPanel h3 {
	margin: 15px 0;
}

.tabHeroPanel ul.bulletedList,
.tabHeroPanel .tick {
	margin: 0 0 20px 70px;
}

.tabHeroPanel ul.bulletedList li
{
	background: transparent url(../img/icons/bullets.gif) no-repeat 35px .4em;
	padding: 3px 0 3px 55px;
}

.tabHeroPanel .linkList {
	clear: both;
	padding: 2px 0 0;
	width: 655px
}

.tabHeroPanel .proDescription .linkList {
	width: 490px;
}

.tabHeroPanel .linkList li {
	display: inline;
	margin: 0 0 20px 30px;
	padding-left: 10px;
	background-position: 0 .6em;
}

.tabHeroPanel .proDescription .linkList li  {
  margin: 0 30px 5px 0;
}

.tabHeroPanel .proDescription h3,
.tabHeroPanel .description h3 {
	margin: 0 0 9px 0;
}

.tabHeroPanel .proDescription p {
	margin: 0 0 6px;
}

.tabHeroPanel .feature h4,
.tabHeroPanel h4 {
	margin: 0;
	padding: 0;
	clear: both;
	overflow: hidden;
}
.tabHeroPanel h4 {
	padding: 10px 0 10px 30px;
}

.tabHeroPanel p {
	margin: 10px 30px;
}

.tabHeroPanel .columnFooter p {
	margin: 10px 30px;
}

.tabHeroPanel .sideColumnPanel p {
	margin: 10px 0;   	
}

.tabHeroPanel .features p {
	margin: 0 0 30px;
}
.tabHeroPanel .feature p {
	margin: 0 0 10px;
}

.tabHeroPanel .note {
	line-height: 1.4em;
}

.tabHeroPanel .features {
	clear: both;
}

.tabHeroPanel .feature {
	padding-left: 70px;
	/*overflow: hidden;*/
	margin: 0 30px 20px 20px;
}
.tabHeroPanel .feature div {
	float: left;
	width: 65px;
	margin-right: 10px;
}

.tabHeroPanel .feature div span {
	display: block;
}
.tabHeroPanel .linkContainer a.button {
	margin: 0 10px 10px 0;
}
.features h3 {
	padding: 15px 30px 0;
	margin: 15px 0 1.6em;
}

.tabHeroPanel .columnFooter .linkContainer {
	clear: both;
	padding-top: 10px;
}

.tabHeroPanel .columnFooter .multiplyButtonContainer {
	margin: 15px 0 60px;
}
.tabHeroPanel .columnFooter .multiplyButtonContainer a.button {
	margin-right: 20px;
}
.tabHeroPanel .columnFooter p,
.tabHeroPanel .columnFooter .description {
	margin-left: 0;
 }

 .sideColumn .columnFooter .description {
	width: 615px;
 }

.tabHeroPanel .columnFooter a.pdfLink {
	background-position: -2px 4px;
	padding-top: 5px;
 }
.tabHeroPanel .columnFooter ul {
	clear: both;
	margin: 0 30px 0 0;
}

.tabHeroPanel div.getPdf {
	border-top: 1px solid #e2e2e2;
	overflow: hidden;
	padding: 20px 0 0;
	margin-top:20px;
	width: 675px;
	clear: both;
}

.contactDetails p.extraInfo {
	margin: 0 0 6px;
}
.sideColumnPanel .tel2 span {
	display: block;
}

/* --------------------------------------------------------------------------------------------------- */
/* --- Stacked tabbed content --- */
/* --------------------------------------------------------------------------------------------------- */

.stackedTabs .header {
	border-bottom: 1px solid #ccc;
}
.stackedTabs .content {
	border-bottom:1px solid #ccc;
	border-left:1px solid #ccc;
	border-right:1px solid #ccc;
}

.stackedTabs .content p {
	margin-top: 0;
}

.stackedTabs table {
	width: auto;
	margin: 0 auto .85em 0;
}

.stackedTabs table th,
.stackedTabs table td{
	background: none;
	border: none;
	text-align: left;
	padding: 0 20px 0.4em 0;
	vertical-align: top;
}

.stackedTabs .content h2
{
	padding-top: 0;
	margin-top: -7px;
}

.stackedTabs .content h3
{
	margin: 0;
}

.stackedTabs .content h3 a {
	padding-bottom: .3em;
}

.stackedTabs .content h3 a.pdf {
	text-transform: capitalize;
}

.stackedTabs .content p {
	margin-bottom: 1.25em;
}

.stackedTabs .content p.tel1 {
	margin-bottom: .15em;
}

.stackedTabs .content p.small {
	margin-bottom: .5em;
}

.stackedTabs ol {
	margin-left: 30px;
}
.stackedTabs li {
	margin-bottom: 10px;
}

.stackedTabs .content ul {
	list-style-type: none;
	padding: 0;
	margin-left: 0;
	margin-top: 0;
}

.stackedTabs .content ul li {
	background: transparent url(../img/icons/bullets.gif) no-repeat scroll 0 0.3em;
	padding: 3px 0 3px 18px;
	margin: 0 0 0 8px;
}

.stackedTabs .content .button {
	margin-top: .3em;
}

/* --------------------------------------------------------------------------------------------------- */
/* --- Image Panel --- */
/* --------------------------------------------------------------------------------------------------- */
.content .imagePanel {
	overflow: auto;
	margin-top: 10px;
}
.content .imagePanel img {
	float: left;
	margin: 10px 20px 10px 0;
	border: 1px solid #e2e2e2;
	width: 187px;
	height: 115px;
	overflow: hidden;
}
.content .imagePanel p {
	margin: 10px 0 10px 215px;
}

.lightbox img {
	border: 1px solid #e2e2e2;
}
/* --------------------------------------------------------------------------------------------------- */
/* --- Image Hero --- */
/* --------------------------------------------------------------------------------------------------- */

img.hero {
	margin: 0 0 1.5em -6px;
}
.genInfo img.hero {
	margin-left: 0;
}

/* --------------------------------------------------------------------------------------------------- */
/* --- New window --- */
/* --------------------------------------------------------------------------------------------------- */

span.newWindowTitle {
	position:absolute;
	left:-500em;
}

/* --------------------------------------------------------------------------------------------------- */
/* --- Product comparison table --- */
/* --------------------------------------------------------------------------------------------------- */

#barclaycardCompare p {
	margin-bottom: 1.5em;
	color: #333;
	background: transparent url(../img/icons/error.gif) no-repeat 0 0;
	padding: 14px 0 16px 58px;
}

#comparisonTable {
	padding: 30px 25px 0 22px;
	margin: 0 0 0 -22px;
	width: 913px;
	overflow-x: scroll;
	clear: both;
	border-top: 1px solid #dcdcdc;
}

#comparisonTable table {
	border-collapse: collapse;
	width: 100%;
}

.stripe {
	background-color: #f0f0f0;
}

#comparisonTable img {
	margin-bottom: 0.3em;
}

#comparisonTable th,
#comparisonTable td {
	padding: 0.95em 14px;
	border-left: 1px solid #dcdcdc;
	vertical-align: top;   	
}

#comparisonTable td {
	width: 167px;
}

#comparisonTable th.first {
	width: 101px;
}

#comparisonTable th {
	font-weight: bold;
	border: none;
	text-align: right;
}

#comparisonTable thead th,
#comparisonTable thead td {
	font-weight: normal;
	border: none;
	text-align: left;
	height: 113px;
	padding-bottom: 0;
}

#comparisonTable thead th.first {
	width: auto;
}

#comparisonTable tr.apr td strong {
	display: block;
}

#comparisonTable thead th {
	padding-top: 0;
}

#comparisonTable thead th div {
	position: relative;
}

#comparisonTable thead th.empty {
	background: transparent url(../img/product/comparison/empty-card.gif) no-repeat 14px 0;
	padding-bottom: 0;
}

#comparisonTable thead th a.close {
	background: transparent url(../img/product/comparison/close-button.gif) no-repeat 0 0;
	display: block;
	position: absolute;
	width: 21px;
	height: 21px;
	top: 0;
	right: 0;
	text-decoration: none;
}

#comparisonTable .aboutTheCardHD div {
	height: 54px;
}

#comparisonTable .cardHD div,
#comparisonTable .balanceTransferHD div,
#comparisonTable .purchaseHD div,
#comparisonTable .creditRatingHD div {
	height: 36px;
}

#comparisonTable .aprHD div {
	height: 42px;
}

#comparisonTable .tellMeMoreHD div {
	height: 26px;
}

/* --------------------------------------------------------------------------------------------------- */
/* --- PDF --- */
/* --------------------------------------------------------------------------------------------------- */

.pdfLink, .getPdf  {
	margin-bottom: 15px;
}
.pdfLink a,
a.pdfLink,	
.getPdf a  {
	background: transparent url(../img/icons/pdf.gif) no-repeat -2px 0;
	padding: 2px 0 7px 28px;
}
.getPdf a {
	background-image: url(../img/icons/get_acrobat_reader.gif);
}
.pdfLink span {
	color: #666;
}
/* --------------------------------------------------------------------------------------------------- */
/* --- Contact Additional Info --- */
/* --------------------------------------------------------------------------------------------------- */
.contactAdditionalInfo {
	background: white url(../img/layout/additonal/header.gif) no-repeat 0 0;
	overflow: hidden;
	margin: 0 -8px 12px -7px;
	padding: 20px 0;
	border-bottom: 1px solid #d2d2d2;
}
.contactAdditionalInfo p {
	padding-left: 50px;
	margin: 10px 0 10px -2px;
}
.contactAdditionalInfo .bd {
	border-left: 1px solid #d2d2d2;
	border-right: 1px solid #d2d2d2;
	overflow: hidden;
	background: white url(../img/layout/additonal/repeater.gif) repeat-x bottom left;
}
.contactAdditionalInfo .ft {
	background: transparent url(../img/layout/additonal/bottom.gif) no-repeat bottom center;
	height: 20px;
}
.contactAdditionalInfo .bd div {
	width: 195px;
	float: left;
	margin-left: 15px;
	padding-right: 10px;
	border-right: 1px solid #d2d2d2;
}
.contactAdditionalInfo .bd .last {
	border: 0;
	padding-right: 0;
}
.contactAdditionalInfo h3 {
	 margin: 0;
}
.features {
	clear: both;
	overflow: hidden;
}
.feature p.tel1 {
	margin: 0 0 5px;
}

.feature p.tel2 span {
	display: block;
}

.column1,
.column2 {
	float: left;
	width: 310px;
	margin:  0;
	padding: 0;                           
}

.column2 {
	margin-left: 20px;
}

/* --------------------------------------------------------------------------------------------------- */
/* --- Contact Details & Popup Tables --- */
/* --------------------------------------------------------------------------------------------------- */

.contactDetails {
	border-spacing: 0;
	margin: 10px 0 0 -5px;
	background: #fff;
	width: 649px;
}

.contactDetails th,
.contactDetails td {
	padding: 8px 15px;
	border-left: 1px solid #fff;
	border-right: 1px solid #d4d4d4;
	vertical-align: top;
}

.contactDetails  th.lt {
	text-align: left;
	border-left: 0;
	width: 325px;
	background: url(../img/layout/table/header-white.gif) no-repeat 0 0;
}

.contactDetails  td.rt {
	border-right: 0;
	background: url(../img/layout/table/header-white.gif) no-repeat top right;
}
.contactDetails th {
	text-align: left;
	margin-left: -1px;
	border-left: 1px solid #d4d4d4;
}

.contactDetails .bottom td  {
	border-bottom: 0;
	background: url(../img/layout/table/bottom.gif) no-repeat bottom center;
}
.contactDetails th.lb,
.contactDetails td.lb {
	padding-bottom: 15px;
	border-left: 0;
	border-bottom: 0;
	background: url(../img/layout/table/bottom.gif) no-repeat bottom left;
}

.contactDetails .bottom th,
.contactDetails .bottom td.rb {
	padding-bottom: 9px;
}

.contactDetails td.rb {
	padding-bottom: 15px;
	border-right: 0;
	background: url(../img/layout/table/bottom_white.gif) no-repeat bottom right;
}
.contactDetails .stripe.bottom td  {
	background: url(../img/layout/table/bottom_white.gif) no-repeat bottom center;
}
.contactDetails .stripe.bottom th.lb {
	background: url(../img/layout/table/bottom_grey.gif) no-repeat bottom left;
}
.contactDetails .stripe.bottom td.rb {
	background: url(../img/layout/table/bottom_grey.gif) no-repeat bottom right;
}
.contactDetails p {
	margin: 0;	
}
.contactDetails span,
.contactDetails a {
	display: block;
}

/* --------------------------------------------------------------------------------------------------- */
/* --- Product slider (Fallback HTML) --- */
/* --------------------------------------------------------------------------------------------------- */

#productSlider {
	margin-top: 20px;
	margin-left: 18px;
}

#productSlider h1,
#protectInsure h1 {
	margin-bottom: 30px;
	margin-left: -2px;
}
#protectInsure {
	margin-left: 18px;
	margin-top: 20px;
}

.creditRatingsLabels,
.sliderLabels {
	display: none;
}

.overlay {
	width: 605px;                               
	background: #eee url(../img/layout/background-shell/overlay_panel_bottom_32.png) no-repeat scroll 0 bottom;
	margin-bottom: 1.9em;
	background-image: none;
}

.overlay { 
	background-image: -moz-linear-gradient(top, bottom,from(#ffffff),to(#e6e6e6)); 
 	background-image: -webkit-gradient(linear, left top, left bottom,color-stop(0.00, #ffffff),color-stop(1.00, #e6e6e6)); 
	border: 1px solid #c2c2c2;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-box-shadow: 2px 2px 2px #ccc;
	-moz-box-shadow: 2px 2px 2px #ccc;
}

#protectInsure .overlay {
	width: 615px;
	margin-left: -18px;
}

.overlayInner {
	background: transparent url(../img/layout/background-shell/overlay_panel_top_32.png) no-repeat scroll 0 0;
	padding: 2px 3px 1px 3px;
	position: relative;
	top: -6px;
	overflow: hidden;
	margin-top: 6px;
}

.overlayInner {
	background-image: none;
}

.overlayHeader {
	float: left;
	width: 120px;
	padding: 20px;
}

#protectInsure .overlayHeader {
	width: 300px;
	padding: 20px 10px;	
}
.overlayHeader p,
.overlayHeader h2,
.overlayHeader h4 {
	display: none;
}

.overlayHeader p,
.overlayHeader h4,
.overlayHeader h2 {
	line-height: 1.2;
	margin-bottom: 4px;
}

.overlayHeader p {
	margin-bottom: auto;
}

.overlayBody {
	padding: 20px 20px 16px 0;
	width: 419px;
	overflow: hidden;
	float: left;
}

#protectInsure .overlayBody {
	padding: 20px 10px 16px 8px;
	width: 270px;
}

.overlayBody h2 {
	margin-top: 0;
	margin-bottom: 0.35em;
}

.overlayBody ul {
	margin: 0 0 13px 17px;
	padding-left: 0;
	list-style-type: none;
}

#protectInsure .overlayBody ul {
	margin: 0 0 13px;    	
}

.overlayBody ul li {
	background: transparent url(../img/icons/tick.png) no-repeat scroll 0 0.35em;
	margin-bottom: 2px;
	padding: 3px 0 3px 29px;
}

.overlayBody p {
	margin-bottom: .65em;
	line-height: 1.25em;
}

.overlayBody a.button {
	margin-right: 18px;
	display: inline;
}

#protectInsure .overlayBody a.button {
	margin-left:28px;
}

/* --------------------------------------------------------------------------------------------------- */
/* --- MyBarclaycard misc --- */
/* --------------------------------------------------------------------------------------------------- */

.myBarclaycard {
	overflow: hidden;
	margin: 30px 0 0 6px;
	padding-bottom: 28px;
	border-bottom: 1px solid #e2e2e2;
}

.myBarclaycard h2 {
	margin-bottom: 0.45em;
}

.myBarclaycard .secondaryContent {
	float: left;
	width: 274px;
	margin-right: 34px;
}

.myBarclaycard .secondaryContent h2 {
	margin-top: 0;
}

.myBarclaycard .secondaryContent img {
	margin-top: 1em;
}

.myBarclaycard .demoLaunchpad {
	background: transparent url(../img/content/mybarclaycard/demo-placeholder.jpg) no-repeat 0 16px;
	width: 274px;
	height: 222px;
	position: relative;
}

.myBarclaycard .demoLinks {
	width: 220px;
	height: 80px;
	position: absolute;
	top: 122px;
	left: 20px;
	padding: 13px 0 13px 14px;
}

.myBarclaycard .demoLinks .videoLightboxLauncher {
	float: left;
}

.myBarclaycard .demoLinks a {
	display: block;
	background: transparent url(../img/icons/playbutton.gif) no-repeat 0 0;
	padding: 1px 0 2px 32px;
	margin-bottom: 9px;
}

.myBarclaycard .primaryContent {
	width: 589px;
	float: left;
}

.myBarclaycard .registerAside {
	overflow: hidden;
	padding: 18px 0 19px;
	background-image: -moz-linear-gradient(top, bottom,from(#ffffff),to(#f5f5f5)); 
	margin-bottom: 1.1em;
	background: #fafafa url(../img/layout/module/mybarclaycardregister.png) no-repeat 0 0;
 	margin-left: -1px;
}

.myBarclaycard .registerAside h2 {
	margin-top: 0;
}

.myBarclaycard .alreadyRegistered,
.myBarclaycard .registerToday {
	float: left;
	width: 295px;
}

.myBarclaycard .registerToday {
	width: 290px;
}

.myBarclaycard .registerAside .inner {
	padding: 0 20px;
	overflow: hidden;
}

.myBarclaycard .registerToday .inner {
	border-left: 1px solid #d1d1d1;
}

.myBarclaycard .registerAside .button {
	margin-top: 0.9em;
}

.myBarclaycard .customerQuote {
	background: transparent url(../img/layout/module/quotebubble.gif) no-repeat 0 32px;
	margin-left: 0;
	position: relative;
	left: -16px;
	width: 603px;
}
.myBarclaycard .benefits h2,
.myBarclaycard .customerQuote h2 {
	margin: 0 0 0 16px;
}

.myBarclaycard .customerQuote div {
	padding: 32px 20px 16px 60px;
	background: transparent url(../img/icons/bluequotes.png) no-repeat 38px 33px;  	
}

.myBarclaycard .customerQuote blockquote {
	margin: 0 0 0.7em;
	display: block;
	line-height: 1.35em;
}

.myBarclaycard .customerQuote blockquote span {
	width: 15px;
	height: 11px;
	background: transparent url(../img/icons/bluequotes.png) no-repeat 0 bottom;
	margin: 0 0 4px 4px;
	display: inline-block;
}

.myBarclaycard .customerQuote cite {
	display: block;
}

.myBarclaycard .benefits .tick {
	margin: 10px 0 0 20px;
}

.screenshots {
	margin: 0 0 30px 6px;
	padding: 0 0 20px;
	overflow: hidden;
	border-bottom: 1px solid #E2E2E2;
}

.screenshots h2 {
	margin-top: 1.7em;
	margin-bottom: 0.2em;
}

.screenshots h3 {
	margin-bottom: 0.6em;
}

.screenshots img {
	margin-top: 0.85em;
}

.screenshots div {
	width: 272px;
	float: left;
	padding: 0 19px;
	border-left: 1px solid #e2e2e2;
}

.screenshots .first {
	padding-left: 0;
	border: none;
}

.screenshots .last {
	padding-right: 0;
}

.mybarclaycardStatus {
	margin: 20px 9px 0;
}

.mybarclaycardStatus p {
	background: transparent url(../img/icons/confirmation-tick.gif) no-repeat 0 0;
	padding-left: 59px;
	padding-top: 13px;
	height: 35px;
	width: 500px;
	float: left;
}
.mybarclaycardStatus p strong {
	position: relative;
}

.mybarclaycardStatus div {
	float: right;
	margin-top: 15px;
}

.mybarclaycardStatus div p {
	background: none;
	width: auto;
	display: inline;
	padding: 0;
	height: auto;
	margin: 2px 12px 0 0;
}
/* --------------------------------------------------------------------------------------------------- */
/* --- Error Pages --- */
/* --------------------------------------------------------------------------------------------------- */
.errorPanel {
	min-height: 500px;
}
.errorPanel .alert {
	background: transparent url(../img/icons/error.gif) no-repeat scroll 0 0;
	padding: 0 71px 0 75px;
}

.errorPanel h1 {
	margin: 25px 0;
}

.errorPanel p {
	margin: 8px 0;
}

.errorPanel .link ul {
	padding: 0 0 20px;
}

.errorPanel .link li {
	padding: 3px 0 3px 14px;
}

/* --------------------------------------------------------------------------------------------------- */
/* --- Feature --- */
/* --------------------------------------------------------------------------------------------------- */

.feature {
	margin: 0 0 20px;
	min-height: 54px;
	padding-left: 70px;
}
/* --------------------------------------------------------------------------------------------------- */
/* --- Icon --- */
/* --------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------- */
/* --- 50x50 --- */
/* --------------------------------------------------------------------------------------------------- */
.pie-chart {
	background: url(../img/icons/50x50/pie-chart.png) no-repeat 0 0;
}
.shopping-bags {
	background: url(../img/icons/50x50/shopping-bags.png) no-repeat 0 6px;
}
.statement-card {
	background: url(../img/icons/50x50/statement-card.png) no-repeat 0 6px;
}
.mouse {
	background: url(../img/icons/50x50/mouse.png) no-repeat 0 0;
}
.padlock {
	background: url(../img/icons/50x50/padlock.png) no-repeat 0 0;
}
.card-helmet {
	background: url(../img/icons/50x50/card-helmet.png) no-repeat 0 2px;
}
.card-padlock {
	background: url(../img/icons/50x50/card-padlock.png) no-repeat 0 2px;
}
.green-car {
	background: url(../img/icons/50x50/green-car.png) no-repeat 0 0;
}
.man-padlock {
	background: url(../img/icons/50x50/man-padlock.png) no-repeat 0 4px;
}
.coin-stack-transfer {
	background: url(../img/icons/50x50/coin-stack-transfer.png) no-repeat 0 0;
}
.globe {
	background: url(../img/icons/50x50/globe.png) no-repeat 0 2px;
}
.mobile {
	background: url(../img/icons/50x50/mobile.png) no-repeat 0 4px;
}
.chip-pin-terminal {
	background: url(../img/icons/50x50/chip-pin-terminal.png) no-repeat 0 2px;
}
.leisure-man-suitcase {
	background: url(../img/icons/50x50/leisure-man-suitcase.png) no-repeat 0 2px;
}
.business-man-suitcase {
	background: url(../img/icons/50x50/business-man-suitcase.png) no-repeat 0 0;
}
.airplane {
	background: url(../img/icons/50x50/airplane.png) no-repeat 0 2px;
}
.card {
	background: url(../img/icons/50x50/card.png) no-repeat 0 0;
}
.cash {
	background: url(../img/icons/50x50/cash.png) no-repeat 0 0;
}
.green-tree {
	background: url(../img/icons/50x50/green-tree.png) no-repeat 0 4px;
}
.green-leaf {
	background: url(../img/icons/50x50/green-leaf.png) no-repeat 0 0;
}
.timer {
	background: url(../img/icons/50x50/timer.png) no-repeat 0 2px;
}
.contactless {
	background: url(../img/icons/50x50/contactless.png) no-repeat 0 0;
}
.coin-stack{
	background: url(../img/icons/50x50/coin-stack.png) no-repeat 0 2px;
}
.business-man-card {
	background: url(../img/icons/50x50/business-man-card.png) no-repeat 0 2px;
}
.woman-customer-service {
	background: url(../img/icons/50x50/woman-customer-service.png) no-repeat 0 2px;
}
.grey-star {
	background: url(../img/icons/50x50/grey-star.png) no-repeat 0 2px;
}
.statement {
	background: url(../img/icons/50x50/statement.png) no-repeat 0 0;
}
.document-folder {
	background: url(../img/icons/50x50/document-folder.png) no-repeat 0 0;
}
.card-flexible-payment {
	background: url(../img/icons/50x50/card-paying-from.png) no-repeat 0 0;
}
.calendar {
	background: url(../img/icons/50x50/calendar.png) no-repeat 0 0;
}
.two-cards-grey {
	background: url(../img/icons/50x50/two-cards-grey.png) no-repeat 0 0;
}
.three-people-team {
	background: url(../img/icons/50x50/three-people-team.png) no-repeat 0 0;
}
.businessman-card-alert {
	background: url(../img/icons/50x50/businessman-card-alert.png) no-repeat 0 2px;
}
.envelope-receiver {
	background: url(../img/icons/50x50/envelope-receiver.png) no-repeat 0 2px;
}
.keys {
	background: url(../img/icons/50x50/keys.png) no-repeat 0 4px;
}
.helmet {
	background: url(../img/icons/50x50/helmet.png) no-repeat 0 4px;
}
.man-card {
	background: url(../img/icons/50x50/man-card.png) no-repeat 0 0;
}
.safety-box {
	background: url(../img/icons/50x50/safety-box.png) no-repeat 0 0;
}
.suitcase-padlock {
	background: url(../img/icons/50x50/suitcase-padlock.png) no-repeat 0 2px;
}
.two-cards-grey-blue {
	background: url(../img/icons/50x50/two-cards-grey-blue.png) no-repeat 0 2px;
}
.business-man-blocked{
	background: url(../img/icons/50x50/business-man-blocked.png) no-repeat 0 2px;
}
.woman-padlock {
	background: url(../img/icons/50x50/woman-padlock.png) no-repeat 0 4px;
}
.telephone-receiver-large {
	background: url(../img/icons/50x50/telephone-receiver.png) no-repeat 0 0;
}
.house {
	background: url(../img/icons/50x50/house.png) no-repeat 0 2px;
}
.couple {
	background: url(../img/icons/50x50/couple.png) no-repeat 0 2px;
}
.four-people {
	background: url(../img/icons/50x50/four-people.png) no-repeat 0 4px;
}
.man-children {
	background: url(../img/icons/50x50/man-children.png) no-repeat 0 4px;
}
.thomas-cook {
	background: url(../img/icons/50x50/thomas-cook.png) no-repeat 0 4px;
}
.price-tag {
	background: url(../img/icons/50x50/price-tag.png) no-repeat 0 4px;
}
.green-medical-heart {
	background: url(../img/icons/50x50/green-medical-heart.png) no-repeat 0 0;
}
.blue-ribbon {
	background: url(../img/icons/50x50/blue-ribbon.png) no-repeat 0 4px;
}
.square-academic-cap {
	background: url(../img/icons/50x50/square-academic-cap.png) no-repeat 0 0;
}
.green-cross {
	background: url(../img/icons/50x50/green-cross.png) no-repeat 0 0;
}
.green-rosette{
	background: url(../img/icons/50x50/green-rosette.png) no-repeat 0 4px;
}
.blue-rosette {
	background: url(../img/icons/50x50/blue-rosette.png) no-repeat 0 4px;
}
.megaphone {
	background: url(../img/icons/50x50/megaphone.png) no-repeat 0 4px;
}
.open-sign {
	background: url(../img/icons/50x50/open-sign.png) no-repeat 0 0;
}
.direct-debit {
	background: url(../img/icons/50x50/direct-debit.png) no-repeat 0 0;
}
.suitcase {
	background: url(../img/icons/50x50/suitcase.png) no-repeat 0 0;
}
.small-business {
	background: url(../img/icons/50x50/small-business.png) no-repeat 0 0;
}
.medium-business {
	background: url(../img/icons/50x50/medium-business.png) no-repeat 0 4px;
}
.public-building {
	background: url(../img/icons/50x50/public-building.png) no-repeat 0 0;
}
.email {
	background: url(../img/icons/50x50/email.png) no-repeat 0 0;
}
.envelope {
	background: url(../img/icons/50x50/envelope.png) no-repeat 0 0;
}
.question-answer-bubbles {
	background: url(../img/icons/50x50/question-answer-bubbles.png) no-repeat 0 0;
}
.pin {
	background: url(../img/icons/50x50/pin.png) no-repeat 0 0;
}
.questionnaire-pen {
	background: url(../img/icons/50x50/questionnaire-pen.png) no-repeat 0 2px;
}
.card-credit-limit {
	background: url(../img/icons/50x50/card-credit-limit.png) no-repeat 0 4px;
}
.cards-compare {
	background: url(../img/icons/50x50/cards-compare.png) no-repeat 0 4px;
}
.polaroid-photo {
	background: url(../img/icons/50x50/polaroid-photo.png) no-repeat 0 4px;
}
.secure-message {
	background: url(../img/icons/50x50/secure-message.png) no-repeat 0 0;
}
.address-book {
	background: url(../img/icons/50x50/address-book.png) no-repeat 0 0;
}
.statement-envelope {
	background: url(../img/icons/50x50/statement-envelope.png) no-repeat 0 0;
}
.coins-slot {
	background: url(../img/icons/50x50/coins-slot.png) no-repeat 0 0;
}
.card-paying {
	background: url(../img/icons/50x50/card-paying.png) no-repeat 0 0;
}
.safety-box-arrow {
	background: url(../img/icons/50x50/safety-box-arrow.png) no-repeat 0 0;
}
.cancellation-reference {
	background: url(../img/icons/50x50/cancellation-reference.png) no-repeat 0 0;
}
.statement-download {
	background: url(../img/icons/50x50/statement-download.png) no-repeat 0 0;
}
.light-bulb {
	background: url(../img/icons/50x50/light-bulb.png) no-repeat 0 0;
}
.chequebook-pen {
	background: url(../img/icons/50x50/chequebook-pen.png) no-repeat 0 0;
}
.coin-stack-transfer-balance {
	background: url(../img/icons/50x50/coin-stack-transfer-balance.png) no-repeat 0 2px;
}
/* --------------------------------------------------------------------------------------------------- */
/* --- 40x40 --- */
/* --------------------------------------------------------------------------------------------------- */
 .question-answer-bubbles-40 {
	 background: url(../img/icons/40x40/question-answer-bubbles.gif) no-repeat 0 0;
}
.secure-message-40 { 	
	 background: url(../img/icons/40x40/secure-message.gif) no-repeat 0 0;
}
.email-40 {
	 background: url(../img/icons/40x40/email.gif) no-repeat 0 0;
}

/* --------------------------------------------------------------------------------------------------- */
/* --- Contact Additional Info --- */
/* --------------------------------------------------------------------------------------------------- */
.contactAdditionalInfo .question-answer-bubbles-40,
.contactAdditionalInfo .secure-message-40,
.contactAdditionalInfo .email-40 {
	min-height: 45px;
}
/****************************************************************************
 *  Navigation List Module
 ****************************************************************************/

.navList .bd p {
	padding: 16px 16px 14px;
	background-color: #fff;
	line-height: 1.325em;
}
.navList .bd {
	background: transparent url(../img/layout/nav/bg.gif) repeat-x center bottom;
}

.navList li {
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #fff;
	background: #fff url(../img/layout/nav/repeat.gif) repeat-x 0 0;
}
.featuredNavList li a,
.navList li a {
	background: transparent url(../img/icons/right-link-arrow.png) no-repeat 15px .9em;
	display: block;
	margin: 0;
	padding: 5px 10px 6px 25px;
}
.featuredNavList .bd h3 {
	padding: 17px 0 0;
	margin-bottom: 0;
}
.featuredNavList ul {
	margin: 10px 20px 0;
	border-top: 1px solid #e2e2e2; 	
}
.featuredNavList li a {
	padding: 5px 0 6px 12px;
	background-position: 2px .8em;
	border-bottom: 1px solid #e2e2e2;
}
#sidebar .navList li.last a {
	padding-bottom: 0;
}

.navList li a:hover {
	text-decoration: underline;
}

.navList2 .bd p {
	padding: 0 0 4px;
	line-height: 1.325em;
}

.navList2 ul {
	list-style-type: none;
	display: block;
	padding:2px 30px 0 20px;
}

.navList2 li {
	border-top: 1px solid #ccc;
	padding: 12px 0 17px;
}

.navList2 li.first {
	border-top: none;
	margin-top :0;
}

.navList2 li a {
	background: transparent url(../img/icons/right-link-arrow.png) no-repeat 0 0.4em;
	display: block;
	line-height:1.2em;
	margin: 0;
	padding: 0 10px 0 10px;
}

#sidebar .navList p {
	padding-top:15px;
	padding-bottom:0;
}

#sidebar .navList p a {
	padding-top:0;
	padding-bottom:10px;
	display:block;
	margin-top:-10px;
}

#sidebar .navList li {
	border-top: 1px solid #ccc;
	border-bottom:none;
}
#sidebar .navList li.first {
	border-top:none;
}

#sidebar .mod .button {
	margin: 0;
}

/****************************************************************************
 *  General sidebar module
 ****************************************************************************/

#sidebar .modContainer .general .bd {
	width: 189px;
	padding: 15px 15px 12px;
	overflow: hidden;
}
#sidebar .modContainer .general .bd .btnCall {
	margin-top: 10px;
}

/****************************************************************************
 *  Image Promo Module
 *  and
 *  Inline Image Promo Module
 ****************************************************************************/
 
.threeColumn .inlineImagePromo .bd {
	padding: 20px 19px 0;
	width: 252px;
	height: 281px;
}
.imagePromo .bd p,
.imageTextPromo .bd p,
.modContainer .imagePromo .bd p,
.modContainer .imageTextPromo .bd p {
	top: -999em;
	position:absolute;
}

.imageTextPromo .button, 
.imagePromo .button {
	position:absolute;
	bottom:25px;
}
.threeColumn .imagePromo .button {
	top: 240px;
	bottom: auto;
}
.fourColumn .imagePromo .button {
	top: 180px;
	bottom: auto;
}

/****************************************************************************
 *  Hero Carousel Module
 *  - This is an ID because Flash will consume the contents of the #heroCarousel div
 ****************************************************************************/

#heroPromoCarousel {
	width: 926px;
	margin: 0 10px;
	position: relative;
	padding-top:4px;
}

#heroPromoCarousel #heroPromoCarouselContent {
	position: static;
	height: 280px;
	overflow: scroll;
	overflow-x: hidden;
}

.oneColumn .section #heroPromoCarousel {
	margin-top: 30px;
	margin-bottom: 21px;	
}

#heroPromoCarouselContent p {
	display: none;
}

#heroPromoCarousel .button {
	position: static;
	margin-right: 10px;
}

/****************************************************************************
 *  Hero Links Module
 *  - This is an ID because Flash will consume the contents of the #heroLinks div
 ****************************************************************************/

#heroLinks {
	height:260px;
	margin-left: 9px;
	margin-top: 0;
}

#heroLinks img {
	position: absolute;
}

#heroLinks ul {
	position: absolute;
	margin-left: 42px;
	margin-top: 26px;
}

#heroLinks li {
	line-height: 1.7em;
}

/****************************************************************************
 *  Hero Image Module
 ****************************************************************************/

.modHeroBanner {
	width: 916px;
	height: 272px;
	background: #fff no-repeat 0 0;
}
.modHeroBanner mod {
	margin-top: 10px;
}

.modHeroBanner h2,
.modHeroBanner p {
	position:absolute;
	left:-1000em;
}

.modHeroBanner .button {
	position: absolute;
	bottom: 50px;
	left: 18px;
}

/****************************************************************************
 *  Accordion Promo Module
 *  ----------------------
 *  1. An image promo can be wrapped by a class of "accordion".
 *  2. The non-JS version simply stacks the promos on top of each other.
 *  3. JavaScript will adapt the HTML to fit the template that the jQuery accordion expects.
 ****************************************************************************/

.accordionEnabled .hd {
	cursor: pointer;
}

.accordionEnabled .ui-state-active {
	cursor: pointer;
}

.accordionEnabled .ui-icon {
	background: transparent url(../img/layout/module/grip.gif) no-repeat 0 0;
	height: 10px;
	width: 2px;
	position: absolute;
	right: 12px;
	top: 13px;
}

.accordionEnabled .first .hd {
	background:white url(../img/layout/module/header-border.gif) no-repeat scroll 0 -80px;
	border: none;
}

.fourColumn .first .hd {
	background-position: 0 0;
}

.accordionEnabled .last .hd {
	background-position: 0 bottom;
	background-image: url(../img/layout/module/header-border-bottom.gif);
	border: none;
}

.fourColumn .accordionEnabled .last .hd {
	background-image: url(../img/layout/module/header-border-bottom_third.gif);
}

.accordionEnabled .last .hd h2 {
	border-bottom: none;
	background-position: 0 0;
	background-image: none;
}

.accordionEnabled .hd,
.accordionEnabled .last .ui-state-active {
	background-image: none;
	border-left:1px solid #D3D3D3;
	border-right:1px solid #D3D3D3;
}

.accordionEnabled .hd h2,
.accordionEnabled .last .ui-state-active h2 {
	margin: 0;
	background-image: url(../img/layout/module/header-background1b.gif);
	background-position: 0 bottom;
}

.accordionEnabled .last .ui-state-active h2 {
	background-position: 0 bottom;
}

.accordionEnabled .ui-state-default h2 {
	padding-left:16px;
}

.accordionEnabled .first .hd h2 {
	background:transparent url(../img/layout/module/header-background1.gif) repeat-x scroll 0 bottom;
	border-bottom:1px solid #D3D3D3;
	margin:0 1px;
	padding:11px 15px 10px;
}

.accordionEnabled .first .bd {
	overflow: hidden;
}

.accordionEnabled .bd .ft {
	background-image: none;
	border-bottom: 1px solid #d3d3d3;
}

 .accordionEnabled .last .bd .ft {
	background-image: url(../img/layout/module/image-promo-bottom.gif);
	border-bottom: none;
}

.threeColumn .accordionEnabled .first .mod .hd,
.threeColumn .accordionEnabled .last .mod .hd {
	width: 292px;
}

.threeColumn .accordionEnabled .mod .hd,
.threeColumn .accordionEnabled .last .mod .ui-state-active  {
	width: 290px;
}

.fourColumn .accordionEnabled .first .mod .hd,
.fourColumn .accordionEnabled .last .mod .hd {
	width: 214px;
}

.fourColumn .accordionEnabled .mod .hd,
.fourColumn .accordionEnabled .last .mod .ui-state-active {
	width: 212px;
}

.fourColumn .accordionEnabled .last .mod .ui-state-active  {
	background-image: none;
}

/****************************************************************************
 *  Latest news module types - for freedom
 ****************************************************************************/

.modContainer .news ul {
	padding:20px 20px 0;
}

.modContainer .news li.first {
	border-top: none;
	margin-top:-8px;
}

.modContainer .news  li  {
	padding:8px 0 8px 25px;
	border-top: solid 1px #e2e2e2;
	background: url(../img/icons/news.png) 0 12px no-repeat;
}

.modContainer .news li div.word  {
	background: url(../img/icons/word.png) 0 11px no-repeat;
}
.modContainer .news li p {
	line-height:1.3em;
	color:#333;
}
.modContainer .news li p a {
	display:block;
}
.modContainer .news li p a.dwl {
	display:block;
	font-size:0.9em;
}

.modContainer .news .button {
	margin-left: 45px;
}

/****************************************************************************
 *  Latest videos module types
 ****************************************************************************/

.modContainer .thumbList ul {
	padding:10px 20px 0;
}

.modContainer .thumbList ul.gallery {
	width: 250px;
}

.modContainer .thumbList ul.gallery li p.date {
	margin: 2px 0;
}

.modContainer .thumbList ul.gallery li {
	margin: 0;
	padding: 10px 0 0;
}

.modContainer .thumbList li {
	border-top: solid 1px #e2e2e2;
	position:relative;
	display:block;
	padding:10px 0;
	overflow:hidden;
	width:100%;
}
.modContainer .thumbList li.first {
	border-top:none;
}
.modContainer .thumbList li img {
    width:86px;
    height:54px;
	border: #e2e2e2 solid 1px;
	float:left;
}
.modContainer .thumbList ul.gallery li a img {
	margin-bottom: 10px
}

.modContainer .thumbList li span {
    display:block;
    left:33px;
    position:absolute;
    top:30px;
    width:25px;
    height:23px;
    background:transparent url(../img/icons/play-small.png) no-repeat scroll left top;
}
.modContainer .thumbList li p {
	color:#333;
	line-height:1.2em;
}
.modContainer .thumbList li div  {
	width: 150px;
	padding:0;
	margin:0 0 0 10px;
	float:left;
}

/****************************************************************************
 *  Bullets list only module
 ****************************************************************************/
.modContainer .list .button {
	position:absolute;
	margin-left: 32px;
	bottom:25px;
}

/****************************************************************************
 *  Press module - typically on home page - for freedom
 ****************************************************************************/

.videoLink .play {
	text-align: center;
	padding-top: 19px;
	background: #fff;
	position: relative;
}

.videoLink img {
	border:#ccc solid 1px;
}

.modContainer .videoLink .button {
	margin-top: 15px;
}

.modContainer .videoLink p 
{
	margin: 5px 20px 0;
}
.videoLink a.flashMovieLink {
	margin: 10px 0 0 20px;
	float: left;
	bottom: 30px;
	position: absolute;
	text-decoration: none;
}
.videoLink a.flashMovieLink em {
	font-style: normal;
}
.videoLink a.flashMovieLink span  {
	background: transparent url("/freedom/assets/global/img/buttons/watch-lightbox-icon.png") no-repeat left top;
	color: #FFF;
	cursor: pointer;
	display: inline;
	padding: 13px 10px 15px 50px;
	margin: 10px 0 0;
}
.videoLink a.flashMovieLink span.end {
	background-position: right top;
	display: inline;
	padding: 13px 0 15px;
	width: 10px;
}

/****************************************************************************
 *  Barclays around the world module - our people
 ****************************************************************************/

.modContainer .bd p.first {
	padding-top:15px;
}

/* events module */

/* CAN .EVENTS / .PEOPLE BE REMOVED?! */

.modContainer .events  .bd  {
	background: url(../img/content/promos/thirdSize/freerun.jpg) top no-repeat;
}

/* people module */

.modContainer .people .bd  {
	background: url(../img/content/promos/thirdSize/executive.jpg) top no-repeat;
}
.modContainer .people .bd p {
	margin-bottom:10px;
}

/****************************************************************************
 *  Latest news module types
 ****************************************************************************/

.halfContentPromos .promos ul.tick {
	padding:15px 20px 0 0;
	margin-left:20px;
}

/****************************************************************************
 *  Products and services hub module  *
 ****************************************************************************/

.modContainer .products p {
	padding-top:0;
	margin-bottom:2px;
}

.modContainer h3.sub {
	margin-top:15px;
	padding-top:15px;
	border-top:#e2e2e2 solid 1px;
}

/****************************************************************************
 *  Breaking ground module 
 ****************************************************************************/
.halfContentPromos .promos p {
	margin-bottom:-5px;
	padding-top:15px;
}

/****************************************************************************
 *  Flash modules
 ****************************************************************************/
.globalMap { 
	margin-left: -7px; 
}

div.flashReplaced {
	left:-10px;
	margin-top:0;
}
.oneColumn div.flashReplaced {
	left:-6px;
	top:13px;
}

.flashReplace {
	position:relative;
	margin-top:22px;
}
.flashReplace .hidden {
	position:absolute;
	top:-9999px;
}
.flashReplace ul.switchView {
	position:absolute;
	right:4px;
}

div.flashReplaced ul.switchView {
	right: -2px;
	margin-top:5px;
}

#page .flashReplace ul.switchView li {
	float:left;
	display:inline;
	padding-top:0;
}

.flashReplace div.header,
.flashReplace div.main,
.flashReplace div.footer {
	position:relative;
	left:-6px;
}

.flashReplace div.header {
	background:url(../img/layout/background-shell/top_border_wide.gif) top left no-repeat;
	height:6px;
	width:916px;
	overflow:hidden;
}
.flashReplace div.main {
	border-style:solid;
	border-color:#ccc;
	border-width:0 1px;
	overflow:hidden;
	width:874px;
	padding:14px 20px 5px;
	background:#f5f5f5 url(../img/layout/background-shell/shell_inner_gradient.png) top left repeat-x;
}
.flashReplace div.footer {
	background:url(../img/layout/background-shell/footer_wide.gif) top left no-repeat;
	height:21px;
	width:916px;
}

.flashReplace ul.switchView li.linkRight {
	border-left:solid 1px #bcbcbc;
	padding-left:5px;
	margin-left:5px;
}
.flashReplace ul.switchView li.linkLeft {
	border-right:solid 1px #bcbcbc;
	padding-right:5px;
	margin-right:5px;
}
.flashReplace ul.letters {
	text-align:center;
}
.flashReplace ul.letters li {
	display:inline;
	margin:0 7px;
	text-transform:uppercase;
}

.flashReplace ul.contacts {
	margin-top:20px;
}
.flashReplace ul.contacts li {
	background:url(../img/layout/module/contactusline.gif) 18px 0 no-repeat;
	position:relative;
	float:left;
	margin-bottom:20px;
	width:871px;
}
.flashReplace ul.contacts li.first {
	background:none;
}
#timeline ul.contacts li {
	background-repeat: repeat-x;
	background-position: 0 0;
}
.flashReplace ul.contacts li li {
	float:none;
	background:none;
	margin-bottom:0;
	width:auto;
	clear:both;
}
.flashReplace ul.contacts li h2 {
	text-transform:uppercase;
}
.flashReplace ul.contacts li h2,
.flashReplace a.totop {
	position:absolute;
	top:-10px;
}
.flashReplace ul.contacts li h2 {
	margin:0;
	left:0;
	padding-right:10px;
}
.flashReplace a.totop {
	background:url(../img/icons/upblue.gif) 7px center no-repeat;
	padding-left:20px;
	position:absolute;
	right:0;
	top:-9px;
}

body .flashReplace ul.contacts h3 {
	font-size:1.667em;
	margin-top:15px;
}
.flashReplace h5 {
	margin:0 0 2px;
}
.flashReplace h6 {
	margin:0;
}
.flashReplace ul ul ul,
.flashReplace .callus,
.flashReplace .write {
	padding:0 0 0 51px;
	float:left;
	margin:0;
}
.flashReplace .nowebsites {
	margin-left:251px;
}
body .flashReplace ul ul ul li,
.flashReplace h5,
.flashReplace h6,
.flashReplace .write p,
.flashReplace a.totop {
	font-size:0.917em !important;
	line-height:1.364em;
}

.flashReplace .write {
	width:289px;
	padding:0;
}

.flashReplace .write .email {
	padding-left:51px;
	background:url(../img/icons/email.gif) 0 5px no-repeat;
}
.flashReplace .write .post {
	padding-left:51px;
	background:url(../img/icons/write.gif) 0 5px no-repeat;
}
.flashReplace .write .post p {
	margin-bottom:10px;
}

/****************************************************************************
 *  Who we work with 
 ****************************************************************************/

.flashReplace ul.partners  {
	clear:both !important;
}

.flashReplace ul.partners li {
	width:245px !important;
	margin:28px 50px 0 0;
	display:inline-block;
	vertical-align:top;
}

.flashReplace ul.partners li.last {
	margin-right:-50px;
}

.flashReplace img {
	margin-bottom:10px;
}

.flashReplace ul.partners li p, .flashReplace ul.partners li a {
	line-height:1.364em;
	font-size:1.278em !important;
}

.flashReplace ul.partners li a {
	margin-top:8px;
}

/* Timeline */
#timeline ul {
	margin:0;
}
#timeline li {
	padding-top:20px;
}
#timeline li.first {
	padding-top:0;
}
#timeline li h2 {
	position:static;
	text-transform:none;
	font-size:1.333em;
	margin:10px 0;
}

#timeline li div {
	float:left;
	margin-right:20px;
	padding:6px 0 0 7px;
	background:url(../img/layout/module/timelinelistitembg.png) top left no-repeat;
	width:211px;
	height:153px;
}

/* sitemap */
.sitemap {
	overflow: hidden;
	margin-right: -10px;
	width: 670px;
}

.sitemap li {
	display: inline-block;
	vertical-align: top;
	width: 200px;
	margin: 0 20px 30px 0;
}

#page .sitemap li li {
	display: list-item;
	clear: both;
	width: auto;
	margin: 6px 0;
}
#page .sitemap li li li {
	margin: 0;
}
#page .sitemap li li li a {
	background-image: none;
	color: #666;
}
.sitemap ul {
	margin-left:15px;
	width:auto;
}
.sitemap ul ul {
	font-size: .84em;
}

.heroImagePromo {
	width: 912px;
	height: 261px;
}

.heroImagePromo .hd {
	position: absolute;
	left: -100em;
}

.heroImagePromo .bd {
	width: 871px;
	border: none;
	padding: 108px 0 0 41px;
	height: 153px;
}

.heroImagePromo .bd li {
	background: transparent url(../img/icons/tickwhite.png) no-repeat 0 0.3em;
	padding-left: 26px;
	margin-bottom: 0.7em;
}

/****************************************************************************
 *  Module bodies should have 20px padding, not its content have padding
 ****************************************************************************/

.modContainer .imagePromo .bd,
#sidebar .modContainer .imageTextPromo .bd {
	padding: 20px;
	width: 250px;
	height: 200px;
}

.threeColumn .modContainer .imagePromo .bd {
	height: 260px;
}

#sidebar .modContainer .imagePromo .bd,
#sidebar .modContainer .imageTextPromo .bd  {
	width: 179px;
	height: 175px;
	background-color: #f7f7f7;
}

#sidebar .modContainer .imageTextPromo .bd {
	height: 138px;
}

#sidebar .modContainer .imagePromo .ft,
#sidebar .modContainer .imageTextPromo .ft {
	background: transparent url(../img/layout/module/image-promo-bottom-grey.png) no-repeat bottom;
	height: 4px;
}

#sidebar .modContainer .imagePromo .bd .button {
	position: absolute;
	bottom: 20px;
}

#sidebar .modContainer .imageTextPromo .bd .button {
	position: absolute;
	bottom: 40px;
}
#sidebar .modContainer .imageTextPromo .bd a.action {
	position: absolute;
	bottom: 20px;
}

.halfContentPromos .modContainer {
	margin: 0 -2px 0 22px;
	float: left;
	display: inline;
}

.halfContentPromos .modContainer .mod {
	margin: 0;
	float: none;
}

.halfContentPromos .modContainer .bd {
	height: 192px;
}

.halfContentPromos .modContainer .imagePromo .bd {
	width: 274px;
}

.halfContentPromos .modContainer .contentAside .hd {
	width: 658px;
	background-position: 0 -421px;
	height: 16px;
}

.halfContentPromos .contentAside .hd h2 {
	border-bottom: none;
	background: none;
}

.halfContentPromos .contentAside .bd {
	width: 612px;
	padding: 0 20px 25px 20px;
	height: auto;
	display: inline-block;
}

.halfContentPromos .contentAside .bd h2 {
	margin-top: 0;
	margin-bottom: 0.7em;
}

.halfContentPromos .contentAside .bd p {
	padding-top: 0;
	padding-bottom: 0.6em;
}

.halfContentPromos .contentAside .bd .button {
	position: static;
}

.halfContentPromos .contentAside .bd .ft {
	background-position: 0 -48px;
	width: 658px;
}

.fourColumn .modContainer .imagePromo .bd {
	width: 172px;
}

.modContainer .tickList .bd {
	padding: 13px 20px 20px;
	width: 274px;
	height: 206px;
}

.modContainer .tickList p {
	margin-bottom: 10px;
	padding: 0;
}

.modContainer .bd .button {
	margin-left: 0;
}

.modContainer .thumbList .button {
	margin-left: 115px;
}

.modContainer .iconList p {
	margin-bottom: 10px;
	padding: 13px 20px 0;
	line-height: 1.7;
}

.modContainer .iconList .feature {
	margin: 0 0 15px 10px;
	padding-left: 65px;
}

.modContainer .iconList .feature p {
	margin: 0;
	padding: 0 20px 0 0;
	line-height: 1.6;
}

.modContainer a.external {
	margin-top: 10px;
}

/****************************************************************************
 *  Product Slider
 *  - This is an ID because Flash will consume the contents of the #productSlider div
 ****************************************************************************/
 
.productSlider {
	overflow: scroll;
	overflow-y: hidden;
	width: 936px;
}

.productSlider ul {
	width: 1768px;
}

.productSlider li {
	width: 200px;
	float: left;
	border-right: 1px solid #666;
	padding: 0 10px;
	margin-bottom: 10px;
	list-style: none;
}

.threeColumn .section #heroPromoCarousel {
	margin-top: 0;
	margin-bottom: 0;
}

/****************************************************************************
 *  Accordion override
 ****************************************************************************/

.accordionEnabled .ui-state-default h2 {
	padding-left: 16px;
}

/****************************************************************************
 *  Generic callout
 ****************************************************************************/

div.genericCallout {
	margin: 0;
	padding: 0;
	
	display: none;
	position: absolute;
	top: 30px;
	left: 20px;
	z-index: 100;
}

div.genericCallout div.t {
	margin: 0 7px 0 0;
	padding: 0;
	height: 7px;
	background: transparent url(../img/layout/callouts/generic_08.png) no-repeat left top;	
	position: relative;
}

div.genericCallout div.t div {
	
	position: absolute;
	right: -7px;
	top: 0;
	
	width: 7px;
	height: 7px;
	background: transparent url(../img/layout/callouts/generic_08.png) no-repeat right top;	
	overflow: hidden;
}

div.genericCallout div.b {
	margin: 0 7px 0 0;
	padding: 0;
	height: 7px;
	background: transparent url(../img/layout/callouts/generic_08.png) no-repeat left bottom;	
	position: relative;
}

div.genericCallout div.b div {
	margin: 0;
	padding: 0;
	position: absolute;
	right: -7px;
	top: 0;
	
	width: 7px;
	height: 7px;
	overflow: hidden;
	background:  transparent url(../img/layout/callouts/generic_08.png) no-repeat right -443px;	
}

div.genericCallout div.calloutContent {
	margin: 0 0 0 1px;
	padding: 13px 25px 0 20px;
	border-left: 1px solid #cacaca;
	background: transparent url(../img/layout/callouts/generic_08.png) no-repeat right -7px;		
}

div.genericCallout div.calloutContent p {
	padding-bottom:13px;
	margin:0;
}

div.genericCallout span.beak {
	margin: 0;
	padding: 0;
	display: block;
	position: absolute;
	top: 20px;
	left: -13px;
	background: transparent url(../img/layout/callouts/beak_08.png) no-repeat left top;
	width: 15px;
	height: 30px;	
}

div.genericCallout span.left 	{}
div.genericCallout span.right 	{
	background-position: -15px top;
	left: auto;
	right: -13px;
}
div.genericCallout span.top 	{background-position: -30px top;}
div.genericCallout span.bottom 	{background-position: -30px -15px;}

div.genericCallout {
	width: 320px;
}

/****************************************************************************
 *  twin Panel  - One Column layout
 ****************************************************************************/
.oneColumn .panelOne,
.oneColumn .panelTwo {
	width: 406px;
	height: 460px;
	float: left;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	margin: 20px 0 0 5px;
	padding: 0 20px;
	position: relative;
	background: white no-repeat bottom right;
}
.oneColumn .panelOne {
	margin-right: 10px;
}
.oneColumn .panelOne .hd,
.oneColumn .panelTwo .hd  {
	background: white url(/freedom/assets/global/img/layout/module/header-panel.gif) no-repeat;
	height: 5px;     	
	margin: 0 -1px 0 -21px;
	width: 448px;
}
.oneColumn .panelOne .ft,
.oneColumn .panelTwo .ft  {
	background: transparent url(/freedom/assets/global/img/layout/module/bottom-panel.gif) no-repeat;
	height: 7px;
	position: absolute;
	bottom: 0;
	left: 0;  	
	margin: 0 -1px;
	width: 448px;
}
.oneColumn .panelOne #fcBarclaycardFlashVideoPlayer p,
.oneColumn .panelTwo #fcBarclaycardFlashVideoPlayer p {
	margin: 20px 140px 5px 0;
	clear: both;
}
.oneColumn .panelOne h2,
.oneColumn .panelTwo h2 {
	margin: 20px 0 5px;
	clear: both;
}
.oneColumn .panelOne h3,
.oneColumn .panelTwo h3 {
	margin: 20px 0 -15px;
	clear: both;
}
.oneColumn .panelOne a.button,
.oneColumn .panelTwo a.button {
	margin: 15px 0 25px;
}
.oneColumn .panelOne #fcBarclaycardFlashVideoPlayer a.flashMovieLink,
.oneColumn .panelTwo #fcBarclaycardFlashVideoPlayer a.flashMovieLink {
	margin: 10px 0 0;
	float: left;
}
.oneColumn .panelOne #fcBarclaycardFlashVideoPlayer a.flashMovieLink:hover,
.oneColumn .panelTwo #fcBarclaycardFlashVideoPlayer a.flashMovieLink:hover {
	text-decoration: none;
}
.oneColumn .panelOne #fcBarclaycardFlashVideoPlayer span,
.oneColumn .panelTwo #fcBarclaycardFlashVideoPlayer span {
	background: transparent url("/freedom/assets/global/img/buttons/watch-lightbox-icon.png") no-repeat left top;
	color: #FFF;
	cursor: pointer;
	display: inline;
	padding: 13px 10px 15px 50px;
	margin: 10px 0 0;
}
.oneColumn .panelOne #fcBarclaycardFlashVideoPlayer span.end,
.oneColumn .panelTwo #fcBarclaycardFlashVideoPlayer span.end {
	background-position: right top;
	display: inline;
	padding-left: 0;
	padding-right: 0;
	width: 10px;
}

/****************************************************************************
 *  Info Panel
 ****************************************************************************/

.infoPanel {
	margin: 30px -3px 0 -2px;
	overflow: hidden;
}
.infoPanel .hd, .infoPanel .ft {
	background: #f5f5f5 url(../img/layout/additonal/info-top.gif) no-repeat 0 0;
	height: 4px;
}
.content .csA .infoPanel h2 {
	margin: 0 0 5px;
	color: #bb4b09;
}
.content .csA .infoPanel p {
	margin: 10px 80px 5px 2px;
}
.content .csA .infoPanel a {
	color: #bb4b09;
}
.infoPanel .bd {
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	margin: 0;
	padding: 0 18px 18px;
	background: #f5f5f5 url(../img/layout/additonal/info-repeater.gif) repeat-x 0 0;
}
.infoPanel .ft {
	background-image: url(../img/layout/additonal/info-bottom.gif);
}

/****************************************************************************
 *  Warning
 ****************************************************************************/
.warning {
	background: transparent url(../img/icons/warning.png) no-repeat 0 0;
	padding: 0 30px;
}
.warning h3 {
	margin-bottom: -6px;
}
body.validatePhoneNumber {
	margin: 0 auto;    	
}

.validatePhoneNumber .wrapper {
	width: 272px;
	padding: 13px 19px 19px;
	margin: 0 auto;
}

.validatePhoneNumber h1 {
	background: transparent url(../img/icons/smallpadlock.gif) no-repeat 0 0;
	padding: 11px 0 18px 44px;
	margin-bottom: 0;
	font-size: 1.125em;
}

.validatePhoneNumber p span {
	font-size: 1.5em;
	display: block;
	color: #00a1e4;
	margin-bottom: 12px;
}

.validatePhoneNumber .valid p,
.validatePhoneNumber .invalid p {
	background: transparent url(../img/icons/roundtick.gif) no-repeat 0 1px;
	padding-left: 24px;
	margin-bottom: 10px;
}

.validatePhoneNumber .invalid p {
	background: transparent url(../img/icons/error-small.gif) no-repeat 0 1px;
}

.validatePhoneNumber p.noIcon {
	background: none;
	margin-bottom: 0;
}

.validatePhoneNumber p.noIcon span {
	margin: 4px 0 0 0;
}

.validatePhoneNumber .box {
	background: transparent url(../img/layout/popup/validate-phone-number.gif) no-repeat 0 0;
	padding: 18px 11px 25px 20px;
	overflow: hidden;
	margin-bottom: 11px;
	height: 102px;
}

.validatePhoneNumber form label {
	font-size: 0.75em;
	line-height: 1.325em;
	margin-bottom: 11px;
	display: block;
}

.validatePhoneNumber p {
	line-height: 1.325em;
}

.validatePhoneNumber form .enterNumber {
	font-family: tahoma,helvetica,arial,sans-serif;
	padding: 1px 3px;
	width: 190px;
}

.validatePhoneNumber form span.button {
	margin-top: 11px;
}

.validatePhoneNumber form span.button span {
	padding-bottom: 1px;
}

body.popup a.closeButton,
.validatePhoneNumber a.closeButton {
	font-size: 0.75em;
	background: transparent url(../img/icons/cross-small.gif) no-repeat 0 2px;
	padding-left: 17px;
}

/****************************************************************************
*  Popup
****************************************************************************/
body.popup {
	background:#fff none;
}

.popup #page {
	background-color:#fff;
	background-image:none;
	margin:0;
	padding:30px 20px;
	width:692px;
}

.popup #page #bd {
	width:100%;
	margin:0;
	background-image:none;
}

.popup #page #bd .intro {
	float: left;
	width: 600px;
	margin-bottom: 20px;
}

.popup #page #bd #bdInner {
	background:transparent url(../img/layout/background-shell/popup_repeater.gif) repeat-y scroll;
	padding: 0;
	position: relative;
	clear :both;
	margin: 0 0 10px;
}

.popup #page #bd #bdInner .content {
	background:transparent url(../img/layout/background-shell/popup_top.gif) no-repeat scroll left top;
	padding: 12px 20px 5px;
}

.popup #page #bd .bdFooter {
	background:transparent url(../img/layout/background-shell/popup_bottom.gif) no-repeat scroll left bottom;
}

.popup .content h2 {
	margin: 14px 0 -5px;
}

.popup #bdInner ol {
	margin: 10px 0 0 20px;
}

.popup #bdInner content {
	margin-top: 10px;
}

.popup ul.fileActions {
	float: right;
	margin-top: 20px;
}

.popup ul.fileActions li {
	display: block;
	float: left;
	margin: 0;
	padding: 0;
}

.popup ul.fileActions li a {
	background: transparent none no-repeat scroll 5px 2px;
	display: block;
	margin: 0;
	padding: 5px 12px 5px 30px;
}

.popup ul.fileActions li.print a {
	background: url(../img/icons/print.gif) no-repeat  5px 4px;
}

.popup .button {
	line-height:1.1em;
	margin-bottom:30px;
}
.popup span {
	font-size: 1.5em;
}

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

.popup .content table {
	border-spacing: 0;
	margin: 15px 0;
	background: #fff;
	width: 649px;
}
.popup .stripe {
	background-color: #f2f2f2;
}

.popup .content th,
.popup .content td {
	padding: 8px 15px;
	border-left: 1px solid #fff;
	border-right: 1px solid #d4d4d4;
	vertical-align: top;
}

.popup .content td {
	font-size: .75em;
}

.popup .content td span {
	font-size: 1.424em;
}

.popup .content .header td {
	border-top: 1px solid #d4d4d4;
}

.popup .content th.lt,
.popup .content .header td.lt {
	text-align: left;
	border-left: 0;
	border-top: 0;
	width: auto;
	background: url(../img/layout/table/header-white.gif) no-repeat 0 0;
}

.popup .content th.lt {
	background-image: url(../img/layout/table/header.gif);
}
.popup .content .header td.rt,
.popup .content th.rt {
	border-right: 0;
	border-top: 0;
	background: url(../img/layout/table/header-white.gif) no-repeat top right;
}
.popup .content th.rt {
	background: url(../img/layout/table/header.gif) no-repeat top right;
}

.popup .content th  {
	background: url(../img/layout/table/header.gif) no-repeat top center;
	font-size: .687em;
	border-bottom: 1px solid #d4d4d4;
}

.popup .content td.centre  {
	text-align: center;
}
.popup .content th.first,
.popup .content td.first  {
	text-align: left;
	margin-left: -1px;
	border-top: 0;
	border-left: 1px solid #d4d4d4;
}

.popup .content .bottom td  {
	border-bottom: 0;
	background: url(../img/layout/table/bottom.gif) no-repeat bottom center;
}
.popup .content th.lb,
.popup .content td.lb {
	padding-bottom: 15px;
	border-left: 0;
	border-bottom: 0;
	background: url(../img/layout/table/bottom.gif) no-repeat bottom left;
}
.popup .content td.rb {
	padding-bottom: 15px;
	border-right: 0;
	background: url(../img/layout/table/bottom_white.gif) no-repeat bottom right;
}
.popup .content .bottom th,
.popup .content .bottom td.rb {
	padding-bottom: 9px;
}
.popup .content .bottom td  {
	background: url(../img/layout/table/bottom_white.gif) no-repeat bottom center;
}
.popup .content .bottom td.lb  {
	background: url(../img/layout/table/bottom_white.gif) no-repeat bottom left;
}
.popup .content .bottom td.rb  {
	background: url(../img/layout/table/bottom_white.gif) no-repeat bottom right;
}
.popup .content .stripe.bottom td  {
	background: url(../img/layout/table/bottom_grey.gif) no-repeat bottom center;
}
.popup .content .stripe.bottom td.lb  {
	background: url(../img/layout/table/bottom_grey.gif) no-repeat bottom left;
}
.popup .content .stripe.bottom td.rb {
	background: url(../img/layout/table/bottom_grey.gif) no-repeat bottom right;
}

/* --------------------------------------------------------------------------------------------------- */
/* ---  Important information																		-- */
/* --------------------------------------------------------------------------------------------------- */
div#contentBody {
	margin: 0;
	padding: 30px 20px;
	width: 694px;
	background-image: none;
}

div#contentBody h1 {
	margin-left: 0;
	margin-top: 0;
	float: left;
}

div#contentBody div.panel {
	background: transparent url(../img/layout/popup/popup-top.gif) no-repeat scroll left top;
}

div#contentBody div.panel div.content {
	padding: 20px;
	background: transparent url(../img/layout/popup/popup-bottom.gif) no-repeat left bottom;
	min-height: 380px;
}

div#contentBody div.panel p {
	padding-right: 60px;
	font-size: .75em;
}

ul.fileActions {
	float: right;
}
div#contentBody div.panel {
	margin: 0 0 10px;
	padding: 6px 0 0;
	clear: both;
}
<<<<<<< import.css

/*ul.termsncondsCls {
list-style-type: disc;padding: 0 0 0 25px;
}

ul.termsncondsCls li {
font-size: .75em;
padding: 5px;
}*/
ul.termsncondsCls {
margin:0;padding:0 0 0 10px;
}

ul.termsncondsCls li {
padding:0 0 5px 20px;
font-size: .75em;
list-style-type:none;
margin:0 0 1px 0;
background:url(../../fc/img/icons/black-bullet.gif) no-repeat left top;

}

/* Server Busy Pages styles - Starts */

.oneColumn .panelOneSBP
{
	
	height: 460px;
	float: left;
	
	margin: 0 0 0 5px;
	padding: 0 20px;
	position: relative;
	
}
.oneColumn .panelOneSBP {
	margin-right: 10px;
}

.oneColumn .panelOneSBP h2 {
	margin: 20px 0 5px;
	clear: both;
}
.oneColumn .panelOneSBP h3 {
	margin: 20px 0 -15px;
	clear: both;
}

.panelOneSBP p { font-family:Tahoma,Arial,Helvetica,sans-serif;font-weight:normal;color:#333333; }
.panelOneSBP h1.headingOneCls { font-family:Tahoma,Arial,Helvetica,sans-serif;font-weight:normal;font-size:220%;color:#555555; }
.panelOneSBP p.headingTwoCls { font-family:Tahoma,Arial,Helvetica,sans-serif;font-weight:normal;font-size:150%;color:#00a1e4; }
.panelOneSBP p.headingThreeCls { font-family:Tahoma,Arial,Helvetica,sans-serif;font-weight:bold;font-size:80%;color:#000;padding:0 0 3px 0; }

.panelOneSBP p.linkBGCls { margin:0;padding:0;text-align:justify;color:#00a1e4;background:url(../../../../images/server_busy/arrow_green.jpg) no-repeat scroll left center;line-height:1.1em}
.panelOneSBP p.linkBGCls a { padding:0 0 0 15px;font-family:Tahoma,Arial,Helvetica,sans-serif;font-weight:normal;font-size:100%;color:#bb4b09; }
.panelTwoSBP { clear:none;width:80px;float:left;padding:15px 0 0 25px; }

/*  Sitewide navigation */
#sitewideNavSBP {
	padding: 0 0 2px;color: #be591d;
}

#sitewideNavSBP p {
	position: absolute;
	top: -100em;
}

#sitewideNavSBP ul {
	margin: 0 auto;
	width: 960px;
	text-align: left;
}

#sitewideNavSBP li {
	margin: 0;
	/*border-right: 1px solid #d7d7d7;*/
	display: inline;
}



#sitewideNavSBP li a.sequence {
	padding: 0 10px;
	font-size: 71%;
}

#sitewideNavSBP li a.first {
	padding: 0 10px;
	font-size: 71%;
}

#sitewideNavSBP .last {
	border-right: none;
}

#sitewideNavSBP .last a {
	padding-right: 0;font-size: 71%;
}

.seperatorCls { color:#acacac;font-size:60% }
/* Server Busy Pages styles - Ends */

/* High Street Pages styles - Starts */

.highStreetBeats {
	background:url("../../fc/img/layout/background-shell/highstreet-top-bg.gif") no-repeat scroll left top transparent;
	height:454px;
	margin:40px 10px 0;
	width:916px;
}
.highStreetBeats p {
	text-align:center;
	padding: 30px 20px 0 20px;
}
/*.highStreetBeats .button {
	position: static;
	margin-right: 10px;
}*/

.highStreetBeatsButtons {
	float:left;padding: 370px 0 0 42px;
}
#flashcontent #mymovie {
margin: 3px 0 0 3px;
}
.streetBeatsmodContainer .hd {	
	background-color:White;
	background-repeat: no-repeat;
	position: relative;	
}

.streetBeatsmodContainer .bd1 {
	width: 448px;
	height: 239px;
	background-color:White;
	background-repeat: no-repeat;
	position: relative;
	background: transparent url("../../fc/img/layout/background-shell/highstreet-mid-box-bot.gif") no-repeat 0 0;
}

.streetBeatsmodContainer .bd1 p {
	padding: 25px 10px 20px 20px;
}

.streetBeatsmodContainer .bd2 div.smallerContent {
	clear:none;float:left;width:160px; 
	/*padding:25px 0 35px 20px;*/
}
.streetBeatsmodContainer .bd2 div.demoImage {
	clear:right;
	width:240px;
	float:left;
	padding:72px 0 0 7px;
	text-align:center;
	margin:0;
}
.streetBeatsmodContainer .bd2 {
	width: 448px;
	height: 239px;
	background-color:White;
	background-repeat: no-repeat;
	position: relative;
	background: transparent url("../../fc/img/layout/background-shell/highstreet-mid-box-bot-bg-demo.gif") no-repeat 0 0;
}

.streetBeatsmodContainer .bd2 div.smallerContent {
	padding: 20px 0 20px 20px;
}
.streetBeatsmodContainer .bd2 .retailersImage {
	padding: 0;float:right;
}

.streetBeatsmodContainer .ft {
	
}

.streetBeatsmodContainer .RelInfo {
	background-color:#f7f7f7;
}

.streetBeatsmodContainer .text p {
	margin:0 20px 2px;
}

.streetBeatsmodContainer .text p.separate {
	margin-top:12px;
}

.streetBeatsmodContainer .text ul.bullet1 {
	padding-top:10px;
}

.streetBeatsmodContainer .text ul.bullet1 li a {
	padding-left:10px;
}

.streetBeatsmodContainer .text a.action {
	padding-left:13px;
}

.threeColumn h1.hub {
	top:-999px;
	position:absolute;
}

.threeColumn h1.logo {
	position:relative;
	top:0;
}

.threeColumn #breadcrumb {
	float:left;
 } 
.threeColumn h1 {
	margin-left:28px;
	margin-top:0;
	clear:both;
}
.threeColumn #bdInner {
	margin:0 12px;
	clear:both;
}
.threeColumn .modContainer,
.threeColumn .accordion {
	margin: 0 10px;
	overflow: hidden;
	float: left;
	width: 292px;
	display: inline;
}


/****************************************************************************
 *  Module dimensions for 4 column grid
 ****************************************************************************/
.threeColumn .section1 {
	clear: both;
	overflow: visible;
}

.threeColumn .streetBeatsmodContainer .tickList .bd1, .threeColumn .streetBeatsmodContainer .tickList .bd2 {
	width: 250px;
	height: 267px;
}


.threeColumn .streetBeatsmodContainer .ft {	
}

.imagePromo .bd1 p,
.imageTextPromo .bd1 p,
.streetBeatsmodContainer .imagePromo .bd1 p,
.streetBeatsmodContainer .imageTextPromo .bd1 p ,
.imagePromo .bd2 div,
.imageTextPromo .bd2 div,
.streetBeatsmodContainer .imagePromo .bd2 div,
.streetBeatsmodContainer .imageTextPromo .bd2 div {
	top: -999em;
	position:absolute;
}

.imageTextPromo .button, 
.imagePromo .button {
	position:absolute;
	bottom:25px;
}
.threeColumn .imagePromo .button {
	top: 240px;
	bottom: auto;
}

.threeColumn .accordionEnabled .first .mod .hd,
.threeColumn .accordionEnabled .last .mod .hd {
	width: 292px;
}

.threeColumn .accordionEnabled .mod .hd,
.threeColumn .accordionEnabled .last .mod .ui-state-active  {
	width: 290px;
}


.threeColumn .section #heroPromoCarousel {
	margin-top: 0;
	margin-bottom: 0;
}

.mod1 .hd1 {
	width: 448px;height: 42px;background: transparent url(../../fc/img/layout/background-shell/highstreet-mid-box-top-bg.gif) no-repeat 0 0;
}

.mod1 .hd1 h2 {
	padding:10px 0 0 20px;
}

.mod1 {
	position: relative;
}

.mod1 .buttonImgLCls {
	margin: 40px 0 0 19px;
}
.mod1 .buttonImgRCls {
	float:left;clear:both;
	margin:60px 0 0 19px;
}
.threeColumn .streetBeatsmodContainer {
	margin: 5px 10px 0 10px;
	overflow: hidden;
	float: left;	
	display: inline;
}

a.buttonH {
/*background-position:right -60px;*/
background-repeat:no-repeat;
cursor:pointer;
display:inline;
float:left;
margin:0;
padding:0 11px 0 0;
text-decoration:none;
height:47px;width:232px;
}

a.btnHighStreet, a.btnHighStreet span, span.btnHighStreet, span.btnHighStreet span {
background-image: url(../../fc/img/buttons/play-game-btn.gif);

}

a.buttonH, a.buttonH:visited, a.buttonH:hover, span.buttonH span input, span.buttonH input {
color:#FFFFFF;
font-weight:bold;
}

span.buttonH span input, .mod .buttonH, .mod1 .buttonH {
font-size:0.6875em;
}




#heroPromoCarousel .buttonH {
margin-right:10px;
position:static;
}

/* High Street Pages styles - Ends */

.mainContent {
	background:url(/freedom/assets/fc/img/layout/background-shell/mainContent.gif) no-repeat left top transparent;
	height:454px;
	margin:40px 10px 0;
	width:916px;
}
.mainContent .linkContainer {
	position: relative;
	top: 400px;
}
.mainContent .aprValue {
	background: transparent url(/freedom/assets/fc/img/layout/background-shell/apr.gif) no-repeat 0 0;
	position: absolute;
	left: 40px;
	top:415px;
	width: 225px;
	height:67px;
}

.mainContent .impLink {
	position: absolute;
	left: 480px;
}
.mainContent .impLink .infoLink {
	background:transparent url(/freedom/assets/fc/img/icons/link_arrow_orange.gif) no-repeat scroll 0 0.5em;	
	font-size: .8125em;
	padding-left:17px;
	display:block;
	clear:both;
	color:#555;
}
.mainContent a.button {
	position: absolute;
	left: 700px;
}

.mainContainer {
	padding: 10px;
}

.mainContainer .bd1 {
	width: 911px;
	height: 280px;
	background-color:White;
	background-repeat: no-repeat;
	position: relative;
	background: transparent url(/freedom/assets/fc/img/layout/background-shell/mainContainer-bottom.gif) no-repeat 0 0;
	
}

.mainContainer .bd1 p {
	padding: 25px 10px 0px 20px;
}
.mod3 .hd3 {
	width: 911px;height: 58px;background: transparent url(/freedom/assets/fc/img/layout/background-shell/mainContainer-top.gif) no-repeat 0 0;
}

.mod3 .hd3 h2 {
	padding:20px 0 0 20px;
	font-size: .9375em;
	font-weight:bold;
	color:#333333
}