@charset "utf-8";
/* CSS Document */

body{
	margin:0 0;
	padding:0 0;
	 font:13px "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	color: #000;
	width:100%;
	height:100%;
	background:url(../../images/bg.png);  /* พิ้นหลังส่วน body ---------------------------- */
}

#header {
		height:80px;
		background:#FFF url(../../../images/bg_banner_gis.png) repeat-x;  /* พื้นหลัง header --------------- */
		border-bottom: 1px solid #999;  
		}
	
	#header h1 {
		padding:20px;
		margin:0 0;
		color: #DDD;
		font-weight: normal;
		font-size: 180%;
		text-shadow: 1px 1px 1px #000;
		}
	
	
	/* navigation ---------------------------------------------------------------------------------------------------------- */
	
	.menu-container {
			margin: 0 auto;
			padding: 0;
			width: 100%;
			min-height:26px;
			background: #fff;
			border-bottom: 1px solid #999;
		}
	
	.memu {
	list-style: none outside none;
	margin: 0;
	padding: 0;
}

.memu ul {
	list-style: none outside none;
	margin: 0;
	padding: 0;
	position: absolute;
	left: -9999px;
	margin-left: 20px;
	width: 150px;
	
	-moz-box-shadow: 3px 2px 3px #333;
	-webkit-box-shadow: 3px 2px 3px #333;
	box-shadow: 3px 2px 3px #333;
}
.memu ul ul {
	margin-left: 0px;
	margin-top: 0px;
	
}
.memu a {
	background: #fff;
	background-color: rgba(255, 255, 255, 0.98);
	border: 1px solid #CCC;
	color: #333;
	display: block;
	font: bold 12px/25px segoe ui,verdana,sans-serif;
	margin: 0 -1px -1px 0;
	padding-left: 10px;
	text-decoration: none;
	width: 139px;
	text-overflow: ellipsis;
}

.menu-report a{width:250px !important;}
.menu-report{width:261px !important;}

.memu img {
	margin:0 2px 0 0;
	width: 20px; 
	height: 20px; 
	vertical-align:middle;
	border:none;
}

.memu li.memu-root > a {
	border-left: 0 !important;
	border-right: 0 !important;
	border-top: 1px solid transparent !important;
	border-bottom: 1px solid transparent !important;
	background: transparent !important;
}

.memu li {
	float: left;
}
.memu li.has-children > a {
	background: url("arrow.png") no-repeat scroll #fff;
	background-position: 130px center;
	background-color: rgba(255, 255, 255, 0.98);
}
.memu li:hover {
	position: relative;
	z-index: 100;
}
.memu li:hover > a {
	background-color: #fff;
	border-color: #CCC;
	color: #56789A;
}
.memu li:hover > ul {
	left: -20px;
	opacity: 1;
	top: 26px;
	z-index: -1;
}
.memu li:hover li:hover > ul {
	left: 150px;
	opacity: 1;
	top: 0px;
	z-index: 100;
}

.memu-current {
	background-color: #abcdef !important;
	background-color: rgba(235, 245, 255, 0.98 !important);
}
			

	/* navigation ---------------------------------------------------------------------------------------------------------- */	
	
	
	#main_wrap{
		clear:both;
		margin:0 0;
		padding:0 0;
		width:100%;
		min-height:100px;
	}
	
	#page_wrap{
		margin:0 auto;
		padding:0 0;
		width:98%;
		min-height:100px;
	}
	
	
	table.main_table{
		margin:0 auto;
		border:#227fad solid 1px;
		border-collapse:collapse;
		background-color:#FFF;
		-moz-box-shadow: 2px 2px 5px #666;
		-webkit-box-shadow: 2px 2px 5px #666;
		box-shadow: 2px 2px 5px #666;
	}
	
	table.grid_table{
		-moz-box-shadow: none !important;
		-webkit-box-shadow: none !important;
		box-shadow: none !important;
	}
	
	.row_head1{background-color:#DDD;}
	
	th.caption{
		filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#6891E7', endColorstr='#304EA6'); /* for IE */
		background: -webkit-gradient(linear, left top, left bottom, from(#6891E7), to(#304EA6)); /* for webkit browsers */
		background: -moz-linear-gradient(top,#6891E7,#304EA6); /* for firefox 3.6+ */ 		
	}
	
	table.main_table th{
		background-color:#7D7DFF;
		color:#FFF;
		text-shadow:1px 1px 0 #304EA6 !important;
	}
	
	table.main_table th,table.main_table td{
		padding:5px;
		height:26px;
		border:#227fad solid 1px;
	}
	
	table.main_table th a:link,table.main_table th a:visited{color:#FFF;text-decoration:none;}
	table.main_table th a:hover{color:#FFF;text-decoration:underline;}
	
	.prog_link:link,.prog_link:visited{color:#03F;text-decoration:none;}
	.prog_link:hover{color:#F00;text-decoration:underline;}
	
	.row1{background-color:#FFF;}
	.row2{background-color:#F8F8F8;}
	
	.comment{font-size:12px !important;}
	
	.red{color:#F00;}
	
	h1{font-size:20px;}
	h2{font-size:13px;color:#F60;}
	
	h1,h2{margin:0 auto;height:30px;}
	
	#directory,#tabs{
		-moz-box-shadow: 2px 2px 5px #666;
		-webkit-box-shadow: 2px 2px 5px #666;
		box-shadow: 2px 2px 5px #666;
	}
	
	#directory{
		margin:10px auto 10px auto;
		width:97%;
		min-height:18px;
		padding:10px 1%;
		border-right:#EEE solid 1px;
		border-bottom:#EEE solid 1px;
		border-top:#ccc solid 1px;
		border-left:#ccc solid 1px;
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#EDEDED'); /* for IE */
		background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#EDEDED)); /* for webkit browsers */
		background: -moz-linear-gradient(top,#FFFFFF, #EDEDED); /* for firefox 3.6+ */ 
	}
	
	#tree_menu{
		position:relative;
		z-index: 9999999;
		float:left;
		margin:0 0;
		padding:0 0;
		width:35%;
		height:200px;
		background-color:#F1F1F1;
		-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
		/*border-right:#999 solid 1px;*/
	}
	
	#filter_header{
		margin:0 0;
		padding:8px 0;
		width:100%;
		height:25px;
		border-bottom:#999 solid 1px;
		color:#333;
		font-size:18px;
		
	}
	
	
		
		#kpi_menu a:link{color:#000;text-decoration:none;}
		#kpi_menu a:visited{color:#000;text-decoration:none;}
		#kpi_menu a:hover{color:#36F;text-decoration:none;}
		
		.sub_list{
			margin-top:5px;
		}
		
	
	#map_wrap{
		position:relative;
		float:left;
		width:64.85%;
		height:200px;
		box-shadow: 2px 2px 5px #666;
		overflow:hidden;
	}
	
	#side_bar_list{
		margin:10px auto 0 auto;
		padding:10px 0 0 1%;
		width:95%;
		height:130px;
		background-color:#FFF;
		border:#666 solid 1px;
		overflow:auto;
		-webkit-overflow-scrolling:touch;
	}
	
	#filter{
		margin:0 auto;
		padding:10px 0 0 1%;
		width:99%;
		height:100px;
		background-color:#FFF;
		border-bottom:#999 solid 1px;
		overflow:hidden;
		-webkit-overflow-scrolling:touch;
	}
	
	#filter:hover{
		overflow:auto;
	}
	
	#tree_menu p{
		text-align:right;
		margin:8px 0 0 0;
		width:99%;
		font-weight:700;
		color:#222;
		text-shadow:#FFF 0 1px 0;
	}
	
	#content_menu{
		float:left;
		margin:0 0 0 1%;
		padding:0 0;
		width:78%;
		height:200px;

	}
	
	
	/* kpi ------------------------------------------------------------------------------------------------ */
	
	
	.holder,.label{
		margin:0 auto !important;
		width:317px;
	}
	.holder{height:320px !important;}
	.holder input{
		margin-top:4px !important;
	}
	.l_wrap{
		margin:0 auto;
		width:319px;
	}
	
	.holder{
		display:block;
		border-left:#FFF solid 1px;
		border-right:#FFF solid 1px;
		border-bottom:#FFF solid 1px;
		/*background-color:#EEE;*/
		background: rgba(0, 0, 0, 0.3);
		text-align:center;
	}
	
	.label{
		position:relative;
		padding-top:5px;
		min-height:30px;
		font-size:12px !important;
		background-color:#ccc;
		border-top-left-radius: 8px;
		border-top-right-radius: 8px;
		-moz-border-radius-topleft:8px;
		-moz-border-radius-topright:8px;
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#EEEEEE', endColorstr='#999999'); /* for IE */
		background: -webkit-gradient(linear, left top, left bottom, from(#EEE), to(#999)); /* for webkit browsers */
		background: -moz-linear-gradient(top,  #EEE,  #999); /* for firefox 3.6+ */ 
		border:#FFF solid 1px;
	}
	
	.text_lable{
		margin:0 0 5px 5px;
		padding:0 0;
		width:290px;
		min-height:20px;
		font-size:14px;
		font-weight:bold;
		color:#111 !important;
		text-shadow:#EEE 0 1px 0;
		text-align:justify;
	}
	
	
	#k_table td{
		width:350px;
		padding:0 0;
	}
	
	.indi{
		position:absolute;
		top:-3px;
		left:290px;
		width:32px;
		height:32px;
	}
	
	#kpi_menu{
		float:left;
		margin-top:10px;
		width:20%;
		min-height:200px;
	}
	
	#kpi_menu_box{
		margin:10px auto 0 auto;
		padding:10px 0 0 1%;
		width:92%;
		font-size:13px !important;
		height:200px;
		background-color:#FFF;
		border:#666 solid 1px;
		overflow:auto;
		-webkit-overflow-scrolling:touch;
	}
	
	#k_table,#kpi_header{float:left;margin:10px 0 0 10px;	}
	#k_table{
		border:#AAA solid 1px;
		width:77%;
		padding:0 0;
		background:url(../../images/st4.png);  /* พื้นหลัง ของ kpi ---------------------------------------------------  */
		
		
		/*filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FEFEFE', endColorstr='#DCDCDC');
		background: -webkit-gradient(linear, left top, left bottom, from(#FEFEFE), to(#DCDCDC));
		background: -moz-linear-gradient(top,#FEFEFE, #DCDCDC); */
		-moz-box-shadow: 0 0 20px #000;
		-webkit-box-shadow: 0 0 20px #00;
		box-shadow: 2px 2px 5px #000;
	}
	#kpi_header{
			border:#AAA solid 1px;
			min-height:30px;
			padding:5px 1% 5px 1%;
			width:75%;
			font-size:14px;
			font-weight:bold;
			background-color:#FFF;
			filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#EDEDED'); 
			background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#EDEDED)); 
			background: -moz-linear-gradient(top,#FFFFFF, #EDEDED); 
	}
	#kpi_header ul{list-style-type:none;margin:0 0;padding:0 0 0 18px;}
	#kpi_header li{margin:0 0;padding:0 0;}
	
	
	#detail_table{
		margin:0 auto;
		padding:0 0;
		border-collapse:collapse;
	}
	#detail_table,#detail_table th,#detail_table td{border:#666 solid 1px;height:28px;}
	
	.de_header{background:#D7D7D7 url(images/chartbar.jpg) repeat-x;text-shadow:#FFF 0 1px 0;}
	
	.Odd{background-color:#F0F0F0;}
	.Even{background-color:#F6F6F6;}
	
	#kpi_header  a:link{color:#039;text-decoration:none;}
	#kpi_header  a:visited{color:#039;text-decoration:none;}
	#kpi_header  a:hover{color:#36F;text-decoration:underline;}
	
	
.img {
	border	:none;
	vertical-align:middle;	
}

#gis_search_table{
	margin:10px 0 0 0;
	width:98%;
	border:#333 solid 1px;
	border-collapse:collapse;
}
#gis_search_table thead th{
	background-color:#ccc;
	text-align:center;
}

#gis_search_table th,#gis_search_table td{
	border:#333 solid 1px;
	padding:1%;
}


#hide_toggle{
	margin:5px 0 0 0;
	padding:0 0;
	float:right;
	font-size:16px !important;
	color:#666;
	font-family:vernada;
	width:20px;
	height:20px;
	cursor:hand;
	cursor:pointer;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#show_toggle{
	position:absolute;
	top:0;
	left:455px;
	z-index:99999999;
	font-size:16px !important;
	color:#666;
	text-align:center;
	font-family:vernada;
	background-color:#F1F1F1;
	width:21px;
	height:21px;
	cursor:hand;
	cursor:pointer;
	border-right:#000 solid 1px;
	border-bottom:#000 solid 1px;
	display:none;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}





/* เมนูตัวกรอง -------------------------------------------------------------------------------------------------------------------- */

#tree_menu span{
			color:#000066;
			font-weight:bold;
			font-size:12px;
			font-family:Vernada;
		}
	
		label{
			cursor:hand;
			cursor:pointer;
		}
		
		#filter img{
			border:none;
			vertical-align:middle;
		}
		
		


ul.topnav {
	padding: 0;
	margin: 10px 0 10px 5px;
	line-height: 0.5em;
	list-style-type: none;
	border-left:#e5e5e5 solid 1px;
	border-right:#e5e5e5 solid 1px;
	border-bottom:#e5e5e5 solid 1px;
}

.topnav ul{
	list-style-type:none;
}

ul.topnav input{
	float:left;
	margin-right:10px;
}
ul.topnav p{
	float:left;
	margin:0 0;
	padding:0 0;
	width:80%;
}

ul.topnav li {
	background-color:#FFF;
	border-top:#CCC solid 1px;
}


ul.topnav li a {
	line-height: 15px;
	padding: 10px 5px;
	color: #000;
	display: block;
	text-decoration: none;
	font-weight: bolder;
}

ul.topnav li a:hover {
	background-color:#eff2f7;
}

#search_nav:hover{
	background-color:#FFF !important;
	color:#000 !important;
	cursor:default !important;
}

ul.topnav ul {
	margin: 0;
	padding: 0;
	display: none;
}

ul.topnav ul li {
	margin: 0;
	padding: 0;
	clear: both;
}

ul.topnav ul li a {
	font-weight: normal;
	outline:0;
}


ul.topnav ul li a:hover {
	color:#675C7C;
}



ul.topnav ul ul li a:hover {
	color:#675C7C;
}

ul.topnav span{
	float:right;
	cursor:hand;
	cursor:pointer;
}




ul.topnav ul li a {padding-left: 20px;}
ul.topnav ul ul li a {padding-left: 40px;}
ul.topnav ul ul ul li a {padding-left: 60px;}
		

/* เมนูตัวกรอง -------------------------------------------------------------------------------------------------------------------- */