@charset "utf-8";
/* CSS Document */
html,body
{
	margin:0px;
	padding:0px;
	background-color:#111111;	
}

.left
{
	text-align:left !important;	
}

.btn
{
	width:80px !important;
}

#cardid
{
	width:5px;
	height:5px;
	border:0px;
	overflow:hidden;
	color:transparent;
	background-color:transparent;
}

#container
{
	padding:0px;
	width:1080px;
	height:1920px;
	margin:0 auto;
	position:relative;
	overflow:hidden !important;
	background-image:url(../images/circus.jpg);
}

.top
{
	width:100%;
	height:388px;
	text-align:center;
	position:relative;
}

.airship
{
	top:20px;
	left:16px;
	color:#000;
	width:450px;
	height:180px;
	font-size:36px;
	cursor:pointer;
	line-height:150px;
	position:absolute;
	letter-spacing:0px;
	font-family:"華康粗圓體","微軟正黑體";
    text-shadow:1px 1px #ffffff;
	background-repeat:no-repeat;
	background-position:center center;
	background-image:url(../images/airship.png);
}

.counter
{
	top:285px;
	left:280px;
	color:#fff;
	width:500px;
	height:80px;
	margin:0 auto;
	font-size:45px;
	line-height:80px;
	font-weight:bold;
	position:absolute;
	font-family:"華康粗圓體","微軟正黑體";
    text-shadow: 2px 2px #000000;
}

.counter_number
{
	color:#F8FF00;
	font-family:Arial Black;
}

.time_area
{
	top:8px;
	right:18px;
	width:400px;
	height:20px;
	color:#000000;
	font-size:22px;
	line-height:30px;
	text-align:right;
	position:absolute;
	letter-spacing:1px;
	font-family:"微軟正黑體";
}

.camera
{
	width:560px;
	height:420px;
	margin:0px auto;
	margin-top:42px;
	background-size:auto auto;
	background-position:center center;
	background-image:url(../images/camera.jpg);
}

.result_area
{
	width:900px;
	height:560px;
	margin:0 auto;
	margin-top:50px;
	overflow:hidden;
	position:relative;
}

.wait
{
	top:0px;
	left:75px;
	width:750px;
	height:300px;
	position:absolute;
}

.wait_photo
{
	float:left;
	width:180px;
	height:180px;
	overflow:hidden;
	margin-top:50px;
	margin-left:80px;
	border:5px solid #FFC600;
	
	/* 圓角效果 */
	border-radius:500px;
	-o-border-radius:500px;
	-ms-border-radius:500px;
	-moz-border-radius:500px;
	-khtml-border-radius:500px;
	-webkit-border-radius:500px;
}

.wait_word
{
	color:#fff;
	float:right;
	width:420px;
	height:300px;
	font-size:80px;
	text-align:center;
	margin-right:10px;
	line-height:300px;
	font-family:"華康粗圓體","微軟正黑體";
	text-shadow:3px 3px #000000;
}

.student_area
{
	top:0px;
	left:75px;
	width:750px;
	height:260px;
	position:absolute;
}

.student_message
{
	color:#fff;
	width:100%;
	height:260px;
	font-size:80px;
	line-height:260px;
	text-align:center;
	font-family:"華康粗圓體","微軟正黑體";
	text-shadow:3px 3px #000000;
}

.student_photo
{
	float:left;
	width:250px;
	height:250px;
	overflow:hidden;
	margin-left:50px;
	background-color:#000000;
	border:5px solid #ffffff;
	background-size:auto 250px;
	background-repeat:no-repeat;
	background-position:center center;
	
	/* 圓角效果 */
	border-radius:500px;
	-o-border-radius:500px;
	-ms-border-radius:500px;
	-moz-border-radius:500px;
	-khtml-border-radius:500px;
	-webkit-border-radius:500px;
}

.student_name
{
	float:right;
	width:390px;
	height:130px;
	color:#ffffff;
	font-size:80px;
	text-align:left;
	line-height:180px;
	font-family:"華康粗圓體","微軟正黑體";
	text-shadow:3px 3px #000000;
}

.student_thermome
{
	float:right;
	width:390px;
	height:130px;
	font-size:60px;
	text-align:left;
	line-height:130px;
	font-family:"華康粗圓體","微軟正黑體";
	text-shadow:3px 3px #000000;
}

.train_area
{
	left:0px;
	top:1140px;
	width:1080px;
	height:280px;
	position:absolute;	
}

.record_area
{
	width:900px;
	height:240px;
	margin:0px auto;
	margin-top:70px;
}

.record_photo
{
	float:left;
	width:320px;
	height:238px;
	overflow:hidden;
	text-align:center;
	margin-left:219px;
	border:1px solid #906011;
	border-right:0px;
	
	/* 圓角效果 */
	border-radius:12px 0px 0px 12px;
	-o-border-radius:12px 0px 0px 12px;
	-ms-border-radius:12px 0px 0px 12px;
	-moz-border-radius:12px 0px 0px 12px;
	-khtml-border-radius:12px 0px 0px 12px;
	-webkit-border-radius:12px 0px 0px 12px;
}

.record_list
{
	float:right;
	width:358px;
	height:240px;
	overflow:hidden;
	
	/* 圓角效果 */
	border-radius:0px 12px 12px 0px;
	-o-border-radius:0px 12px 12px 0px;
	-ms-border-radius:0px 12px 12px 0px;
	-moz-border-radius:0px 12px 12px 0px;
	-khtml-border-radius:0px 12px 12px 0px;
	-webkit-border-radius:0px 12px 12px 0px;
}

.footer
{
	top:1840px;
	height:80px;
	width:1080px;
	position:absolute;
}

select[multiple]:focus option:checked
{
	background: red linear-gradient(0deg, red 0%, red 100%);
}

select[multiple] option
{
	padding:15px 0px 15px 15px;
}

.debug_area
{
	padding:5px;
	width:1070px;
	margin:0 auto;
	font-size:16px;
	line-height:30px;
	font-family:"微軟正黑體";
	background-color:#cccccc;
}

.debug_area input
{
	width:150px;
	text-align:center;
	font-family:"微軟正黑體";
}

.debug_area select
{
	width:157px;
	text-align:left;
	font-family:"微軟正黑體";
}

.thermome_number
{
	font-size:90px;
	font-family:Arial Black;
}

.thermome_unit
{
	color:#A3A3A3;
	font-family:"微軟正黑體";
}


.ball_area
{
	top:1495px;
	left:120px;
	width:70px;
	height:70px;
	position: absolute;
}

.ball_obj
{
	width:70px;
	height:70px;
	-webkit-animation:rotate 2s linear infinite;
	-moz-animation:rotate 2s linear infinite;
	animation:rotate 2s linear infinite;
}

.button
{
	cursor:pointer;	
}

.button_on
{
	color:#fff;
	background-color:#090;
}

.button_off
{
	color:#fff;
	background-color:#f00;
}

@-moz-keyframes rotate { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes rotate { 100% { -webkit-transform: rotate(360deg); } }
@keyframes rotate { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
