@charset "utf-8";

input[type="checkbox"] {margin-top: 2px;}
ol {list-style: decimal; margin: 10px 0px 10px 22px;}
ol li {margin: 10px 0px;}
.content-tab ul, .tab-content ul { list-style:disc;margin: 10px 0px 10px 22px;}
.content-tab ul li, .tab-content ul li { margin:10px 0;}
p.space {padding: 15px 0 0 0;}
.section:after {content: ''; display: block; clear: both;}
.section .left, .section .right {width: 49%; float: left;}
.section .left p {padding-left: 6px;}

.section .left-30{width: 29%; float: left;}
.section .right-70{width: 69%; float: left;}

@media handheld, only screen and (max-width: 1040px) {
	.section .left p {padding-left: 0px;}
}
@media handheld, only screen and (max-width: 767px) {
	.content-container {padding: 0px 0px 20px 0px;	}
}

/*---------- ---------- ---------- Contact information (Page footer element) ---------- ---------- ----------*/
.close-button {display: none;}
.contact-info {margin: 20px 0 0 10px; padding: 10px 0 0 0; border-top: 1px solid #cfcfcf;}
.contact-info h4 {color: #25383c;}
.contact-info .contact {position: relative; width: 49%; display: inline-block;}
.contact-info.style2 .contact {width: 100%; display: block; border-top: 1px solid #cfcfcf; margin: 10px 0px 0px 0px;}
.contact-info .contact .title {color: #25383c; margin: 10px 0px 0px 0px;}
.contact-info .contact .position {color: #25383c;}
.contact-info .contact .company {color: #25383c; margin: 8px 0px 8px 0px;}
.contact-info .contact .tel:before {content: 'Tel: '; display: inline-block; width: 50px;}
.zh_HK .contact-info .contact .tel:before {content: '電話: ';}
.contact-info .contact .tel {color: #25383c;}
.contact-info .contact .fax:before {content: 'Fax: '; display: inline-block; width: 50px;}
.zh_HK .contact-info .contact .fax:before {content: '傳真: ';}
.contact-info .contact .fax {color: #25383c;}
.contact-info .contact .email:before {content: 'Email: '; display: inline-block; width: 50px; color: #25383c;}
.zh_HK .contact-info .contact .email:before {content: '電郵: ';}
.contact-info .contact .email {color: #ed1b2e;}
.two-column h1 { padding: 20px 0px 7px 5px;}
.two-column p { margin: 20px 0px 0px 0px;} 
.two-column .right-col { margin-top:12px !important;}
.two-column .right-col.frame { padding-top:10px;}
.two-column .right-col .sidead-content .style1 {margin-bottom: 10px;}
.two-column .right-col .sidead-content .style1 p {position: relative; background-image: none; border: none; width: 118px; left: 71px;}
.two-column .right-col .sidead-content .style1.title p {top: 6px; padding: 5px 0px 1px 8px;}
.two-column .right-col .sidead-content .style1.title p.center {top: 18px;}
.two-column .right-col .sidead-content .style1.title p.no-arrow:after {content:'';}
.two-column .right-col .sidead-content .style1.title a.content {color: #25383c; font-size: 0.84em; width: 130px; padding: 1px 0px 1px 10px; display: inline-block; left: 70px; top: 6px; position: relative; text-decoration: underline;}
.content-tab p.title {width: 90%; margin: 10px 0px;}
#bottom-side-content-container .contact-info{margin: 20px 35px 0 35px;}

.contact-landing-frame {clear: both;}
.contact-landing-frame ul{margin: 10px 0px 10px 0px;}
.contact-landing-frame li {list-style: none; color: #ed1b2e; margin: 5px 0 5px 0px; font-weight: bold;}
.contact-landing-frame li .title {border: 1px solid #cfcfcf; width: 100%; padding: 5px 0 5px 0; background-color: #fff;}
.contact-landing-frame li .title p {color: #ed1b2e !important; margin: 0 0 0 15px!important;}
.contact-landing-frame li .title p.desc {font-size: 0.8em;}
.contact-landing-frame li .content {border-right: 1px solid #cfcfcf; border-left: 1px solid #cfcfcf; border-bottom: 1px solid #cfcfcf; width: 100%; margin: 0 0 20px 0; padding: 0px;}
.contact-landing-frame li .content p {margin: 0 !important; font-weight: normal;}
.contact-landing-frame li .content a {font-size: 0.95em; text-decoration: underline;}
.contact-landing-frame li .content .left {width: 60%; float: left;}
.contact-landing-frame li .content .left p {padding: 0 15px 0 15px;}
.contact-landing-frame li .content .right {width: 39%; float: left;}
.contact-landing-frame li .content .grey, .contact-landing-frame li .content .light-grey {clear: both;}
.contact-landing-frame li .content .grey:after, .contact-landing-frame li .content .light-grey:after {clear: both; display: block; content:'';}
.contact-landing-frame li .content .grey {background-color: #f5f5f5; padding: 8px 0 8px 0;}
.contact-landing-frame li .content .light-grey{background-color: #fff; padding: 8px 0 8px 0;}
.contact-landing-frame li .content p.remarks {padding: 0px 5px 10px 15px; font-size: 0.8em;}
.contact-landing-frame li .content .caption {position: relative; width: 100%; float: none; clear: both; padding: 5px 0 0 0;}

.contact-frame {position: relative; background-color: #fff; width: 100%; border-top: 2px solid #EC1B2E; margin: 20px 0px 0px 0px; -webkit-box-shadow: -15px 0 15px -15px #d5d5d5, 15px 0 15px -15px #d5d5d5, 0 -15px 15px -15px #d5d5d5;
-moz-box-shadow: -15px 0 15px -15px #d5d5d5, 15px 0 15px -15px #d5d5d5, 0 -15px 15px -15px #d5d5d5;
box-shadow: -15px 0 15px -15px #d5d5d5, 15px 0 15px -15px #d5d5d5, 0 -15px 15px -15px #d5d5d5; padding: 20px 0 0 0;}
.contact-frame.style2 {padding: 0;}
.contact-frame .header {font-size: 0px; max-height: 90px; padding-top: 0px; position: relative; width: 100%;
background-color: rgba(0, 0, 0, 0); margin: 0; padding: 0;}
.contact-frame .header img {width: 100%; height: 90px;}
.contact-frame .header .title-wrap { float: left; font-size: 20px; height: 91px; position: absolute; width: 25%;}
.contact-frame .header .title-wrap h3 { color: #FFF; font-size: 2em; margin-left: 25px; margin-top: 5px; }
.contact-frame .header .title-wrap p { color: #FFF; font-size: 0.75em; margin-left: 25px; margin-top: 7px;}
.contact-frame .header .title-wrap.section1 { left: 0%; top: 0px; }
.contact-frame .header .title-wrap.section2 { left: 25%; top: 0px; }
.contact-frame .header .title-wrap.section3 { left: 50%; top: 0px; }
.contact-frame .header .title-wrap.section4 { left: 75%; top: 0px; }

@media handheld, only screen and (max-width: 767px){
	.contact-frame .header .mobile-view .header { position: relative; width: 100%; height: inherit; background-color: #EC1B2E; font-size:12px;}
	.contact-frame .header .mobile-view .header h3 {position: relative; color: #FFF; font-size: 1.8em; margin: 0px; padding: 3px 0px 3px 10px; width: 70%; }
	.contact-frame .header .mobile-view .header h4 { position: absolute; color: #FFF; font-size: 2.8em; margin: 0; bottom: -5px; right: 47px;}
	.contact-frame .header .mobile-view .header h5 { position: absolute; color: #FFF; font-size: 1.4em; bottom: 0px; right: 10px;}
	.section .left-30{width: 100%; float: none;}
	.section .right-70{width: 100%; float: none;}
}

.contact-frame .content {width: 91%; padding: 20px 0px;}
.contact-frame .content .left {width: 26%; float: left; margin-right: 1.4%;}
.medium .contact-frame .content .left {font-size: 1.1em;}
.large .contact-frame .content .left {font-size: 1.2em;}
.contact-frame .content .question .left {width: 65%;}
.contact-frame .content .terms .left {width: 11px;}
.contact-frame .content .right {width: 73%; float: left;}
.contact-frame .content .question .right {width: 35%;}
.contact-frame .content .terms .right {width: 94%;}
.contact-frame .content .right a {text-decoration: underline;}
.contact-frame .content .right input[type="text"] {height: 23px;}
.contact-frame .content .right input[type="password"] {height: 23px;}
.contact-frame .content .right textarea {min-height: 70px;}
.contact-frame .content .right input[type="text"], .contact-frame .content .right input[type="password"], .contact-frame .content .right textarea {width: 100%;}
.contact-frame .content .right input[type="text"].hkid-1 {width: 78%;}
.contact-frame .content .right input[type="text"].hkid-2 {width: 18%;}
.contact-frame .content .right input[type="text"].bday-dd, .contact-frame .content .right input[type="text"].bday-mm { width:10%;}
.contact-frame .content .right input[type="text"].bday-yy { width:15%;}
.contact-frame .content .left p, .contact-frame .content .right p{margin: 0; padding: 0;}
.contact-frame .content .left:after, .contact-frame .content .right:after {content: ''; clear: both; display: block;}
.contact-frame .content p.desc {padding-left: 26%; margin: 0; font-size: 1em;}
.contact-frame .content .section {position: relative; clear: both; display: block; padding: 0 0 10px 0;}

.contact-frame .other-remark{display:inline-block;}
.remarks, .remarks li, .remarks p, p.remarks {font-size: 11px;}

.contact-frame .content .center {position: relative; clear: both; width: 100%; text-align: center; padding: 10px 0px 0px 0px;}
.contact-frame .content .section h4 {font-size: 11px; text-decoration: underline;}
.medium .contact-frame .content .section h4 {font-size: 1.0em;}
.large .contact-frame .content .section h4 {font-size: 1.1em;}
.contact-frame .content .section ol {list-style: decimal; margin: 0px 0px 0px 17px;}
.contact-frame .content .section li {padding: 7px 0px; margin: 0;}
.medium .contact-frame .content .section li {font-size: 1.1em;}
.large .contact-frame .content .section li {font-size: 1.2em;}
.contact-frame .content .section a {text-decoration: underline; margin: 0px 1px;}
.button-wrap {position: relative; margin: 15px 0px 30px 0px;}
.button-wrap.style2 {margin: 10px 0px 20px 0px;}
.button-wrap a {text-decoration: none;} 
.button .left-container {background-image: url("../../images/common/button-left.jpg"); background-repeat: no-repeat; display: inline-block; float: none; height: 38px; left: 5px; position: relative; width: 7px; }
.button .center-container {background-image: url("../../images/common/button-center.jpg"); background-repeat: repeat-x; display: inline-block; float: none; min-width: 40px; font-size: 14px; height: 38px; padding-left: 10px; padding-right: 10px; position: relative; vertical-align: top;}
.button .right-container {background-image: url("../../images/common/button-right.jpg"); background-repeat: no-repeat; display: inline-block; float: none; height: 38px; left: -5px; position: relative; width: 7px; }
.button p {color: #fff !important; margin: 8px 0px 0px 0px !important; text-align:center !important; position: relative; left: -2px;}

@media handheld, only screen and (max-width: 1040px) {
	h1.tablet-hide {display: none;}
	.contact-info {margin: 20px 0 0 15px;}
	.contact-frame .content .section h4 {padding: 0 0 0 0;}
	ol {margin: 10px 0px 10px 25px;}
	.contact-info .contact {margin: 0px 10px 0px 0px; width: 46%;}
	.contact-info.style2 .contact {width: 46%; display: inline-block;}
	#bottom-side-content-container .contact-info{margin: 20px 22px 0 22px;}
	.contact-frame .content .left {width: 34%;}
	.contact-frame .content .right {width: 65%;}
	.two-column .left-col.style3 {width: 100%; margin-top: 0px;}
	.two-column .right-col.style2.tablet {width: 100%; display: block; margin: 10px 0px 0px 10px;}
	.two-column .right-col.style2.listing {width: 100%; display: block; position: relative; margin-top: 20px;}
	.content-tab p {margin: 0px 10px 0px 10px;}
	.contact-frame .content p {margin: 0px;}
	.content-tab p.title {margin: 11px 0 11px 0;}
	.sidead-wrap.wrap-style1{width: 20%;}
	.two-column .right-col .sidead-content .sidead-title.style1.banner1{background-image: url("../../images/bg-crosssale-tablet-001.jpg"); width: 111px; height: 83px; display: inline-block; vertical-align: top;}
	.two-column .right-col .sidead-content .sidead-title.style1.banner2{background-image: url("../../images/bg-crosssale-tablet-002.jpg"); width: 111px; height: 83px; display: inline-block; vertical-align: top;}
	.two-column .right-col .sidead-content .sidead-title.style1.banner3{background-image: url("../../images/bg-crosssale-tablet-003.jpg"); width: 493px; height: 83px; display: inline-block; vertical-align: top;}
	.two-column .right-col .sidead-content .sidead-title.style1.banner4{background-image: url("../../images/bg-crosssale-tablet-004.jpg"); width: 220px; height: 83px; display: inline-block; vertical-align: top;}
	.two-column .right-col .sidead-content .sidead-title.style1.banner4 a {display: block !important;}
	.two-column .right-col .sidead-content .sidead-title.style1.banner4 span {text-decoration: underline;}
	.two-column .right-col .sidead-content .style1.title p {top: 36px; padding: 1px 0px 1px 4px; left: 6px; margin: 12px 0 0 0; width: 87px; text-align: center; font-size: 0.86em; }
	.two-column .right-col .sidead-content .style1.title p.no-arrow{top: 0px; left: 75px; width: 180px; text-align: left;}
	.two-column .right-col .sidead-content .style1.title a.content {display: inline; margin: 0px 20px 0px 0px;}
	.contact-landing-frame li {margin: 5px 0 5px 0px;}
}
@media handheld, only screen and (max-width: 767px) {
	.two-column .right-col.style2.tablet {display: none;}
	.two-column .left-col.style3 {width: 100%; margin-top: 15px;}
	h1 {width: 80%;}
	.back {margin: 0px 15px 0px 0px;}
	.button-wrap.style2 a {display: inline-block;}
	.section .left, .section .right {width: 100%; float: none;}
	.contact-frame .content .right input[type="text"].hkid-1 {width: 75%;}
	.contact-frame .content .right input[type="text"].hkid-2 {width: 18%;}
    .contact-frame .content .right input[type="text"].bday-dd, .contact-frame .content .right input[type="text"].bday-mm { width:25%;}
    .contact-frame .content .right input[type="text"].bday-yy { width:40%;}
	.contact-frame .content .section.small {font-size: 0.9em;}
	ol {font-size: 0.9em;}
	.contact-info {padding: 30px 0px 0px 0px;}
	.contact-landing-frame li .content .right p {padding: 0 0 0 15px;}
	.contact-landing-frame li {width: 100%; margin: 5px 0 5px 0px;}
	.contact-landing-frame li .content .left {width: 100%; float: none;}
	.contact-landing-frame li .content.single-line .left {width: 50%; float: left;}
	.contact-landing-frame li .content .right {width: 100%; float: none;}
	.contact-landing-frame li .content.single-line .right {width: 50%; float: left;}
	.contact-frame .content .terms .left {padding-right: 4px;}
	.contact-landing-frame ul{margin:0px 0 0px 0px;}
	.content-tab p {margin: 0;}
	.content-tab ol {margin: 10px 0px 10px 15px;}
	.left-col.style2 .back{margin: 0px 0px 0px 0px;}
}
@media handheld, only screen and (max-width: 640px) {
	.close-button {display: block;}
	.contact-frame .content p.desc {padding-left: 0%; margin: 0;}
	.contact-info .contact {margin: 0px 10px 0px 0px; width: 95%;}
	.contact-info.style2 {border-top: 1px solid #cfcfcf; padding: 10px 0px}
	.contact-info.style2 .contact {width: 95%; display: block;}
	
	.two-column .right-col.style2.listing {margin: 25px 0px 0px 0px;}
	
	.contact-frame .content .left, .contact-frame .content .question .left {width: 95%; float: none;}
	.contact-frame .content .right, .contact-frame .content .question .right {width: 95%; float: none;}
	.contact-frame .content .terms .left {float: left;}
	.contact-frame .content .terms .right {width: 90%; float: left;}
}


/*anchor for registration copy from form.css*/
.contact-frame .content .section.anchor-content{display:none;}
.inner-table{ border-bottom: 1px solid #e8e8e8; border-left: 1px solid #e8e8e8; border-right: 1px solid #e8e8e8; margin:0px 5px 5px 5px;}
.anchor.registration{
    cursor: pointer;
    position: relative;
    background-color: #FFF;
    padding: 0;
    width: auto;
    min-height: 25px;
    height: auto;
    margin: 0px auto 0px auto;
    background-image: -moz-linear-gradient(top, #fefefe 0, #e6e6e6 100%);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#fefefe', EndColorStr='#e6e6e6')";
    background-image: -ms-linear-gradient(top, #fefefe 0, #e6e6e6 100%);
    background-image: -webkit-linear-gradient(top, #FEFEFE 0, #E6E6E6 100%);
    background-image: linear-gradient(top, #fefefe 0, #e6e6e6 100%);
    border: 1px #CFCFCF solid;
}

.anchor.registration p{
    color: #ed1b2e;
    width:90%;
    padding-left: 7px;
    padding-top: 3px;
    position: relative;
    font-weight: bold;
}

.anchor.registration:after{
    content: url(../../images/arrow/arrow-red-down.png);
    display: block;
    height: 9px;
    position: absolute;
    right: 10px;
    top: 3px;
    width: 10px;
}

 .locationMarker{
    background: url('../../images/map_marker2.png') no-repeat right top;
    min-height: 20px;
    padding-right: 10px;
	cursor:pointer;
	display: block;
    padding-right: 38px;
}