html {
	height:100%;
    min-height:100%;
}

body {
	margin:0px;
}

.fixed {
	position:fixed;
	width:100%;
	height:0px;
	z-index:1;
}

.topBar {
	top:0px;
	max-width:1000px;
	margin: 0px auto;
}

.rightBar {
	top: 0px;
	width: 90vw;
	margin: 0px auto;
}

.menuBar {
	width: 100%;
	bottom: 1vh;
	position: absolute;
}

.menuBar > ul {
	cursor: default;
	list-style-type: none;
	display: inline-flex;
	margin: 0px;
	color: white;
	font-size: 1vw;
}

.menuBar > ul > li {
	padding-right: 2vw;
}

.menuBar > ul > li:hover {
	color:#FAB13E;
}

.LoginIcon {
	width:34px;
	height:34px;
	background-color:rgba(150, 150, 150, 0.5);
	background-size:34px 34px;
	position:relative;
	float:right;
	display:inline;
	top:65px;
	right:134px;
}

.LoginText {
	cursor: default;
	line-height: 34px;
	width:100px;
	height:34px;
	font-family:arial, helvetica; 
	font-size:18pt; 
	text-align:center;
	background-color:rgba(150, 150, 150, 0.5);
	background-size:100px 34px;
	position:relative;
	float:right;
	display:inline;
	top:65px;
	right:0px;
}

.previewTag {
	margin: 0px auto;
}

.Signin:visited {
    color:white;
}

.Signin{
margin: 0px auto;
color: white
}


.Signin:hover {
 	color:#FAB13E;
}

.topleft {
	position:relative;
	float:left;
	display:inline;
	top:70px;
	left:20px;
}

.imgAlpha {
	background-color:rgba(0, 0, 0, 0.4);
}

.ExplainText {
	font-family:arial, Microsoft JhengHei; 
	font-size:4vw; 
	font-weight:bold;
	position:relative;
	top:40vh;
	margin: 0px auto;
	color:white;
}

.SubtitleText {
	font-family:arial, Microsoft JhengHei; 
	font-size:2vw; 
	font-weight:bold;
	line-height:6vh;
	position:relative;
	top:43vh;
	margin: 0px auto;
    color:white;
}

.ExplainTextContent {
	top:15vh;
}

.SubtitleTextContent {
	font-size:2vw;
	top:15vh;
	font-weight:normal;
}

.imageBottom {
	bottom: 8vh;
	position: absolute;
}

.float-center {
	float: left;
  	position: relative;
  	right: -45%; /* or right 50% */
  	text-align: left;
    margin-left:6px;
}

#company {
	width:100%;
	height:53px;
	font-family:arial, helvetica; 
	font-size:13pt; 
	font-weight:bold;
	background-color: #000000;
}

#menu {
	float: right;
	color: white;
	top: 25vh;
	position: relative;
	list-style-type: none;
	cursor: default;
	display: none;
}

#menu > li {
	padding-top: 25px;
	margin-bottom: -15px;
	text-align: center;
	width: 70px;
	height: 45px;
}

#menu > li:hover {
	color:#FAB13E;
}

.menuSelected {
	background-color: rgba(255,255,255,0.3);
	border-radius: 100px;
}

.block {
	position: relative;
	width: 100%;
	height: 100vh;
	background-color: #000000;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:cover;
	text-align: center;
}

.block#homeDiv {
	background-image:url(../images/Index_background_01.jpg);
}

.block#videoDiv {
	background-image:url(../images/Index_background_02.jpg);
}

#videoDiv div {
	max-width: 55vw;
	left: 23vw;
	position: absolute;
}

.block#imageDiv {
	background-image:url(../images/Index_background_03.jpg);
}

#imageDiv div {
	max-width: 30vw;
	left: 15vw;
	position: absolute;
	margin-top: 20vh;
	text-align: left;
}

.block#quizDiv {
	background-image:url(../images/Index_background_04.jpg);
}

#quizDiv div {
	max-width: 30vw;
	left: 53vw;
	position: absolute;
	margin-top: 15vh;
	text-align: left;
}

.block#fileDiv {
	background-image:url(../images/Index_background_05.jpg);
}

#fileDiv div {
	max-width: 30vw;
	left: 10vw;
	position: absolute;
	margin-top: 40vh;
	text-align: left;
}

.block#weblinkDiv {
	background-image:url(../images/Index_background_06.jpg);
}

#weblinkContent {
	max-width: 32vw;
	left: 45vw;
	position: absolute;
	margin-top: 11vh;
	text-align: left;
}