.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
}
 
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

h1, h2, h3, h4, h5, h6, p {
	margin: 0;
	padding: 0;
}

p {
	margin: 0;
	line-height: 1.5em;
}

body {
	font-family: Arial, sans-serif;
	padding: 0;
	margin: 0;
}

img {
	max-width: 100%;
	height: auto;
	margin: 0;
	border: 0;
}
.imgLeft {
	float:left;
	padding-right:15px;
	padding-bottom:15px;
}
.imgRight {
	float:right;
	padding-left:15px;
	padding-bottom:15px;
}

.map {
	clear:both;
	text-decoration: none;
	color: #000000;
	font-weight: bold;
	font-size: 0.9em; 	
}

#hkmap {
	display:block;
}

.map_c {
	letter-spacing: 3px;
}
#hkmap a:link { color: blue; }
#hkmap a:visited  { color: blue; }
#hkmap a:hover { color:#ef38a2; }
#hkmap a:active { color:#ef38a2; }

.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

.style1 {
	font-family: Arial;
	font-weight: bold;
	color: #FFFFFF;
	font-size: 1.5em; 
	width:100%;
	height:100%;
	table-layout:fixed;
}
.style2 {
	font-family: Arial;
	font-size: 0.8em;  
	color: #000000;
	font-weight: bold;
	vertical-align:bottom;
	margin-right: 15px;
}

li {
	padding-top:5px;
	padding-bottom:5px;
}
.counter{
    background-image:url('../imgs/box.png');
    background-repeat:no-repeat;
    background-size:cover;
}

.sidenav {
	display:none;
}
/*---------------*/


#wrapper {
	max-width: 1024px;
	margin-right: auto;
	margin-left: auto;	
	margin-bottom:20px;
	clear:both;
	}
#common {
	display:block;
	width: 100%;
	clear:both;
	margin-bottom:20px;
}
.common {
	display:block;
	width: 100%;
	clear:both;
	margin-bottom:20px;
}


/*2 columns*/
#menu {
	display:block;
	float:left;
	width:21.5%;
	z-index:1000;
	height:100%;
}

#menus{
	background-color:#ffca08;
	width:215px;
	font-size:1em;
	font-weight:bold;
	height:100%;
}
#menus:hover {
background-image: url("../imgs/menu-on.jpg");
background-color:#e9068b;
background-repeat: no-repeat;
background-position: center;
color:#FFF;
}
#menus div{
	height:100%;
	width:85%;
	margin-top:8px;
	margin-bottom:8px;
	margin-left:15px;
	margin-right:15px;
}
#menus a{
	text-decoration: none;
	color:#000;
}
#menus:hover a{
	text-decoration: none;
	color:#FFF;
}
#menus-on{
background-image: url("../imgs/menu-on.jpg");
background-color:#e9068b;
background-repeat: no-repeat;
background-position: center;
color:#FFF;
width:215px;
font-size:1em;
font-weight:bold;
}
#menus-on a{
	text-decoration: none;
	color:#FFF;
}
#menus-on div{
	height:100%;
	width:85%;
	margin-top:8px;
	margin-bottom:8px;
	margin-left:15px;
	margin-right:15px;
}
#menus-on:hover a{
	text-decoration: none;
	color:#FFF;
}

#content {
	display:block;
	float:left;
	background-color: #FFF;	
	margin-left:2%;
	width:76.5%;
	margin-bottom:25px;
}
/*content end*/
#head{
	position:relative;
	left:130%;
	top:-100px;
	z-index:100;
}

/*header*/
.header_left {
	display:block;
	float:left;
	width:49%;

}
.header_right {
	display:block;
	float:left;
	width:51%;
}
.header_center {
	display:none;
}
#header{
	color:#fff;
	font-size:15px; 
	top:8px; 
}
#header img{
	vertical-align:middle;
}
.headLogo {
	display:block;
	float:left;
	width:100%;
	background-color: #FFF;	
	margin: 0;
}
.headHeader {
	display:block;
	float:left;
	width:100%;
	background-color: #FFF;	
	margin: 0;
}
.headIcons {
	display:block;
	float:left;
	width:100%;
	background-color: #FFF;	
}
.headOthers {
	display:block;
	float:left;
	width:100%;
	background-color: #FFF;	
}
#group_logo{
	top:50px;
	vertical-align:top;
	font-size:0.8em;
}
#group_logo img{
	vertical-align:top;
}
/*header end*/

#head_buff{
	position:absolute; 
	left:5%;
	top:-85px;
	z-index:100;
}
#head_buff img{
	max-width: 100%;
}
#head_icon{ 
	position:absolute;
	left:95%;
	top:0;
	z-index:200;
}
#head_icon img{
	max-width: 1000%;
}

#reg {
	display:block;
	float:left;
	width:100%;
}
/*banner*/
#banner {
	display:block;
	float:left;
	width:100%;
}
.banner1 {
	display:block;
	float:left;
	width:32%;
	height:auto;
	margin-right:2%;
	}
.banner2 {
	display:block;
	float:left;
	width:32%;
	height:auto;
	margin-right:2%;
}
.banner3 {
	display:block;
	float:left;
	width:32%;
	height:auto;
}
.banner4 {
	display:none;
}
.reg {
	display:block;
	text-align:right;
	top:0px;
	width:100%;
	margin-bottom:4%;
}
#banner_mob {
	display:none;
}

.banner_mob{
	display:none;
}
/*banner end*/

#text {
	display:block;
	float:left;
	width:96%;
	clear: both;
	font-size: 1em;
	margin-bottom: 20px;
	text-align: justify;
	letter-spacing: 5px;
}
#texts-header {
	display:block;
	float:left;
	width:96%;
	clear: both;
	font-size: 1.5em;
	font-weight:bold;
	color:#ef38a2;
	margin: 0 10px 25px 10px;
}
#texts {
	display:block;
	float:left;
	width:96%;
	clear: both;
	text-align: justify;
	font-size: 1em;
	padding:0 1%;
	margin: 0 10px 25px 10px;
}

#texts a {
	text-decoration: none;
	color:#ef38a2;
}

/*icons*/
#iconWrapper {
	display:block;
	width:100%;
	margin-bottom:20px;
}
.icon1 {
	display:block;
	float:left;
	width:100px;
	height:100px;
	margin:3px;
}
.icon2 {
	display:block;
	float:left;
	width:100px;
	height:100px;
	margin:3px;
}
.icon3 {
	display:block;
	float:left;
	width:100px;
	height:100px;
	margin:3px;
}
.icon4 {
	display:block;
	float:left;
	width:100px;
	height:100px;
	margin:3px;
}
.icon5 {
	display:block;
	float:left;
	width:100px;
	height:100px;
	margin:3px;
}
.icon6 {
	display:block;
	float:left;
	width:100px;
	height:100px;
	margin:3px;
}
.icon7 {
	display:block;
	float:left;
	width:100px;
	height:100px;
	margin:3px;
}
/*icons end*/

/*footer*/
#footer {
	display:block;
	text-align:right;
	border-top:1px solid #ccc;
	top:0px;
	margin-right:15px;
	clear:both;
	width:100%;
	font-size:1em;
	color:#333333;
}
#footer img{
	clear:both;
	vertical-align:middle;
}
#footer a{
	text-decoration: none;
	color:#333333;
}
#footer a:hover{
	text-decoration: none;
	color:#000;
	font-weight:bold;
}
#share_pc{
	display:block;
}
#share_tab{
	display:none;
}
#share_mob{
	display:none;
}
#promWrapper {
	display:block;
	text-align:center;
	float:none;
	width:100%;
}
.prom1 {
	display:block;
	float:left;
	width:29%;
	height:auto;
		margin: 0 0 5px 0;
}
.prom2 {
	display:block;
	float:left;
	width:31%;
	height:auto;
		margin: 0 0 5px 0;
}
.prom3 {
	display:block;
	float:left;
	width:40%;
	height:auto;
		margin: 0 0 5px 0;
}

@media screen and (max-width: 880px) {
	#promWrapper {
		display:block;
		text-align:left;
		float:none;
		width:100%;
	}
	.prom1 {
		display:block;
		float:left;
		width:50%;
		height:auto;
		margin: 0 0 5px 0;
	}
	.prom2 {
		display:block;
		float:left;
		width:50%;
		height:auto;
		margin: 0 0 5px 0;
	}
	.prom3 {
		display:block;
		float:left;
		width:100%;
		height:auto;
		margin: 0 0 5px 0;
	}
}
@media screen and (max-width: 980px) {
#menu {
	display:block;
	float:left;
	width:24.5%;
	z-index:1000;
}

#content {
	display:block;
	float:left;
	background-color: #FFF;	
	margin-left:2%;
	width:73.5%;
	margin-bottom:25px;
}
}
@media screen and (max-width: 880px) {
#menu {
	display:block;
	float:left;
	width:27%;
	z-index:1000;
}

#content {
	display:block;
	float:left;
	background-color: #FFF;	
	margin-left:2%;
	width:71%;
	margin-bottom:25px;
}
}