@font-face {
    font-family: atsfontbold;
    src: url('fonts/THSBold.eot');
    src: url('fonts/THSBold.woff') format('woff'), 
         url('fonts/THSBold.ttf') format('truetype');
}

@font-face {
    font-family: atsfont;
    src: url('fonts/THS.eot');
    src: url('fonts/THS.woff') format('woff'), 
         url('fonts/THS.ttf') format('truetype');
}

.ths{
	font-family: atsfont !important;
	font-size: 14pt;
}

.thsb{
	font-family: atsfontbold !important;
	font-size: 14pt;
}
/*
---------------------
main-bg-blue
#3cad76
2nd color
#ff9801
---------------------
*/

BODY{
	padding: 0;
	margin: 0;
	background: #e7f5f8 url('../images/nbg2.jpg') left bottom fixed no-repeat;
	position: relative;
	background-size: cover;
}



BODY, TD, TH, select, input, span, div, textarea{
	font-size: 14px;
	color: black;
	font-family: Tahoma, Verdana;
}

a{
	text-decoration: none;
	color: #292574;
}

a.sep{
	color: #C47500;
}

a:hover{
	color: black;
}

.header{
	background: #ff9801;
	margin-bottom: 20px;
	border-bottom: 1px solid white;
}

.header .sitename{
	font-size: 18px;
	color: white;
	padding: 0 10px;
	line-height: 40px;
}

.header .sitename b{
	color: white;
}

.hello{
	display: block;
	float: right;
	color: white;
	line-height: 40px;
	padding-right: 10px;
}

.manage a.warn{
	background: #2D73D2;
}

.manage a:hover{
	background: #6491DB;
}

.login-form{
	display: table; 
	margin: 100px auto;
	background: white;
	padding: 0;
	border-radius: 5px;
	box-shadow: 1px 1px 5px #DCDCDC;
	width: 60%
}

.login-form h1{
	background: #3cad76;
	color: white;
	line-height: 40px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	font-weight: normal;
	margin-top: 0;
}

.center-table{
	display: table;
	margin: 0 auto;
}

.text-blue{
	color: #3cad76;
}

.row{
	padding: 10px;
}

input{
	border: 1px solid #DCDCDC;
	background: white;
	outline: none;
	padding: 4px;
	border-radius: 4px;
}

textarea{
	border: 1px solid #DCDCDC;
	background: white;
	outline: none;
	padding: 4px;
	border-radius: 4px;
	min-width: 315px;
	min-height: 80px;
}

textarea.norm{
	min-height: auto;
}

select{
	border: 1px solid #DCDCDC;
	background: white;
	outline: none;
	padding: 3px 1px;
	border-radius: 4px;
}

select.min{
	min-width: 220px;
}

h1{
	font-size: 16px;
	font-weight: bold;
}

.c{
	text-align: center !important;
}

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

.r{
	text-align: right !important;
}

.btn{
	padding: 0 20px;
	border-radius: 4px;
	color: white;
	line-height: 27px;
	text-align: center;
	border: none;
	background: #3cad76;
	margin: 0 2px;
	outline: none;
}

.btn:hover{
    opacity: 0.8;
    filter: alpha(opacity=80); /* For IE8 and earlier */
}

.btn-warning{
	background: #FF9900 !important;
}

.btn-low{
	line-height: 26px;
}

.warper{
	display: table;
	margin: 10px auto;
	width: 90%;
}

.box{
	background: white;
	border-radius: 5px;
	box-shadow: 0 0 10px black;
	padding: 0 0 20px 0;
	width: 80%;
	display: block;
	float: left;
}

.box100{
	width:100% !important;
}
.box h1{
	background: #3cad76;
	color: white;
	line-height: 40px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	font-weight: normal;
	padding: 0 20px;
	margin: 0 0 10px 0;
	text-align: right;
}

.menu{
	padding: 0;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	display: block;
	float: left;
	width: 20%;
	min-width: 180px;
}

.menu h1{
	background: #3cad76;
	color: white;
	line-height: 40px;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	font-weight: normal;
    margin: 0 0 0 0;
    padding: 0 20px;
}
.menu .inmenu{
	box-shadow: 0 0 10px black;
	margin-right: 10px;
	border-radius: 4px;
	background: white;
}

.menu a{
	display: block;
	line-height: 30px;
	color: black;
	padding: 0 15px;
	border-bottom: 1px solid #DCDCDC;
	background: white;
	/*margin-right: 10px;*/
}

.menu a:first-child{
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

.menu a.on{
	color: white;
	font-weight: bold;
	background: #FF9900;
}


.menu a:hover{
	background: #C7E3F1;
	color: black;
}

.menu a.recipt{
	padding-top: 10px;
	padding-bottom: 10px;
}

.clearfix{
	width: 100%;
	clear: both;
}

table{
	border-collapse: collapse;
	width: 98%;
	border: none;
	display: table;
	margin: 0 auto;
}

table tr.hover:hover td{
	background: #f6f6f6;
}

table.form tr th{
	text-align: left;
}

table tr th{
	font-weight: bold;
	color: black;
	background: #f6f6f6;
	padding: 4px;
	border: 1px solid white;
}

table tr td{
	padding: 4px;
	border-bottom: 1px solid #DCDCDC;
}

table.form tr th{
	text-align: left !important;
}

table.clear{
	width:initial;
	margin: 0;
}

table.clear tr th, table.clear tr td{
	border: none;
}

.need{
	color: red !important;
}

.err{
	border-color: red !important;
}

.thumb{
	width: 100px;
	border: none;
}

.form-label{
	width: 150px;
	background: #f6f6f6;
	border: 1px solid #DCDCDC;
	line-height: 25px;
	display: block;
	float: left;
	border-top-left-radius: 4px;
	border-bottom-left-radius: 4px;
	padding: 0 4px;
	border-right: 0;
}

.has-label input, .has-label select{
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

.has-label textarea{
	border-top-left-radius: 0;
}

.form-group{
	border: 1px solid #DCDCDC;
	border-radius: 4px;
	margin-bottom: 5px;
}

.form-group label:not(.noclass){
	font-weight: bold;
	margin-bottom: 5px;
	display: block;
	float: none;
}

.thumb{
	border: none;
	width: 150px;
}

.thumb-right{
	display: block;
	float: right;
	margin: 0 0 5px 5px;
}

.suredel{
	background: red !important;
}

.suredel:hover{
	background: #ff9801 !important;
}

ul.pagination{
	list-style: none;
	padding: 0;
	margin: 5px;
}

ul.pagination li{
	list-style: none;
	padding: 0;
	margin: 0 2px;
	display: block;
	float: left;
}

ul.pagination li a{
	display: block;
	padding: 0 8px;
	line-height: 20px;
	border-radius: 2px;
	background: #DCDCDC;
	color: #666666;
}

ul.pagination li a.on{
	background: #3cad76;
	color: white;
}

td.nopad{
	padding: 0 !important;
}

.footer{
	background: black;
	text-align: right;
	bottom: -10px;
	width: 100%;
	/*position: absolute;*/
}

.footer span{
	padding-right: 10px;
	color: #DBDBDB;
	line-height: 25px;
	font-size: 10px;
}

.hidden{
	display: none;
}

.content{
	padding: 10px;
}

.namelist{
	display: table;
	margin: 0 auto;
}

.namelist a{
	display: table-cell;
	float: left;
	text-align: center;
	vertical-align: middle;
	padding: 0 10px;
	margin: 0 5px 5px 0;
	background: #68CA9B;
	color: white;
	font-size: 22px;
	line-height: 50px;
	border-radius: 4px;
	width: 100px;
	height: 100px;
}

.namelist a:hover{
	background: #ff9801;
}

.manage a{
	display: inline-block;
	border-radius: 4px;
	padding: 0 10px;
	background: #3cad76;
	color: white;
	line-height: 18px;
}

.manage a:hover{
	background: #ff9801;
}

.small{
	color: #696969;
	font-size: 10px;
	font-style: italic;
}

.signature{
	max-width: 150px;
	border: none;
}

.doc{
	margin: 2.5cm 2.5cm 50px 2.5cm;
}

.doc .dtitle{
	font-size: 20pt;
	font-weight: bold;
	line-height: 80px;
	background: url('../images/logo-80.jpg') left center no-repeat;
	text-align: center;
	margin-bottom: 40px;
}

.doc .label{
	display: block;
	float: left;
	/*font-size: 16pt;*/
	font-weight: bold;
	margin-right: 40px;
	line-height: 40px;
}

.doc .value{
	display: block;
	float: left;
	/*font-size: 14pt;*/
	font-weight: normal;
	margin-right: 40px;
	line-height: 40px;
}

.doc p{
	text-indent: 150px;
}

.sign .block{
	display: block;
	float: right;
	width: 50%;
	padding: 0;
	margin: 40px 0 0 0;
	text-align: center;
}

.sign .block div{
	line-height: 30px;
}

.sign .block .signature{
	height: 100px;
	text-align: center;
	display: table;
	margin: 0 auto;
}

.sign .block .signature img{
	max-height: 100px;
}

.sign .block .delsign{
	color: white;
	display: block;
	position: absolute;
	line-height: 25px !important;
	padding: 0 5px;
	border-radius: 3px;
}

.doc .logo{
	height: 120px;
	background: url('../images/logo-120.jpg') center center no-repeat !important;
	text-align: center;
}

.fl{
	display: block;
	float: left;
}

.fr{
	display: block;
	float: right;
}

.half{
	width: 48%;
}

.warning{
	background: #DDFFDD;
	border: 1px solid #009500;
	padding: 20px;
	margin: 5px;
	position: relative;
}

.warning #wclose{
	position: absolute;
	display: block;
	color: #009500;
	font-size: 20px;
	line-height: 20px;
	padding: 0;
	top: 1px;
	right: 3px;
}

tr.hover:hover{
	background: #f9f9f9;
}

.logo-color{
	display: inline-block;
	width: 60px;
	height: 60px;
	background: url('../images/logo-color.png') left top no-repeat;
}

.alone{
	padding: 20px;
	background: white;
}

.morelink a{
	font-size: 9pt;
	color: #3cad76;
}

.morelink a:hover{
	color: black;
}

.blink_me {
  animation: blinker 1s linear infinite;
}

@keyframes blinker {  
  50% { opacity: 0; }
}

.alert_icon{
	display: block;
	float: right;
	color: white;
}

.alert_icon i{
	line-height: 40px !important;
	margin-right: 10px;
}

.alert_icon:hover{
	color: white;
}

.switch a .fa{
	font-size: 20pt;
}

.switch-on{
	color: #3cad76;
}

.switch-off{
	color: #D3D3D3;
}

.pad-td{
	padding-left: 60px;
	background: #FFFAE1;
}

.table-title{
	width: 98%;
	display: table;
	margin: 0 auto;
	font-weight: bold;
}

.table-auto{
	width: auto;
}

.ml-0{
	margin-left: 1%;
}

input[readonly]:not(.datepicker):not(.border) {
    border: none;
}

/***************************** popup **********************************/
BODY.popupwin{
	background: white;
}

BODY.popupwin #mmenu, BODY.popupwin .hello, BODY.popupwin .footer{
	display: none !important;
}