/* start global */
body {
	font-size:13px;
	line-height:1.3em;
	font-family:Arial, Verdana, Tahoma, sans-serif;
	color:#1e2046;
	background:url(../images/bg-short.jpg) no-repeat top center;
}
body.home{
	background:url(../images/bg.jpg) no-repeat top center !important;
}
h1 {
	font-size:20px;
	padding:5px 0;
}
h2 {
	font-size:18px;
	padding:5px 0;
}
h3 {
	font-size:16px;
	padding:5px 0;
}
h4 {
	font-size:14px;
	padding:0 0 5px 0;
}
h5 {
	font-size:12px;
}
h6 {
	font-size:10px;
}
a {
	text-decoration:none;
	color:#fff;
}
a:hover {
	color:#1e1d4b;
	text-decoration:underline;
}
.left{
	float:left;
}
.right{
	float:right;
}
/* end global */
div#wrapper {
	width:960px;
	margin:0 auto;
}


div#header {
	width:950px;
	margin:0 auto;
	margin-top:30px;
}


div#header .logo{
	width:502px;
	height:52px;
	/*background:url(../images/logo.png) no-repeat 0 0;*/
}
div#header .logo a{
	display:block;
	width:502px;
	height:52px;
}


div#header .shortcut{
	/*width:290px;*/
	color:#fff;
}
div#header .shortcut span{
	display:inline-block;
	padding-left:15px;
	text-align:center;
	line-height:17px;
}
div#header .shortcut span a:hover{
	color:#fff;
}

div#header .nav{
	height:38px;
	margin-top:20px;
	*margin-top:40px;
	_margin-top:40px;	
}

div#header .nav a{
	display:block;
	float:left;
	height:38px;
	text-indent:-99999px;
}
div#header .nav a.news{
	background:url(../images/nav-bg.png) no-repeat 0 0;	
	width:91px;	
}
div#header .nav a.map{
	background:url(../images/nav-bg.png) no-repeat -92px 0;	
	width:182px;	
}
div#header .nav a.academic{
	background:url(../images/nav-bg.png) no-repeat -275px 0;	
	width:194px;	
}
div#header .nav a.light-pollution{
	background:url(../images/nav-bg.png) no-repeat -469px 0;
	width:132px;
}
div#header .nav a.reference{
	background:url(../images/nav-bg.png) no-repeat -601px 0;
	width:115px;
}
div#header .nav a.organizers{
	background:url(../images/nav-bg.png) no-repeat -716px 0;
	width:127px;
}
div#header .nav a.past-survey{
	background:url(../images/nav-bg.png) no-repeat -843px 0;
	width:107px;
}
div#header .nav li{
	float:left;
}
div#header .nav a:hover{
	cursor:pointer;
}

div#header .nav a.news:hover, div#header .nav li.selected a.news{
	background-position:0 -38px;
}
div#header .nav a.map:hover, div#header .nav li.selected a.map{
	background-position:-92px -38px;
}
div#header .nav a.academic:hover, div#header .nav li.selected a.academic{
	background-position:-275px -38px;
}
div#header .nav a.light-pollution:hover, div#header .nav li.selected a.light-pollution{
	background-position:-469px -38px;
}
div#header .nav a.reference:hover, div#header .nav li.selected a.reference{
	background-position:-601px -38px;
}
div#header .nav a.organizers:hover, div#header .nav li.selected a.organizers{
	background-position:-716px -38px;
}
div#header .nav a.past-survey:hover, div#header .nav li.selected a.past-survey{
	background-position:-843px -38px;
}

div#header .section{
	margin:30px 0 0 30px;
	height:90px;
}
div#header .section-news{
	background:url(../images/section-news.png) no-repeat 0 0;
	width:244px;
}
div#header .section-hk-light-pollution-map{
	background:url(../images/section-hk-light-pollution-map.png) no-repeat 0 0;
	width:407px;
}

div#header .section-academic-areas{
	background:url(../images/section-academic-areas.png) no-repeat 0 0;
	width:310px;
}

div#header .section-light-pollution{
	background:url(../images/section-light-pollution.png) no-repeat 0 0;
	width:244px;	
}

div#header .section-reference{
	background:url(../images/section-reference.png) no-repeat 0 0;
	width:195px;
}
div#header .section-co-organizers{
	background:url(../images/section-co-organizers.png) no-repeat 0 0;
	width:258px;
}
div#header .section-contact-us{
	background:url(../images/section-contact-us.png) no-repeat 0 0;
	width:210px;
}
div#header .section-about-nsn{
	background:url(../images/section-about-nsn.png) no-repeat 0 0;
	width:210px;
}

div#content {
	clear:both;
	width:960px;
	margin-top:20px;
}
body.home #content{
	margin-top:280px !important;
}
div#content .content-top{
	height:20px;
	background:url(../images/content-top-bg.png) no-repeat top center;
}

div#content .content-details{
	padding-top:10px;
	background:url(../images/content-bg.png) repeat-y 0 0;
}

div#content .content-details .breadcrumb{
	background-color:#999;
	color:#fff;
	font-size:12px;
	margin:5px 6px 25px 6px;
	padding:1px 0;
	*padding-top:3px;
}
div#content .content-details .breadcrumb a:hover{
	color:#fff;
}

div#content .content-details .no-menu a{
	color:#1E2046;
	text-decoration:underline;
}
div#content .content-details .no-menu a:hover{
	color:#333333;
}
div#content .content-details .no-menu td.logo{
	width:250px;
	height:40px;
}
div#content .content-details .no-menu td.logo img{
	height:40px;
}
div#content .content-details .no-menu p{
	padding-bottom:10px;
}
div#content .content-details .no-menu ul{
	padding:10px 0;
}
div#content .content-details .no-menu ul li{
	background:url(../images/square.gif) no-repeat left 5px;
	padding:2px 0 2px 20px;
}

div#content .content-details .no-menu .contact td{
	padding:2px 0px;
}
div#content .content-details .no-menu .contact td a{
	text-decoration:none;
}
div#content .content-details .no-menu .contact td a:hover{
	text-decoration:underline;
}
div#content .content-details .no-menu .site-details th{
	background-color:#ddd;
	border:1px solid #ccc;
	padding:10px 5px;
	vertical-align:middle;
}
div#content .content-details .no-menu .site-details td{
	padding:10px;
	text-align:center;
	border:1px solid #CCCCCC;
}
div#content .content-details .no-menu .site-details td a{
	text-decoration:underline;
}
div#content .content-details .no-menu .site-details td a:hover{
	text-decoration:underline;
}


div#content .content-details .container{
	width:890px;
	margin:0 auto;
}
div#content .content-details .container .back-btn a{
	float:right;
	color:#1E1D4B;
	background: url("../images/arrow.gif") no-repeat scroll 0 5px transparent;
	padding-left:15px;
	vertical-align:baseline;
}
div#content .content-details .container .back-btn a:hover{
	color:#777;
}
	
div#content .content-details .container .title{
	border-bottom:5px solid #ddd;
	padding-bottom:5px;
	margin-bottom:10px;
}
div#content .content-details .container .news-details .date{
	padding-bottom:5px;
}
div#content .content-details .container .news-details .title {
	border:0;
	border-bottom:1px dotted #1E2046;
}
div#content .content-details .container .news-details .title span{
	display:block;
	font-size:18px;
	font-weight:bold;
	padding:5px 0;
}
div#content .content-details .container .news-details .details div{
	padding-bottom:15px;
}
div#content .content-details .container .news-details .details .news-photos img{
	width:270px;
}
div#content .content-details .container .news-details .details .news-photos{
	text-align:center;
	float:left;
	display:inline-block;
	width:270px;
	padding:5px;
}
div#content .content-details .container .news-details .details .news-photos span{
	display:block;
}
div#content .content-details .container .news-details .details div p{
	padding-bottom:10px;
}
div#content .content-details .container .about-nsn div{
	padding-bottom:15px;
}

div#content .content-details .container .index-map{
	margin:0 auto;
	margin-top:20px;
	font-size:11px;
}
div#content .content-details .container .index-map .top{
	margin:0 auto;
	width:873px;
	position:relative;
}
div#content .content-details .container .index-map .top .map-header{
	background-color:#1e2046;
	width:611px;
	color:#fff;
	padding:8px 0 8px 7px;
	*padding-bottom:7px;
}
div#content .content-details .container .index-map .top .map-header span{
	display:inline-block;
	text-align:left;
	line-height:14px;
	padding-right:2px;
}
div#content .content-details .container .index-map .top .map-header span.choice{
	text-align:right;
	padding-right:2px;
}
div#content .content-details .container .index-map .top .map-header select{
	margin:4px 0;
	font-size:12px;
}

div#content .content-details .container .index-map .map-info{
	margin:0 auto;
	background:url(../images/map-info.png) no-repeat 0 0;
	height:119px;
	position:relative;
	top:-10px;
	background-position:1px 0 \9;
}
div#content .content-details .container .additional-info{
	margin-top:10px;
}
div#content .content-details .container .additional-info div{
	height:66px;
	display:inline-block;
	padding-right:8px;
	float:left;
}
div#content .content-details .container .additional-info div span{
	float:right;
	line-height:60px;
	font-size:15px;
	font-weight:bold;
	text-align:center;
	text-indent:0;
	*line-height:normal;
}
div#content .content-details .container .additional-info .current-moon-age{
	background:url(../images/current-moon-age.jpg) no-repeat 0 0;
	width:172px;
	text-indent:-99999px;
}
div#content .content-details .container .additional-info .end-time-of-twlight{
	background:url(../images/end-time-of-twlight.jpg) no-repeat 0 0;
	width:234px;
	text-indent:-99999px;	
}
div#content .content-details .container .additional-info .start-time-of-twlight{
	background:url(../images/start-time-of-twlight.jpg) no-repeat 0 0;
	width:245px;
	text-indent:-99999px;
}
div#content .content-details .container .additional-info .number-of-sites{
	background:url(../images/number-of-sites.jpg) no-repeat 0 0;
	width:215px;
	padding-right:0;
	text-indent:-99999px;
}

div#content .content-details .container .additional-info .current-moon-age span{
	width:54px;
}
div#content .content-details .container .additional-info .end-time-of-twlight span{
	width:62px;
}
div#content .content-details .container .additional-info .start-time-of-twlight span{
	width:68px;
}
div#content .content-details .container .additional-info .number-of-sites span{
	width:46px;
}

div#content .content-details .container .three-column{
	padding-top:30px;
}
div#content .content-details .container .three-column p{
	color:#383838;
}

div#content .content-details .container .three-column .brief{
	width:654px;
}

div#content .content-details .container .three-column .brief .article{
	width:654px;
	padding-right:27px;
}
div#content .content-details .container .three-column .brief .article .context{
	margin-top:15px;
	margin-bottom:5px;
	height:82px;
}
div#content .content-details .container .three-column .brief .article .context img{
	width:95px;
	height:82px;
	float:left;
	padding-right:15px;
	vertical-align:middle;
}

div#content .content-details .container .three-column .brief .intro{
	width:375px;
	padding-right:27px;
}
div#content .content-details .container .three-column .brief .intro span img{
	padding-bottom:15px;
}

div#content .content-details .container .three-column .download{
	width:236px;
	height:190px;
	background:url(../images/download-bg.jpg) no-repeat 0 0;
}
div#content .content-details .container .three-column .download ul{
	padding-top:60px;
	width:175px;
	margin:0 auto;
}
div#content .content-details .container .three-column .download ul li{
	background:url(../images/square.gif) no-repeat left center;
	padding-left:20px;
	margin-bottom:8px;
}
div#content .content-details .container .three-column .download ul li a{
	color:#444;
	display:inline-block;
}

div#content .content-details .container .three-column .more a{
	float:right;
	color:#383838;
	font-size:11px;
}
div#content .content-details .container table.news-context{
	border-top:1px dotted #777;
}
div#content .content-details .container table.news-context td{
	border-bottom:1px dotted #777;
	padding:10px 0;
}
div#content .content-details .container table.news-context td a span{
	text-decoration:underline;
	color:#1e2046;
	display:block;
}
div#content .content-details .container table.news-context td a:hover span{
	color:#777;
}

div#content .content-details .container table.news-context td.date{
	width:15%;
	
}
div#content .content-details .container table.news-context td.date span{
	border-left:5px solid #1e2046;
	padding-left:5px;
}
div#content .content-details .container table.news-context td.arrow{
	width:1%;
	background:url(../images/arrow.gif) no-repeat 0 15px;
}
div#content .content-details .container table.news-context td.link{
	width:84%;
	padding-left:10px;
}


div#content .content-details .container .side-menu{
	width:245px;
	padding-right:20px;
	_padding-right:10px;
}
div#content .content-details .container .side-menu ul li{	
	margin-bottom:1px;
	background-color:#333;
	width:228px;
}
div#content .content-details .container .side-menu ul li span{
	display:block;
}
div#content .content-details .container .side-menu ul li a{
	display:block;
	padding:15px;
	color:#fff;
}
div#content .content-details .container .side-menu ul li.selected{
	background-color:#787878;
	width:228px
}
div#content .content-details .container .side-menu ul li a.selected,
div#content .content-details .container .side-menu ul li a.selected:hover{
	background:url(../images/side-menu-active-bg.jpg) no-repeat -1px 0 ;
	width:203px;
	padding-right:25px;
}
div#content .content-details .container .side-menu ul li a:hover{
	color:#fff;
	background-color:#787878;
	text-decoration:none;
}
div#content .content-details .container .side-menu ul li ul{
	background-color:#fff;
}
div#content .content-details .container .side-menu ul li ul li{
	color:#000;
	margin-bottom:0;
	background-color:#bbb;
	width:228px;	
}
div#content .content-details .container .side-menu ul li ul li a{
	padding-left:35px;
	padding-top:10px;	
	padding-bottom:10px;
	background:url(../images/side-menu-arrow.png) no-repeat 15px 12px #bbb;
	padding-right:13px \9;
	_background:url(../images/side-menu-arrow.png) no-repeat 15px 15px #bbb;
	_padding-top:1px;
}
div#content .content-details .container .side-menu ul li ul li a.selected,
div#content .content-details .container .side-menu ul li ul li a.selected:hover{
	width:179px;
	background:url(../images/side-menu-pattern.gif) repeat 0 0;
	color:#000;
}
div#content .content-details .container .side-menu ul li ul li.selected{
	background:url(../images/side-menu-pattern.gif) repeat 0 0;
}
div#content .content-details .container .side-menu ul li ul li.selected a,
div#content .content-details .container .side-menu ul li ul li.selected a:hover{
	background:url(../images/side-menu-active-arrow.png) no-repeat 15px 12px;
}


div#content .content-details .container .inner-content{
	display:inline-block;
	width:625px;
}
div#content .content-details .container .inner-content p{
	padding-bottom:10px;
}
div#content .content-details .container .inner-content p.caption{
	font-size:12px;
	font-weight:bold;
}
div#content .content-details .container .inner-content a{
	color:#1E2046;
	text-decoration:underline;
}
div#content .content-details .container .inner-content a:hover{
	color:#333;
}
div#content .content-details .container .inner-content ul{
	padding:15px 0;
}
div#content .content-details .container .inner-content ul li{
	background:url(../images/square.gif) no-repeat left 5px;
	padding-left:20px;
}
div#content .content-details .container .inner-content table tr th{
	background-color:#ddd;
	border:1px solid #ccc;
	padding:10px 5px;
}
div#content .content-details .container .inner-content table tr td{
	text-align:center;
	padding:10px;
	border:1px solid #ccc;
}
div#content .content-details .container .inner-content table tr td.date{
	text-align:center;
	width:75px;
}

div#content .content-details .container .inner-content .large-image{
	padding-bottom:20px;	
}
div#content .content-details .container .inner-content .large-image img{
	width:625px;
}
div#content .content-details .container .inner-content .large-image p{
	padding-top:5px;
}
div#content .content-details .container .inner-content .two-column .context{
	clear:both;
	padding-bottom:10px;
	display:inline-block;
}
div#content .content-details .container .inner-content .two-column .small-image img{
	width:300px;
}
div#content .content-details .container .inner-content .two-column .left{
	padding-right:25px;
}
div#content .content-details .container .inner-content .two-column .left,
div#content .content-details .container .inner-content .two-column .right{
	width:300px;
	line-height:20px;
	color:#1f1e46;
	text-align:justify;
}

div#footer {
	width:960px;
	height:273px;
	background:url(../images/footer-bg.jpg) no-repeat top center;
	margin:0 auto;
	text-indent:-99999px;
	clear:both;
}
div#footer .disclaimer{
	background:url(../images/disclaimer.jpg) no-repeat 0 0;
	height:171px;
	width:545px;
	margin-top:75px;
	margin-left:30px;
	
}
div#footer .logo{
	background:url(../images/logo.jpg) no-repeat 0 0;
	width:286px;
	height:127px;
	margin-top:75px;
	margin-right:30px;
}
div#footer .logo a.hku {
	display:block;
	width:235px;
	height:58px;
}
div#footer .logo a.ecf {
	display:block;
	width:284px;
	height:60px;
	margin-top:6px;
}

.google-map-bubble{
	width:245px;
	font-size:12px;
}
.google-map-bubble a{
	color:#1e2046;
}
.google-map-bubble .bubble-top{
	border:4px solid #1e2046;
	padding:8px;
	background-color:#fff;
}
.google-map-bubble .bubble-top .bubble-name-ch{
	font-weight:bold;
	font-size:13px;
	clear:both;
}
.google-map-bubble .bubble-top .bubble-name-en{
	font-weight:bold;
	font-size:13px;
}
.google-map-bubble .bubble-top .bubble-link a{
	font-size:11px;
	color:#1e2046;
}
.google-map-bubble .bubble-top .bubble-more a{
	font-size:11px;
	color:#1e2046;
	text-decoration:underline;
	vertical-align:baseline;
}
.google-map-bubble .bubble-top .bubble-data{
	padding:10px 0;
}
.google-map-bubble .bubble-top .bubble-data td{
	padding:0 5px 0 0 !important;
	margin:0 !important;
}
.google-map-bubble .bubble-top .bubble-data td.title{
	font-weight:bold;
	border:none !important;
	text-align:right;
}
.google-map-bubble .bubble-top .bubble-update-time{
	font-size:11px;
}
.google-map-bubble .bubble-top .bubble-close{
	display:block;
	width:9px;
	height:15px;
	float:right;
	cursor:pointer;
	
}

.google-map-bubble .bubble-bottom{ 
	background:url(../images/bubble-arrow.png) no-repeat 0 0;
	width:21px;
	height:12px;
}
.clear {
	clear:both;
	overflow:hidden;
}
.none {
	display:none;
}

div#header .shortcut .right{
	display:none;
}