/*------------------------------------------------------------------
[Master Stylesheet : screen.css]

Project:      TFL LUIP
Version:      1.0
Created:      20/10/08
Last change:  20/10/08
Assigned to:  Diego Lago - diego.lago@webtechnologygroup.co.uk
Primary use:  TFL LUIP project

[Table of contents]

01. Layout
02. Main Content
  02.01. Intro - Landing Page
  02.02. Tube Lines figures upper block
  02.03. Slideshow
03. Sidebar
04. Local Navigation

/*------------------------------------------------------------------
[01.Layout]
*/
#main-content,
#supporting-content,
#local-navigation{
  float: left;
  margin-top: 0;
}
body.template-3 #main-content {
  margin-left: 156px;
  width: 568px;
}
#banner { 
  width: 744px;
  background: #ddd;
  height: 122px;
  float: left;
  margin: 61px 0 20px;
}
.breadcrumbs {
  position: absolute;
  margin: -10px 0 0 10px;
  z-index: 100;
  width: 744px;
}
#main-content-main {
  clear: both;
}
#main-content-copy {
  width: 322px;
  float: left;
}
#main-content-sidebar {
  width: 226px;
  float: right;
  margin-bottom: 20px;
}
#video {
  clear: both;
  background: #ddd; 
  width: 340px; 
  margin-bottom: 20px;
}

/*------------------------------------------------------------------
[02. Main Content]
*/
#main-content-copy h2 {
  border: none;
  color: #515151;
}

/*------------------------------------------------------------------
[02. Main Content]
[02.01. Intro - Landing Page]
*/
#main-content-intro {
  height: 21em;
  margin: 0 3px 20px 0;
  background: #F6F7F6;
  border: 1px solid #CACBC9;
  float: left;
  width: 225px;
}
#main-content-intro h1, #main-content-intro p {
  padding: 0 15px;
}
#main-content-intro h1 {
  border-bottom: none;
  color: #113b92;
  font-size: 2em;
  line-height: 1.1em;
  padding-top: 12px;
  margin-bottom: .5em;
  letter-spacing: -.7px;
}
#main-content-intro p {
  color: #888;
  font: bold 1.4em/1.4 Arial, sans-serif;
  letter-spacing: -.5px;
}

/*------------------------------------------------------------------
[02. Main Content]
[02.02. Tube Lines figures upper block]
*/
#main-content-figures {
  height: 21.1em;
  margin: 0 3px 20px 0;
  float: left;
  width: 227px;
  color: #fff;
}
#main-content-figures:hover {
  text-decoration: none;
}
#main-content-figures div {
  border-top: 1px solid #fff;
  background-color: #00A5E9;
  margin-top: 10px;
}
#main-content-figures h1, #main-content-figures p, #main-content-figures dl {
  padding: 0 9px;
  margin: 0;
  font: bold 1.1em Arial, sans-serif; 
}
#main-content-figures h1 {
  border-bottom: none;
  color: #fff;
  font-size: 2em;
  font-weight: 400;
  line-height: 1.1em;
  padding: 10px 9px 5px;
}
#main-content-figures .boxteaser{
	 padding: 8px 0 7px;
}
#main-content-figures .boxteaser li{
	clear:both;
	width:96%;
	float:left;
	color: #fff;
	font-size: 1.1em;
	background:none;
	margin-bottom:10px;
}
#main-content-figures .boxteaser li span.percent{
	font-size:2.2em;
	margin:10px 0;
	color: #fff;
	display:block;
	line-height:0.95em;
}
#main-content-figures .boxteaser li span.teasersub{
	font-size:2.2em;
	margin:10px 0;
	color: #fff;
	display:block;
	line-height:0.7em;
}
#main-content-figures dt {
  color: #fff;
  font-size: 1.1em;
  padding: 8px 0 7px;
}
#main-content-figures dd {
  background: none;
  padding-left: 0;
  font-size: 4.4em;
  line-height: 1em;
  font-weight: 400; 
}

/*------------------------------------------------------------------
[02. Main Content]
[02.03. Slideshow]
*/
#slideshow, #visuals {
  position:relative;
  float: left;
  height: 237px;
}
#slideshow img {
  position:absolute;
  top:0;
  left:0;
  z-index:8;
}
#slideshow img.active {
  z-index:10;
}
#slideshow img.last-active {
  z-index:9;
}

/*------------------------------------------------------------------
[03. Sidebar]
*/
.side-block {
  margin: 0 0 20px;
}
.solid-block {
  background: #00A5E9;
  padding: 15px;
  color: #fff;
}
.solid-block h2 {
  color: #fff;
  font-size: 1.35em;
  line-height: 1.1em;
  border-bottom: none;
}
.solid-block ul { 
  list-style-type: none; 
  margin: 0;
}
.solid-block li {
  padding: 0 0 1em;
  font-size: 1.1em;
  font-weight: bold;
  background: none;
}
.solid-block .lines {
  padding-bottom: 1em;
  letter-spacing: .25px;
}
.solid-block .last {
  padding-bottom: 0;
}
.solid-block .lines li {
  line-height: .5;
  font-weight: 400;
}

/*------------------------------------------------------------------
[04. Local Navigation]
*/
#local-navigation {
  width: 156px;
}
#local-navigation dd,
#local-navigation li{
  padding-left: 0;
  background-image: none;
  width: 149px;
}
#local-navigation ul,
#local-navigation dl{
  list-style-type: none;
  padding-left: 0;
}
#local-navigation a{
  padding-left: 12px;
  border-top: 1px solid #FFF;
  display: block;
  color: #fff;
  font: bold 1.3em Arial, sans-serif; 
  height: 1.7em;
  line-height: 1.7em;
  background-repeat: no-repeat;
  background-position: left top;
}
#local-navigation a:hover{
  text-decoration: none !important;
}
/*#local-navigation #TTIntroduction { background:#ddd url("../images/nav-line-home.gif"); color:#888; }
#local-navigation #TTBakerloo { 	background:#AE6118; margin-right:12px;}
#local-navigation #TTCentral { background:#E41F1F; margin-right:12px;}	
#local-navigation #TTCircle { background:#F8D42D; color:#113b92; margin-right:12px;}
#local-navigation #TTDistrict { background:#00A575; margin-right:12px;}
#local-navigation #TTHammersmith { background:#E899A8; color:#113b92; margin-right:12px;}
#local-navigation #TTJubilee { background:#8F989E; margin-right:12px;}
#local-navigation #TTMetropolitan { background:#893267; margin-right:12px;}
#local-navigation #TTNorthern { background:#000; margin-right:12px;}
#local-navigation #TTPiccadilly { background:#0450A1; margin-right:12px;}
#local-navigation #TTVictoria { background:#009FE0; margin-right:12px;}
#local-navigation #TTWaterloo { background:#70C3CE; color:#113b92; margin-right:12px;}
#local-navigation #TTIntroduction.active { background: url("../images/nav-line-home-active.gif"); margin-right:0px;}
#local-navigation #TTBakerloo.active { background: url("../images/nav-bakerloo-active.gif");  margin-right:0px;}
#local-navigation #TTCentral.active { background: url("../images/nav-central-active.gif");  margin-right:0px;}
#local-navigation #TTCircle.active { background: url("../images/nav-circle-active.gif");  margin-right:0px;}
#local-navigation #TTDistrict.active { background: url("../images/nav-district-active.gif");  margin-right:0px;}
#local-navigation #TTHammersmith.active { background: url("../images/nav-hammersmith-active.gif");  margin-right:0px;}
#local-navigation #TTJubilee.active { background: url("../images/nav-jubilee-active.gif");  margin-right:0px;}
#local-navigation #TTMetropolitan.active { background: url("../images/nav-metropolitan-active.gif");  margin-right:0px;}
#local-navigation #TTNorthern.active { background: url("../images/nav-northern-active.gif");  margin-right:0px;}
#local-navigation #TTPiccadilly.active { background: url("../images/nav-piccadilly-active.gif");  margin-right:0px;}
#local-navigation #TTVictoria.active { background: url("../images/nav-victoria-active.gif");  margin-right:0px;}
#local-navigation #TTWaterloo.active { background: url("../images/nav-waterloo-active.gif");  margin-right:0px;}*/

#local-navigation #TTIntroduction { background: #ddd url("../images/nav-line-home.gif"); color: #888; }
#local-navigation #TTBakerloo { background: #AE6118 url("../images/nav-bakerloo.gif"); }
#local-navigation #TTCentral { background: #E41F1F url("../images/nav-central.gif"); }
#local-navigation #TTCircle { background: #F8D42D url("../images/nav-circle.gif"); color: #113b92; }
#local-navigation #TTDistrict { background: #00A575 url("../images/nav-district.gif"); }
#local-navigation #TTHammersmith { background: #E899A8 url("../images/nav-hammersmith.gif"); color: #113b92; }
#local-navigation #TTJubilee { background: #8F989E url("../images/nav-jubilee.gif"); }
#local-navigation #TTMetropolitan { background: #893267 url("../images/nav-metropolitan.gif"); }
#local-navigation #TTNorthern { background: #000 url("../images/nav-northern.gif"); }
#local-navigation #TTPiccadilly { background: #0450A1 url("../images/nav-piccadilly.gif"); }
#local-navigation #TTVictoria { background: #009FE0 url("../images/nav-victoria.gif"); }
#local-navigation #TTWaterloo { background: #70C3CE url("../images/nav-waterloo.gif"); color: #113b92; }

#local-navigation #TTIntroduction.active { background-image: url("../images/nav-line-home-active.gif"); }
#local-navigation #TTBakerloo.active { background-image: url("../images/nav-bakerloo-active.gif"); }
#local-navigation #TTCentral.active { background-image: url("../images/nav-central-active.gif"); }
#local-navigation #TTCircle.active { background-image: url("../images/nav-circle-active.gif"); }
#local-navigation #TTDistrict.active { background-image: url("../images/nav-district-active.gif"); }
#local-navigation #TTHammersmith.active { background-image: url("../images/nav-hammersmith-active.gif"); }
#local-navigation #TTJubilee.active { background-image: url("../images/nav-jubilee-active.gif"); }
#local-navigation #TTMetropolitan.active { background-image: url("../images/nav-metropolitan-active.gif"); }
#local-navigation #TTNorthern.active { background-image: url("../images/nav-northern-active.gif"); }
#local-navigation #TTPiccadilly.active { background-image: url("../images/nav-piccadilly-active.gif"); }
#local-navigation #TTVictoria.active { background-image: url("../images/nav-victoria-active.gif"); }
#local-navigation #TTWaterloo.active { background-image: url("../images/nav-waterloo-active.gif"); }