@font-face {
    font-family: 'Xerox Sans';
    src: url('xeroxsans.eot');
    src: url('xeroxsans.eot?#iefix') format('embedded-opentype'),
	 url('xeroxsans.woff') format('woff'),
	 url('xeroxsans.ttf') format('truetype'),
	 url('xeroxsans.svg') format('svg');
}
body{
	/*background:URL(../images/case-profile.jpg) no-repeat 50% -41px;*/
}
body {
	font-family:Helivatic,Arial, sans-serif ;
	font-size:140%;
	background:#fff;
}
a{
	text-decoration:underline;
	color:#2e6ca2;
}
h1,h2,h3,h4,h5,h6{
	font-family:'Xerox Sans';
	font-weight:100;
}
h1.logo-title{
	font-size:246%;
}
h6.logo-subtitle{
	font-size:1em;
}
h5{
	font-size:115%;
}
h3{
	color:#00B1C5;
}
h5{
	color:#3F8CB2;
}
h3{
	font-size:138%;
	margin:0.9em 0px 0.5em 29px;
	color:#777;
	text-transform:uppercase;
	
}
h3:before{
}
h4{

}
hr{
	border-color:#d2d2d2;
	margin:1em 0px 1em 0px;
}
form{
	color:#666;
}
.container-main{
	max-width:1170px;
	margin:0 auto;
}
/*top area*/
.topbar{
	height:100px;
	background:#fff;
	display:inline-table;
	width: 100%;
	position: relative;
}.topsplit{
	background-color:#6699CC;
	background-size:100% 5px;
	height:3px;
	width:100%;
}.logo{
	/*background:URL(../images/logo.png) no-repeat 0px 0px;*/
	width:86px;
	height:56px;
	float:left;
	margin-top:23px;
	text-align:center;
	margin-left:30px;
	margin-right:10px;
}
.logo1{
	/*background:URL(../images/logo.png) no-repeat 0px 0px;*/
	width:86px;
	height:56px;
	float:left;
	margin-top:23px;
	text-align:center;
	margin-left:30px;
	margin-right:10px;
}.logo-title{
	color:#6699CC;
}
.navbar-header{
	width:530px;
}
.navbar-toggle{
	border-color:none;
	border-width:0px;
}
.navbar-toggle .icon-bar{
	background:#e9720b;
}
.ecc-nav{
	background:#4e5a6f;
	/*background:#43464c;*/
	border-top:1px solid #a2a3a4;
	border-bottom:1px solid #a2a3a4;
	/*width:100%;
	height:52px;*/
	clear:both;
}.ecc-nav .nav{
	
}.ecc-nav a{
	color:#f0f0f0;
}
.btn-link{
	text-decoration:underline;
}
.btn-attendance-approve{
	font-size:12px;
	margin-right:14px;
}
.btn-attendance-deny{
	font-size:12px;
}
.dropdown-menu>li>h5{
	padding:3px 20px;
}

label input[type="checkbox"] ~ i{
	font-size: 1.6em;
	color:#999;
}
label input[type="checkbox"] ~ i.glyphicon.glyphicon-unchecked{
    
	display: inline;
}
label input[type="checkbox"] ~ i.glyphicon.glyphicon-check{
    display: none;
}
label input[type="checkbox"]:checked ~ i.glyphicon.glyphicon-unchecked{
    display: none;
}
label input[type="checkbox"]:checked ~ i.glyphicon.glyphicon-check{
   
	display: inline;
}
label:hover input[type="checkbox"] ~ i.glyphicon {
	
}
div[data-toggle="buttons"] label.active{
    
}

div[data-toggle="buttons"] label {
	display: inline-block;
	padding: 6px 12px;
	margin-bottom: 0;
	font-size: 14px;
	font-weight: normal;
	line-height: 2em;
	text-align: left;
	white-space: nowrap;
	vertical-align: top;
	cursor: pointer;
	background-color: none;
	border: 0px solid #c8c8c8;
	border-radius: 3px;
	
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
}
[data-toggle="buttons"] label:hover {

}
[data-toggle="buttons"] label:active, [data-toggle="buttons"] label.active {
-webkit-box-shadow: none;
box-shadow: none;
}



@media (min-width: 768px){
.form-horizontal .control-label {
	padding-top: 0px;
	text-align:left;

	}
.dl-horizontal dt{
	width: 50%;
}
.dl-horizontal dd{
	margin-left:51%;
}
}
@media (max-width: 767px) { 
	.topbar{
		height:auto;
		background:#43464c;
		position:relative;
	}
	
	.logo img{
		width:70%;
		padding-top: 20px;
	}
	.logo{
		margin-left:10px;
		margin-bottom:0.4em;
		height: 40px;
   		width: 70px;
	}
	.logo1 img{
		width:90%;
	}
	
	.logo1{
		margin-left:10px;
		margin-bottom:0.4em;
		height: 40px;
   		width: 70px;
	}
	h1.logo-title{
		width:100%;
		position:relative;
		text-align:left;
		font-size:24px;
		margin-left:15px;
		margin-top:0.8em;
		margin-bottom:0.4em;
	}
	
	h6.logo-subtitle{
				color:darkorange;
                font-size:10px;
                margin-left:15px;
	}
	
	.navbar-header{
		width:100%;
	}
	.navbar-toggle{
		position:absolute;
		top:15px;
		right:1px;
		margin-right: 5px;
	}
	.navbar-nav{
		margin:0px -15px;
	}
	.navbar-collapse{
		border-color:#505050;
	}
	.navbar-nav>li>a{
		color:#f0f0f0;
		border-bottom: 1px solid #505050;
		text-decoration: none;
	}
	.nav>li>a:hover{
		background:#505050;
		color:darkorange;
	}
	
	input[value='Cancel'] {
		margin-left:15px;
		margin-right:15px;
		margin-top: 8px;
	}
}

.navbar-right{
	padding-right:30px;
	bottom:0;
	right:0;
	position:absolute;
	margin-bottom:15px;
}
div.navbar-right button.dropdown-toggle{
	background:transparent;
}
.ecc-content{
	border:1px solid #d2d2d2;
	background:#f9f9f9;
	min-height:550px;
}

.left-section{
	border-right:1px solid #d2d2d2;
	background:#eaeaea;
	width:405px;
	/*min-width:400px;*/
	height:86%;
	min-height:650px;
	display:table-cell;
}

.themeimage{
	background:#e9e9e9;
	padding:10px;
	border-bottom:1px solid #d2d2d2;
}
.themeimage_small{
	margin-left:29px;
}
.pageintroduction{
	margin:1em 0px 0.5em 29px;
}
.form-title{
	color:#666;
	border-left:5px solid #609de4;
	padding-left:0.5em;
}
.themeimage img{
	border:1px solid #d2d2d2;
	width:100%;
	max-width: 381px;
}
.loginsection{
	background:#f5efe8;
	padding:1px 20px 10px 15px;
	border-left:4px solid #609de4;
	border-bottom:1px solid #d2d2d2;
}
.loginsection h5{
	color:#3d3d3d;
	margin:14px 0px 15px 0px;
}
.loginsection input{
	margin-bottom:15px;
}
.loginsection .btn{
	width:60%;
	clear:right;
}
.loginsection a{
	display:block;
}
.contactinfosection{
	padding:20px;
	height:240px;
}

/* -- left end --*/
.right-section{
	display: table-cell;
	padding: 10px;
	vertical-align: top;
}
.welcomesection{
	padding:15px;
}
.usefullink{

}
.usefullink img{
	margin-right:15px;
}
.usefullink ul {
    list-style: none;
    padding:0;
    margin:0 0 20px 15px;
}
.usefullink li { 
    padding-left: 1.5em; 
    text-indent: -0.7em;
}

.usefullink li:before {
    content: "• ";
    color: #3c96ef; 
}

.formmessage ul {
    list-style: none;
    padding:0;
    margin:0 0 20px 0px;
}
.formmessage li { 
    padding-left: 1.5em; 
    text-indent: -0.7em;
	margin-bottom:0.5em;
}
.form-inline .bootstrap-select.btn-group{
	margin-right:1em;
}
.form-inline .form-control{
	width:220px;
}
.formmessage li:before {
    content: "• ";
}
.formmessage h4{
	color:#666
}


.btn-default{
	color:#2e6ca2;
}
.btn-primary{
	background-color:#3a7bb3;
}
.selectpicker.btn-default{
	color:#555;
}
.bs-callout {
	padding: 0.25em 2em 0.25em 1em;
	margin: 1px 0.8em 1em 14px;
	border: 1px solid #eee;
	border-left-width: 5px;
	border-radius: 3px;
	/*float:left;
	width:46%;*/
	background:#fff;
	box-shadow:0px 1px 1px #ccc;
}
.callout-left .bs-callout{
	margin-right:0px;
}
.callout-right .bs-callout{
	margin-left:0px;
}
.attendance_result{
	margin:0px 29px 0px 29px;
}
.pdfwaring{
	padding:1em 1em 0px 1em;
	border:1px solid #dfcb74;
	border-radius:0.3em;
}
.formmessage{
	padding:0.25em 1em 0.25em 1em;
	border:1px solid #dfcb74;
	border-radius:0.3em;
}
.pdfwaring a{
	float:left;
	margin-right:1em;
}
.bs-callout .table{
	margin-bottom:0.5em;
}
.bs-callout-info {
	/*border-left-color: #609de4;*/
	/*border-left-color: #e4a460;*/
	border-left-color:#609de4;
}.bs-callout-voucher{
	border-left-color: #87bbdf;
}
.margin-5{
	margin-left:4%;
}
.margin-right{
	margin-right:4%;
}
.margin-right-weak{
	margin-right:2%;
}
.margin-left-weak{
	margin-left:1%;
}
.strong{
	font-weight:bold;
}
.margin-bottom{
	margin-bottom:1px;
}
.margin-bottom-18{
	margin-bottom:1.5em;
}
.margin-bottom-08{
	margin-bottom:0.8em;
}

.searcharea{
	margin:0px 29px 0px 29px;
	border:1px solid #eee;
	box-shadow:0px 1px 1px #ccc;
}
.paymentdetailarea{
	margin:0px 29px 0px 29px;
	border:1px solid #eee;
	box-shadow:0px 1px 1px #ccc;
}
.paymentdetailarea .table td{
	height:4em;
}
.createuserform .row{
	margin-bottom:0.8em;
	height:34px;
	position: relative;
}
label{
	font-weight:100;
	line-height:0.8em;
}
.createuserform .row label{
	line-height:0.9em;
	font-weight:100;
	margin-bottom:0px;
 	position: absolute;
 	top: 50%;
  	transform: translateY(-50%);
}
.createuserform .row .form-control:not(.btn-group){
	margin-left: 33.33%;
	width:50%;
}
.createuserform .row .input-group{
	margin-left:33.33%;
}
.createuserform .row .input-group .form-control{
	width:100%;
	margin-left:0px;
}
.createuserform .row .form-control.btn-group:first-of-type{
	margin-left: 33.33%;
	width:50%;
}

.search-line1{
	margin-bottom:0.8em;
}
.search-line2{
	margin-bottom:0.8em
}
.panel-withouttop{
	border-top:0px none;
	border-top-left-radius:0;
	border-top-right-radius:0;

}
.bottombar{
	padding:20px;
	font-size:small;
	background:#fff;
}
.folderableheader a{
	color:#696b70;
}
.folderableheader a:hover{
	color:#47484d;
	text-decoration:none;
}
.folderableheader .glyphicon{
	display:inline-block;
	width:18px;
	height:18px;
	margin-right:11px;
	position:static;
}
.triangle{
	display:inline-block; 
	height:0px; 
	width:0px; 
	line-height:0px;
	margin-right:11px;
}
.triangle-right{
	border:5px solid #fff; 
	border-color:transparent transparent transparent #696b70; 
	border-style:solid; 
}
.triangle-top{
	border:5px solid #fff; 
	border-color:#696b70 transparent transparent transparent; 
	border-style:solid; 
}

.bs-callout-danger{
	border-left-color:#cc6666;
	color:#cc6666
}
.nav-tabs>li.active>a, .nav-tabs>li.active>a:hover, .nav-tabs>li.active>a:focus{
	font-weight:bold;
	color:#6699CC;
}
.welcome{
	display:inline-block;
	position:relative;
	top:2px;
}

.bootstrap-datetimepicker-widget td.active, .bootstrap-datetimepicker-widget td.active:hover{
	background:#6699CC;
}
.bootstrap-datetimepicker-widget td.today:before {
	border-bottom-color: #6699CC;
}

.jmesa .wsColumn{
	border-bottom: 0px none;
}
.jmesa .statusBar td{
	font-size:100%;
	font-family:Arial, sans-serif, Helivatic;
	}
.jmesa .odd td, .jmesa .even td, .jmesa .highlight td{
	border:0px none;
	padding:0.5em 0.4em;
	font-size:13px;
	font-family:Arial, sans-serif, Helivatic;
	vertical-align:middle;
}
.jmesa .wsColumn, .jmesa div{
	font-size:1em;
}
.jmesa .table{
	padding:0.2em;
	
}
.jmesa .header td,.jmesa .header th{
  background: #7d828c;
  border-right-style: none;
  padding: 0.5em 0.8em 0.3em 0.8em;
  font-size: 13px;
  text-align: center;
  vertical-align: middle;
  color: black;
  border-top: 1px solid #d2d2d2;;
  border-bottom: 3px solid #609de4;
  /*border-bottom: 1px solid #d2d2d2;*/
}
.table tr.header {
	background:#f0f0f0;

}.table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th, .table>thead>tr>td, .table>tbody>tr>td, .table>tfoot>tr>td{
	vertical-align:middle;
}
.table 
/*.jmesa .header td:nth-child(1){
 border-left:5px solid #609de4;
}*/
.jmesa .filter .dynFilter{
	height:30px;
	border-radius:3px;
}
.jmesa .filter #dynFilterDiv{
	height:32px;
	border-radius:3px;
}
#dynFilterInput{
	height:30px;
	border-radius:3px;
}
.jmesa .filter td{
	border-top-style:none;
}
.margin-top-18{
	margin-top:18px;
}
.margin-left-2c{
	margin-left:2em;
}
.jmesa .table
{
	border:0px none;
	margin-bottom:0px;
}
.jmesa .toolbar td{
	padding: 0.3em 0.3em;
}
.jmesa .tbody td{
	/*padding: 0.2em 0.2em;*/
}
.panel h4,.panel h4 .small{
	color:#000;;
}
.panel-default>.panel-heading{
	background:none;
	/*background:#f0f0f0;*/
	
	border:0px none;
}
.panel-collapse>.panel-body{
	background:none;
	padding:0px 0px 1em 0px;
}
.panel-default>.panel-heading+.panel-collapse>.panel-body{
	border-top:none 0px;
}
.panel{
	/*border:0px none;
	background:none;*/
}
.normal{
	font-weight:normal;
	color:#3F8CB2;
}
.panel-title>a{
	/*text-decoration:none;*/
}
.panel-heading{
	padding-left:0px;
}
.panel-group>.panel-heading:hover{

}
.bs-callout-voucher .panel-title{
	font-size:1em;
	padding:0px 8px;
}.bs-callout h5{
	padding:0px 8px;
}
.panel{
	padding:1.2em 15px 1.2em 15px;
}
.panel.panel-default{
	padding:0px;
}
.red{
	color:#FF0004!important;
}
.report_block{

	/*float:left;*/
	margin:0.3em;
	

}
.button_group{
	margin-left:29px;
	margin-bottom: 15px;
}
.bottombar{
}
.bottombar>div{
	display:inline-block;
	width:49%;
}
.bottombar>div.bottom_help{
	text-align:right;
}
.badge{
	background:#bd5a16;
}
.text-right{
	text-align:right;
}
.messagetable th{
	border-bottom:2px solid #F67F35;
	background:wheat;
	padding:0.6em;
}

.messagetable td{
	border-bottom:3px solid #fff;
	padding:0.4em 0.4em 0.4em 0.6em;
}
.messagetable tr:nth-child(even){
	background:#f5f5f5;
	
}

.table-striped>tbody>tr.header>th{
	background:wheat;
	color:black;
	border-bottom:2px solid #609de4;
}
.newmark{
	background:#609de4;
	color:white;
	padding:0.1em 0.4em;
	border-radius:1em;
}
.breadcrumb {
  padding: 0.3em 0.4em;
  margin-bottom: -1em;
  list-style: none;
  background: none;
  border-radius: 4px;
  margin-left: 25px;
  margin-top: 5px;
  display:block;
}
.reversedtable>tbody>tr>td>span{
	display:none;
}
@media (min-width: 768px){
	.navbar-collapse.collapse {
		display: none!important;
	}
}
@media (max-width: 768px){ /* style for small screen */
	.left-section{
		width:100%;
		height:auto;
		min-height:auto;
		display:block;
	}
	.bottombar>div{
		display:block;
		width:100%;
	}
	.bottombar>div.bottom_help{
		text-align: left
	}
	input[value='Cancel'] {
		margin-left:15px;
		margin-right:15px;
	}

	
}
@media (max-width: 992px){  /* style for medium screen */
	.container-main{
		overflow: hidden;
	}
	.callout-left .bs-callout{
		margin-left: 0px;
	}
	.bs-callout{
		margin-right: 0px;
	}
	.createuserform .row {	
		height:auto;
		width:100%;
	}
	.themeimage_small,.pageintroduction, .ecc-content h3,.button_group,.breadcrumb{
		margin-left: 15px;
	}
	.button_group{
		margin-right:15px;
	}
	.createuserform .row label{
	line-height:0.9em;
	font-weight:100;
	margin-bottom:0.5em;
 	position: static;
 	top: 0px;
  	transform: none;
	width:100%;
	}
	.createuserform .row label br{
		display:none;
	}
	.createuserform .row label.text-right{
		text-align: left;
	}
	.input-group{
		 margin-bottom: 5px;
	}
	
	.createuserform .row .form-control:not(.btn-group){
		width:100%;
		margin-left: 15px;
	}
	.createuserform .row .form-control{
		margin-right:30px;
		
	}
	.createuserform .row .input-group{
		margin-left:15px;
		width:100%;
	}
	.createuserform .row .input-group .form-control{
		margin-left: 0px;
	}
	.createuserform .row .form-control.bootstrap-select.btn-group{
		margin-left: 0px;
		margin-right:0px;
	}
	.createuserform .row .form-control.bootstrap-select.btn-group:first-of-type{
		margin-left: 15px;
		width:100%;
	}
	input[type='submit'] {
		margin-left:15px;
		margin-right:15px;
	}
	.loginsection .btn[type='submit']{
		margin-left:0px;
	}
	.row p{
		margin-left:15px;
	}
	.bs-callout{
		padding:0.25em 0.75em 1px 0.25em;
	}
	.table>tbody>tr>td{
		padding:8px 6px;
		line-height: 1em;
	}
	.panel{
		margin:0px 15px;
	}
	.attendance_result{
		margin:0px 15px;
	}
	.attendance_result .panel{
		margin:0px;
		overflow-x: scroll;
	}
	.overcolumn{
		overflow-x: scroll;
	}
	.form-inline .control-label{
		width:100%;
	}
	.form-inline .bootstrap-select.btn-group{
		margin-bottom: 0.8em;
	}
	.form-inline .form-control{
		width:100%;
	}
	.reversedtable .header{
		display:none;
	}
	.reversedtable>tbody>tr{
		border-top: 1px solid #c0c0c0;
		border-bottom: 1px solid #c0c0c0;
	}
	.reversedtable>tbody>tr>td{
		display:block;
		width:100%;
		border:0px none;
		padding:0px;
		padding-left:15px;
		margin-bottom: 0.5em;
		margin-top: 0.5em;
		padding-right:15px;
		height:33px;
		line-height: 33px;
	}
	.reversedtable>tbody>tr>td:first-of-type{
		background:wheat;
		margin-top: 0em;
		border-bottom:2px solid #609de4;
		
	}
	.reversedtable>tbody>tr>td>span{
		display:inline-block;
		width:33%;
		height:28px;
		line-height: 28px;
		float:left;
		font-weight: 700;
	}
	.reversedtable td .input-group{
		margin-bottom: 0px;
	}
	.reversedtable td label{
		width:66%;
		text-align: left;
	}
	.reversedtable td .form-control{
		width:66%;
	}
	.reversedtable td .input-group .form-control{
		width:100%;
	}
	.reversedtable td .form-control,.reversedtable td label{
		margin-bottom: 0px;
		padding:0px;
		height:34px;
	}
	.paymentdetailarea th{
		display:none;
	}
	.paymentdetailarea>table>tbody>tr>td{
		display:block;
		float: left;
		width:auto;
		height:3em;
		border-top:0px none;
	}

	.paymentdetailarea>table>tbody>tr>td:nth-of-type(1){
		display: block;
		width:100%;
		height:2em;
		line-height:1em;
		background:wheat;
		border-bottom: 2px solid #f7a45b;
	}
	.paymentdetailarea>table>tbody>tr>td:nth-of-type(1):before{
		content: "Attendance Date:";
	}
	.paymentdetailarea>table>tbody>tr>td[colspan="6"]{
		height:auto;
		background:white;
	}
}
@media (max-width: 480px){ 
	.button_group .btn[type="button"]{
		width:100%;
		margin-top:5px;
	}	
}
.wordbreak {
	word-break:break-all;
}
.wordbreak-address {
	word-break:break-word;
}
.wordbreak-table {
	word-wrap:break-word;
	word-break:break-all;
}