@font-face {
    font-family: MYuenHK;
    src: url(http://www.medilase.com.hk/ttt_assets/font/MYuenHK_Medium.otf);
}
@font-face {
    font-family: MYuenHK;
    src: url(http://www.medilase.com.hk/ttt_assets/font/MYuenHK_Light.otf);
    font-weight:lighter;
}
@font-face {
    font-family: MYuenHK;
    src: url(http://www.medilase.com.hk/ttt_assets/font/MYeungHK_SemiBold.otf);
    font-weight:bold;
}
body{
    text-align:center;
    font-family: 'MYuenHK', Arial, sans-serif;
    color:#67b0bb;
	background:#f2f2f2;
    font-size:15px;
    margin:0;
}



@media screen and (max-device-width: 540px){
 body{
   -webkit-text-size-adjust: none;
 }
}

.container{
    width:100%;
    max-width:1263px;
    margin:0 auto;
    text-align:left;
    min-width:540px;
    animation:openForm 2s ease-in;
	padding-top:132px;
}

*, *:after, *:before{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}

a{
    color:#959595;
}

a:hover{
    color:#767676;
}

.row:after{
    content:'';
    clear:both;
    display:block;
}

img{
    display:block;				
    /*image-rendering: -moz-crisp-edges;  */       /* Firefox */
    /*image-rendering:   -o-crisp-edges;  */       /* Opera */
    image-rendering: -webkit-optimize-contrast;/* Webkit (non-standard naming) */
    /*image-rendering: crisp-edges;*/
    /*-ms-interpolation-mode: nearest-neighbor;*/  /* IE (non-standard property) */
}

.fl_left{
    float:left;
}

.fl_right{
    float:right;
}

.img-max{
    max-width:100%;
    margin:0 auto;
}

/*form*/
label.mLabel{
    position:relative;
    font-size:15px;
    margin-right:5%;
    margin-left:5%;
    display: inline-block;
    line-height:200%;	
}

.thankyoupage label.mLabel{
	z-index:1000;
}

label.mLabelText{
    line-height:25px;
    display:block;
}

input[type="button"],input[type="submit"]{
    opacity:0;
    position:absolute;
    left:0;top:0;
}
.mBtn-Txt{
    color: #fff;
    cursor: pointer;
    font-size: 25px;
    left: 0;
    letter-spacing: 10px;
    line-height: 40px;
    text-align: center;
    width: 100%;
    padding-left:10px;
    display:block;
    font-weight:100;
    box-shadow: 3px 3px 4px grey;
    height: 40px;
    width: 170px;
    
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
}

.mBtn-Txt:hover{
    box-shadow: 3px 3px 4px #555;
}

.mBtn-submit{
    background: #7acad6 none repeat scroll 0 0;
    
}
.mBtn-reset{
    background: #bebcc3 none repeat scroll 0 0;				
}

.error {
    background:#ffffe1;
}

#FormBg{
    position:relative;
    /*background:url(http://www.medilase.com.hk/medilase_form_v2/image/formBg_winnieForm_v3.jpg) no-repeat;*/
    width:100%;
    margin:auto;
}			

#occupation{
    width: 136px;
    height: 20px;
}
#genderF{
}
#genderM{
}			

#age{
    width: 136px;
    height: 20px;
}
#shop{
    width: 185px;
    height: 20px;
}
            
#btn-agreePromotion{
position: absolute;
display: inline-block;
width: 18%;
height: 1.1%;
top: 1074px;
left: 42%;		/*background:red;
    opacity:0.5;*/
}

#tnc_rules2014{
    /*background:url(http://www.medilase.com.hk/medilase_form_v2/image/m_formBg_MDLAP140911FBR_tnc.png);*/
    max-width:810px;
    position:absolute;
    top:26%;
}
.tnc_btn_close{
    /*background:url(http://www.medilase.com.hk/medilase_form_v2/image/btn_close.png) no-repeat;*/
    display:inline-block;
    width:120%;
}
#overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background:url(http://www.medilase.com.hk/medilase_form_v2/image/bg_opacity_50.png) repeat;
    z-index: 10000;
}
#ComboboxOverlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background:trasparent;
    opacity:0;
    z-index: 2;
    /*background:red;
    opacity:0.2;*/
}
            
#mediEl_lbl_occupation{
    height: 23px;
}

table#mediEl_occupation_list{
    display:none;
}

#mediEl_lbl_gender{
    height: 100%;
    margin-left:5px;
}

table#mediEl_gender_list{
    display:none;
}

#mediEl_lbl_telc{
    height: 23px;
}

table#mediEl_telc_list{
    display:none;
}

#mediEl_lbl_age{
    height: 23px;
}

table#mediEl_age_list{
    display:none;
}

#mediEl_lbl_shop{
    height: 23px;
}
#mediEl_lbl_free{
    height: 23px;
}


table#mediEl_shop_list{
    display:none;
}

table#mediEl_free_list{
    display:none;
}



#mediEl_lbl_comeFrom{
    height: 23px;
}

table#mediEl_comeFrom_list{
    display:none;
}

.invisibleInput{
    visibility:hidden;
    position:absolute;
    z-index:-1;
    top:0;
}

.medi-sel_label{
    margin-left:5px;
}

#btn-submitForm{
    text-decoration:none;
}

.btn_area{
    position:relative; margin:10px 0 0 0; text-align:center
}

.medi-btn-sel_bg{
    line-height:24px;
    font-family:微軟正黑體, 'MYuenHK';
    font-weight:bold;
}

.medi-btn-sel{
    background:url(../images/m_btn-sel.png) no-repeat right;
    background-size:25px auto;
}

.term_pt{
    font-size:12px; color:#707070; line-height:25px;
}

.drop_field{
    height: 100%; position: absolute; left: 0px; z-index: -1; width: 90%;
}

input[type='text']:focus{
    outline:0;
}

.field_row{
    line-height:24px;
}

.field01{
    background:#d9d9d9;
    border:0;
    padding:0 5px;
    width:100%;
    height:24px;
    line-height:24px;
    color:#464646;
    font-size:14px;
    font-family:微軟正黑體, 'MYuenHK';
    font-weight:bold;
}

#expect_date *{
    font-weight:normal;
}

/*form*/

/* all placeholder */
::-webkit-input-placeholder { color:#464646;  }
input::-webkit-input-placeholder { color:#464646;  }
::-moz-placeholder { color:#464646;  } /* firefox 19+ */
:-ms-input-placeholder { color:#464646;  } /* ie */
input:-moz-placeholder { color:#464646;  }
#mediEl_comeFrom_list ::-webkit-input-placeholder { color:#464646; font-size:13px; font-family: Arial, MHeiHK-Medium, 微軟正黑體, 新細明體, 細明體, tahoma, helvetica;}
#mediEl_comeFrom_list ::-moz-placeholder { color:#464646; font-size:13px; font-family: Arial, MHeiHK-Medium, 微軟正黑體, 新細明體, 細明體, tahoma, helvetica;} /* firefox 19+ */
#mediEl_comeFrom_list :-ms-input-placeholder { color:#464646; font-size:13px; font-family: Arial, MHeiHK-Medium, 微軟正黑體, 新細明體, 細明體, tahoma, helvetica;} /* ie */
#mediEl_comeFrom_list input:-moz-placeholder { color:#464646; font-size:13px; font-family: Arial, MHeiHK-Medium, 微軟正黑體, 新細明體, 細明體, tahoma, helvetica;}

/*main*/
.section_form, .section_info{
    width:50%;
    float:right;
}

.section_promo{
    width:50%;
    float:left;
	margin-bottom:10px;
}

.section_video{
	margin-bottom:10px;
}

.section_form{
    padding:0 15px;				
}

.section_form .border_bottom{
    border-bottom:1px solid #33b5b9;
    width:100%;
    height:1px;
}

.header_logo{
    text-align:center;
	position:relative;
}

.logo{
    max-width:321px;
    width:100%;
    display:inline-block;
    padding:27px 0 32px 0; 
}

.form_title{
    margin-bottom:8px;
}					

.button{
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
}

.button:hover{
    opacity:0.75;
    filter: opacity(75%);
}

input.mTextbox:focus{
    border:1px solid #ccc;
    outline:0;
}

.section_video video{
    width:100%;
    height:auto;
}

.footer{
    margin-bottom:70px;
    width:100%;
}

.footer img{
    float:left;
}

#term_box, #photo_box{
    position:fixed;
    z-index:9999;
    background:rgba(0,0,0,0.6);
    width:100%;
    height:100%;
    text-align:center;
    display:table;
}

.term_wrapper, .photo_wrapper{				
    display:inline-block;
    text-align:left;
    display:table-cell;
    vertical-align:middle;
}

.photo_container{
	position:relative;
    margin:0 auto;
	padding:40px 0px;
	max-width:905px;
	text-align:center;
	display:table;
}

.term_container{
    position:relative;
    max-width:550px;
    width:100%;
    margin:0 auto;
    font-size:12px;
    color:#464646;
	background:rgba(255,255,255,0.8);
	padding:15px 20px;
}

#photo_close_bn{
    position:absolute; 
    right:8px ; 
    top:0px;
}

#photo_close_bn .mfp-close{
	color:#fff;
	font-size:32px;
}

.term_container ul{
    margin-left:-20px;
    list-style: disc;
	margin-top:0;
}

#term_close_bn{
    position:absolute; 
    right:0px; 
    top:0px;
}

.mfp-close{
    overflow:visible;
    cursor:pointer;
    background:0 0;
    border:0;
    -webkit-appearance:none;
    display:block;
    outline:0;
    padding:0;
    z-index:1046;
    -webkit-box-shadow:none;
    box-shadow:none;
    
    width:44px;
    height:44px;
    line-height:44px;
    right:0;
    top:0;
    text-decoration:none;
    opacity:1;
    filter:alpha(opacity=65);
    padding:0 0 18px 10px;
    font-size:19px;
    font-family:Arial,Baskerville,monospace;
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif
}

@keyframes slideBoxFadeIn {
    0%   {opacity: 0;}
    100% {opacity: 1;}
}

@keyframes slideBoxFadeOut {
    0%   {opacity: 1;}
    100% {opacity: 0;}
}

#term_box.pop_show{
    animation: slideBoxFadeIn 0.5s ease-in;
    opacity:1;
}

#term_box.pop_hide{
    animation: slideBoxFadeOut 0.5s ease-in;
    opacity:0;
}

#photo_box.pop_show{
    animation: slideBoxFadeIn 0.5s ease-in;
    opacity:1;
}

#photo_box.pop_hide{
    animation: slideBoxFadeOut 0.5s ease-in;
    opacity:0;
}

.section_promo > img{
	margin-left:auto !important;
	margin-right:auto !important;
}

.section_info > img{					
	padding-top:50px;
	padding-bottom:70px;
}

.thumb_area{
	margin-bottom:26px;
	margin-left:-10px;
}

.thumb_area img{
	width:100%;
}

.thumb_area a{	
	width:50%;
	float:left;
	padding-left:10px;
	cursor:pointer;
}

.video_area{
	margin-left:-12px;
}


.video_area > div{
	width:25%;
	padding-left:12px;
	float:left;
	margin-top:10px;
}

.video_area img{
	width:100%;
}

.video_area a{
	display:block;	
	position:relative;
	cursor:pointer;
}

.video_area a:before{
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	opacity:0;
	background-size:100% !important;
	background-repeat:no-repeat;
		
	-webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
}

.video_area a:hover:before{
	opacity:1;	
}

#video_cty:before{
	background-image:url(../images/mo_cty.png);	
}

#video_vt:before{
	background-image:url(../images/mo_vt.png);	
}

#video_kc:before{
	background-image:url(../images/mo_kc.png);	
}

#video_kt:before{
	background-image:url(../images/mo_kt.png);	
}

#video_gi:before{
	background-image:url(../images/mo_gi.png);	
}

.poster_area{
	padding-left:15px;
	padding-right:15px;
}

.poster_area img{
	max-width:100%;
	margin-left:auto;
	margin-right:auto;
	width:100%;
}


.btn_home{
	position:absolute;
	right:10px;
	top:30px;
}

#mainMenu, #subMenuList{
	z-index:25 !important;
}

.thankyou{
	padding-top:90px;
	padding-bottom:30px;
}

.term_pt a{
	text-decoration:underline;
}


.section_form:after{
	content:'';
	display:block;
	width:100%;
	border-bottom:1px solid #33b5b9;
	height:1px;
	margin-top:35px;
}

@media screen and (min-width:768px) and (max-width:1000px){
	.section_promo{
		margin-bottom:50px;
	}
}

@media screen and (max-width:1280px){
	.section_promo{
		padding-left:15px;
	}
}

            
@media screen and (min-width:768px){				
                            
    .footer{
        margin-top:38px;
    }
    
    .display_mobile{
        display:none;
    }
    
    .display_desktop{
        display:block;
    }
    
    .footer{
        padding-right:28px;					
    }				
    
    .footer_left{
        width:52.5%;
        float:left;
    }
    
    .footer_left01{
        width:28.6%;
    }
    
    .footer_left02{
        width:38%;
    }
    
    .footer_left03{
        width:33%;
    }
    
    .footer_right{
        width:47.5%;
        float:left;
    }
    
    .footer_right01{
        width:50.8%;
    }
    
    .footer_right02{
        width:20.4%;
    }
    
    .footer_right03{
        width:15%;
    }
    
    .footer_right04{
        width:13.5%;
    }
        
    .section_promo{
        padding-right:27px;
    }
	
	.section_form{
		padding-left:10px;
	}
        
	.thankyoupage.section_form:after{
		content:'';
		display:none;
	}
}

@media screen and (max-width:767px){    
    
    .section_promo{
        padding-bottom:50px;
		padding-left:15px;
		padding-right:15px;
		padding-top:5px;
    }
	
	.section_info > img{
		padding-top:35px;
		padding-bottom:70px;
	}
    
    .display_mobile{
        display:block;
    }
    
    .display_desktop{
        display:none;
    }
    
    .section_form, .section_promo, .section_video, .section_info{
        width:100%;
    }
    
    .section_video{
        padding:0 3px;
    }
    
    .header_logo img{
        max-width:271px;
    }
    
    .footer01{
        width:30%;
    }
    
    .footer02{
        width:39%;
    }
    
    .footer03{
        width:30%;
    }
    
    .term_container{
        padding-left:15px;
        padding-right:15px;
    }   
	
	.thankyou{
		padding-top:0px;
		padding-bottom:20px;
		margin-top:-20px;
	} 
	
	.section_form{
		padding-bottom:30px;
	}
	
	
	.section_info:before{
		content:'';
		display:block;
		border-bottom:1px solid #33b5b9;
    	height:1px;
		margin:0 15px;
	}
		
    
}

@media screen and (min-width:768px) and (max-width:940px){
    .mBtn-Txt{
        width:132px;
    }
}
