body{margin:0px;}
.mainContainer{background: #fac695; /* Old browsers */background: -moz-linear-gradient(45deg, #fac695 0%, #f5ab66 47%, #ef8d31 100%); /* FF3.6-15 */background: -webkit-linear-gradient(45deg, #fac695 0%,#f5ab66 47%,#ef8d31 100%); /* Chrome10-25,Safari5.1-6 */background: linear-gradient(45deg, #fac695 0%,#f5ab66 47%,#ef8d31 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fac695', endColorstr='#ef8d31',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */width:100%;height:100vh;overflow:hidden;display: table;position: absolute;height: 100%;width: 100%;}
.caseBg{width:100%;height:100vh;overflow:hidden;background-image:url(image/caseBg.png);background-size:cover;}
.resultIcon{position:absolute;width:340px;left:70px;top:81px;}
.resultIcon img{width:100%;}
.studentName{color:#ef8f2e;font-family:sans-serif;font-size:40px;position:absolute;top:171px;left: 423px;width: 440px;text-align: center;}
.msg{color:#59524c;font-family:sans-serif;font-weight:700;position:absolute;font-size:50px;top:260px;left:529px;}
.warningIcon{top:93px;}
.case3 .msg{left:480px;}
.case4 .msg{left:471px;font-size:40px;}
.case5 .msg{text-align:center;font-size:41px;left:494px;}
.case6 .msg{text-align:center;font-size:46px;left:522px;top:193px;}
.case7 .msg{left:474px;font-size: 45px;top: 218px;}
.case8  .msg{left: 498px;top: 220px;}
.whiteContainer{height:510px;width:910px;background-color:rgba(255,255,255,0.9);position:absolute;margin:auto;top:0;left:0;bottom:0;right:0;    /* opacity: 0.9; */box-shadow:11px 9px 15px -4px #888888;}
{position:absolute;top:285px;left:462px;}
.titleImg{position: relative;/* top:160px; *//* left:440px; */width: 100%;text-align: center;padding: 10px 0px;}
.failBox{display: none;/* padding: 30px 0px; */color: #ffffff;font-size: 19px;background-color: #f54c6c;}
.successBox{display: none;/* padding: 30px 0px; */color: #ffffff;font-size: 19px;background-color: #1cc654;}

/* necessary to give position: relative to parent. */
input[type="text"]{/* font: 15px/24px 'Muli', sans-serif; *//* color: #333; *//* width: 100%; *//* box-sizing: border-box; *//* letter-spacing: 1px; */background-color: #ffffff;}

:focus{outline: none;}

.col-3{/* float: left; *//* width: 300px; *//* margin: 40px 3%; *//* position: absolute; *//* display: block; *//* text-align: center; */width: 100%;} /* necessary to give position: relative to parent. */
input[type="text"]{font: 15px/24px "Lato", Arial, sans-serif; color: #333; width: 100%; box-sizing: border-box; letter-spacing: 1px;height:41px;}


.effect-20{border: 1px solid #ccc;padding: 7px 14px;transition: 0.4s;background: transparent;}


.effect-20 ~ .focus-border:before,
.effect-20 ~ .focus-border:after{content: "";position: absolute;top: 0;left: 0;width: 0;height: 2px;background-color: #975c00;transition: 0.3s;}
.effect-20 ~ .focus-border:after{top: auto; bottom: 0; left: auto; right: 0;}
.effect-20 ~ .focus-border i:before,
.effect-20 ~ .focus-border i:after{content: ""; position: absolute; top: 0; left: 0; width: 2px; height: 0; background-color: #975c00; transition: 0.4s;}
.effect-20 ~ .focus-border i:after{left: auto; right: 0; top: auto; bottom: 0;}
.effect-20:focus ~ .focus-border:before,
.effect-20:focus ~ .focus-border:after,
.has-content.effect-20 ~ .focus-border:before,
.has-content.effect-20 ~ .focus-border:after{width: 100%; transition: 0.3s;}
.effect-20:focus ~ .focus-border i:before,
.effect-20:focus ~ .focus-border i:after,
.has-content.effect-20 ~ .focus-border i:before,
.has-content.effect-20 ~ .focus-border i:after{height: 100%; transition: 0.4s;}
.effect-20 ~ label{position: absolute; left: 14px; width: 100%; top: 10px; color: #aaa; transition: 0.3s; z-index: -1; letter-spacing: 0.5px;}
.effect-20:focus ~ label, .has-content.effect-20 ~ label{position:absolute;top: -100px; left: 0; font-size: 12px; color: #975c00; transition: 0.3s;}

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

form#taxiLectureForm {
    position: relative;
    text-align: center;
    width: 100%;
    height: 41px;
}

.submitBtn {
    /* position: absolute; */
    padding: 48px 0px;
    /* z-index: 90; */
    z-index: 10;
    position: absolute;
    float: left;
    /* padding-left: 19%; */
}
.formContainer {
    position: relative;
    width: 100%;
    height: 160px;
    text-align: center;
    overflow: hidden;
}

.embedform {
    position: absolute;
    
    text-align: center;
    width: 100%;
}
.centercontainer {
    display: table-cell;
    vertical-align: middle;
}

.inner {
    margin-left: auto;
    margin-right: auto;
    width: 500px;
}.titleImg img {
    width: 100%;
}
.submitWriteLog {
	-moz-box-shadow: 3px 4px 0px 0px #ffffff;
	-webkit-box-shadow: 3px 4px 0px 0px #ffffff;
	box-shadow: 3px 4px 0px 0px #ffffff;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f9f9f9), color-stop(1, #e9e9e9));
	background:-moz-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
	background:-webkit-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
	background:-o-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
	background:-ms-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
	background:linear-gradient(to bottom, #f9f9f9 5%, #e9e9e9 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e9e9e9',GradientType=0);
	background-color:#f9f9f9;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	border:1px solid #dcdcdc;
	display:inline-block;
	cursor:pointer;
	color:#666666;
	font-family:Arial;
	font-size:17px;
	font-weight:bold;
	padding:12px 44px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffffff;
	/* padding: 0px 30px; */
	z-index: 10;
	float: left;
}
.submitWriteLog:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #e9e9e9), color-stop(1, #f9f9f9));
	background:-moz-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
	background:-webkit-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
	background:-o-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
	background:-ms-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
	background:linear-gradient(to bottom, #e9e9e9 5%, #f9f9f9 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e9e9e9', endColorstr='#f9f9f9',GradientType=0);
	background-color:#e9e9e9;
}
.submitWriteLog:active {
	position:relative;
	top:1px;
}

.failBox{display: none;}
.loadingReq{
    display: none;
    /* right: 40px; */
    /* top: 82px; */
    position: relative;
    z-index: 0;
    }
    .submitBtn.s1 {
    left: 5%;
}

.submitBtn.s2 {
    right: 5%;
}
.testArea {
    width: 100%;
    height: 100%;
    position: fixed;
    border:none;
    overflow: hidden;
}
@media only screen and (max-width: 500px) {
.inner {
    width: 80%;
}
}