/*
Site: Serco Group plc
Author: Reading Room
*/

/* Global */
/* Always force a scrollbar in non-IE */
html { overflow-y: scroll; }
body {font-size: 62.5%; font-family: Arial, Helvetica, sans-serif; color: #000000; text-align: center; background: #ffffff;}
p {font-size: 130%; line-height: 1.5; margin: 0 0 1.5em;}
a {color: #c70000; text-decoration: none;}
a:hover {text-decoration: underline;}
label {cursor: pointer; vertical-align: middle;}
input, select, textarea {font-size: 130%; font-family: Arial, Helvetica, sans-serif; vertical-align: middle;}
/* Align checkboxes, radios, text inputs with their label by: Thierry Koblentz tjkdesign.com/ez-css/css/base.css  */
input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; }
textarea { overflow: auto; } /* www.sitepoint.com/blogs/2010/08/20/ie-remove-textarea-scrollbars/ */

/* General classes */
input.text {padding: 1px; border-width: 1px; border-style: solid; border-color: #7c7c7c #c3c3c3 #dddddd; box-shadow: inset 0 1px 0 0 #c3c3c3, inset 1px 0 0 0 #f0f0f0, inset -1px 0 0 0 #f0f0f0;}
input.submit {font-weight: bold; color: #ffffff; background: #fff url(/Images/search_tcm3-44322.png) no-repeat left center; padding: 3px 15px 2px 4px; border: none; cursor: pointer; width: 10px; height: 20px;}
#searchform label {font-size: 1.3em; padding-right: 2px;}

/* Layout */
#container {text-align: left; padding: 20px 0 0; margin: 0 auto; width: 800px;}
#header {clear: both; float: left; padding: 0 0 5px; width: 100%;}
#main {clear: both; float: left; padding: 0 0 24px; border-bottom: 1px solid #e5e5e5; width: 100%;}
#footer {clear: both; float: left; padding: 15px 0 20px; width: 100%;}

/* Site logo */
#logo {float: left; margin: 0 0 10px 20px;}

/* Site tools */
#site-tools {float: right; text-align: right; margin: 0 20px 0 0;}
#lang {font-weight: bold; font-size: 110%; line-height: 1; margin: 0 0 10px;}
#lang a {text-decoration: underline;}

/* Header navigation */
#header .nav {clear: both; color: #ffffff; background: #be0912 url(/Images/header_nav_tcm3-38928.gif) repeat-x left top; padding: 4px 0 5px 30px;}
#header .nav li {list-style-type: none; display: inline; font-size: 140%; margin: 0 35px 0 0;}
#header .nav li a {color: #ffffff;}

/* Footer share price */
#footer .srp {float: left;}
#footer .srp h2 {display: inline; font-weight: bold; font-size: 110%; line-height: 1; margin: 0 15px 0 0;}
#footer .srp ul {display: inline;}
#footer .srp li {list-style-type: none; display: inline; font-size: 110%; line-height: 1; color: #666666; margin: 0 15px 0 0;}
#footer .srp li strong {font-weight: normal; color: #333333;}
#footer .srp a.more {font-size: 110%;}

/* Footer cookie detect */
#cookiedetect {float: left; background-color: #E8E8E8; padding: 5px; width: 100%;}
#cookiedetect h2 {display: inline; font-weight: bold; font-size: 110%; line-height: 1.5; margin: 0;}
#cookiedetect a.more {font-size: 110%;}

/* Footer navigation */
#footer .nav {float: right;}
#footer .nav li {list-style-type: none; display: inline; font-size: 110%; line-height: 1; padding: 0 0 0 7px; border-left: 1px solid #bcbcbc; margin: 0 0 0 7px;}
#footer .nav li.first {padding: 0; border: none; margin: 0;}

/* Spotlight */
#spotlight {clear: both; width: 100%;}
#spotlight #promo-col {float: left; margin: 0 25px 0 0; width: 185px;}
#spotlight #video-col {float: left; margin: 0 25px 0 0; width: 250px;}
#spotlight #news-col {float: left; width: 315px;}
#promo-col .first {margin: 0;}

/* Promo */
.promo {margin: 20px 0 0;}
.promo a {display: block; font-size: 130%; line-height: 1; color: #ffffff; background: #4c50b4 url(/Images/spotlight_purple_tcm3-38932.gif) repeat-x left bottom;}
.promo a img {display: block;}
.promo a span {display: block; background: url(/Images/arrow_white_9x15_tcm3-38926.png) no-repeat 165px center; padding: 6px 60px 8px 10px; min-height: 26px;}

/* Video */
.video img {display: block;}
.video div {color: #ffffff; background: #d70e00 url(/Images/spotlight_red_tcm3-38933.gif) repeat-x left bottom; padding: 13px 15px; min-height: 34px;}
.video div h2 {font-weight: normal; font-size: 170%; line-height: 1; margin: 0 0 4px;}
.video div a {display: block; font-size: 130%; line-height: 1; color: #ffffff; background: url(/Images/arrow_white_9x15_tcm3-38926.png) no-repeat right center;}

/* News */
.news h2 {font-size: 170%; line-height: 1; padding: 0 0 7px; border-bottom: 1px solid #e5e5e5; margin: 0 0 22px;}
.news li {list-style-type: none; font-size: 130%; margin: 0 0 20px; width: 100%;}
.news li span {display: block; padding-left: 12px;}
.news li a {display: block; background: url(/Images/arrow_red_6x11_tcm3-38923.png) no-repeat left .2em; padding: 0 0 0 12px;}
.news a.more {font-size: 130%;}

/* Barousel + Thslide */
.barousel {margin: 0 0 25px; width: 800px; position: relative;}
#barousel_thslide {height: 383px;}
/* boilerplate slide */
.boilerplate_slide {position: absolute; left: 0; top: 0; z-index: 100;}
.boilerplate_slide img {display: block; position: relative; z-index: 1;}
.boilerplate_slide span.mask {display: block; background: url(/Images/slider_img_mask_tcm3-38930.png) no-repeat left bottom; width: 800px; height: 283px; position: absolute; left: 0; top: 0; z-index: 2;}
.boilerplate_slide div {padding: 0 25px 30px; width: 750px; position: absolute; left: 0; bottom: 0; z-index: 3;}
.boilerplate_slide div p {font-size: 190%; line-height: 1.25; color: #ffffff; margin: 0;}
.boilerplate_slide div p a {color: #ffffff;}
/* images */
.barousel_image {width: 800px; height: 283px; position: absolute; z-index: 10;}
.barousel_image img {display: none; position: absolute; z-index: 1;}
.barousel_image img.default {display: block;}
.barousel_image img.current {z-index: 10;}
.barousel_image span.mask {display: block; background: url(/Images/slider_img_mask_tcm3-38930.png) no-repeat left bottom; width: 800px; height: 283px; position: absolute; top: 0; z-index: 11;}
/* content */
.barousel_content {color: #ffffff; width: 800px; position: absolute; left: 0; z-index: 50;}
#barousel_thslide .barousel_content {width: 800px; height: 283px; bottom: 100px;}
.js #barousel_thslide .barousel_content {cursor: pointer;}
.barousel_content div {display: none; padding: 0 25px 30px; width: 750px; position: absolute; bottom: 0;}
.barousel_content div.default {display: block;}
.barousel_content div h2 {font-weight: normal; font-size: 230%; line-height: 1.2; color: #ffffff; margin: 0;}
.barousel_content div h2 a {color: #ffffff;}
.barousel_content div p {font-size: 120%; color: #ffffff; margin: 0;}
.barousel_content div a.more {display: block; font-size: 130%; color: #ffffff; background: url(/Images/arrow_red_6x11_tcm3-38923.png) no-repeat left .2em; padding: 0 0 0 12px;}
/* content style spread over 2 cols */
.barousel_content div.barousel_content_2cols h2 {float: left; padding: 0 38px 0 0; width: 360px;}
.barousel_content div.barousel_content_2cols h2 span {display: block; text-align: right;}
.barousel_content div.barousel_content_2cols a.more {float: right; width: 340px;}
/* nav container */
.thslide {width: 800px; height: 115px;}
#thslide_barousel_nav {background: url(/Images/slider_controls_gradient_tcm3-38929.gif) repeat-x left bottom; position: absolute; bottom: 0; z-index: 51;}
/* previous and next */
.thslide_nav_previous {float: left;}
.thslide_nav_next {float: right;}
.thslide_nav_previous a, .thslide_nav_next a {display: block; text-indent: -9999px; height: 115px; width: 70px;}
.thslide_nav_previous a {background: url(/Images/arrow_red_17x34_back_tcm3-38925.png) no-repeat center 45px;}
.thslide_nav_next a {background: url(/Images/arrow_red_17x34_tcm3-38924.png) no-repeat center 45px;}
/* thumbnails */
.thslide_list {float: left; padding: 15px 0 0; width: 660px; height: 115px; overflow: hidden; position: relative;}
.thslide_list ul {float: left; width: 9000px;}
.thslide_list li {float: left; list-style-type: none;}
.thslide_list li a {display: block; padding: 10px 20px; width: 125px; height: 80px; position: relative;}
.thslide_list li a img {border: 1px solid #666666; width: 123px; height: 78px; position: absolute;}
/* current thumbnail */
.thslide_list li a.current {background: url(/Images/slider_thumb_current_tcm3-38931.png) no-repeat left center; padding: 25px 20px 10px; top: -15px;}
.thslide_list li a.current img {border: 4px solid #c70000; width: 117px; height: 72px;}


/* =============================================================================
   Non-semantic helper classes
   ========================================================================== */

.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }

.hidden { display: none; visibility: hidden; }

.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

.invisible { visibility: hidden; }

.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }


/* -- New homepage  -- */


.home-hero {
	margin-bottom: 20px;
}

.home-grid {
	background: orange;
	overflow: hidden;
	margin-bottom: 20px;
	position: relative;
}

.home-grid h1 {
	position: absolute;
	left: 0;
	top: 0;
	width: 360px;
	height: 160px;
	float: left;
	font-size: 20px;
	line-height: 32px;
	padding: 20px;
	background: #be0912;
	color: #ffffff;	
}

.home-grid a.boilerplate {
	color: #ffffff;
	display: block;
}

.home-grid a.boilerplate:hover {
	text-decoration: none;
}

.home-grid ul {
	float: left;
	margin: 0;
	padding: 0;
	background: yellow;
}

.home-grid ul:before {
	content: " ";
	display: block;
	float: left;
	width: 400px;
	height: 200px;
}

.home-grid ul li {
	float: left;
	position: relative;
}

.home-grid ul li a {
	display: block;
}

.home-grid ul li a span {
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
	background: rgba(0,0,0,.5);
	color: #fff;
	padding: 0 10px;
	width: 180px;
	font-size: 16px;
	line-height: 36px;
}

.home-grid ul li a span:before {
	content: "\002b";
	margin-right: 5px;
	font-size: 26px;
	line-height: 36px;
	display: block;
	float: left;
}

.news {
	padding: 20px;
	margin-bottom: 20px;
	background: #dedede;
}

.news h2 {
	font-size: 24px;
	border-bottom: none;
}

.news ul li span, .news ul li a {
	padding: 0;
	display: inline-block;
	font-size: 16px;
	line-height: 16px;
}

.news ul li a:before {
	content: "\25BA";
	margin-right: 5px;
	font-size: 12px;
	line-height: 16px;
}

.news ul li span {
	width: 20%;
}

.page-footer {
	background: #eeeeee;
	padding: 20px;
	overflow: hidden;
}

.page-footer .column {
	width: 175px;
	float: left;
	margin-right: 20px;
}

.page-footer .column.last {
	margin-right: 0;
}

.page-footer .column h2 {
	font-size: 18px;
	margin-bottom: 20px;
}

.page-footer .column ul {
	margin-bottom: 20px;
}

.page-footer .column ul li {
	margin-bottom: 10px;
}

.page-footer .column ul li a {
	font-size: 14px;
}

.page-footer .column ul li a:before {
	content: "\25BA";
	margin-right: 5px;
	font-size: 12px;
	line-height: 16px;
}

.page-footer .column p {
	margin-bottom: 0;
}

.page-footer .column p strong {
	font-weight: bold;
	margin-right: 5px;
}

.page-footer .srp {
	clear: both;
	padding-top: 40px;
	overflow: hidden;
}

.page-footer .srp h2 {
	float: left;
	font-size: 18px;
	margin-right: 10px;
	color: #999;
}

.page-footer .srp ul {
	float: left;
}

.page-footer .srp ul li {
	float: left;
	font-size: 18px;
	margin-right: 10px;
	color: #999;
}

#footer {
	margin: 0;
	padding-top: 0;
	padding-bottom: 0;
}

#footer #cookiedetect {
	margin-bottom: 20px;
	width: 760px;
	padding: 20px;
}

#footer .updated {
	float: left;
	margin: 0;
	font-size: 11px;
}