.unitMenu {
    height: 11%;
    margin: -3% auto;
    width: 98%;
}
.unitMenu >img{
	float:left;
	width: 14%;
	margin-top:1%;
}
.unitDtls {
    height: 97%;
    width: 96%;
    text-align: center;
    margin: 3% 2% 0 2%;
    display:inline-block;
    overflow: hidden;
}
#unitbox {
    float: right;
    width: 85%;
}
#unitbox > img {
    width: 5.2%;
    position: relative;
    margin-top: 1%;
    margin-left: 0.25%;
}
.model {
    width: 13%;
    height: 85%;
    float: left;
}

.model > img {
    width: 94%;
}

.model > a {
    width: 100%;
    float: left;
}

.videobox {
    height: 85%;
    width: 76%;
    float: left;
}
div#btnbox {
    float: left;
    display: inline-block;
    width: 7%;
}
div#btnbox img {
    margin-top: 6%;
    width:79%;
}
.characters {
    background-size: 100%;
    display: inline-block;
    width: 90%;
    height: 98%;
    float: left;
}
.changebox {
    display: inline-block;
    height: 8.8%;
    width: 100%;
    display:inline-block;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
	.changebox {
	    display: inline-block;
	    height: 10%;
	    width: 100%;
	    display:inline-block;
	}
}
@-moz-document url-prefix() {
	.changebox {
		height: 10%;
	}
}
.follow {
    width: 10%;
    height: 100%;
    display: inline-block;
}

.follow > img{
    width: 75%;
    height: auto;
}
.result{
    background: url("../images/course/answerbox.png") 0% 0% / 100% no-repeat;
	background-size: 100%;
    width: 90%;
    height: 98%;
    display: inline-block;
    text-align:left;
}
.result span {
    padding: 12px 5%;
    display: inline-block;
    vertical-align: middle;
    font-size: 33px;
    color: #673AB7;
    margin-top:-2%;
}

.characters img {
    height: auto;
    width:8%;
}

.listen,.sing{
	width: 17.1%;
	float:right;
	margin-left:1%;
	margin-top: 5px;
}
.tbl_frame{
    border: none;
}
.adjust_style{
		margin-top: 7px;
		margin-top: 0px\9\0;
	}

@media screen and (-webkit-min-device-pixel-ratio:0) {
	.adjust_style {
    	margin-top: 1px;
	}
}
@media screen and (min-width: 1200px) and (max-width: 1600px) {
    .result span {
	   font-size: 24px;
	}
	.adjust_style{
		margin-top: 1px;
	}
	@media screen and (-webkit-min-device-pixel-ratio:0) {
	.adjust_style {
    	margin-top: 2px;
	}
}
}
@media screen and (min-width: 1001px) and (max-width: 1200px) {
    .result span {
	    font-size: 16px;
	}
	.adjust_style{
		margin-top: 1px;
	}
}
@media screen and (min-width: 901px) and (max-width: 1000px) {
	.result span {
	    font-size: 14px;
	}
	#unitbox > img {
	    width: 5.0%;
	}
	.adjust_style{
		margin-top: 1px;
	}
	@media screen and (-webkit-min-device-pixel-ratio:0) {
	.adjust_style {
    	margin-top: 4px;
	}
}
}
@media screen and (min-width: 801px) and (max-width: 900px) {
	.result span {
	    font-size: 14px;
	}
	#unitbox > img {
	    width: 5.0%;
	}
	.adjust_style{
		margin-top: 1px;
	}
	@media screen and (-webkit-min-device-pixel-ratio:0) {
	.adjust_style {
    	margin-top: 2px;
	}
}
}
@media screen and (min-width: 201px) and (max-width: 800px) {
	.result span {
	    font-size: 4px;
	}
	#unitbox > img {
	    width: 5.0%;
	}
	.adjust_style{
		margin-top: 1px;
	}

}

