	/*  CSS */

body	{
	background-color: #EAEAEA;
	color: #333333;
	margin: 0;
	padding: 0;
	font-family:  "Trebuchet MS",  Arial, Helvetica, sans-serif;
	
	
	}
.hidden {display:none;}

	
#outer{

    width:780px;
	

	}	
	
	
#inner	{
    float:left;
	height:100%;
	color: #333;
	padding: 0;
	width: 780px;
	background:  #E7E7E7 url(../graphics/pagebg.jpg) no-repeat;

}

	
#banner	{
	FLOAT: left;
	color: #333;
	border: 0;
	margin: 0;
	padding: 0;
	text-align: left;
	width:780px;
	height:123px;
	
	
	}

	

#pagebody	{
	padding: 0;
	margin: 0;
	text-align: left;
	
	}
	
	
#leftcol {
		
		
			
	    width: 162px;
	    \width: 166px;	/* IE5 hack */
	    w\idth: 162px;
		padding:0 0px 0 4px ;
		float:left;

		}
	
	
#maincol {
		width: 424px;
	    \width: 443px; /* IE5 hack */
	    w\idth: 424px;
		padding:0 12px 0 11px;
		float:left;
	
		}
		
#maincolext {
		width: 586px;
	    \width: 584px; /* IE5 hack */
	    w\idth: 586px;
		padding:0 12px 0 11px;
		float:left;
}
		
		
#rightcol {
		width:152px;
	    \width: 163px; /* IE5 hack */
	    w\idth: 152px;
		padding:0 5px 0 6px;
		float:left;
		background-color:#DFDFDF;
		
		}
		
#footer {
	
	
	width:460px;
	\width: 480px; /* IE5 hack */
	w\idth: 410px;
	color: #cccccc;
	padding: 10px 20px 10px 0;
	text-align: left;
	margin:0 0 0 180px;
	
		
	}
		
		
#headerl{

	width: 424px;
	\width: 443px; /* IE5 hack */
	w\idth: 424px;
	padding:0 12px 0 11px;
	float:left;


}

#headerr{

		width:163px;
	    \width: 163px; /* IE5 hack */
	    w\idth: 163px;
		padding:0 0px 1px 0px;
		float:left;
		background-color:#fff;


}


/*  Typography */
	
	
#headerl h1 {
	
	font-family:Arial, Helvetica, sans-serif;
	font-size: 130%;
	line-height: normal;
	font-weight: bold;
	color: #D90021;
	padding: 5px 0 5px 0px;
	margin:0px;
	
}
#headerr h1 {
	
	font-family:Arial, Helvetica, sans-serif;
	font-size: 100%;
	line-height: normal;
	font-weight: normal;
	color: #A0A9BA;
	padding: 5px 0 5px 0px;
	margin:0px;
}

#maincol p	{
	
	font-family:Arial, Helvetica, sans-serif;
	color:#333;
	text-align: left;
	margin: 5px 0 10px 0px;
	font-size: x-small; /* REDUCE desired size a notch for IE 5 */
    voice-family: "\"}\"";
    voice-family: inherit; 
    font-size: small; /* REAL DESIRED SIZE for all other browsers */
	}
	
	
#maincol, #maincolext {
	
	color:#666;
	line-height: 19px;
	text-align: left;
	margin: 5px 0 10px 0px;
	font-size: small;   
	
	}	
	
	
#maincol h1, #maincolext h1, .topictitle {
	
	font-family:Arial, Helvetica, sans-serif;
/*	font-size: 130%;  */
	font-size: 22px;
	font-weight: bold;
	color: #D90021;
	padding: 5px 0 5px 0px;
	margin:0px;
	
}


#maincol h2, #maincolext h2 {
	font-family:Arial, Helvetica, sans-serif;
	/*font-size: 115%;*/
	font-size:18px;
	font-weight:normal;
	line-height: normal;
	color: #6E9ECE;
	padding: 10px 0 5px 0px;
	margin:0px;
}

#maincol h3, #maincolext h3 {
	
	
	font-family:Arial, Helvetica, sans-serif;
	font-size: 17px;
	color: #4F5050;
	font-weight: BOLD;
	padding: 0 0 0px;
	margin-left: 13px;
	margin-top: 0px;
	margin-bottom: 0px;
}

#maincol ul {

font-family:"Trebuchet MS",  Arial, Helvetica, sans-serif;
	color: #4781BB;
	font-size: x-small; /* REDUCE desired size a notch for IE 5 */
    voice-family: "\"}\"";
    voice-family: inherit; 
    font-size: small; /* REAL DESIRED SIZE for all other browsers */


}


#maincolext p	{
	font-family:  "Trebuchet MS",  Arial, Helvetica, sans-serif;
	color:#333;
	text-align: left;
	margin: 5px 0 10px 0px;
	font-size: small;
	voice-family: "\"}\"";
	voice-family: inherit;
	font-size: small;
	font-style: normal;
	


	
	
	}
/*
#maincolext h1 {
	
	font-family:Arial, Helvetica, sans-serif;
	font-size: 130%;
	font-weight: bold;
	color: #D90021;
	padding: 5px 0 5px 0px;
	margin:0px;
	
}


#maincolext h2 {
	font-family:"Trebuchet MS",  Arial, Helvetica, sans-serif;
	font-size: 115%;
	line-height: normal;
	font-weight: normal;
	color: #6E9ECE;
	padding: 10px 0 5px 0px;
	margin:0px;
}

#maincolext h3 {
	
	
	font-family:Arial, Helvetica, sans-serif;
	font-size: 17px;
	color: #4F5050;
	font-weight: BOLD;
	padding: 0 0 0px;
	margin-left: 13px;
	margin-top: 0px;
	margin-bottom: 0px;
}
*/

#maincolext ul {

	font-family:"Trebuchet MS",  Arial, Helvetica, sans-serif;
	color: #4781BB;
	font-size: x-small; /* REDUCE desired size a notch for IE 5 */
    voice-family: "\"}\"";
    voice-family: inherit; 
    font-size: small; /* REAL DESIRED SIZE for all other browsers */


}




#rightcol p{

	font-family:"Trebuchet MS",  Arial, Helvetica, sans-serif;
	color:#666;
	text-align: left;
	margin: 5px 0 10px 0px;
	font-size: 11px; 

}
#rightcol a{

	font-family:"Trebuchet MS",  Arial, Helvetica, sans-serif;
	color:#6E9ECE;
	text-align: left;
	margin: 5px 0 10px 0px;
	font-size: 11px; 

}

#rightcol h1 {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 110%;
	line-height: normal;
	font-weight: normal;
	color:#D90021;
	padding: 5px 0 5px 0px;
	margin:0px;
}

#footer p	{
text-align:left;
margin: 0 ;
padding: 0;
color:#666;
font-size:11px;
	}
	
#footer a	{

	
	margin: 10px 0;
	padding: 0;
	color:#518BC6;
	}

/* General links */
	
a:link, a:visited {
	
	text-decoration : none;
	color:#6E9ECE;
	
	}

a:hover {
	
	text-decoration : underline;
	color:  #006699;
	}

a:active {
	
	text-decoration : none;
	color: #526968;
	
	}



	
/* menu styles*/


/* top menu boxes*/

#leftcol ul#subnav {margin:0;padding:0;}
#leftcol ul#subnav br {display:none;}
#leftcol #subnav li {margin:0 0 5px 0; padding:0 0 0 0; list-style:none;  }

#leftcol #subnav a:link, #leftcol #subnav a:visited {
  display:block;
  background-position:0px;
  padding:13px 0px 13px 67px;
 font-size:13px;
  width:80px;
  \width: 147px; 
  w\idth: 80px;
   text-decoration:none;
  } 
  
html>body#leftcol #subnav a:link, html>body#leftcol #subnav a:visited {width:80px;}
#subnav strong {
  display:block;
  margin:4px 0 0 0;
 }

  #leftcol .box1 a {
    color:#ffffff;background-image:url(../graphics/thumb1_f1.gif);background-repeat:repeat-x;

  }
  #leftcol .box1 a:hover {
  color:#FFCC00;background-image: url(../graphics/thumb1_f2.gif);background-repeat:repeat-x;

  }
  #leftcol .box2 a {
   color:#ffffff;background-image: url(../graphics/thumb2_f1.gif);background-repeat:repeat-x;
 
 }
  
  #leftcol  .box2 a:hover {
   color:#FFCC00;background-image: url(../graphics/thumb2_f2.gif);
   background-repeat:repeat-x;
  
 }

  #leftcol .box3 a {
   color:#ffffff;background-image: url(../graphics/thumb3_f1.gif); background-repeat:repeat-x;
 
 }
  
  #leftcol  .box3 a:hover {
   color:#FFCC00;background-image: url(../graphics/thumb3_f2.gif); background-repeat:repeat-x;
  
 }
 
 
  #leftcol ul {
  margin:0;
  padding:0;
  }
  


/* main menu boxes */



#navcontainer { 

    margin: 0;
	padding: 0;
    float: left;
	width: 130px;
	

	 }

#navcontainer ul{

    margin: 0;
    padding: 0;
    list-style-type: none;
	
	

}

#navcontainer li {

    margin: 0 0 1px 0px;
	padding:0 0 0px 0;
	display:inline;

}

#navcontainer li a{

    display: block;
    padding: 2px 5px 2px 15px;
    border-left: 4px solid #316395;
	border-bottom: 1px solid #fff;
    background-color: #3C79B7;
    color: #ffffff;
    text-decoration: none;
    width: 123px;
    \width: 145px; 
    w\idth: 123px;
    font-size: x-small; /* REDUCE desired size a notch for IE 5 */
    voice-family: "\"}\"";
    voice-family: inherit; 
    font-size: small; /* REAL DESIRED SIZE for all other browsers */
	font-weight:bold;
    background-image: url(../graphics/arrow2.gif);
    background-repeat: no-repeat;
	background-position: 5px 50%;
    line-height:20px; 
}


#navcontainer li a:hover{

	border-left: 4px solid #dadada;
	background-color: #356BA2;
	color: #FFCC00;
	background-image: url(../graphics/arrow2.gif);
	background-repeat: no-repeat;
	background-position: 5px 50%;
	border-left: 4px solid #316395;
}


#navcontainer ul ul li { 

	margin: 1px 0 0 0;
	padding:0 0 0 0px; 

}

#navcontainer ul ul li a{

	display: block;
	padding: 5px 5px 2px 15px;
	width: 123px;
	\width: 145px; 
	w\idth: 123px; 
	color: #ffffff;
	text-decoration: none;
	font-weight:normal;
	line-height: 20px;
	background-color:#518BC6;

}

#navcontainer ul ul li a:hover{

	color: #FFCC00;
	text-decoration: none;
	font-weight:normal;
	background-color:#356BA2;

}
#navcontainer ul li a#current{
	color: #0066CC;
	font-weight:bold;
}





/* bottom menu boxes*/

#leftcol ul#subnav2 {margin:4px 0 0 0;}
#leftcol ul#subnav2 br {display:none;}
#leftcol #subnav2 li {margin:4px 0 5px 0px; padding:0 0 0 0; list-style:none;  }

#leftcol #subnav2 a:link, #leftcol #subnav2 a:visited{
  display:block;
  background-position:0px;
  padding:0px 0px 10px 63px;
  font-size:13px;
  width:80px;
  \width: 145px; 
  w\idth: 80px;
  
  } 
  
html>body#leftcol #subnav2 a:link, html>body#leftcol #subnav2 a:visited {width:80px;}
#subnav2 strong {
  display:block;
  margin:3px 0 0 0;
  text-decoration:none;
 }


/* End  menu styles */



/*Find a route boxes */



#routebytype {
	float:left;
	padding: 3px 5px 0 10px;
	background: url(../graphics/searchbytype.jpg) no-repeat; 
	margin: 5px 0px 5px 0; 
	width: 199px;
	\width: 205px; 
    w\idth: 189px; 
	HEIGHT: 82px; 
	
}


 
#routebytype h1 a{

	color:#ffffff;
	font-size: x-small; /* REDUCE desired size a notch for IE 5 */
    voice-family: "\"}\"";
    voice-family: inherit; 
    font-size: small; /* REAL DESIRED SIZE for all other browsers */
	
	
}


#routebytype a{

	font-size:small;
	color:#ffffff;
	
}


#routebylocation {
	float:left;
	padding: 3px 5px 0 10px;
	background: url(../graphics/searchbylocation.jpg) no-repeat; 
	margin: 5px 0px 5px 0; 
	width: 189px;
	\width: 205px; 
    w\idth: 189px; 
	height:82px;
	\height:45px;
	he\ight:82px;
	
}
#routebylocation h1 a{

	color:#ffffff;
	font-size: x-small; /* REDUCE desired size a notch for IE 5 */
    voice-family: "\"}\"";
    voice-family: inherit; 
    font-size: small; /* REAL DESIRED SIZE for all other browsers */
	
}


#routebylocation a{

	font-size:small;
	color:#ffffff;
	
}

 
/* =Search Form
----------------------------------------------- */

#searchform, #advsearch {
 
  background-color:#DCE1E7;
  padding:5px;
  margin:0px;
  font-size:small;
  color:#006699;

  
  }
 #searchform p, #advsearch p {
font-size:12px;
color:#003399;
  }

#searchbox {
  width:220px;
  margin:0px;
  padding:2px;
  font-size: x-small; /* REDUCE desired size a notch for IE 5 */
    voice-family: "\"}\"";
    voice-family: inherit; 
    font-size: small; /* REAL DESIRED SIZE for all other browsers */
  
  }
 
 

  
/* =Generic Forms
----------------------------------------------- */

td input, td textarea, td select, #searchform input, #advsearch input {
 font-size: x-small; /* REDUCE desired size a notch for IE 5 */
    voice-family: "\"}\"";
    voice-family: inherit; 
    font-size: small; /* REAL DESIRED SIZE for all other browsers */
  margin: 0;
  }
input.text {
  background:#fff;
  border:1px solid;
  border-color:#333 #DBDBDB #DBDBDB #666;
  color:#333;
  margin: 2;
  }
.imgbutton {
  width:50px;
  height:22px;
  background-color:#669ACC;
  color:#fff
  }
 .img {
  vertical-align:top;
  }



.imageright {
float: right;
margin: 0 0px 10px 15px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color:#666666;
font-weight:normal;
line-height:17px;
	
}

.clearboth {
	CLEAR: both
	
}

.button {
	background-color: #FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #333333;
}


 /* Table Stlying */

/* info */
table.info
{
text-align: left;
font-family: Arial, Helvetica, sans-serif ;
font-weight: normal;
font-size: x-small; /* REDUCE desired size a notch for IE 5 */
voice-family: "\"}\"";
voice-family: inherit; 
font-size: small; /* REAL DESIRED SIZE for all other browsers */
color: #fff;
border-collapse: collapse;
border-spacing: 0px;
width: 100%;

}

table.info td 
{background-color: #DFDFDF;
color: #333;
padding: 4px;
text-align: left;
border: 1px #fff solid;
vertical-align:top;
}

table.info td.hed, 
table.info td.hed1, 
table.info td.hed2,
table.info td.hed3,

{background-color: #6E9ECE;
color: #fff;
padding: 4px;
text-align: left;
border-bottom: 1px #fff solid;
font-weight: bold;
font-size: x-small; /* REDUCE desired size a notch for IE 5 */
voice-family: "\"}\"";
voice-family: inherit; 
 font-size: small; /* REAL DESIRED SIZE for all other browsers */

} 
table.info td.hed { width: 100%;}
table.info td.hed1 { width:200px; }
table.info td.hed3 { width:60px; text-align: right;}

table.info td.results1 {width: 200px;}
table.info td.results2 {width: 60px; }


.div-hed
{background-color: #6E9ECE;
color: #fff;
padding: 4px;
text-align: left;
border: 1px #fff solid;
font-weight: bold;
font-size: x-small; /* REDUCE desired size a notch for IE 5 */
voice-family: "\"}\"";
voice-family: inherit; 
 font-size: small; /* REAL DESIRED SIZE for all other browsers */

} 

.div-hed a, .div-hed a:visited, .div-hed a:hover
{
	color: #fff;
}

/* Breadcrumbs  */


#breadcrumbs
{
padding: 0;
margin: 3px 0 5px 0px;
font-size: 11px;
}

#breadcrumbs p

{
font-size: 11px;
padding:0px;
margin: 0px;
colour: #333;

}

#breadcrumbs a

{
font-size: 11px;
padding:0px;
color:#518BC6;

}

#breadcrumbs a:hover

{
	padding:0px;
	font-size:11px;
}


.centeredImage
    {
    text-align:center;
    margin-top:0px;
    margin-bottom:0px;
    padding:0px;
	clear:both
	
    }
	

/*   ADDITIONAL STYLES - ADDED BY Chris Shennan */
.routesection
{
	width: 100%;
	\width: 100%;  /* IE5 HACK */
	w\idth: 100%;
	color:#333;
}

.div-routeimages
{
	width: 250px;
	\width: 250px;
	w\idth: 250px;
	float:right;
}

.div-routeimages img
{
	margin: 10px;
	margin-top:0px;
}

.table-routepartproperties
{
	width: 320px;
	\width: 320px;
	w\idth: 320px;
	padding:0px;
	margin:0px;	
}

.table-routedetails
{
	width: 100%;
	\width: 100%;
	w\idth: 100%;
	padding:0px;
	margin:0px;	
}

.info .column1 
{ 
	width: 157px;
	\width: 157px;
	w\idth: 157px;
	font-weight:bold;
}

.info .column2
{ 
	width: 396px;
	\width: 396px;
	w\idth: 396px;
}

.right
{
	text-align:right !important;
}


/* Events Table */


.events
{
	text-align: left;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 12px;
	color: #000;
	margin-bottom:10px;
	border-bottom: 1px #999999 solid;
	width: 100%;
}


table.events td 
{
color: #000;
padding: 4px 0 2px 0;
text-align: left;
border: 0px #DFDFDF solid;}

.events .teaser
{
	float:right;
	width: 100%;
	vertical-align: bottom;
	text-align:right;
}

.events h1
{
	color: #6E9ECE !important;
	padding: 5px 0 5px 0;
	text-align: left;
	font-size: small !important;
	font-weight: bold;
} 


/* Publications Table */


table.publications
{
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 12px;
	color: #fff;
	border: 1px;
	border-collapse: collapse;
	border-spacing: 0px;
	margin-bottom:10px;
	border-bottom: 1px #999999 solid;
	width: 100%;
}

table.publications td 
{
color: #000;
padding: 4px 0 2px 0;
text-align: left;
border: 0px #DFDFDF solid;}

table.publications td.heading
{
	width: 200px;
	font-weight:bold;
	vertical-align:top;
}

table.publications td.hed

{
color: #6E9ECE;
padding: 5px 0 5px 0;
text-align: left;
border-bottom: 0px #fff solid;
font-size: small;
font-weight: bold;} 


.relatedHead, .contentprovider
{
	font-weight: bold;
}

.div-routemap
{
	text-align:center;
}

.advertbanner
{
	float:left;
	width: 50%;
}

#bannercontainer, .divcontainer
{
	width: 100%;
}

.spacer
{
	width:100%;
	height: 10px;
}

#maincol select,
#maincolext select 
{
	width:100px;
}



/* STYLES DEFINED IN FD CODE */
#paginate { width: 100%; text-align: right;}


/* CONTACT TABLE STYLES */
.contactTable {	margin: 0px; padding: 0px; width: 100%;	border-collapse: collapse; border-spacing: 0px; }
.contactTable tr { text-align: left; }
.contactTable .contactHighlight { width: 150px;	vertical-align:top; }
.contactTable .spacer {	width: 5px; }
.contactTable .heading { width:40px; vertical-align:top; }


/* ROADWORKS */

.info .tablecontents, .info .tablecontents2 { width: 43%; }
.info .tablecontents-small { width:14; }

/* Publications */

table.publicationsearch { width: 100%; border: 0px; margin: 2px; padding:0px;} 
table.publicationsearch td.heading { width: 33%; }
table.publicationsearch td.submit {text-align:right;}
td.newspubcontainer { width: 130px; text-align:left; vertical-align:top; }


/* ROAD CONDITIONS */
table.topicheader { width: 100%; border: 0px; padding: 0px; margin:0px; border-collapse: collapse; border-spacing: 0px; height: 50px;}
table.info td.heading { width: 150px;}
img.location { width: 200px; height: 200px; }


/* Routes */
table.table-routepartproperties { width: 100%; }
table.table-routepartproperties td.column1 { width: 30%; }

table.info td.hed1 a,
table.info td.hed2 a,
table.info td.hed3 a  { color: #FFF; }


/* ROUTE SEARCH */
table.search { width: 100%; }
table.search td.heading { width:35%; }


.bold {font-weight:bold;}


