/*----- common -----*/
body {		
	background-color:rgb(42,42,42);	
	margin: 0px;
}

.page_title{
	font:13px "微軟正黑體", Arial, Helvetica, sans-serif;
	color: rgb(255,255,255);
	background-color: rgb(64,64,64);
	font-weight:bold;	
	padding-left: 20px;
	padding-top: 5px;
	padding-bottom: 5px;
	border: #aaaaaa 0px solid;
	margin: 0px;
}

.btn{	
	color: #ffffff;
	background:url('images/bg_active.png') repeat 0px 0px;	
	border: #3079ed 1px solid;
	padding:3px 15px 3px 15px;
	behavior:url(csshover.htc);
	width: 120px;
	height: 27px;
}

.btn:hover{	
	background:url('images/btn_hover.png') repeat 0px 0px;	
	cursor: pointer;
}

.btn:active{
	background:url('images/btn_down.png') repeat 0px 0px;	
}

.btn[disabled]{
	color: #777777;
	background-color: #cccccc;
	border: #777777 1px solid;		
}

.btn[disabled]:hover{
	cursor: default;	
}

.btn2{	
	color: #ffffff;
	background-color: #4a8aff;
	border: #3079ed 1px solid;
	padding:5px;
	behavior:url(csshover.htc);
}

.btn2:hover{	
	background-color: #3079ed;
	cursor: pointer;
}

/*---- login ----*/
.login-table{
	font:15px "微軟正黑體", Arial, Helvetica, sans-serif;
	background-color: rgb(30,30,30);
	border: 0px;
	width: 400px;
}

.login-title {
	font:17px "微軟正黑體", Arial, Helvetica, sans-serif;
	color: rgb(255,255,255);
	background:url('images/bg.png') repeat 0px 0px;
	height: 30px;
	width: 100%;
	border-color: rgb(255,0,0);
	font-weight: bold;	
}

.login-footer{
	color: rgb(255,255,255);
	background-color: rgb(60,60,60);
	height: 30px;
	width: 100%;
	border-color: rgb(255,0,0);
}

.login-table2{
	font:15px "微軟正黑體", Arial, Helvetica, sans-serif;
	color: rgb(240,240,240);
	border: 0px;
	padding: 10px;	
}


.login-table a{
	text-decoration: none;	
	color: rgb(140,140,140);
}

.login-table a:hover{
	text-decoration: underline;
	color: rgb(255,198,0);	
}

.page_condition {
	font:13px "微軟正黑體", Arial, Helvetica, sans-serif;
	background-color: rgb(45,45,45);	
	color: rgb(255,255,255);	
	padding: 10px;
}

.page_condition td:hover{
	color: rgb(255,198,0);
}

.page_condition span{
	color: rgb(255,255,255);
}

.download_link a{
	font : 14px "微軟正黑體", Arial, Helvetica, sans-serif;
	/*color:#013d6a;*/
	color: #ffffff;
	text-decoration: none;
}

.download_link a:hover{	
	text-decoration: underline;
	color: rgb(255,198,0);	
}

/*----- top frame -----*/
.banner{
	background:url('images/banner.png') repeat 0px 0px;	
}

.header{
	float:right;
	padding-right:10px;
	padding-top: 3px;
}

.header span{
	font : 13px "微軟正黑體", Arial, Helvetica, sans-serif;
	color: #ffffff;
	margin: 0px;
}

.header a{
	font : 13px "微軟正黑體", Arial, Helvetica, sans-serif;
	color: #ffffff;	
	text-decoration: none;
}

.header a:hover{
	color: #ffffff;
	text-decoration: underline;	
}

/*----- option frame -----*/
.option_body{
	border-right: 1px solid #000;

}

#main_menu{		
	font : 13px "微軟正黑體", Arial, Helvetica, sans-serif;	
	min-height: 93%;	
}

#closemenu_btn{		
	behavior:url(csshover.htc);	
}

#closemenu_btn:hover{
	cursor: pointer;
}

.menutitle {	
	font : 15px "微軟正黑體", Arial, Helvetica, sans-serif;		
	background:url('images/bg.png') repeat 0px 0px;	
	behavior:url(csshover.htc);
	margin: 0px;
	padding-left: 10px;
	padding-top: 3px;
	padding-right: 10px; 			
	height: 29px;
}

.menutitle table{		
	width: 100%;
	color: #ffffff;
	padding: 0px;
	border: 0px;
	border-spacing: 0px;
}

.menutitle table:hover{
	cursor: pointer;
	cursor: hand;		
}

.menu{
	MARGIN: 0px; 
	LIST-STYLE-TYPE: none; 	
	padding: 0px;
}

.menu li, .menu_item, .menu_item_active{
	
	background-color: rgb(30,30,30);
	font : 13px "微軟正黑體", Arial, Helvetica, sans-serif;	
	padding-right: 2px;
	padding-left: 30px;	
	padding-top: 5px;
	padding-bottom: 5px;
	behavior:url(csshover.htc);	
}

.menu li, .menu_item{
	color: rgb(192,192,192);
}

.menu li:hover, .menu_item:hover{
	/*background:url('images/bg_hover.png') repeat 0px 0px;*/
	background-color: rgb(61,148,184);
	color: #ffffff;
	cursor: pointer;
	cursor: hand;	
}

.menu li.menu_item_active{	
	/*background:url('images/bg_active.png') repeat 0px 0px;	*/
	color: rgb(255,198,0);	
}

/*----- live ocx -----*/
.live_toolbar{
	background-color: #000000;
	behavior:url(csshover.htc);		
}

.live_toolbar div:hover{
	cursor: pointer;
}

.img_option{
	background:url('images/LiveX/icright_doc.png') no-repeat 0px 0px;
	width:32px; 
	height:32px;	 	
}

.img_option:hover{
	background:url('images/LiveX/icright_doc_hover.png') no-repeat 0px 0px;	
}

.img_change_camera{
	background:url('images/LiveX/icright_spotout.png') no-repeat 0px 0px;
	width:32px; 
	height:32px;	 	
}

.img_change_camera:hover{
	background:url('images/LiveX/icright_spotout_hover.png') no-repeat 0px 0px;	
}

.img_ptz{
	background:url('images/LiveX/icright_ptz.png') no-repeat 0px 0px;
	width:32px; 
	height:32px;	 	
}

.img_ptz:hover{
	background:url('images/LiveX/icright_ptz_hover.png') no-repeat 0px 0px;	
}

.img_io{
	background:url('images/LiveX/icright_io.png') no-repeat 0px 0px;
	width:32px; 
	height:32px;	 	
}

.img_io:hover{
	background:url('images/LiveX/icright_io_hover.png') no-repeat 0px 0px;	
}

.img_play{
	background:url('images/LiveX/ic32_play.png') no-repeat 0px 0px;
	width:32px; 
	height:32px;	 	
}

.img_play:hover{
	background:url('images/LiveX/ic32_play_hover.png') no-repeat 0px 0px;	
}

.img_stop{
	background:url('images/LiveX/ic32_stop.png') no-repeat 0px 0px;
	width:32px; 
	height:32px; 	
}

.img_stop:hover{
	background:url('images/LiveX/ic32_stop_hover.png') no-repeat 0px 0px;
}

.img_mic{
	background:url('images/LiveX/ic32_mic.png') no-repeat 0px 0px;
	width:32px; 
	height:32px; 	
}

.img_mic:hover{
	background:url('images/LiveX/ic32_mic_hover.png') no-repeat 0px 0px;
}

.img_audio{
	background:url('images/LiveX/ic32_audio.png') no-repeat 0px 0px;
	width:32px; 
	height:32px; 	
}

.img_audio:hover{
	background:url('images/LiveX/ic32_audio_hover.png') no-repeat 0px 0px;
}

.img_snapshot{
	background:url('images/LiveX/ic32_snapshot.png') no-repeat 0px 0px;
	width:32px; 
	height:32px; 	
}

.img_snapshot:hover{
	background:url('images/LiveX/ic32_snapshot_hover.png') no-repeat 0px 0px;
}

.img_change_quality{
	background:url('images/LiveX/ic32_stream.png') no-repeat 0px 0px;
	width:32px; 
	height:32px; 	
}

.img_change_quality:hover{
	background:url('images/LiveX/ic32_stream_hover.png') no-repeat 0px 0px;
}

.img_save_file{
	background:url('images/LiveX/ic32_download.png') no-repeat 0px 0px;
	width:32px; 
	height:32px; 	
}

.img_save_file:hover{
	background:url('images/LiveX/ic32_download_hover.png') no-repeat 0px 0px;
}

.img_fullscreen{
	background:url('images/LiveX/ic32_expand.png') no-repeat 0px 0px;
	width:32px; 
	height:32px; 	
}

.img_fullscreen:hover{
	background:url('images/LiveX/ic32_expand_hover.png') no-repeat 0px 0px;
}

/*----- multiview -----*/
.cam_menu td{
	behavior:url(csshover.htc);
	background-color: rgb(50,50,50);
	color: rgb(255,255,255); 
	font-size: 17px; 
	font-weight:bold;	
	width:36px;
}

.cam_menu td[disabled]{	
	background-color: rgb(50,50,50);
	color: rgb(100,100,100); 
	font-size: 17px; 
	font-weight:bold;	
	width:36px;
	cursor: default;
}

.cam_menu td:hover{
	background-color: rgb(61,148,184);	
	cursor: pointer;
}

.cam_menu td[disabled]:hover{
	background-color: rgb(61,148,184);	
	cursor: default;
}

.multiwindow_title{
	font:13px "微軟正黑體", Arial, Helvetica, sans-serif;
	color: rgb(255,255,255);
	background:url('images/bg.png') repeat 0px 0px;	
	font-weight:bold;	
	padding-left:3px;
	border: rgb(190,190,190) 1px solid;	
}

/*----- download center -----*/
.DownloadHeader{
	font : 14px "微軟正黑體", Arial, Helvetica, sans-serif;
	color: rgb(255,255,255);
	background:url('images/bg.png') repeat 0px 0px;
	text-align: left;
}

.DownloadContent{
	font : 14px "微軟正黑體", Arial, Helvetica, sans-serif;
	color: rgb(255,255,255); 
	background-color: rgb(50,50,50);	
	text-align: left;
}

.DownloadContent2{
	font : 14px "微軟正黑體", Arial, Helvetica, sans-serif;
	color: rgb(140,140,140); 
	background-color: rgb(50,50,50);
	text-align: left;
}

.DownloadSize{
	font : 14px "微軟正黑體", Arial, Helvetica, sans-serif;
	color: rgb(255,255,255); 
	background-color: rgb(64,64,64);
	text-align: left;
}

/*----- rpb -----*/
.query_info{
	font: 14px "微軟正黑體", Arial, Helvetica, sans-serif;
	color: rgb(255,255,255); 
	background-color: rgb(52,52,52);
	border: 1px solid rgb(42,42,42);
}

.query_info td{
	border: 0px solid rgb(42,42,42);
	padding-right: 10px;
	padding-bottom: 5px;
}

.query_result_header{
	font: 14px "微軟正黑體", Arial, Helvetica, sans-serif;
	color: rgb(255,255,255); 
	background-color:rgb(100,100,100);
}

.query_result{
	font: 14px "微軟正黑體", Arial, Helvetica, sans-serif;
	color: rgb(192,192,192); 
	background-color:rgb(52,52,52);
}

.query_result:hover{
	background-color: rgb(61,148,184);
	color: rgb(255,255,255); 
}

.query_result_focus{
	font: 14px "微軟正黑體", Arial, Helvetica, sans-serif;	
	color: rgb(255,198,0);	
	background-color:rgb(52,52,52);
}

.query_result_focus:hover{
	background-color: rgb(61,148,184);	
}

.page_control{
	font: 13px "微軟正黑體", Arial, Helvetica, sans-serif;
	color: rgb(192,192,192); 	
	position: relative;
	right: 5px;
}

/*----- live view ptz control -----*/
.live_control{	
	border:#dddddd 1px solid;
	padding: 10px;
	width: 280px;
	background-color: rgb(42,42,42);	
}

.live_control_title{
	font:15px "微軟正黑體", Arial, Helvetica, sans-serif;
	color: #ffffff;	
	font-weight: bold;		
}

.live_control_text{
	font:12px "微軟正黑體", Arial, Helvetica, sans-serif;
	color: #ffffff;	
}

.live_control hr{
	width:100%;
	border:#dddddd 1px solid;
}

.ptz_left{
	background:url('images/LiveX/left.png') no-repeat 0px 0px;		
}

.ptz_right{
	background:url('images/LiveX/right.png') no-repeat 0px 0px;			
}

.ptz_up{
	background:url('images/LiveX/up.png') no-repeat 0px 0px;			
}

.ptz_down{
	background:url('images/LiveX/down.png') no-repeat 0px 0px;			
}

.ptz_left_up{
	background:url('images/LiveX/left_up.png') no-repeat 0px 0px;		
}

.ptz_right_up{
	background:url('images/LiveX/right_up.png') no-repeat 0px 0px;		
}

.ptz_left_down{
	background:url('images/LiveX/left_down.png') no-repeat 0px 0px;		
}

.ptz_right_down{
	background:url('images/LiveX/right_down.png') no-repeat 0px 0px;		
}

.ptz_home{	
	background:url('images/LiveX/home.png') no-repeat 0px 0px;			
}

.ptz_zoomin{
	background:url('images/LiveX/zoomin.png') no-repeat 0px 0px;			
}

.ptz_zoomout{
	background:url('images/LiveX/zoomout.png') no-repeat 0px 0px;			
}

.ptz_autofocus{
	background:url('images/LiveX/autofocus.png') no-repeat 0px 0px;			
}

.ptz_left, .ptz_right, .ptz_up, .ptz_down, .ptz_left_up, .ptz_right_up, .ptz_left_down, .ptz_right_down, .ptz_home, .ptz_zoomin, .ptz_zoomout, .ptz_autofocus{
	width: 32px;
	height: 32px;	
	behavior:url(csshover.htc);
}

.ptz_left:hover, .ptz_right:hover, .ptz_up:hover, .ptz_down:hover, .ptz_left_up:hover, .ptz_right_up:hover, .ptz_left_down:hover, .ptz_right_down:hover, .ptz_home:hover, .ptz_zoomin:hover, .ptz_zoomout:hover, .ptz_autofocus:hover{	
	background-position: -32px 0;
	cursor: pointer;
}

.ptz_left:active, .ptz_right:active, .ptz_up:active, .ptz_down:active, .ptz_left_up:active, .ptz_right_up:active, .ptz_left_down:active, .ptz_right_down:active, .ptz_home:active, .ptz_zoomin:active, .ptz_zoomout:active, .ptz_autofocus:active{	
	background-position: -64px 0;	
}

/*------ live control ----------*/
.btn_play{
	background:url('images/LiveX/bn_play.png') no-repeat 0px 0px;
	width:32px;
	height:32px;
}
.btn_stop{
	background:url('images/LiveX/bn_stop.png') no-repeat 0px 0px;	
	width:32px;
	height:32px;
}
.btn_snapshot{
	background:url('images/LiveX/bn_snapshot.png') no-repeat 0px 0px;		
	width:32px;
	height:32px;
}

.btn_play:hover, .btn_stop:hover, .btn_snapshot:hover, .btn_fullscreen:hover{
	background-color: #d3d3d3;
	cursor: pointer;
}

.btn_fullscreen{
	background:url('images/LiveX/bn_fullscreen.png') no-repeat 0px 0px;
	width:32px;
	height:32px;
}