@charset "UTF-8";
/* CSS Document */
@import url('contents.css');
@import url('button.css');
@import url('menu.css');
@import url('maps.css');
@import url('symbols.css');
@import url('station-menu.css');
@import url('unselect.css');
@import url('tabs.css');

body{
  margin:0;
  background:#030;
  min-height:800px;
 
}
.black-ribbon {
 position : fixed;
 z-index : 9999;
 width : 70px;
}
@media only all and (min-width : 768px) {
 .black-ribbon {
 width : auto;
 }
}

.stick-left { left : 0; }
.stick-right { right : 0; }
.stick-top { top : 0; }
.stick-bottom { bottom : 0; }
p{
	 font-size:20px;
	
	
	}
header{
	width:100%;
	text-align:left;
	background: url(../images/bg-head.png) 50% 0 repeat-x;
	 
}
/*body.scroll{
   
   margin-top:135px;
  
}
 header.scroll  {
	position:fixed;
	z-index:99999;
    top:-135px;

}*/
  
#alpha{
	position:absolute;
	z-index:999999;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.8);
	display:none;
}
#top-head{
	height:135px;
	overflow:hidden !important;
	width:1000px;
	margin:0 auto;
	background: url(../images/bg-header.png) 50% 0 repeat-x;
	text-align:center;
	}
.wrapper{
	width:100%;
	margin:0 auto;
	 
 
	}
.content-wrapper{
	width:1000px;
	margin:0 auto;
	min-height:600px;
	background:#FFF;
	position:relative;
	padding-bottom:80px;
	 
 
	} 
#logo{
	position:absolute;
	margin: 10px 0 0 40px;
	z-index:9;
	cursor:hand;
    cursor:pointer;
	
	}
#bg-header{
	position:absolute;
	height:180px;
	margin:0 auto;
	overflow-y:hidden;
	z-index:-1;
	
}
#txt_head{
	/*position:absolute;*/
	margin:0px 0 0 0px;
	z-index:99;
	width:100%;
	position:relative;
	
	
}

#txt_head ul{ 
	/*float:left;*/
	padding:0;
	margin:5px 0 0 0px;
}
#txt_head ul.txt{ 
	margin-left: 150px;
	float:left;
	width:450px;
}

#txt_head ul.login{ 
    position:absolute;
	right:100px;
	top:20px;
}

#txt_head ul li{
	list-style:none;
	text-align:left;
	margin:0 0 0 0;
	padding:0;
	
	
}
#txt_head ul li.header{
	font-family: 'Conv_ThaiSansNeue-Bold','Cordia New';
	font-size:38px;
	/*color:#015095;*/
	color:#ffffff;
	margin:10px 25px 0 0px;
	
	font-weight: bold;
}
#txt_head ul li.header.tel{
	 letter-spacing:2px;
	 position:relative;
	 
}
#txt_head ul li.header.tel:before{
	content:url(../images/tel-icon.png);
	position:absolute;
	top:3px;
	left:-25px;
	
}
#txt_head ul li.subhead{
	
	color:#FFF;
	font-family: 'Conv_ThaiSansNeue-Light','Cordia New';
	margin: 0px 0px 0 0;
	padding:0;
	
	
}
#txt_head ul li.lang{
	color:#ffffff;
	text-align:right;
	
	}



#sub-txt{
	font-size:35px !important;
	
	}
#txt_head ul.lang{
	 /*border-left:1px dotted #CCC; */
	 margin-left:10px;
	 cursor:hand;
	cursor:pointer;
	width:75px;
}
#txt_head ul.lang li{
	text-align:center;
	margin-left:10px;
 
}
#txt_head ul.lang li.flag {
	vertical-align:middle;
	 
	
}
#txt_head ul li.admin{ 
	padding:0px;
	/*margin:15px 0px 0 0px;*/
	margin:25px -95px 0 0px;
	color:#FFF;
	position:relative;
	cursor:hand;
	cursor:pointer;
	text-align:right;
	
}
#txt_head ul li.admin.on{ 
	 
	 margin:15px -95px 0 0px; 
	 
}

 

footer{
	background:#030;
	z-index:9999999;
	 width:1000px;
	 margin:0 auto;
	 padding-bottom:30px;
 
 }
 footer ul, footer ul li{
	margin:0;
	padding:0;
	list-style:none;
	text-align:center;
}
footer ul{
	/*padding-top:60px;*/
	
	
	}
footer ul li{
	color:#FFF;
	
	}
footer ul li.foot-txt{
	background: url(../images/bg-footer.png) 50% 0 repeat-x;
	min-height:30px;
	font-family: 'Conv_ThaiSansNeue-Regular','Cordia New';
	font-size:16px;
	vertical-align:middle;
	padding:15px 0 0;
	 
}
 
ul.search2{
	border-top:1px solid #CCC;
	border-bottom:1px solid #CCC;
	width:1000px;
	margin:0 auto;
	padding:0;
	background:#FFF;
	font-size:18px;
	text-align:left;
}
ul.search2 li{
	display:inline-block;
	padding:0px 0 ;	
	margin:0;
}

ul.search2 li p{
	color: #333;
	font-size:18px;
	font-family: 'Conv_ThaiSansNeue-Regular','Cordia New';
	text-align:left;
}

 ul.search2 li.separate{
	border-left:1px solid #aaa;
	vertical-align:middle;
	padding:10px 0;
	margin:0px 20px;
}
ul.search2 input{
	width:140px;
}
ul.search2 select{
	width:120px;
	margin:0 5px;
	 
	
	}
.clear{
	clear:both;
}

#marquee{
	background-color:#fcfcfc;
	border-bottom:1px solid #CCC;
	width:1000px;
	margin:0 auto;
	height:35px;
	
}

#marquee_txt{
	width:1000px;
	margin:0 auto;
	 
	 
}
 
#marquee_txt a{
	text-decoration:none;
	margin-right:20px;
	 
}
#marquee_txt a span.text{
	display:inline-block;
	padding:10px 10px 0;
	color:#666;
}
#marquee ul{
	margin:0;
	background-color:#fcfcfc;
	text-align:left;
	width:100%;
}
#marquee ul li{
	list-style:none;
	float:left;
	/*padding: 2px 20px;*/
	border-right:1px solid #999;
	width:2%;
}
#marquee ul li.marquee-content{
	width:45%;
}
#marquee ul li p{
	color:#FFF;
	font-size:15px;
	font-family: 'Conv_ThaiSansNeue-Regular';
}
#marquee ul li:last-child{
	border-right:0px solid #999;
}

#marquee ul:last-child li{
	height:30px;
}


ul.img-ratio li:first-child{
	background-color:#c24706
}

ul.img-ratio li:last-child{
	background-color:#da6111
}





/*
#dialog-login li{
	list-style:none;
	margin:5px 20px;
}

#dialog-login input{
	margin:0;
}*/


/* intro page */
 
 
#intro{
	background:#fff url(../images/bg_intro.png) 0 0 no-repeat;
	z-index:9999999;
	position:absolute;
	margin:75px 0 0 -400px;
	left:50%;
	padding:0px;
	width:800px;
	height:600px;
	overflow:hidden;
	-moz-box-shadow:0 1px 10px rgba(0, 0, 0, 0.6);
	-webkit-box-shadow:0 1px 10px rgba(0, 0, 0, 0.6);
	box-shadow:0 1px 10px rgba(0, 0, 0, 0.6);
	/*Gray Event Start*/
	/*-webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;*/ /* IE 6-9 */
    /*Gray Event Stop*/
}
#intro-news .time{
	color:#690;
}
#intro .wrap-intro{
	padding:25px;
	
	}
#intro .logo{
	width:80px; 
	float:left;
	}
#intro .logo2{
	width:120px; 
	float:left;
	margin-left:25px;
	}
#intro ul{ 
	margin:0;
	z-index:99;
	width:600px;
	 
}

#intro ul.txt{ 
	 
	float:left;
	width:550px;
}
#intro ul.txt2{ 
	 
	float:left;
	width:400px;
	color:#fff;
	margin-top:25px;
}
#intro ul li{
	list-style:none;
	text-align:left;
	margin:0;
	padding:0;
}

#intro ul li.header{
	font-family: 'Conv_ThaiSansNeue-Bold';
	font-size:36px;
	color:#1a3551;
	text-align:left;
	margin-top:15px;
}
 
#intro ul li.subhead{
	 
	font-family: 'Conv_ThaiSansNeue-Light';
	font-size:34px;
	margin:0px 0 0 0px;
}

#intro-news{
	clear:both;
	width:500px;
	margin:0;
	padding:25px;
	height:280px;
}

#intro .news-more{
	margin-top:25px;
	
	}
#intro .enter-site{
	float:left;
	margin-top:35px;
	}
#intro-overlay{
	position:absolute;
	z-index:99999999;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.8);
}



#dialog-login{
	display:none;
	z-index:9999999999;
	position:absolute;
	margin:230px 0 0 350px;
	padding:30px;
	width:230px;
	height:160px;
	background:#FFF url(../images/admin-bg.png) 10px 40px no-repeat;
	moz-border-radius:8px;
   -webkit-border-radius:8px;
    border-radius:8px;
	border:5px solid #ccc;
	-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 10px   rgba(0,0,0,0.5);
	box-shadow: 0px 0px 10px rgba(0,0,0,0.5); 
}
#dialog-login li{
	list-style:none;
	margin:5px 10px 5px 85px ;
	position:relative;
	text-align:left;
}
#dialog-login li.admin,#dialog-login li.pass
{
	padding-left:25px;
	
	}
#dialog-login li.admin:before{
	content:url(../images/admin-icon.png);
	position:absolute;
	top:-5px;
	left:0px;
	
}
#dialog-login li.pass:before{
	content:url(../images/key-icon2.png);
	position:absolute;
	top:-5px;
	left:0px;
	
}
#dialog-login input{
	margin:0;
	padding:0 5px;
	width:120px;
	
}

#dialog-login li.close_x{
	
	position:absolute;
	right:-30px;
	top:-20px;
	
	
	}
#dialog-login li.close_x:hover{
	cursor:pointer;
	cursor:hand;
	
}
.admin-search-table{
	margin:0px auto ; 
	padding:5px 0;
	width:950px;
	margin:0 auto;
	border-bottom:1px dotted #ccc;
}

.admin-search-table tr th{
	border:0px solid #666;
	text-align:center;
	padding: 5px;
	background:#CCC;
	font-weight:bold;
}

.admin-search-table tr td{
	border:0px solid #666;
	padding: 5px;
	vertical-align:middle;
}


.data-table{
	margin:10px auto auto auto;
	border:1px solid #ccc;
	border-collapse:collapse;
	width:950px;
	 
}
.data-table tr{
	cursor:pointer;
	cursor:hand;
}

.data-table tr:nth-child(odd){
	background:#F4F4F4;
	
	}
.data-table tr th{
	border:1px solid #ccc;
	text-align:center;
	padding: 5px;
	background:#030; 
	color:#FFF;
}

.data-table tr td{
	border:1px solid #ccc;
	padding: 10px;
	vertical-align:top;
	text-align:left;
}
.data-table tr td.thumb>img{
	width:75px;
	border:1px solid #ccc;
	cursor:pointer;
	cursor:hand;
	
	}
.data-table tr td.detail:hover{
	text-decoration:underline;
	color:#060;
	
	}
.data-table tr:hover{
	background:#ddd;
	 
	}
.admin-header{
	padding:10px 20px;
	text-align:left;
	font-family: 'Conv_ThaiSansNeue-Light';
	font-size:20px;
	background:#F4F4F4;

	 
}
.admin-header span{
		color:#360; 
}
 .map {
  border: 1px solid #DDD; 
  float:left;  
  margin: 0px 0 0 0px;
  -webkit-box-shadow: #AAA 0px 0px 15px;
}
   
.cctv{
	display:none; 
	width:900px;
	z-index:9999999999;
	position:absolute;
	bottom: 0; 
	top:-100px;
	left:50%; 
	margin-left:-450px; 
	moz-border-radius:8px;
   -webkit-border-radius:8px;
    border-radius:8px;
	border:5px solid #ccc;
	-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 10px   rgba(0,0,0,0.5);
	box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	background:#FFF url(../images/header_admin.jpg) 0 0 no-repeat;
	padding:0;
	padding-bottom:35px;
	 
}
.cctv tr:nth-child(even){
	background:#F4F4F4;
	
	}
.cctv td{
	vertical-align:top;
	padding:10px;	
	
	}
.cctv td.content-left{
	text-align:right;
	width:200px;
}
 
.cctv td.content-right{
	text-align:left;
	padding-left:10px !important;
	padding-right:40px !important;
}
.cctv input, .cctv select{
	margin:0 !important;
	
	}

.event{
	width:800px; 
	margin:auto auto;
}

.event p{
	font-size:18px; 
	text-align:left
}

.popup-news{
	display:none;
	background:#fff;
	width:600px;
	height:250px;
	z-index:99;
	position:absolute;
	padding:20px;
	border:0px solid #ccc;
	top:24px;
	left:165px;
	moz-border-radius:8px;
   -webkit-border-radius:8px;
    border-radius:8px;
	-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 10px   rgba(0,0,0,0.5);
	box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
}

.popup-news .popup-left{
	width:150px;
	float:left;
	margin-top:0px;
}

.popup-news .popup-right{
	text-align:left;
	width:380px;
	height:230px;
	float:right;
}

.popup-news .time{
	color:#690;
	 
}
.popup-news .more{
	position:absolute;
	bottom:35px;
	right:35px;
	}
.byline{
	float:left; 
	margin-top:10px;
	color:#999;
	font-style:italic;
	
	}
#control{
	background:rgba(0,0,0,0.5);
	border-top:2px solid #09C;
	height:35px;
	width:400px;
	position:absolute;
	bottom:0;
	z-index:8888;
	 
	}
#control span{
	padding:7px;
	display:inline-block;
	
}
#control span.play{
	cursor:hand;
	cursor:pointer;
}
#control span.play2{
	float:right;
}
#control span #tab{
	background:url(../images/bg-tab.png) repeat-x;
	height:5px;
	width:50px;
	padding:0;
	margin-top:8px;
}
#control span #step{
	position:absolute;
	cursor:hand;
	cursor:pointer;
}
#control span.time{
	color:#CCC;
	font-size:16px;
}
.popup-news .popup-close{
	width:40px;
	 position:absolute;
	top:15px;
	right:5px;
}
.popup-news .pop-new-arr{
	 position:absolute;
	 top:-36px;
	 left:180px;
}

.popup-news .popup-close:hover{
	cursor:pointer;
}
.popup-right{
	
	margin-top:0px;
	}
 h6{
	font-size:18pt;
	color:#360;
	
}

 

.cctv h3{
	font-size:22px !important;
    font-family: 'Conv_ThaiSansNeue-Regular';
	border-bottom:1px dotted #ccc;
	padding:0 0 px !important;
	color:#FFF;
	margin:0 0 20px 0 !important; 
	 
	 
	}
 

.popup-right p{
	color:#666;
	font-size:14pt;
}
 #direction{
	position:relative;
	margin-top:10px;
	 
	 }
 #direction .img{
	float:left; 
	position:absolute;
	padding:9px;
	z-index:99919;
 }
 #direction .text{
	 
	position:absolute;
	text-align:right;
	right:0px;
	z-index:9999;

	 }
#direction .des{
	color:#FFF;
	background:rgba(0,0,0,0.5);
	padding:10px;
	margin-top:10px;
	width:370px;
	height:25px;
		-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 10px   rgba(0,0,0,0.5);
	box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
}
#direction .arrow{
		padding:10px ;
}
 
/*** Popup event****/
.popup-event{
	display:none;
	background:#fff;
	width:400px;
	z-index:98;
	position:absolute;
	padding:10px;
	border:0px solid #ccc;
	top:80px;
	left:260px;
	moz-border-radius:8px;
   -webkit-border-radius:8px;
    border-radius:8px;
	-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 10px   rgba(0,0,0,0.5);
	box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
}
#pop-cctv{
	
	top:67px;
	left:370px;
	
}
 .pin-img{
	float:left;
	width:55px;
	height:95px;
	}
#pop-cctv  .pin-img{
	width:75px;
}
#pop-news{
	top:65px;
	left:85px;
	
	}
#pop-news .title{
	font-size:22px;
	
}
.popup-event .popup-left{
	width:380px;
	float:left;
	text-align:left;
	margin-bottom:10px;
	padding-top:10px;
	
}

.popup-event .popup-left p{
	text-indent:0 !important;
	color:#666;
	font-size:14pt;
	padding:2px 5px;
}

.popup-event .popup-left p.title{
	color:#360;
	z-index:10;
}
.popup-event .popup-left p.time{
	color:#690;
}
.popup-event .popup-close{
	width:20px;
	float:right;
}
.popup-event .popup-arr{
	position:absolute;
	right:-37px;
	top:25px;
}
.popup-event .popup-arr-cctv{
	position:absolute;
	left:-37px;
	top:25px;
	z-index:5;
}

.popup-event .popup-close:hover{
	cursor:pointer;
}

.popup-event .popup-img{
	clear:both;
	width:390px;
	margin:10px auto;
}

.popup-event .popup-img img{
	width:390px;
}

#paging{
	margin:20px auto;
	 border-top:3px solid #030;
	border-bottom:1px dotted #ccc;
	padding:15px 0;
  width:950px;
	 
	}
#paging span{
	display:inline-block;
	margin:0 10px;
	
}
#paging span.active{
	color:#FFF;
	background:#ccc;
	width:20px;
	height:20px;
	moz-border-radius:50%;
   -webkit-border-radius:50%;
    border-radius:50%;
	
}
#paging button{
	width:25px;
	height:20px;
	margin:0 10px;
	
}
#list-all #paging{
 width:900px;
 margin:0 auto; 

	
	}
#news-list{
	margin:20px auto;
	text-align:left;
	width:900px;
	clear:both;
	position:relative;
	
 
}
#news-list img.thumb{
	 
	width:100px;
	
}
 
#news-list td{
	border-bottom:1px dotted #CCC;
	list-style:none;
	width:450px;
	margin:0;
	padding:15px 0; 
}
#news-list td:hover{
	background:#f4f4f4;
	cursor:hand;
	cursor:pointer;
	
	
	}
#news-list li p{
	font-size:14pt;
}
#news-list .title{
	font-size:20px !important;
    font-family: 'Conv_ThaiSansNeue-Regular';
	color:#690;
	
	}
#news-list .desc{
	padding:5px 0 10px;
}
#news-list .more a{
	color:#666;
	position:relative;
	padding-left:20px;
	 
}
#news-list .more a:before{
	content:url(../images/more.png);
	position:absolute;
	left:0px;
}
.link-news>div {
	 display:inline-block !important;
	 width:100px ;
	 vertical-align:top;
	 margin-left:15px;
	 }
.link-news>div:last-child{
	 width:295px !important;
	
	
	}	
.ratio{
	background:#C60;
	height:36px;
	padding:0;
	border:none;
	
	}
.ratio div{
	display:inline-block	
		}
.ratio div.img{
	background:#930;
	height:30px;
	padding:5px 18px 1px;
}
.ratio div.text{
	color:#fff;
	padding:0 20px;
}

#logout{
	display:none;
}

.img-sd{
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	
	-webkit-box-shadow: 1px 1px 10px rgba(50, 50, 50, 1);
	-moz-box-shadow:    1px 1px 10px rgba(50, 50, 50, 1);
	box-shadow:         1px 1px 10px rgba(50, 50, 50, 1);
	margin: 10px;
}

.news-detail{
	font-size:larger;
	text-indent:20px;
	text-align:left;
}






#register{
	width:600px;
	padding:20px;
	border:5px solid #030;
	/*moz-border-radius:8px;
   -webkit-border-radius:8px;
    border-radius:8px;*/
	-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 10px   rgba(0,0,0,0.5);
	box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	margin:25px auto;
}
#register td{
	vertical-align:top;
	/*padding:5px;*/
	
	
	}
#register td.content-left{
	text-align:right;
}
 
#register td.content-right{
	text-align:left;
}
#register input{
	
	
	}
#register label{
	cursor:hand;
	cursor:pointer;
	
	}
p.indent{
	font-size:larger;
	text-indent:20px;
	text-align:left;
	font-size:20px;
	padding :25px 0;
	text-align:justify;
}
#map-info{
	position:absolute;
	top:0px;
	left:0px;
	color:#FFF;
	background:#033;
	padding:9px 5px 8px 15px;
	/*-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;*/
	height:19px;
	cursor:pointer;
	cursor:hand;
	 -webkit-touch-callout: none; 
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none; 
	/*	-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 10px   rgba(0,0,0,0.5);
	box-shadow: 0px 0px 10px rgba(0,0,0,0.5);*/
	z-index:8 ;	
	 
	text-align:left;
	border-left:10px solid #FFF;
	border-right:10px solid #FFF;
	}
#map-info:after{
	 padding:5px;
	content:url('../images/maximize.png');
	
	}
#menu-0>ul{
	top:78px;
	left:10px;
/*width:38px !important;
overflow:hidden;*/
display:none;
z-index:19 ;	
}
input.input-count{
width:50px;
text-align:center;	
	
	}
input.input-count.left-top{
	display:block;
	margin-bottom:15px !important;
	
	
}
.input-count2{
 
	margin-bottom:5px !important;
	
	
}
.margin5{
	margin :5px;
	
	}
	
#switchBtn{
	position:absolute;
	right:0;
	
	
	}	
	
#switchBtn:hover{
	cursor:pointer;
	cursor:hand;
	
	
	
	}
#switchBtn li img{
	margin-left:15px;
	
	
	}
#switchBtn li.text{
	 color:#FFF;
	}