body
{
	font-family:Arial,"微軟正黑體";
	font-size: 16px;
	width: 900px;
	margin: 0px auto 0 auto;
	/*background: #444;*/
}

#div1 {
	position: relative;
	left: 0px;
	top: 0px;
	width: 900px;
	height: 600px;
	margin-top:5px;
	background-color: #FFFFFF;
}

input[type='range'] {
	width:250px;
}

input[type='range']:hover{
	cursor:pointer;
}

input[type='button']{
	font-family: Verdana,Arial,"微軟正黑體";
	font-size: 10pt; 
	background-color: white;
	border: 1px solid #ccc;
	color: dimgray;
	padding: 4px 8px;
	border-radius: 5px;
	box-shadow: 0 1px 1px rgba(0,0,0,.075);
}

input[type='button']:focus{
	outline: 0;
}

input[type='button']:hover{
	color: black;
}

input[type='button']:active{
	background-color: #F7F7F9;
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
}


.titletext{
	font-weight: bold;
	text-align:center;
	vertical-align:middle;
	/* background-color:#9900CC; */
	color:#FFFFFF;
}

#imgdiv, #titlediv1, #titlediv2,#userdiv1,#userdiv2,#userdiv3,#userdiv4 {
	box-sizing:border-box;
}

#titlediv1, #titlediv2 {
	position: absolute;
	left: 575px;
	width: 315px;
	padding: 1px 0;
	/* background-color:#9900CC; */
	background-color: #6F2C91;
	border: 1px solid #9900CC;
	z-index: 2;
}

#titlediv1{
	top: 0px;
}

#titlediv2{
	top: 345px;
}



#imgdiv {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 570px;
	height: 600px;
	border: 1px solid #CCCCCC;
	z-index: 1;
}
#userdiv1 {
	position: absolute;
	left: 575px;
	top: 35px;
	width: 315px;
	height: 305px;
	border: 1px solid #CCCCCC;
	z-index: 2;
}

#userdiv2 {
	position: absolute;
	left: 575px;
	top: 380px;
	width: 315px;
	height: 50px;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
	border-left: 1px solid #CCCCCC;
	z-index: 2;
}

#userdiv3 {
	position: absolute;
	left: 575px;
	top: 430px;
	width: 315px;
	height: 120px;
	border-bottom: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
	border-left: 1px solid #CCCCCC;
	z-index: 2;
}
#userdiv4 {
	position: absolute;
	left: 575px;
	top: 550px;
	width: 315px;
	height: 50px;
	border-bottom: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
	border-left: 1px solid #CCCCCC;
	z-index: 2;
}
.italicsymbol {
	font-family:"Times New Roman", Times, serif;
	font-size: 16px;
	font-style:italic;
}

.fraction {
	display: inline-block;
	position: relative;
	vertical-align: middle; 
	letter-spacing: 0.01em;
	text-align: center;
	}
.fraction > span { 
	display: block; 
	padding: 0.2em; 
	}
.fraction span.fdn {border-top: thin solid black;}
.fraction span.bar {display: none;}