@charset "utf-8";
@media screen and (max-width: 720px) {

html, body, table{margin: 0;padding: 0;border: 0;}
body{font-family:Arial,sans-serif;line-height:1.5;font-size:1em;background: #fff;color: #000;word-wrap: break-word;-webkit-text-size-adjust: none;}
h1, h2, h3, h4, h5, h6{ font-weight: normal; }
p img { float: left; margin: 0 10px 5px 0; padding: 0; }
img { border: 0; max-width: 100%; height: auto;}
table { width: auto;border-collapse: collapse;border-spacing: 0; }

body{margin:0; padding:0; width:100%;}
#container,#footer div,#logo div,#nag,#footer{width:100%; margin:auto;}
#wrapper_940{margin:0;}

#logo div{width:96%; margin:0 2%;}
#logo div img{width:200px; height:60px;}

#nag{width:100%; height:auto; margin:0; background:url(images/nag_bg.jpg) repeat;}
#nag ul{width:100%;}
/**/
#nag ul li a {width:48px !important;}
#nag ul li.bt0 a{background:url(mobile/images/nag_index.jpg) no-repeat;}
#nag ul li.bt1 a{background:url(mobile/images/nag_intro.jpg) no-repeat;}
#nag ul li.bt2 a{background:url(mobile/images/nag_conductor.jpg) no-repeat;}
#nag ul li.bt3 a{background:url(mobile/images/nag_committee.jpg) no-repeat;}
#nag ul li.bt4 a{background:url(mobile/images/nag_member.jpg) no-repeat;}
#nag ul li.bt5 a{background:url(mobile/images/nag_perform.jpg) no-repeat;}
#nag ul li.bt6 a{background:url(mobile/images/nag_oversea.jpg) no-repeat; width:78px !important;}
#nag ul li.bt7 a{background:url(mobile/images/nag_recording.jpg) no-repeat;}
#nag ul li.bt8 a{background:url(mobile/images/nag_review.jpg) no-repeat; width:78px !important;}
#nag ul li.bt9 a{background:url(mobile/images/nag_studio.jpg) no-repeat;}
#nag ul li.bt10 a{background:url(mobile/images/nag_contactus.jpg) no-repeat;}
#nag ul li.bt11 a{background:url(mobile/images/nag_video.jpg) no-repeat;}

#container{margin:1em 0; padding:0;}
#slideshow{clear:both;}
#wrapper_940,#slideshow{width:96%; padding:0 2%;}
#footer .boxright{display:none;}

#index #index_left-col,#index #index_right-col,#index #h2_hkmlco,#index #h2_perform,#index #h2_conductor,#index #h3_oversea,#index #h3_recording{width:100%; margin:0; padding:0;}
#index #h2_perform{min-height:0; margin-bottom:20px;}
#index #h2_perform h3{font-size:inherit; margin-bottom:auto;}
#index #h2_perform img{display: block; float:none;}
#index #h2_conductor .hmc,#index #h2_conductor .wsf{width:100%; float:none; clear:both; margin-bottom:20px;}
#index #h2_conductor .conductor_text{display:block; float:none; width:100%;}
#index #h3_oversea,#index #h3_recording{clear:both;}
#index #h3_oversea p a,#index #h3_recording p a{display:block; clear:both;}
#index .cd{margin-right:10px;}

#conductor div.conductor_profile h2{width:100%; display:block;}
#conductor div.conductor_profile div.conductor_text{width:100%; margin-left:0; display:block;}
#conductor div.conductor_profile img{float:none; margin:0 auto; text-align:center;}

#member .instrument{margin-bottom:8px; padding:4px; background:#eee;}

/*for the program detail page*/
body.perform-white div#wrapper{width:98%; padding:1%;}
body.perform-white div#wrapper div.programn ol{width:85%;}
body.perform-white div#wrapper div.programn ol li{width:100%;}

#oversea #worldmap{width:100%; height:auto; margin-bottom:40px; background:none;}
#oversea #worldmap li{background:#F2F2F2; padding:4px;}
#oversea #worldmap li h3{}
#oversea #worldmap li a{z-index:10;text-align:center;}
#oversea #worldmap li a span{width:100% !important; height:auto ; position:relative !important; text-indent:0 !important; background:none !important; top:auto !important; left:auto !important; }
#oversea #worldmap li a:hover span{top:auto !important;}
/**/
#oversea .osdetail{padding:0 0 10px 0;min-height:0; background:none !important; margin-bottom:20px;}
#oversea .osdetail h3{display:block; font-weight:bold;}
#oversea .osdetail p{width:100%; text-align:left; top:auto !important; position:relative;}

#video iframe{width:100%;}

#event .mainBlock{padding:2px 0;}
#event #yearselect{width:100%; padding:0; float:none;}
#event #yearselect .ind{font-size:20px; color:#999999; background:#dddddd; display:block; width:100%; clear:both;}
#event #yearselect li{float:left; margin-right:10px;}
#event #eventdisplay{width:100%; padding:0; float:none; clear:both;}
/**/
#event .mainBlock h4{color:#aaa; float:none; }
#event .mainBlock h5{font-size:14px; margin:0;}
#event .mainBlock .ent{width:98%; padding-left:0;}
#event .mainBlcok p.activity{line-height:1;}
}