
#header { height: 80px; background: #f0f0f0;}
#top_sec { height: 480px; background-color: #babcbe;}

#menu { font-size: 16px; float: right; margin: 30px 0 0 0;}
#menu li { list-style: none; float: left; margin: 0 20px 0 0;}
#menu li a { text-decoration: none; color: #000;}
#menu li a:hover {
	border-bottom: 4px solid #241f20;
	-webkit-transition:.2s;
	   -moz-transition:.2s;
		 -o-transition:.2s;
			transition:.2s;
}

#fileContainer{ width: 800px; height: 180px; position: absolute; background-color: #E5E6E8; border: 50px #e5e6e7 solid; margin: -55px 0 0 -50px;}
.file_btn {
	color: #fff;
	background: #241f20;
	-webkit-transition:background 0.2s;
	   -moz-transition:background 0.2s;
	     -o-transition:background 0.2s;
	        transition:background 0.2s;
}
.file_btn:hover { background: #babcbe; color: #241f20;}
#readFile { width: 800px; margin: 120px auto 0 auto;}
#frmUpload { width: 797px; height: 60px; border-bottom: none; display: inline-block;}
#fakeBrowse { width: 200px; height: 60px;  float: right; border: none; font-size: 20px;}
#txtFakeText { width: 585px; height: 58px; font-size: 18px;  text-align: center; border: none;}
#fileDrag { width: 590px; height: 56px; margin-top: -58px; font-size: 20px; text-align: center; line-height: 60px; border-top: none; z-index:0; opacity:0; }
#fileDrag.hover { z-index:5; opacity:1;}

#progress_bar {
	width: 797px; 
	color: white; 
	text-align: right;
	clear: both;
	opacity: 0;
	-webkit-transition:opacity .3s linear;
	   -moz-transition:opacity .3s linear;
	     -o-transition:opacity .3s linear;
	        transition:opacity .3s linear;
}
#progress_bar.loading { opacity: 1.0;}
#progress_bar .percent {
	width: 0; 
	height: 10px;
	margin-top: 2px;
	background-color: #4e4e4e;
	-webkit-transition:all 1s cubic-bezier(0.215, 0.61, 0.355, 1);
	   -moz-transition:all 1s cubic-bezier(0.215, 0.61, 0.355, 1);
	     -o-transition:all 1s cubic-bezier(0.215, 0.61, 0.355, 1);
	        transition:all 1s cubic-bezier(0.215, 0.61, 0.355, 1);
}

#parse {
	width: 797px;
	height: 60px; 
	border: none;
	color: #fff;
	background: #241f20;
	font-size: 20px; 
	-webkit-transition:background 0.2s;
	   -moz-transition:background 0.2s;
	     -o-transition:background 0.2s;
	        transition:background 0.2s;
}

#parse:hover {
	background: #babcbe;
	color: #241f20;
}

#loadTestFile {
	width: 200px;
	height: 50px;
	background-color: #cfd1d2;
	color: #241f20;
	border: none;
	font-size: 14px;
	font-weight: bold;
	margin: 10px 0 0 300px;
	-webkit-transition:background 0.2s;
	   -moz-transition:background 0.2s;
	     -o-transition:background 0.2s;
	        transition:background 0.2s;
}

#about { width: 900px; margin: auto;}
#recent { width: 900px; margin: auto; display: none;}
#recent_data { position: relative; z-index:2; width: 900px; font-size: 14px; text-align: center;}
.recent_data .del, .recent_data .print, .recent_data .reload { cursor: pointer; }
.reload { width: 100px; font-weight: bold; }
.reload:hover {color: #241f20; cursor: pointer;}
.del {background-color: #efefef; color: #b4b4b4; width: 30px;}
.del:hover {color: #241f20; cursor: pointer;}
.footer_copyright {position: fixed; width: 100%; bottom: 0; font-size: 12px; line-height: 50px;color: #fff; background: #babcbe; padding-left: 20px; z-index: 3;}
.footer_copyright span {float: right; margin-right: 40px;}
.footer_copyright a {text-decoration: none; color: #fff;}
.footer_copyright a:hover {color: #241f20;}
