#section1 {
	width: 100%;
	height: 50vw;
	background-color: #FEFBE8;
	text-align: center;
	color: #515151;
}

#sect1_pic {
	width: 100%;
	height: 100%;
	background: url("../pic/about_us.jpg") no-repeat;
	background-size: 100% auto;
	padding: 11vw 30vw;
}

#sect1_slogan {
	font: 3vw MElleHK-Medium;
	color: white;
	background-color: rgba(47, 231, 255, 0.5);
	letter-spacing: 5px;
	padding: 1vw;
}

#sect1_about {
	width: 70%;
	background-color: rgba(255, 255, 255, 0.65);
	position: relative;
	top: -35%;
	margin-left: 15%;
}

#sect1_about_title {
	font: 2vw MElleHK-Medium;
	margin: 2% 0;
}

#sect1_about_text {
	font-weight: bold;
	font-size: 1.2vw;
	text-align: justify;
	margin: 0 5%;
}

#section2 {
	width: 100%;
	height: calc(100vh - 80px);
	min-height: 500px;
	background-color: #FEFBE8;
	text-align: center;
}

#sect2_left {
	width: 35%;
	height: calc(100vh - 80px);
	min-height: 500px;
	padding-top: calc((100vh - 80px) * 0.25);
	float: left;
}

#left_title_en {
	font: 3vw Caviar-Dreams;
}

#left_title_cn {
	font: 3vw MElleHK-Medium;
}

#left_text {
	font-size: 1.5vw;
	margin-top: 10%;
}

#sect2_right {
	width: 65%;
	height: calc(100vh - 80px);
	min-height: 500px;
	padding: calc((100vh - 80px) /6 /2) 0;
	float: right;
}

#right_H {
	width: 100%;
	height: calc((100vh - 80px) /6);
	min-height: calc(500px /6);
}

#H_pic {
	width: 20%;
	height: calc((100vh - 80px) /6);
	min-height: calc(500px /6);
	float: left;
}

#H_pic img {
	Height: 80%;
	margin-left: 20%;
}

#H_title {
	width: 80%;
	height: calc((100vh - 80px) /6 *2/5);
	min-height: calc(500px /6 *2/5);
	float: left;
}

#H_title_cn {
	width: 8vw;
	height: calc((100vh - 80px) /6 *2/5);
	min-height: calc(500px /6 *2/5);
	background-color: #FFBA00;
	font: 2vw MElleHK-Medium;
	color: white;
	float:left;
}

#H_title_en {
	width: 8vw;
	height: calc((100vh - 80px) /6 *2/5);
	min-height: calc(500px /6 *2/5);
	background-color: #FFBA00;
	font: 2.5vw Caviar-Dreams;
	color: white;
	text-align: left;
	float: left;
}

#H_brief {
	width: 80%;
	height: calc((100vh - 80px) /6 *3/5);
	min-height: calc(500px /6 *3/5);
	font-size: 1vw;
	text-align: justify;
	padding-top: calc((100vh - 80px) /12 *0.1);
	float: left;
}

#right_E {
	width: 100%;
	height: calc((100vh - 80px) /6);
	min-height: calc(500px /6);
}

#E_pic {
	width: 20%;
	height: calc((100vh - 80px) /6);
	min-height: calc(500px /6);
	float: left;
}

#E_pic img {
	Height: 80%;
	margin-left: 20%;
}

#E_title {
	width: 80%;
	height: calc((100vh - 80px) /6 *2/5);
	min-height: calc(500px /6 *2/5);
	float: left;
}

#E_title_cn {
	width: 8vw;
	height: calc((100vh - 80px) /6 *2/5);
	min-height: calc(500px /6 *2/5);
	background-color: #FFBA00;
	font: 2vw MElleHK-Medium;
	color: white;
	float:left;
}

#E_title_en {
	width: 10vw;
	height: calc((100vh - 80px) /6 *2/5);
	min-height: calc(500px /6 *2/5);
	background-color: #FFBA00;
	font: 2.5vw Caviar-Dreams;
	color: white;
	text-align: left;
	float: left;
}

#E_brief {
	width: 80%;
	height: calc((100vh - 80px) /6 *3/5);
	min-height: calc(500px /6 *3/5);
	font-size: 1vw;
	text-align: justify;
	float: left;
}

#right_A {
	width: 100%;
	height: calc((100vh - 80px) /6);
	min-height: calc(500px /6);
}

#A_pic {
	width: 20%;
	height: calc((100vh - 80px) /6);
	min-height: calc(500px /6);
	float: left;
}

#A_pic img {
	Height: 80%;
	margin-left: 20%;
}

#A_title {
	width: 80%;
	height: calc((100vh - 80px) /6 *2/5);
	min-height: calc(500px /6 *2/5);
	float: left;
}

#A_title_cn {
	width: 7vw;
	height: calc((100vh - 80px) /6 *2/5);
	min-height: calc(500px /6 *2/5);
	background-color: #FFBA00;
	font: 2vw MElleHK-Medium;
	color: white;
	float:left;
}

#A_title_en {
	width: 8vw;
	height: calc((100vh - 80px) /6 *2/5);
	min-height: calc(500px /6 *2/5);
	background-color: #FFBA00;
	font: 2.5vw Caviar-Dreams;
	color: white;
	text-align: left;
	float: left;
}

#A_brief {
	width: 80%;
	height: calc((100vh - 80px) /6 *3/5);
	min-height: calc(500px /6 *3/5);
	font-size: 1vw;
	text-align: justify;
	float: left;
}

#right_R {
	width: 100%;
	height: calc((100vh - 80px) /6);
	min-height: calc(500px /6);
}

#R_pic {
	width: 20%;
	height: calc((100vh - 80px) /6);
	min-height: calc(500px /6);
	float: left;
}

#R_pic img {
	Height: 80%;
	margin-left: 20%;
}

#R_title {
	width: 80%;
	height: calc((100vh - 80px) /6 *2/5);
	min-height: calc(500px /6 *2/5);
	float: left;
}

#R_title_cn {
	width: 10vw;
	height: calc((100vh - 80px) /6 *2/5);
	min-height: calc(500px /6 *2/5);
	background-color: #FFBA00;
	font: 2vw MElleHK-Medium;
	color: white;
	float:left;
}

#R_title_en {
	width: 11vw;
	height: calc((100vh - 80px) /6 *2/5);
	min-height: calc(500px /6 *2/5);
	background-color: #FFBA00;
	font: 2.5vw Caviar-Dreams;
	color: white;
	text-align: left;
	float: left;
}

#R_brief {
	width: 80%;
	height: calc((100vh - 80px) /6 *3/5);
	min-height: calc(500px /6 *3/5);
	font-size: 1vw;
	text-align: justify;
	float: left;
}

#right_T {
	width: 100%;
	height: calc((100vh - 80px) /6);
	min-height: calc(500px /6);
}

#T_pic {
	width: 20%;
	height: calc((100vh - 80px) /6);
	min-height: calc(500px /6);
	float: left;
}

#T_pic img {
	Height: 80%;
	margin-left: 20%;
}

#T_title {
	width: 80%;
	height: calc((100vh - 80px) /6 *2/5);
	min-height: calc(500px /6 *2/5);
	float: left;
}

#T_title_cn {
	width: 6vw;
	height: calc((100vh - 80px) /6 *2/5);
	min-height: calc(500px /6 *2/5);
	background-color: #FFBA00;
	font: 2vw MElleHK-Medium;
	color: white;
	float:left;
}

#T_title_en {
	width: 6vw;
	height: calc((100vh - 80px) /6 *2/5);
	min-height: calc(500px /6 *2/5);
	background-color: #FFBA00;
	font: 2.5vw Caviar-Dreams;
	color: white;
	text-align: left;
	float: left;
}

#T_brief {
	width: 80%;
	height: calc((100vh - 80px) /6 *3/5);
	min-height: calc(500px /6 *3/5);
	font-size: 1vw;
	text-align: justify;
	float: left;
}

/* device screen's width lower than 650 px */
/* screen size reference https://www.25xt.com/screen/phone.html - check "width x Height dp" */
@media only screen and (max-device-width: 650px) and (orientation:portrait) {
	#section1 {
		height: 90vh;
		min-height: 0px;
	}
	
	#sect1_pic {
		height: 40vh;
		min-height: 0px;
		padding: 15vh 15vw;
	}

	#sect1_slogan {
		font: 6vw MElleHK-Medium;
		letter-spacing: 2vw;
		padding: 0;
	}
	
	#sect1_brief {
		height: 50vh;
		min-height: 0;
	}

	#sect1_about {
		height: 50vh;
		min-height: 0;
	}

	#sect1_about_title {
		font: 5vw MElleHK-Medium;
		margin: 5% 0;
	}

	#sect1_about_text {
		font-size: 3vw;
	}

	#sect1_logo {
		height: 50vh;
		min-height: 0;
	}

	#sect1_logo img {
		width: 95%;
		margin-top: 20vh;
		margin-right: 5%;
	}
	
	#section2 {
		height: 90vh;
		min-height: 0;
	}
	
	#sect2_left {
		height: 90vh;
		min-height: 0;
		padding-top: 30vh;
	}

	#left_title_en {
		font: 5vw Caviar-Dreams;
	}

	#left_title_cn {
		font: 5vw MElleHK-Medium;
	}

	#left_text {
		font-size: 3.5vw;
		margin-top: 15%;
		padding: 0 5%;
	}
	
	#sect2_right {
		height: 90vh;
		min-height: 0;
		padding: 2.5vh 0;
	}

	#right_H {
		height: 17vh;
		min-height: 0;
	}

	#H_pic {
		width: 30%;
		height: 16vh;
		min-height: 0;
	}

	#H_pic img {
		Height: 80%;
		margin-left: 10%;
	}

	#H_title {
		width: auto;
		height: 4vh;
		min-height: 0;
		margin-left: 10%;
		margin-top: 2vh;
	}

	#H_title_cn {
		width: 15vw;
		height: 4vh;
		min-height: 0;
		font: 5vw MElleHK-Medium;
	}

	#H_title_en {
		width: 20vw;
		height: 4vh;
		min-height: 0;
		font: 6vw Caviar-Dreams;
		padding-left: 5%;
	}

	#H_brief {
		width: 55%;
		height: 10vh;
		min-height: 0;
		font-size: 3vw;
		margin-left: 10%;
		margin-right: 5%;
		padding-top: 1vh;
	}
	
	#right_E {
		height: 17vh;
		min-height: 0;
	}

	#E_pic {
		width: 30%;
		height: 16vh;
		min-height: 0;
	}

	#E_pic img {
		Height: 80%;
		margin-left: 10%;
	}

	#E_title {
		width: auto;
		height: 4vh;
		min-height: 0;
		margin-left: 10%;
		margin-top: 2vh;
	}

	#E_title_cn {
		width: 15vw;
		height: 4vh;
		min-height: 0;
		font: 5vw MElleHK-Medium;
	}

	#E_title_en {
		width: 20vw;
		height: 4vh;
		min-height: 0;
		font: 6vw Caviar-Dreams;
		padding-left: 5%;
	}

	#E_brief {
		width: 55%;
		height: 10vh;
		min-height: 0;
		font-size: 3vw;
		margin-left: 10%;
		margin-right: 5%;
		padding-top: 1vh;
	}
	
}