@charset "utf-8";
/* 共用樣式 */
body, ul, li, a {
	margin:0;
	padding:0;
}
h1, h2, h3, h4, h5, h6, h7 {
	margin:0;
	padding:0;
	font-size:14px;
}
/* 系統標題 */
h1 {
	font-size:14px;
}
/* 項目標題 */
h4 {
	text-indent:5px;
	padding:10px 20px;
}
/* 單元標題 */
h5 {
	text-indent:0;
	padding:10px 0 0 20px;
}
/* 子標題 */
h6 {
	color:#ccc;
	font-weight:800;
	margin:3px;
}
/* 備註 */
h7 {
	color:#FFF;
	font-size:10px;
	float:right;
}
body {
	height:100%;
	background-color:#333;
}
#topCtrl {
	position:relative;
	color:#fff;
	background-color:#045d01;
	height:45px;
}

#topCtrl h1 {
	padding:13px 8px 12px;
	text-indent:16px;
}

#topCtrl .message {
	
	font-size:14px;
	font-weight:bold;
	font-family:Arial, Helvetica, sans-serif;
	
	color:#f90;
	background-color:#333;
	
	border-top:1px solid #000;
	border-left:1px solid #000;
	border-right:1px solid #aaa;
	border-bottom:1px solid #aaa;
	
	position:relative;
	margin-left:10px;
	margin-right:10px;
	bottom: 3px;
	padding:3px;
	
	-moz-border-radius: 4px;
	-khtml-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
}
#wrap {
	width:100%;
	min-height:306px;
}
#main {
	width:100%;
	height:100%;
	background-color:#FFF;
}

#mainMenu {
	font-size:18px;
	font-weight:800;
}

#mainMenu li {
	width:100%;
	text-indent:40px;
	display:block;
	list-style:none;
	line-height:47px;
	vertical-align:middle;
	border-bottom:#666 solid 1px;
}

#navMenu{
	width:320px;
	margin:20px 13px;
	padding:0;
}

#navMenu li {
	width:90px;
	height:120px;
	list-style:none;
	border:#666 solid 1px;
	float:left;
	/*background-color:#64ba0f;*/
	margin:5px 4px;
}

#navMenu li a{
	display:block;
	width:100%;
	text-align:center;
	margin-top:100px;
	color:#fff;
	font-size:13px
}

.menuOverStyle {
	color:#fff;
	background-color:#045d01;
	border-top:#FFF solid 2px;
}
.contentStyle {
	width:100%;
	color:#454545;
	background-color:#ddd;
}
#footer {
	height:30px;
	background-color:#333;
}
#mapMenuList li {
	font-size:16px;
	display:block;
	list-style:none;
	line-height:40px;
	text-indent:50px;
}
.top {
	border-top:#333 solid 1px;
}
#areaMenuList li {
	font-size:16px;
	display:block;
	list-style:none;
	line-height:40px;
	text-indent:50px;
	background-color:#E5E5E5;
}
.bkCanvasStyle {
	width:100%;
	height:100%;
	position:absolute;
	background-color:#000;
}
#mapCtrl ul {
	display:block;
	overflow: hidden; /* 超過範圍隱藏 */
	white-space: nowrap; /* 不斷行 */
	margin:0;
	padding:0;
}
#mapCtrl li {
	margin:0;
	padding:0;
	float:left;
	display:inline;
}
.mapCtrlStyle {
	width:100%;
	color:#FFF;
	font-size:18px;
	background-color:#333;
}
/* 共用 */
#pageTitle {
	color:#F90;
	font-size:14px;
	margin-bottom:0px;
}
.noData {
	color:#FFF;
	text-indent:20px;
	background-color:#045d01;
	height:24px;
	line-height:24px;
}
#msg500 {
	color:#FC0;
	text-align:left;
	text-indent:0;
	font-size:12px;
	font-weight:800;
	font-family:Arial, Helvetica, sans-serif;
}
#loading {
	color:#F90;
	font-size:16px;
	font-weight:800;
}
/* 速度顏色標示 */
.speed80up {
	color:#FFF;
	background-color:#090;
}
.speed60to79 {
	color:#333;
	background-color:#FF0;
}
.speed40to59 {
	color:#333;
	background-color:#F90;
}
.speed1to39 {
	color:#FFF;
	background-color:#F00;
}
.speed0 {
	color:#888;
	background-color:#454545;
}
/* 速度顏色標示 */
.text80up {
	color:#090;
}
.text60to79 {
	color:#ff0;
}
.text40to59 {
	color:#F90;
}
.text1to39 {
	color:#F00;
}
/* 道路選單 */
#selt_sec_title {
	color:#fff;
	background-color:#045d01;
	height:45px;
	border-bottom:1px solid #004500;
}
#unitTitle {
	display:block;
	font-size:17px;
	float:left;
	font-weight:bold;
	padding:13px 8px 12px;
}

#title_back_btn, #title_home_btn{
	display:block;
	width:45px;
	height:45px;
	text-align:center;
}

#title_back_btn{
	float:left;
	border-right: 2px solid #004500;
}

#title_home_btn{
	float:right;
	border-left: 2px solid #004500;
}

.sectionSpace {
	color:#FFF;
	background-color:#334433;
}
.sectionMenuList li {
	width:100%;
	color:#333;
	text-indent:40px;
	display:block;
	list-style:none;
	line-height:40px;
	vertical-align:middle;
	border-bottom:#666 solid 1px;
	background-color:#FFF;
}
/* 平均速度 */
#directionSpace {
	text-align:center;
	color:#F90;
	padding:10px 10px 0px 10px;
}
#directionSpace ul {
	width:100%;
	margin:auto;
	display:table;
}
#directionSpace li {
	text-align:center;
	list-style-type:none;
	background-color:#045d01;
	border:#CCC solid 1px;
	color:#FFF;
	margin:3px;
}
li .dirBtn {
	padding:5px;
}
.liBtnStyle {
	float:left;
}
.snBtnStyle {
	width:99.5%;
	height:100px;
	line-height:100px;
}
.ewBtnStyle {
	width:46%;
	height:200px;
	line-height:200px;
}
#locationSpace {
	margin:auto;
	text-align:center;
	padding:6px 10px 0px 10px;
}
.locBox {
	margin-top:10px;
}
.locBox a {
	color:#F90;
}
select {
	margin:8px 0px 13px 0px;
}
.btn {
	height:36px;
	line-height:36px;
	color:#FFF;
	text-align:center;
	background-color:#045d01;
	margin-top:12px;
	border:#888 solid 1px;
}
#speedList {
	text-align:center;
	padding:12px 8px 16px 8px;
}
#speedTb {
	color:#FFF;
	width:100%;
}
.speedLoc {
	height:30px;
}
.speedVal {
	font-size:20px;
	font-family:Arial, Helvetica, sans-serif;
	height:40px;
	line-height:40px;
}
.speedVal .val1 {
	width:45px;
}
.speedVal .val3 {
	width:45px;
}
/* 壅塞路段 */
#dataList {
	text-align:left;
	text-indent:20px;
	padding:12px 8px 16px 8px;
}
#congTb {
	color:#FFF;
	width:100%;
	background-color:#F00;
}
.congVal {
	line-height:30px;
	height:30px;
	color:#FFF;
}
.congVal .val1 {
	text-indent:12px;
}
.congVal .val2 {
	text-align:right;
	border-bottom:#333 solid 2px;
}
.congVal .val2 a {
	right:20px;
}
/* 即時影像 */
#cctvTb {
	width:100%;
}
#cctvTb .locRow {
	color:#FFF;
	text-indent:10px;
	background-color:#045d01;
	height:30px;
	line-height:30px;
}
#cctvTb .cctvRow {
	color:#FFF;
	height:30px;
	text-indent:20px;
	line-height:30px;
}
#cctvTb .noCctv {
	color:#999;
	height:30px;
	text-indent:20px;
	line-height:30px;
}
.rowLine {
	border-bottom:#454545 solid 1px;
}
#cctvSpeed, #cctvMile {
	color:#FFF;
	width:100%;
	margin-top:6px;
	padding:5px;
}
#staticImg img,  #staticImg iframe {
	margin:3px 0 3px 0;
}
#dCctv {
	margin-top:10px;
	color:#FC0;
	text-indent:20px;
	font-size:14px;
}
#stateChange, #prvNext {
	width:100%;
	text-align:center;
	line-height:30px;
}
#att {
	margin-top:20px;
	color:#F00;
}
#attStr {
	color:#F90;
	text-indent:20px;
}
.km {
	font-size:14px;
	color:#CCC;
}
#fromLocDtl, #toLocDtl, #staticImg {
	margin-top:6px;
	color:#fff;
	text-indent:8px;
}
#fromLocDtl {
	text-align:right;
}
#road {
	padding:10px 0 0 0;
	margin:auto;
}
#nwRoad {
	border-bottom:#333 solid 2px;
}
#seRoad,  #nwRoad {
	width:100%;
	min-height:28px;
	text-align:center;
	background-color:#999;
	vertical-align:middle;
}
#seRoadTb, #nwRoadTb {
	width:100%;
}
#seRoadTb td,  #nwRoadTb td {
	width:100%;
	text-align:center;
}
.roadCctvUl {
	padding:5px 0 5px 0;
	white-space:nowrap;
}
.roadCctvUl li {
	display:inline;
	padding:1px;
}
.roadCctvUl a {
	color:#333;
	font-size:10px;
	min-width:30px;
	height:24px;
	line-height:24px;
	vertical-align:middle;
	display:inline-block;
}
.cctvBtnMile {
	background:url(../assets/cctv_bg.png) no-repeat;
}
#roadCanvas {
	text-align:left;
}
#nodataDiv {
	width:auto;
	text-align:center;
}
#leftcar {
	float:left;
}
#rightcar {
	float:right;
}
/* 旅行時間 */

#travelTimeInfo {
	margin:0;
	padding:0;
	text-indent:0;
	color:#FFF;
	background-color:#045d01;
	padding:3px;
	margin-bottom:5px;
}
#travelTimeInfo table {
	width:100%;
	border:#ccc solid 1px;
	padding:15px 5px 15px 5px;
	line-height:22px;
}
#travelTimeInfo #moreTd {
	text-align:center;
	height:50px;
	line-height:50xp;
	vertical-align:bottom;
}
#info0, #info1, #info2, #info3 {
	text-indent:12px;
}
#secList {
	margin:0;
	padding:0;
	text-indent:0;
	width:100%;
	margin-top:10px;
	color:#FFF;
	text-align:center;
}
#travelTimeTb {
	width:100%;
	padding:5px;
}
#travelTimeTb .traLoc {
	line-height:26px;
	background-color:#045d01;
}
#travelTimeTb .traTime {
	line-height:32px;
}
#historyData {
	background:#045d01;
	color:#FFF;
	padding:5px;
}
#historyData ul {
}
#historyData li {
	text-indent:0;
	text-align:center;
	width:100%;
	line-height:22px;
	display:table;
	border:#ccc solid 1px;
	margin:3px 0 3px 0;
	padding:8px 0 8px 0;
	;
}
/* 天氣 */
#weatherTb {
	width:100%;
	color:#FFF;
}
#weatherTb td {
	padding:6px 0 6px 0;
}
#weatherTb a {
	text-indent:13px;
}
#weatherTb .boun {
	width:80px;
	color:#F90;
}
.bun1 td {
	background:url(../assets/weather_up_bg.png) repeat-x;
}
.bun2 td {
	background:url(../assets/weather_botton_bg.png) repeat-x;
	border-bottom:#888 solid 1px;
}
/* 事件/施工 */

#incTb, #workTb {
	width:100%;
	color:#FFF;
}
.inc td,  .work td {
	height:30px;
	line-height:30px;
	border-bottom:#888 solid 1px;
}
.i1 {
	width:90px;
	white-space:nowrap;
}
.i2 {
	white-space:nowrap;
}
.i3 {
	width:100px;
	text-align:right;
	white-space:nowrap;
}
.congVal td {
	background-color:#C00;
}