/* Both EN/SC are using the same CSS */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/* End of Eric Meyer's CSS Reset */

article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
	display: block;
}

@font-face {
    font-family: 'Trajan Pro';
    src: url('../fonts/TrajanPro-Regular.eot'), /* IE9 Compat Modes */
    url('../fonts/TrajanPro-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../fonts/TrajanPro-Regular.woff') format('woff'), /* Modern Browsers */
    url('../fonts/TrajanPro-Regular.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../fonts/TrajanPro-Regular.svg#svgFontName') format('svg'); /* Legacy iOS */
}


html{
}

body {
	line-height: 1.3;
	font-family: 'Lato', "Apple LiGothic Medium", "蘋果儷中黑", "微軟正黑體", "Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif;
	font-size:16px;
	color:#333333;
	background-color: #FFF;
}
* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transition: 0.3s;
    	  transition: 0.3s;
}
a{
	text-decoration: none;
	color:inherit;
	-webkit-transition: 0.3s; /* Safari */
    transition: 0.3s;
    cursor: pointer;
}
a:hover{
	color:#5F6062;
}
a:active{
	color: #BB9753;
}

.wrapper{
	margin:0 auto;
	width: 100%;

	background-color: #FFF;
}

	.mainLeft{
		position: fixed;
		float:left;
		width:40%;
		height:100%;
		min-height:100vh;
		background-image: url("../images/main_en.jpg");
		background-position: center center;
		background-size:cover;
	}
	.mainRight{
		float:right;
		width:60%;
		min-height:100vh;
		text-align:center;

		display: -webkit-flex;
		display: flex;
		-webkit-align-items: center;
		align-items: center;
		-webkit-justify-content: center;
		justify-content: center;
	}
		.textFrame{
			width:100%;
			padding:60px;
		}
		.title{
			margin:0 auto;
			max-width: 768px;
			padding:0 15px;

			font-family: 'Trajan Pro', 'Times New Roman', serif;
			font-size: 30px;
			line-height: 1.2;
			color:#ac8642;
		}
		.title .scText{
			font-size: 26px;
		}
		.scText{
			line-height: 1.5;
		}
		.divider{
			margin:50px auto;
			margin-top:46px;
			width:100px;
			border-bottom:2px solid #ac8642;
		}
		.para{
			line-height: 1.5;
		}
		.bigTitle{
			font-size: 36px;
			margin-bottom: 20px;
		}
		.bigTitle .scText{
			font-size: 30px;
		}
		.moreBtn{
			display:block;
			margin:0 auto;
			margin-top:40px;
			width:210px;
			height:50px;
			padding-top:13px;
			border:2px solid #ac8642;

			cursor: pointer;
			color:#ac8642;
			text-transform: uppercase;
			letter-spacing:2px;
		}
		.moreBtn:hover{
			background-color: #ac8642;
			border-color: #ac8642;
			color:#FFF;
		}
		.moreBtnSC{
			height:70px;
		}
		.tncBtn{
			margin-top:15px;
			font-size:12px;
			color:#ac8642;
			text-decoration: underline;
		}

		.downloadAppSection{
				display:inline-block;
				margin-top:50px;
				margin-bottom: 50px;
				height:90px;
				text-align: left;
			}
				.QRcode{
					background-image: url("../images/qrcode.png");
					background-size: contain;
				}
				.downloadAppSection .QRDesktop{
					float:left;
					width:90px;
					height:90px;
					margin-right: 15px;
				}
				.downloadAppSection .dlRightSection{
					float:left;
					height:100px;
					position: relative;
				}
					.fixHeight{
						min-height:50px;
					}
					.downloadAppSection .dlTitle{
						font-weight: bold;
					}
					.downloadAppSection .dlText{
						font-family: "Lato", sans-serif;
					}
					.downloadAppSection .downloadIconSet{
						position: relative;
						height:40px;
					}
						.downloadAppSection .downloadIconSet .storeApple, .downloadAppSection .downloadIconSet .storeGoogle{
							height: 40px;
						}
						.downloadAppSection .downloadIconSet .storeApple img, .downloadAppSection .downloadIconSet .storeGoogle img{
							height: 100%;
						}
						.downloadAppSection .storeApple{
							margin-right:10px;
						}

						.downloadIconSet a{
						}
						.downloadIconSet a:hover{
							-webkit-filter:brightness(1.3);
						}

				.QRMobile{
					display:none;
				}

				.chinaNetworkReminder{
					font-size:12px;
					color: #999;
				}

@media only screen and (min-width: 1600px) {
	.mainRight{
		padding-top:2%;
	}
}

@media only screen and (max-width: 1000px) {
	.mainLeft{
		clear:both;
		position: relative;
		width:100%;
		min-height:0;
		padding-top:66.7%;
		background-image: url("../images/main_mobile_en.jpg");
		background-position: center center;
		background-size:cover;
	}
	.mainRight{
		clear:both;
		display:block;
		width:100%;
		min-height:0;
		height:auto;
		text-align:center;

		display: -webkit-flex;
		display: flex;
		-webkit-align-items: center;
		align-items: center;
		-webkit-justify-content: center;
		justify-content: center;
	}
		.textFrame{
			width:100%;
			padding:40px 30px;
		}

		.title{
			font-size:24px;
		}
		.title .scText{
			font-size: 20px;
			margin-top:10px;
		}
		.bigTitle{
			font-size:30px;
		}
			.divider{
				margin:40px auto;
				margin-top:32px;
				width:60px;
			}
}



@media only screen and (max-width: 540px) {
	.textFrame{
		padding:40px 15px;
	}

	.title{
		font-size:20px;
	}
	.downloadAppSection{
		text-align: center;
	}
		.downloadAppSection{
			height:auto;
		}
		.downloadAppSection .dlRightSection{
			height:auto;
		}
		.QRDesktop{
			display:none;
		}
		.QRMobile{
			display:block;
			width:100px;
			height:100px;
			margin: 0 auto;
			margin-top:30px;
		}
}