@charset "utf-8";

#wrapper{
	background: url(../images/HKBU-AAO-HomeComing-index.jpg) no-repeat 50% 0 #F2DFBE;
}
/* #wrapper.soccer{
	background-color: #81bd4f;
}
#wrapper.tea{
	background-color: #a75eb1;
}
#wrapper.ceremony{
	background-color: #56bfba;
}
#wrapper.dinner{
	background-color: #fa7d90;
}
#wrapper.tour{
	background-color: #e88a23;
}
#wrapper.guide{
	background-color: #f6d839;
} */
#content .gallery-wrap{
	width: 418px;
	position: relative;
	border:5px solid #953D31;
	padding:2px;
	opacity: 0;
	margin-top:-20px;
	margin-right:35px;
	margin-bottom:30px;
	float: left;
}
#content .gallery{
	width: 404px;
	min-height: 270px;
	position: relative;
	border: 2px solid #953D31;
	overflow: hidden;
}
#content .gallery img{
	top:50% !important;
	left:50% !important;
	transform:translate(-50%, -50%);
}
#content .gallery-wrap .pagination{
	position: absolute;
    bottom: -25px;
    left: -10px;
    z-index: 55;
}
#content .gallery-wrap .pagination span{
	text-indent: -9999px;
	font-size: 0;
	line-height: 0;
	background: rgba(149, 61, 49,.5);
	display: block;
	width: 6px;
	height: 6px;
	margin: 0 5px;
	float: left;
	cursor: pointer;
	transform: rotate(-45deg);
	/* -moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%; */
}
#wrapper .gallery-wrap .pagination span:hover, #wrapper .gallery-wrap .pagination span.cycle-pager-active{background-color:transparent; border:1px solid rgba(149, 61, 49, 1);}

#content .gallery-wrap .prev, #content .gallery-wrap .next{
	position:absolute;
	width:50px;
	height:50px;
	padding:2px;
	border:3px solid #953D31;
	border-radius:50%;
	background-color:#F4DAB7;
	top:50%;
	transform: translateY(-50%);
	z-index:110;
}
#content .gallery-wrap .prev:hover, 
#content .gallery-wrap .prev:focus, 
#content .gallery-wrap .next:hover, 
#content .gallery-wrap .next:focus{
	border-color:#F4DAB7;
	background-color:#953D31;
}
#content .gallery-wrap .prev span, #content .gallery-wrap .next span{
	position:relative;
	border:1px solid #953D31;
	display:block;
	width:40px;
	height:40px;
	border-radius:50%;
}
#content .gallery-wrap .prev:hover span, 
#content .gallery-wrap .prev:focus span, 
#content .gallery-wrap .next:hover span, 
#content .gallery-wrap .next:focus span{
	border-color:#F4DAB7;
}
#content .gallery-wrap .prev span:before, #content .gallery-wrap .prev span:after, #content .gallery-wrap .next span:before, #content .gallery-wrap .next span:after{
	content: '';
	width: 8px;
	height: 10px;
	display: inline-block;
	background-color:#953D31;
	position: absolute;
}
#content .gallery-wrap .prev:hover span:before, 
#content .gallery-wrap .prev:focus span:before,
#content .gallery-wrap .prev:hover span:after, 
#content .gallery-wrap .prev:focus span:after, 
#content .gallery-wrap .next:hover span:before, 
#content .gallery-wrap .next:focus span:before, 
#content .gallery-wrap .next:hover span:after, 
#content .gallery-wrap .next:focus span:after{
	background-color:#F4DAB7;
}
#content .gallery-wrap .prev span:before{
	left: 13px;
	top: 10px;
	transform: skew(135deg);	
}
#content .gallery-wrap .prev span:after{
	left: 13px;
	top: 20px;
	transform: skew(-135deg);
}
#content .gallery-wrap .next span:before{
	right: 13px;
	top: 10px;
	transform: skew(45deg);	
}
#content .gallery-wrap .next span:after{
	right: 13px;
	top: 20px;
	transform: skew(-45deg);
}
#content .gallery-wrap .prev{
	left:-26px;
}
#content .gallery-wrap .next{
	right:-26px;
}
#content img.section-img{
	opacity: 0;
	margin-bottom: 10px;
}
#content div.event{
	opacity: 0;
	margin-top: 30px;
}
#content div.event ul{
	overflow:hidden;
}
#content .title{
	margin-bottom: 40px;
	opacity: 0;
	position: relative;
}
#content .title img.full{
	position: absolute;
	right: 50px;
	top: -10px;
	/* bottom: -30px;
	left: calc((100% - 50px) / 2); */
	/* bottom: -45px;
    left: calc((100% - 77px) / 2); */
}
#content img.full{
	margin-top: -5px;
    vertical-align: middle;
}
#content .hd{
	font-size:18px;
	font-weight:bold;
}
#content .hd2{
	font-size:24px;
	font-weight:bold;
	line-height:28px;
}
/* #wrapper .gallery:before,
#wrapper .gallery:after{
	content: '';
	width: 90px;
	height: 90px;
	display: inline-block;
	position: absolute;
	z-index: 101;
}
#wrapper.soccer .gallery:before,
#wrapper.soccer .gallery:after{
	background: url(../images/gallery-corner-soccer.png) no-repeat 0 0;
}
#wrapper.tea .gallery:before,
#wrapper.tea .gallery:after{
	background: url(../images/gallery-corner-tea.png) no-repeat 0 0;
}
#wrapper.ceremony .gallery:before,
#wrapper.ceremony .gallery:after{
	background: url(../images/gallery-corner-ceremony.png) no-repeat 0 0;
}
#wrapper.dinner .gallery:before,
#wrapper.dinner .gallery:after{
	background: url(../images/gallery-corner-dinner.png) no-repeat 0 0;
}
#wrapper.tour .gallery:before,
#wrapper.tour .gallery:after{
	background: url(../images/gallery-corner-tour.png) no-repeat 0 0;
}
#wrapper .gallery:before{
	top: -20px;
	left: -20px;
}
#wrapper .gallery:after{
	bottom: -20px;
	right: -20px;
	transform: rotate(180deg);
} */
/* #wrapper.tour .gallery span{background-color: rgba(203, 61, 0, .4);}
#wrapper.tour .gallery span:hover, #wrapper.tour .gallery span.cycle-pager-active{background-color: rgba(203, 61, 0, 1);}
#wrapper.tea .gallery span{background-color: rgba(128, 49, 138, .4);}
#wrapper.tea .gallery span:hover, #wrapper.tea .gallery span.cycle-pager-active{background-color: rgba(128, 49, 138, 1);}
#wrapper.ceremony .gallery span{background-color: rgba(14, 114, 131, .4);}
#wrapper.ceremony .gallery span:hover, #wrapper.ceremony .gallery span.cycle-pager-active{background-color: rgba(14, 114, 131, 1);}
#wrapper.dinner .gallery span{background-color: rgba(192, 41, 78, .4);}
#wrapper.dinner .gallery span:hover, #wrapper.dinner .gallery span.cycle-pager-active{background-color: rgba(192, 41, 78, 1);}
#wrapper.soccer .gallery span{background-color: rgba(51, 93, 17, .4);}
#wrapper.soccer .gallery span:hover, #wrapper.soccer .gallery span.cycle-pager-active{background-color: rgba(51, 93, 17, 1);} */
#content{
	color: #953D31;
	font-size: 16px;
	line-height: 22px;
	font-family: arial;
	padding:60px 0 70px 0;
	width: 100%;
}
#content  div.f_left{
	width: calc(100% - 510px);
}
#content  div.f_left ul{
	display: table;
}
#content > ul{
	margin-bottom: 20px;
}
#content ul li{
	padding-left: 20px;
	position: relative;
	margin-bottom: 10px;
}
#content ul li:before{
	content: '';
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background-color: #953D31;
	display: inline-block;
	position: absolute;
	top: 6px;
	left: 2px;
}
#content img.f_left{
	/* margin-right: 10px; */
	margin-bottom: 10px;
	display: inline-block;
}
#content p.remarks{
	margin-bottom: 0;
}
#content .event_details{
	/* padding: 20px 24px; */
	/* width: calc(100% - 450px); */
	margin-bottom: 20px;
	margin-top: 20px;
}
/* .soccer #content .event_details{
	background-color: #438c3c;
}
.tea #content .event_details{
	background-color: #76318b;
}
.ceremony #content .event_details{
	background-color: #3382aa;
}
.dinner #content .event_details{
	background-color: #e34751;
}
.tour #content .event_details{
	background-color: #df6017;
	width: 100%;
} */
#content table th,
#content table td{
	font-weight: normal;
	text-align: left;
	vertical-align: top;
	font-size: 16px;
	/* line-height: 28px; */
	line-height: 24px;
}
#content table th{
	padding-right: 10px;
}
#content table td{
	padding-right: 10px;
}
#content table.event-details{
	width:100%;
	border-bottom:5px solid #7C191E;
	margin-bottom:10px;
}
#content table.event-details th{
	background-color:#7C191E;
	color:#F4DAB7;
	vertical-align:middle;
	padding:10px 15px;
}
#content table.event-details td{
	padding:7px 35px 7px 15px;
	vertical-align:top;
	border-bottom:1px solid #7C191E;
}
#content table.event-details tr:last-child td{
	border-bottom:0;
}
#content table.event-details tr td:nth-child(2){
	width:40%;
}
#content p{
	margin-bottom: 20px;
}
#content p.half_margin_bottom{
	margin-bottom: 10px;
}
#content .small{font-size:14px;}
.btn-wrap{
	margin-bottom: 30px;
	display: inline-block;
	width: 100%;
	margin-top: 20px;
}
.form_btn{
	text-decoration: none;
	color: #F4DAB7;
	font-size: 15px;
	padding:2px;
	border: 3px solid #953D31;
	/* font-weight: bold; */
	border-radius: 20px;
	margin-right: 10px;
	display: inline-block;
	position: relative;
}
.form_btn span{
	padding: 2px 25px 2px 15px;
	background-color: #953D31;
	border-radius: 20px;
	display: inline-block;
	position: relative;
}
.form_btn span:before{
	content: '';
	width: 10px;
	height: 10px;
	display: inline-block;
	border-left: 2px solid #F4DAB7;
	border-top: 2px solid #F4DAB7;
	position: absolute;
	right: 10px;
	top: 32%;
	transform: rotate(135deg);
}
.form_btn:hover,
.form_btn:focus{
	color: #953D31;
	border-color: #EDD6A8;
	background-color: #953D31;
}
.form_btn:hover span,
.form_btn:focus span{
	background-color: #EDD6A8;
}
.form_btn:hover span:before,
.form_btn:focus span:before{
	border-color:#953D31;
}
#content .arrow-btn{
	position:absolute;
	width:196px;
	height:60px;
	bottom:-30px;
	/* background:url(../images/btn-bg.png) no-repeat 50% 0; */
	text-indent:-9999px;
}
#content .arrow-btn.back{
	right: 256px;
}
#content .arrow-btn.next, #content.soccer .arrow-btn.back{
	right: 45px;
}
#content .arrow-btn.submit{
	right: 489px;
}
#content .arrow-btn.reset{
	right: 278px;
}
#content .arrow-btn:hover,
#content .arrow-btn:focus{
	/* background-image:url(../images/btn-bg-over.png); */
}
#content .yellow{
	color: #fafc6b;
	margin-top: -15px;
	margin-left: 10px;
	margin-bottom: 30px;
}
#content .remarks{
	color: rgba(149,61,49,.6);
	font-style: italic;
}
#content .f_left ul{
	margin-top: 20px;
}
#content.guide{
	padding-top: 0;
}
#content .event-list-wrap{
	width: 100%;
	display: block;
	position: relative;
}
#content .event-list-top{
	text-align:center;
	background:url(../images/table-top.png) no-repeat 50% 0;
	width:100%;
	height:56px;
}
#content .event-list-top img{
	position:relative;
	top:-18px;
}
#content .event-list-bottom{
	background:url(../images/table-btm.png) no-repeat 50% 0;
	width:100%;
	height:50px;
}
#content .event-list-content{
	background:url(../images/table-bg.png) repeat-y 50% 0;
	padding:0 8px;
}
#content .event-list-content .event-list{
	display:table;
	width:100%;
	padding:10px 0 20px 0;
	border-bottom:5px solid #7C191E;
}
#content .event-list-content .event-list-item{
	display:table-row;
}
#content .event-list-content .event-list-item.full>span:last-child:before{
	content:"";
	position:absolute;
	/* right:-30px; */
	top:50%;
	margin:-35px;
	width:98px;
	height:70px;
}
#content .event-list-content .event-list-item:hover{
	background-color:#7C191E;
}
#content .event-list-content .event-list-item:hover>span{
	color:#EAB873;
}
#content .event-list-content .event-list-item>span{
	display:table-cell;
	vertical-align:top;
	color:#7C191E;
	border-top:1px solid #953D31;
	position:relative;
}
#content .event-list-content .event-list-item:first-child>span{
	border-top:0;
}
#content .event-list-content .event-list-item>.event-time{
	padding:15px 0 15px 20px;
	font-weight:bold;
	white-space:nowrap;
}
#content .event-list-content .event-list-item>.event-logo{
	padding:5px 10px;
}
#content .event-list-content .event-list-item>.event-logo img{
	display:block;
}
#content .event-list-content .event-list-item>.event-venue{
	width:100%;
	padding:15px 40px 15px 0;
}
#content .event-list-content .event-list-item>.event-venue>span{
	font-weight:bold;
}
#content .event-list-content .event-special{
	padding:15px 20px;
	color:#7C191E;
}
#content .event-list-content .event-special a{
	color:#7C191E;
	text-decoration:underline;
}
#content .event-list-content .event-special a:hover{
	text-decoration:none;
}
#content .event-wrap{
	position:relative;
	border:4px solid #953D31;
	border-radius:40px;
	padding:75px 40px 100px 40px;
	min-height:630px;
}
#content.tour .event-wrap{
	background:url(../images/bg-event1.gif) no-repeat 100% 100% #F4DAB7;
}
#content.openhouse .event-wrap{
	background:url(../images/bg-event2.gif) no-repeat 100% 0% #F4DAB7;
}
#content.tea .event-wrap{
	background:url(../images/bg-event3.gif) no-repeat 100% 100% #F4DAB7;
}
#content.ceremony .event-wrap{
	background:url(../images/bg-event4.gif) no-repeat 100% 100% #F4DAB7;
}
#content.dinner .event-wrap{
	background:url(../images/bg-event5.gif) no-repeat 100% 100% #F4DAB7;
}
#content.soccer .event-wrap{
	background:url(../images/bg-event6.gif) no-repeat 100% 100% #F4DAB7;
}
#content.form .event-wrap{
	background-color:#F6D9B7;
	padding-left:4px;
	padding-right:4px;
	padding-bottom:0;
	margin-bottom:75px;
}

#content .event-wrap:before{
	content: " ";
	position: absolute;
	/* z-index: -1; */
	top: 2px;
	left: 2px;
	right: 2px;
	bottom: 2px;
	border: 2px solid #953D31;
	border-radius:34px;
    pointer-events: none;
}
#content .event-wrap .title{
	/* background:url(../images/title_bg.png) no-repeat 0 0;
	width:345px;
	height:135px; */
	width:404px;
	height:166px;
	position:absolute;
	/* top:-73px; */
	top:-102px;
	left:50%;
	transform:translateX(-50%);
	opacity:0;
}
#content .event-wrap .title img{
	/* position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%); */
	margin: 0 auto;
}
#content .event-wrap .title.full:before{
	content:"";
	position:absolute;
	width:98px;
	height:70px;
	right:-50px;
	top:75px;
}
#content #logo-tour,
#content #logo-tour2,
#content #logo-tea,
#content #logo-ceremony,
#content #logo-soccer,
#content #logo-dinner{
	position: absolute;
	z-index: 10;
}
#content #logo-tour{
	top: 130px;
    left: -45px;
}
#content #logo-tour2{
	top: 300px;
    right: -95px;
}
#content #logo-tea{
	top: 155px;
    right: -65px;
}
#content #logo-ceremony{
	top: 425px;
    left: -50px;
}
#content #logo-soccer{
	top: 640px;
    left: -90px;
}
#content #logo-dinner{
	top: 520px;
    right: -120px;
}
#top_wrapper > div#right-col a.lang{
	color: #ffffff;
}
#top_wrapper > div#right-col a.lang:hover,
#top_wrapper > div#right-col a.lang:focus{
	color: #f5f800;	
}
.form #top_wrapper > div#right-col a.lang,
.guide #top_wrapper > div#right-col a.lang{
	color: #6b6960;
}
.form #top_wrapper > div#right-col a.lang:hover,
.form #top_wrapper > div#right-col a.lang:focus,
.guide #top_wrapper > div#right-col a.lang:hover,
.guide #top_wrapper > div#right-col a.lang:focus{
	color: #b04e0d;	
}
#content .event-details-wrap{display:none;}
#content .event-details-wrap dt{
	display:table-cell;
	white-space:nowrap;
}
#content .event-details-wrap dd{
	display:table-cell;
}
#content.openhouse .jcf-select{
	/* min-width:470px; */
	min-width:520px;
	position:relative;
	margin:-15px 0 45px 0;
	border:3px solid #953D31;
	display:inline-block;
	padding:2px;
	height:auto;
	background-color:transparent;
}
#content.openhouse .jcf-select .jcf-select-text{
	background-color:#F4DAB7;
	border:0;
	margin:0;
	height:37px;
	border:1px solid #953D31;
	padding:0 10px;
	line-height:35px;
	font-size:14px;
}
#content.openhouse .jcf-select.jcf-focus, #content.openhouse .jcf-select.jcf-focus .jcf-select-text{
	border-color:#953D31 !important;
}
#content.openhouse .jcf-select .jcf-select-opener{
	background-color:#F4DAB7;
	width:35px;
	height:35px;
	top:3px;
	right:3px;
}
#content.openhouse .jcf-select .jcf-select-opener:after{
	border-bottom: 2px solid #953D31;
	border-right: 2px solid #953D31;
	content: '';
	display: block;
	height: 10px;
	width: 10px;
	margin-top: -5px;
	margin-right:-5px;
	pointer-events: none;
	position: absolute;
	right: 50%;
	top: 50%;
	-webkit-transform-origin: 66% 66%;
			-ms-transform-origin: 66% 66%;
					transform-origin: 66% 66%;
	-webkit-transform: rotate(45deg);
			-ms-transform: rotate(45deg);
					transform: rotate(45deg);
	-webkit-transition: all 0.15s ease-in-out;
	transition: all 0.15s ease-in-out;		
}
/* #content.openhouse .jcf-select.jcf-drop-active .jcf-select-opener:after{
	-webkit-transform: rotate(-135deg);
			-ms-transform: rotate(-135deg);
					transform: rotate(-135deg);	
} */
#content.openhouse .jcf-select .jcf-select-drop{
	left:-3px;
	right:-3px;
}
#content.openhouse .jcf-select-drop .jcf-select-drop-content{
	border-color:#953D31 !important;
}
#content.openhouse .jcf-list{
	background-color:#F4DAB7;
}
#content.openhouse .jcf-list .jcf-list-content{
	padding:20px 30px 0 15px;
	/* font-style:italic; */
	font-size:14px;
	width:100% !important;
}
#content.openhouse .jcf-scrollbar-vertical{
	background-color:#F4DAB7;
}
#content.openhouse .jcf-scrollbar-vertical .jcf-scrollbar-dec, #content.openhouse .jcf-scrollbar-vertical .jcf-scrollbar-inc{
	background-color:#81301F;
}
#content.openhouse .jcf-scrollbar-vertical .jcf-scrollbar-handle{
	background-color:#7C191E;
}
#content.openhouse .jcf-list .jcf-optgroup-caption{
	color:#953D31;
	font-weight:normal;
}
#content.openhouse .jcf-list .jcf-list-content ul li{
	padding:0;
	margin:0;
}
#content.openhouse .jcf-list .jcf-list-content ul li:before{
	display:none;
}
#content.openhouse .jcf-list .jcf-list-content>ul>li{
	border-top:1px solid #7C191E !important;
}
#content.openhouse .jcf-list .jcf-list-content>ul>li:first-child{
	border-top:0 !important;
}
#content.openhouse .jcf-list .jcf-option{
	color:#953D31;
}
#content.openhouse .jcf-list .jcf-list-content>ul>li>span{
	padding:10px 0;
}
#content.openhouse .jcf-list ul{
	padding-bottom:10px;
}
#content.openhouse .jcf-select-drop .jcf-hover, #content.openhouse .jcf-list-box .jcf-selected{
	background-color:#7C191E;
	color:#F4DAB7;
}
#content.openhouse .jcf-optgroup{
	display:block;
}