/* --------------------------------------------------- */
/* --------------------------------------------------- */
/* grid.css */
/* --------------------------------------------------- */
/* --------------------------------------------------- */
body {
	background-image: none;
	background-color:#fff;
	color:#000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 75%;
	text-align: left;
	margin: 0;
	padding: 0;
}

#wrapper{
	margin: 0;
	text-align: left;
	width: 100%;
}

#toolboxarea {display:none;}

#headerarea{
	height: 35px;
	margin: 0;
	border-top: 0px solid #f9c72d;	
}
#logocontainer {
	margin: 0;
}
#globalnavigation {display:none;}

#contentwrapper {
    background-image: none;
    min-height: auto;
	width: 100%;
}

#contentwrapper2colstart, #contentwrapper2col, #contentwrapper2colfull, #contentwrapper3col {
	margin: 0;
	background-image: none;
	background-color: transparent;
	width: 100%;
	height:auto;
}
#contentwrapperstart {display: none}

#contentwrapper2colstart #leftarea, #contentwrapper2col #leftarea {display: none;}
#contentwrapper3col #leftarea, #contentwrapper2colfull #leftarea {display: none;}

#centerarea{
	z-index: 12;
	margin:0;
	background-image: none;
	background-color: transparent;
	overflow: visible;
	width:100%;
}


#contentwrapper3col #centerarea{
	background-image: none;
	background-color: transparent;
	overflow: hidden;
	width: 100%;
	z-index: 12;
	margin:0;
}



#contentwrapper3col #rightarea {
	width: 270px;
}

#contentwrapper2col #rightarea{
	width:395px;
}

#contentwrapper2colfull #rightarea {display: none}
#contentwrapper2colstart #rightarea{
	width: 364px;
}
#rightarea {clear:both;padding: 20px 0 0 0;background-color: transparent;}
#rightpadding {padding: 0;}





#contentwrapper3col #centerpadding, #contentwrapper2colfull #centerpadding{	padding: 0;}
#contentwrapper2col #centerpadding {padding: 0;}
#contentwrapper2colstart #centerpadding{padding: 0;}



#footerarea{
	display:none;
}
#footerarea a, #footerarea img {vertical-align:middle;}
















/* --------------------------------------------------- */
/* --------------------------------------------------- */
/* type.css */
/* --------------------------------------------------- */
/* --------------------------------------------------- */
#contentwrapper2col #centerarea h1, #contentwrapper2colstart #centerarea h1, #contentwrapper2colstart #rightarea h1, #contentwrapper2col #rightarea h1{
	background-color: #555555;
	color: #ffc700;
	font-size: 110%;
	margin: 0;
	padding: 2px 2px 2px 4px; 
	height:1%;
}
#contentwrapper2col #centerarea h2, #contentwrapper2colstart #centerarea h2, #contentwrapper2colstart #rightarea h2, #contentwrapper2col #rightarea h2{
	background-color: Transparent;
	color: #000;
	font-size: 100%;
	margin: 0;
	padding: 0;
}
#contentwrapper3col h1, #contentwrapper2colfull h1{
	font-weight: normal;
	font-size: 140%;
	
}
#contentwrapper3col h2, #contentwrapper2colfull h2{
	font-weight: normal;
	font-size: 120%;
	
}
#rightarea #CongestionCharge { background-color: #fff; color: #000; margin-bottom: 10px;padding: 2px 2px 2px 0px; text-align: left}
#rightarea #CongestionCharge h1 { display: inline; margin-right: 30px}

table.messagelist {border: 1px solid #ddd;}

table.messagelist tr:hover
{
	background-color: #000;
	color: #ffc700;
}
table.messagelist tr.extramessage:hover
{
    background-color: #fff;
    color: #000;
    }
	
table.messagelist tr {display:block;position:relative;}
table.messagelist tr.extramessage {display:none;}

	
.mooremessage{border: 1px solid #000;margin: 0 0 0 20px;}
.mooremessage1{ padding:4px }
.mooremessage2{ background-color: #ffe999; padding:4px }
.mooremessage3{ background-color: #ffe999; padding:4px }
a img {border:0}


.hidden {display: none}
	
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
/* Table */
table {margin-bottom: 10px;font-size:100%;}
tr {background-color: #fff;}
tr.alternate {background-color: #edeeef;}
td {padding: 3px 0px 3px 3px;vertical-align: top;}
.col1 {width: 19px;}
.col2 {padding: 0 5px;width: 265px;}
.col3 {padding: 0 5px;width: 90px;}
.col4 {padding: 0 5px;width: 50px;}
.col5 {padding: 2px 1px 1px 1px;width: 14px;}

th.orderby {background: url(cssimg/orderby_lightbg.gif) #fff left bottom repeat-x;border-top:6px solid #fff;border-bottom:6px solid #fff;}
th.activeorderby {background: url(cssimg/orderby_darkbg.gif) #fff left bottom repeat-x;border-top:6px solid #fff;border-bottom:6px solid #fff;}
a.orderby {width:auto;display:block;background: url(cssimg/orderby_arrowdown.gif) transparent 95% 50% no-repeat;color:#000;text-decoration:none;font-size:105%;border:1px solid #cfcfcf;padding:1px 5px;}


input{
	margin: 0px 0 0px 0;
	vertical-align: middle;
}
button{
	font-size: 100%
}
label{
	font-weight: bold;}
label img{

	margin: 0px 5px 0px 6px;
	vertical-align: middle;
}
label.invalid
{
    color:Red;
}

/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
/* Camera images */
#cameras {}
#cameras ul, #cameras ul li {padding:0;margin:0;list-style: none}
#cameras .camerapreview {background-image: none;width:209px;height:210px;float:left;margin:0 4px 8px 4px;}
#cameras .camerapreview img {padding:19px 0 0 15px;}
#cameras .camerapreview a {text-decoration:none;}
#cameras .camerapreview h2 {font-weight:bold;color: #ffc700;font-size: 110%;padding: 3px 2px 4px 29px; margin:6px 6px 0 6px;background: url(../images/icons/camera.gif) #555 3px 2px no-repeat;}
#cameras .camerapreview span {display:block;font-weight:bold;color: #ffc700;font-size: 110%;padding: 3px 2px 4px 29px; margin:6px 6px 0 6px;background: url(../images/icons/camera.gif) #555 3px 2px no-repeat;}


.cameralist .camerapreview {background-image: none; transparent 0px 0px no-repeat;width:209px;height:210px;margin:0 4px 8px 4px;}

.cameralist ul, .cameralistul li  {
	padding: 0;
	list-style: none;
	display: block;
	margin:0;
}

.cameralist ul li {
display:inline;
float: left;
margin:0 4px 8px 4px;
position:relative;
height:1%;
width:210px;
}




.cameralist .camerapreview img {margin:18px 0 0 14px;border:1px solid #000;}
.cameralist .camerapreview a {text-decoration:none;}
.cameralist .camerapreview span {display:block;color: #ffc700;font-size: 110%;padding: 3px 2px 4px 29px; margin:6px 6px 0 6px;background: url(../images/icons/camera.gif) #555 3px 2px no-repeat;}

ul.treeview a {color:#414141;}
























/* --------------------------------------------------- */
/* --------------------------------------------------- */
/* widgets.css */
/* --------------------------------------------------- */
/* --------------------------------------------------- */
#interactivearea {
   margin-bottom: 10px;
}


#interactivetabs {
	background: url("cssimg/bg_interactive_tabs.gif") #fff no-repeat left top;
	display: inline-block;	
	height:1%;
	padding: 0 0 0 2px;
	width: auto;
	position: relative;
	top: 6px;
}

#interactivetabs ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: inline;
}

#interactivetabs ul li {
	background: url("cssimg/bg_interactive_li.gif") transparent no-repeat right top;
	float: left;
	margin: 0 1px 0 0;
	padding: 0 3px 0 0;
}
#interactivetabs ul li.end {
	background: url("cssimg/bg_interactive_li_end.gif") transparent no-repeat right top;
	margin: 0 1px 0 0;
	padding: 0 6px 0 0;
}
#interactivetabs ul li a, #interactivetabs ul li span {
	background: url("cssimg/bg_interactive_a.gif") transparent no-repeat left top;
	color: #000;
	display: block;
	font-weight: bold;	
	padding: 10px 15px 5px 15px;
	text-decoration: none;
}
#interactivetabs ul li span {
	background: url("cssimg/bg_interactive_a_current.gif") transparent no-repeat left top;
}
#interactivetabs ul li a:hover {
	background: url("cssimg/bg_interactive_a_current.gif") transparent no-repeat left top;
}
#interactivetabs ul li.current a {
	background: url("cssimg/bg_interactive_a_current.gif") transparent no-repeat left top;
}
























#interactivecontent {
	background: url("cssimg/bf_interactivecontent.gif") transparent no-repeat left top;
}
#starttabvvis {
    padding: 20px 0px 0px 20px;
    text-align: right; 
    width: 450px;
}

#starttabvviswrap 
{
	
    padding: 20px 0px 0px 20px;
    text-align: center; 
    
}

#starttabvvis
{
	
	width:350px;
	text-align:left;
	padding:10px;
	}
#starttabvvis .camera 
 {
    text-align:left;
    margin-bottom:10px;
}
#starttabvvis .camera .description
 {
	
    text-align:left;
    margin-top:10px;
   
}

#starttabvvis .vvisinfo 
 {
	
    text-align:left;   
}
#starttabvvis table td,#starttabvvis table tr
 {
	background-color:transparent;
}

#starttabcameras {
    padding: 20px 0px 0px 20px;
    text-align: right; 
    width: 450px;
}
 
#starttabcameras .camerarow {
    display:block;

 }
#starttabcameras .camerarow .camera {
    float: left;
    margin: 0 35px 0 0;
}
#starttabcameras .camerarow .camera select {
    font-size: 100%;
    width: 180px;
}
#starttabcameras input {
    font-size: 110%;
    margin-bottom: 10px;
}
.splashlist {
    background: url("cssimg/bg_splashlist.gif") no-repeat left top;
    float:left;
    margin: 0 3px 0 5px;
    min-height: 118px;
    width: 237px;
    }
.splashlist img {
    float:left;
    margin: 6px 6px 0px 6px; 
    }
.splashlistpadding {
    margin: 20px 16px 0 83px;
    }
.splashlistpadding h1 {
    background-color: Transparent !important;    
    color: #000 !important;
    font-size:100% !important;
    margin: 0 0 0 0 !important;
    padding: 0;
    }
.splashlist p {
    color: #000;
    display:block;
    margin: 0 0 0 0 !important;
    }
.splashlist a {
    color: #000;
    display:block;
    margin: 8px 0 0 0 !important;
    text-decoration: underline;
}
.splashlistend {
    background: url("cssimg/bg_splashlistend.gif") no-repeat left top;
    height: 6px;
    margin: 0;   
    padding: 0;
    width: 237px;
    }
.platepadding {
    padding: 10px;
    }
.platepadding p {
    padding: 0px;
	margin:0;
}	
.platepadding h1 {
    font-size: 100% !important;
    font-weight: bold !important;
    margin: 0 0 4px 0 !important;
    }
.platestart {
    background-image: none !important;
    width: 238px;
	border:1px solid #ddd;
    }
.plateend {display:none;}

.plateend h1{font-size:100%}
.informationlist {
	border:1px solid #ddd;
    background-image: none;
    width: 367px;
	margin:0 0 10px 0;
}
.informationlist h1 {
	background-color: #fff;
    color: #000;
    height: 1.6em !important;
    margin: 10px 0 0 0 !important;
    padding: 1px 0 0 25px !important;
    width: auto !important;
    }
.informationlist div.informationlistpadding {
    color: #000;
    margin: 0;
    padding: 10px 20px;
    }
.informationlist a {
    color: #000 !important;
    display: block;
    margin: 0 0 0 0 !important;
    padding: 0;
    text-align: right;
    width: auto !important;
    }
.informationlistend {
    display:none;
    }
#cameraarealist ul {
    list-style: none;
    margin:0;
    padding:0;
    }
#cameraarealist ul li {
    float: left;
    margin: 0 10px 10px 0;
    list-style: none;
    padding:0;
    width: 180px;

    }
#cameraarealist ul li label {}
#cameraarealist ul li img { 
   display: block;
    border: 0;
    padding: 0;
    }
#cameraarealist ul li a {
    color: #000;
    display: block;
    margin: 0 0 4px 0;
    text-decoration: none !important;
    }
#cameraarealist ul li a {
    text-decoration: underline;
    }
.last {
	border:0 !important;
}

.white_line {
display:none;
}
.imgplate {
	margin: 0 0 12px 0;
	padding: 0px;
}
.plate {
	background-color: #fff;
	margin: 0 0 12px 0;
	padding: 10px;
}
.plate a {
 color:#000;
 text-decoration: underline;
}
.plate img.map {
	border: 1px solid #858586;
	float: left;
}
.mapfilter {
    overflow: hidden;
	text-align: left;
}
.alignright {
	text-align: right;
}
.clear {clear: both;}


#iframecontainer {
	/* position:absolute; */
	position:relative;
	display:block;
	top: 0px;
	left: 0px;
	bottom:5px;
	padding:0;
	margin:0;
}

.iframeclass {
	min-width:100%;	
	display:block;
	padding:0;
	margin:0;
	border:none;
}
* HTML .iframeclass{width: 96%} 

tr.extramessage {display:none;}

/* START - Map Service Tab*/
#mapservicetab {}
#mapservicetab a {color:#000; text-decoration: underline}
#mapimage {
    float: left;
    padding: 20px 0px 0px 20px;
    width: 310px;
    }
#mapselects {
    float: left;
    padding: 20px 0px 0px 0px;
    width: 155px;
    }
#mapselects table {width: 155px;}
#mapselects caption {
    color: #000 !important;
    background: url("cssimg/bg_header.gif") transparent repeat left top !important;
    font-weight: bold;
    padding: 3px 0px 2px 15px !important;
    text-align:left;
}
#mapselects table th {padding: 4px 0px 4px 15px !important;}
#mapselects table th.bg {background: url("cssimg/bg_mapselects_th.gif") #edeeef no-repeat right center !important;}
#mapselects table th.withlabel {background: none #fff !important;width: 120px;}
#mapselects table th.withlabelbold {background: none #edeeef !important;font-weight: bold !important; width: 100px;}
#mapselects table td.withinput {background-color: #fff !important;padding: 0 !important;width: 20px;}
#mapselects table td.withinputbold {background-color: #edeeef !important;padding: 0 !important; width: 20px;}
#mapselects table td.withinput input, #mapselects table td.withinputbold input {margin:0 0 0 3px;}
	
#mapselects table td.withbutton {padding: 0 2px 0 0;text-align: right;}
#mapselects table td.withbutton input {font-size: 100%;}
#mapselects table th.withlabel label {font-weight: normal}
#mapselects table th.withlabelbold label {font-weight: bold}

#mapselects div input
{
   float: right;
   vertical-align:bottom;
   margin:0;
   padding:0;
}
#maplinkarea{margin-top: 5px;padding: 0px 0px 10px 20px}
/* END - Map Service Tab*/

/* Start - Week plan */
#weekplan tr.alternate{background-color: #edeeef;}
#weekplan th, #weekplan td{ padding: 4px 0 4px 4px; vertical-align: top}
#weekplan .col1{width:200px}
#weekplan ul {margin:0;list-style: none;padding:0}
#weekplan li {margin:0;list-style: none;padding:0}
#weekplan a {color: #000; display:block; margin: 0 0 4px 0}
/* END -  Week plan */


#degradeinformation 
{
    text-align:center;
  	color: #ff0000;
	font-weight: bold;
}

#wrappersigns{background-color:#fff;border: 1px solid #edeeef;margin:20px; padding: 2px; text-align:left;width:380px}
#wrappersigns table{ margin-bottom:20px}

#wrappersigns caption, #wrappersigns th, #wrappersigns td{ text-align: left; vertical-align:top; color: #000; padding: 2px}
#wrappersigns caption
{
    background-color: #555555;
	color: #ffc700;
	font-size: 110%;
	font-weight: bold;
	margin: 0;
	padding: 2px 2px 2px 4px;}
#wrappersigns .col1 {width: 21px}
#wrappersigns .col2 {width: 300px}