body,html{
	height: 100%;
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}
p{
	margin: 0 !important;
}
.inline_block{
	display: inline-block;
}

/*login page*/
.login{
	height: 100%;
	background: #676C7B  url(../images/login-bg.png) center center no-repeat fixed;
	position: relative;
}
.login p{
	display: inline-block;
	margin-left: 5px;
}
.login .alert-danger{
	margin: auto;
	width: 350px;
}
.login-wrap{
	width: 590px;
	height: 370px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -200px;
	margin-left: -296px;
	display: table;
}
.login-wrap .clearfix{
	display: table-cell;
	height: 100%;
}
.login-wrap .left-side{
	background: #3c5a7f url(../images/left-login-bg.png) center left no-repeat;;
	text-align: center;
	float: left;
	width: 42.66666667%;
	height: 100%;
	display: table;
	padding-top: 16%;
	border-top-left-radius: 5px;
	-webkit-border-top-left-radius: 5px;
	-o-border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-o-border-bottom-left-radius: 5px;
}
.login-wrap .left-side p{
	font-size: 14px;
	color: #fff;
}
.login-wrap .right-side{
	display: table;
	float: left;
	width: 57.33333333%;
	height: 100%;
	background: #fff;
	padding:20px;
	border-top-right-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-o-border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-o-border-bottom-right-radius: 5px;
}
.login-wrap .right-side h2{
	color: #3c5a7f;
	margin-bottom: 5px;
	border-bottom: 2px solid #ddd;
	padding-bottom: 14px;
	margin-bottom: 47px;
}
.login-wrap .right-side label{
	margin-bottom: 25px;
}
.login-wrap .right-side input[type="text"],
.login-wrap .right-side input[type="password"]{
	margin-bottom: 20px;
	outline: none !important;
	background: #f5f8f9;
}
.login-wrap .right-side input:focus{
	border: 1px solid #528fcc;
	outline: none !important;
	background: #fff;
}

.login-wrap .right-side .lbl-chckbox{
	margin-bottom: 10px;
}

.login-wrap .right-side span{
	color: #acb0b5;
	margin-right: 10px;
}
.login-wrap .right-side .btn-primary{
	width: 140px;
	margin-top: -17px;
}
.login-wrap .right-side .action-area{
	margin-top: 52px;
	margin-bottom: 8px;
}
.login-wrap .right-side .btn{
	padding-top: 10px;
	padding-bottom: 10px;
	font-size: 14px;
}
.login-wrap .right-side .btn-success{
	width: 100px;
	background: #abd037;
	border: 0;
	margin-top: 15px;
}
/**Forgot Password page**/
.forgotpass_wrap {
	position: absolute;
	width: 357px;
	height: auto;
	top: 50%;
	left: 50%;
	margin-top: -198px;
	margin-left: -208px;
}
.forgotpass_wrap h4 {
	text-align: center;
	color: #3C5A7F;
}
.forgot_content {
	background: #ffffff;
	height: auto;
	padding: 10px 30px 10px 30px;
}
.forgot_content input {
	text-align: center;
}
.forgot-error {
	text-align: center;
	color: #f70c0c;
}
/*dashboard page*/
#wrapper{
	overflow-x: hidden;
	background: #3c5a7f;
}
.dashboard .col-md-8.left-page{
	padding-top: 15px;
}
/*navigation top*/
.navbar-default{
	background: #e3e9f3;
	border-bottom: 0 !important;

}
.navbar-header{
	background: #4c73a2;
	position: relative;
	z-index: 2;
}
.navbar-brand{
	height: auto !important;
	padding: 15px 20px !important;
	width: 220px;
	text-align: center;
}
.navbar-top-links{
	margin-right: 0 !important;	
}
.top_line{
	background: #20A2F7;
	height: 2px;
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	z-index: 1;
}
.navbar-top-links .lft-border{
	border-left: 1px solid #c5c5c8; 
}
.navbar-top-links li {
  display: inline-block !important;
}
.navbar-top-links li a{
	color: #97afcd !important;
	padding: 17px 15px 17px 20px !important;
	background: #3c5a7f !important;
}
.navbar-top-links li a.dropdown-toggle{
	background: #ECECEC !important;
}
.navbar-top-links li a i{
	text-align: right;
	border: 1px solid #97AFCD;
	border-radius: 5px;
	padding: 7px 10px;
	text-align: center;
	font-size: 20px;
	margin-right: 7px;
}
.navbar-top-links a:hover,
.open a{
	background: #E0E0E0 !important;
	color: #97AFCD !important;
	border-color: #436794 !important;
}
.navbar-top-links a:hover .fa-chevron-down,
.open a .fa-chevron-down{
	color: #52aeea !important;
}
.navbar-top-links .dropdown-menu{
	background: #3c5a7f;
	top: 65px;
	margin: 0 !important;
	padding: 0 !important;
}
.dropdown-menu .divider{
	background-color: #5289B0  !important;
	margin: 0 0 3px 0 !important;
}
.sidebar-nav .divider{
	background-color: #5289B0  !important;
	margin: 2px 0 !important;
	height: 1px;
}
.navbar-top-links .img-top{
	position: absolute;
	top: -8px;
	right: 63px;
}
.navbar-top-links .dropdown-menu li a{
	padding: 8px 20px !important;
}
.navbar-top-links .dropdown-menu li,
.navbar-top-links .dropdown-menu li a:hover{
	width: 100%;
	color: #b8c4d5 !important;
}
.navbar-top-links .dropdown-menu li a:hover{
	background: #6784a9 !important;
}
.navbar-static-top .content_title{
	padding-top: 13px;
	padding-left: 20px;
	float: left;
}
.navbar-static-top .content_title h4{
	font-size: 20px;
	padding-left: 8px;
	border-left: 2px dotted #7DC7F7;
	color: #3C5A7F;
}
.employee_name{
	width: auto;
	position: absolute;
	right: 0;
	top: -69px;
	z-index: 1000;
	padding: 5px 10px;
	text-align: right;
	background-color: #20A2F7;
	color: #fff;
	border-bottom-left-radius: 3px;
	-webkit-border-bottom-left-radius: 3px;
	-moz-border-bottom-left-radius: 3px;
}
/*navigation sidebar*/
.sidebar {
  z-index: 1;
  position: absolute;
  width: 220px;
  margin-top: 70px;
  height: auto;
  z-index: 2000;
}
.sidebar li a{
	padding: 22px 20px !important;
	color: #b8c4d5;
	position: relative;
}
.sidebar li a i.fa{
	position: absolute;
	right: 15px;
	top: 26px;
}
.sidebar .dropdown-submenu>a:after{
	border: 0 !important;
}
.sidebar .dropdown-submenu ul{
	background: #3c5a7f;
	top: 6px;
	padding: 0 !important;
	min-width: 270px;
}
.sidebar .dropdown-submenu ul li a{
	background: #3c5a7f !important;
	color: #b8c4d5;
	padding: 8px 20px !important;

}
.sidebar .dropdown-submenu ul li a i{
	top: 10px;
}
.sidebar .dropdown-submenu ul li a:hover{
	color: #fff;
	background: #20a2f7 !important;
}
.sidebar span.ico,
.sidebar span.fa{
	width: 27px !important;
	height: 18px;
	display: inline-block;
	margin-bottom: -4px;
}
.sidebar .dropdown-submenu li a span.fa{
	color: #97AFCD;
}
.sidebar .dropdown-submenu ul li a:hover span.fa{
	color: #fff !important;
}
.sidebar span.fa-user{
	font-size: 17px;
}
.sidebar span.ico-system{
	background: url('../images/ico-system.png') left center no-repeat !important;
}
.sidebar span.ico-hirs{
	background: url('../images/ico-leave.png') left center no-repeat !important;
}
.sidebar span.ico-time{
	background: url('../images/ico-clock.png') left center no-repeat !important;
}
.sidebar span.ico-payroll{
	background: url('../images/ico-dollar.png') left center no-repeat !important;
}
.sidebar span.ico-mps{
	background: url('../images/ico-graph.png') left center no-repeat !important;
}
.sidebar span.ico-backup{
	background: url('../images/ico-storage.png') left center no-repeat !important;
}
/*hover sidebar*/
.sidebar li a:hover{
	background: #20a2f7 !important;
	color: #fff;
}
.sidebar li a:hover span.ico-system{
	background: url('../images/ico-system-on.png') left center no-repeat !important;
}
.sidebar li a:hover span.ico-hirs{
	background: url('../images/ico-leave-on.png') left center no-repeat !important;
}
.sidebar li a:hover span.ico-time{
	background: url('../images/ico-clock-on.png') left center no-repeat !important;
}
.sidebar li a:hover span.ico-payroll{
	background: url('../images/ico-dollar-on.png') left center no-repeat !important;
}
.sidebar li a:hover span.ico-mps{
	background: url('../images/ico-graph-on.png') left center no-repeat !important;
}
.sidebar li a:hover span.ico-backup{
	background: url('../images/ico-storage-on.png') left center no-repeat !important;
}
/*active sidebar*/
.sidebar li.active a{
	background: #20a2f7 !important;
	color: #fff;
}
.sidebar li.active a span.ico-system{
	background: url('../images/ico-system-on.png') left center no-repeat !important;
}
.sidebar li.active a span.ico-hirs{
	background: url('../images/ico-leave-on.png') left center no-repeat !important;
}
.sidebar li.active a span.ico-time{
	background: url('../images/ico-clock-on.png') left center no-repeat !important;
}
.sidebar li.active a span.ico-payroll{
	background: url('../images/ico-dollar-on.png') left center no-repeat !important;
}
.sidebar li.active a span.ico-mps{
	background: url('../images/ico-graph-on.png') left center no-repeat !important;
}
.sidebar li.active a span.ico-backup{
	background: url('../images/ico-storage-on.png') left center no-repeat !important;
}
.sidebar,.navbar-collapse{
	background: #3c5a7f !important;
	border: 0 !important;
}


/*page wrapper*/
.page-wrapper{
	position: relative;
 	margin: 0 0 0 220px;
	padding: 30px 20px 20px 20px;
	border-left: 1px solid #e7e7e7;
	height: 100%;
	background: #fff;
	display: block;
	border-top: 1px solid #E5E5E5;
}


/*common style*/
.dashboard .btn{
	font-size: 12px !important;
	text-transform: uppercase;
	padding-top: 10px !important;
	padding-bottom: 10px !important;
}
.btn-success{
	background: #6ABB32 !important;
	border: 0 !important;
	
}
.btn-info{
	background: #48C5FF !important;
	border: 0 !important;
}
 .btn-primary{
	background: #20A2F8 !important;
	border: 0 !important;
}
.btn-default{
	background: #A6B4DA !important;
	border: 0 !important;
	color: #fff !important;
}

.btn-success:hover{
	background: #54B054 !important;
}
.btn-primary:hover{
	background: #138AD8 !important;
}
.btn-default:hover{
	background: #829CE2 !important;
}
.btn-info:hover{
	background: #1CB0F5 !important;
}
.btn-upload{
	position: relative;
	overflow: hidden;
	background: #ABABAB;
	color: #fff;
	font-size: 16px;
}
.btn-upload:hover{
	color: #fff !important;
	background: #969696;
}
input.upld_fl{
	position: absolute;
	top: 0;
	right: 0;
	min-width: 100%;
	min-height: 100%;
	font-size: 100px;
	text-align: right;
	filter: alpha(opacity=0);
	opacity: 0;
	background: red;
	cursor: inherit;
	display: block;
	font-size: 12px;
}
.even{
	background-color: #f2f6fa;
}
.odd{
	background-color: #ebf0f5;
}
.checkbx,
.rdio{
	display: none !important;
}
.rdio + label.lbl-radio span,
.checkbx + label.lbl-chckbox span{
	display: inline-block;
	width: 17px;
	height: 17px;
	margin: 1px 10px -4px 1px;
}
.checkbx + label.lbl-chckbox span{
	background: url(../images/action-btn.png) left top no-repeat;
}
.checkbx:checked + label.lbl-chckbox span{
	background: url(../images/action-btn.png) -20px top no-repeat;
}
.checkbx:checked + label.active{
	color: #6dbc33;
}
.rdio + label.lbl-radio span{
	background: url(../images/action-btn.png) -40px top no-repeat;
}
.rdio:checked + label.lbl-radio span{
	background: url(../images/action-btn.png) -59px top no-repeat;
}
label.lbl-chckbox,
label.lbl-radio{
	font-size: 12px;
	color: #797C7E;
	font-weight: normal;
}
input.form-control,
select.form-control,
button{
	height: 30px !important;
	display: inline-block;
	font-size: 12px;
	background:#ffffff !important;
	border-color:#4bdc96;
}
input[type='number']{
	padding-right: 4px;
}
.login-wrap input[type='text'],
.login-wrap input[type='password']{
	height:34px !important;
}
.slct{
	background: url(../images/caret-slct.png) right center no-repeat !important;
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none !important;
	padding: 0 18px 0 5px !important;	
}
.box .row{
	margin: 0;
}
.box table{
	width: 100%;
}
.box table th,
.box table td{
	vertical-align: middle !important;
	padding: 8px 5px !important;
	font-size: 12px !important;
	text-transform: uppercase !important;
}
.box table th{
	text-align: center;
}
.slct-xs{
	width: 80px !important;
}
.slct-sm{
	width: 110px !important;
}
.slct-md{
	width: 140px !important;
}
.slct-lg{
	width: 240px !important;
}
.slct-xl{
	width: 310px !important;
}
.tbl-stl1 .bg-header th{
	padding-top: 10px !important;
	padding-bottom: 10px !important;
}
.bg-header td,
.bg-header th{
	background: #ecf2f7 !important;
	color: #50627a;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 14px;
}
.btm-border td,
.btm-border th{
	border-bottom: 2px solid #e1e3e5 !important;
}

.tbl-stl1 tr:first-child th:first-child{
	border-top-left-radius: 5px;
	-webkit-border-top-left-radius: 5px;
	-moz-border-top-left-radius: 5px;
	
}
.tbl-stl1 tr:first-child th:last-child{
	border-top-right-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-top-right-radius: 5px;
}
.tbl-stl1 tr:last-child td:first-child{
	border-bottom-left-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-bottom-left-radius: 5px;
	
}
.tbl-stl1 tr:last-child td:last-child{
	border-bottom-right-radius: 5px;
	-webkit-border-bottom-right-radius: 5px;
	-moz-border-bottom-right-radius: 5px;
}
.border-left th:first-child,
.border-left td:first-child{
	border-left: 0 !important;
}
.border-left th,
.border-left td{
	border-left: 1px solid #dfe4e8 !important;
	vertical-align: middle !important;
}

/*margin*/
.m-bot20{
	margin-bottom: 20px !important;
}
.m-top20{
	margin-top: 20px !important;
}
.m-top10{
	margin-top: 10px !important;
}
.m-bot10{
	margin-bottom: 10px !important;
}

/*padding*/
.p-bot20 > *{
	padding-bottom: 20px !important;
}
.p-right15{
	padding-right: 15px !important;
}

/*text*/
.txtclr_blue{
	scolor: #20A2F8;
}
.txtclr_red{
	color: #186EA6 !important;
}
.text-right{
	text-align: right;
}
.f12{
	font-size: 12px;
}

.box .vertical_m td,
.box .vertical_m th{
	vertical-align: middle !important;
}
td.vertical_t,
.vertical_t td,
.vertical_t th{
	vertical-align: top !important;
}
.alert{
	display: none;
}
table.tbl_even_odd tr:nth-child(even){
	background-color: #f2f6fa;
}
table.tbl_even_odd tr:nth-child(odd){
	background-color: #ebf0f5;
}
.tbl_odd_even tr:nth-child(even){
	background-color: #ebf0f5;
}
.tbl_odd_even tr:nth-child(odd){
	background-color: #f2f6fa;
}
table.tbl_even_odd td{
	border-bottom:1px solid #e1e3e5;
	font-size: 14px;
}
.tbl_odd_even td{
	border-bottom:1px solid #e1e3e5;
	font-size: 14px;
}
.tbl-stl1 tr:last-child td{
	border-bottom: 0;
}

/*disable inputs*/
select:disabled{
	background: #E1E3E5 !important;
}
.checkbx:disabled + label.lbl-chckbox span{
	background: url(../images/action-btn.png) -78px top no-repeat
}


.overflw{
	overflow: auto;
	background: #f9f9f9;
}
.pgnation li,
.pgnation .slct{
	display: inline-block;
	font-size: 12px !important;
}
.pgnation li:first-child{
	padding-right: 100px;
}
.pgnation li .pagination{
	margin-right: 30px;
	border: 1px solid #CACACA;
	display: inline-table;
}
.pgnation li .pagination a:first-child{
	border: 0 !important;
}
.pgnation li .pagination a{
	border-left: 1px solid #CACACA !important;
	color: #000 !important;	
	display: inline-block;
	font-size: 12px !important;
}
.pgnation li .pagination a:hover{
	text-decoration: none;
	background: #D7D7D7;
	color: #3C5A7F !important;
}
.pgnation li .pagination a.active_button{
	border: 0;
	background: #597DA9;
	color: #fff !important;
}

/*override modal desing*/
.dashboard .modal-content{
	border:  1px solid #316199;
}
.dashboard .modal-content .modal-header{
	background: #316199;
  	border-bottom: 1px solid #ABABAB;
}
.dashboard .modal-content .modal-header h4{
	color: #fff !important;
	margin: 0;
}
.dashboard .modal-header .close{
	color: #fff;
	margin-top: -8px;
}

/*nav-tabs*/
.nav-tabs{
	padding: 0 !important;
}
.nav-tabs li{
	padding: 0 !important;
	margin-bottom: -2px !important;
}
.nav-tabs li a{
	border: 0 !important;
}
.emp-prof-sidebar .nav-tabs li a{
	padding-top: 5px !important;
	padding-bottom: 5px !important;
}
.nav-tabs li.active a{
	color: #3c5a7f !important;
  	border-bottom: 3px solid #20A2F8 !important;
  	text-transform: uppercase;
}
.tab-pane{
	padding: 30px 0;
}
.tab-content{
	margin-left: 0 !important;
}

/*override dialog box design*/
.ui-widget-overlay{
	z-index: 1001 !important;
}
.ui-dialog{
	padding: 0 !important;
	border: 1px solid #316199 !important;
	z-index: 1051 !important;
}
.ui-dialog-titlebar{
	background: #316199 !important;
	color: #fff !important;
	border-bottom-left-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
	padding-top: 10px !important;
	padding-bottom: 10px !important;
	border-color: #316199 !important;
	border-bottom: 1px solid #ABABAB !important;
	font-size: 14px;
}
.ui-dialog .ui-dialog-content{
	font-size: 14px;
}
.ui-dialog-titlebar-close:focus{
	outline: none !important;
}
.ui-dialog-titlebar-close{
	background-color: #F9F9F9  !important; 
	border: 0 !important;
	margin-right: 6px !important;
	height: 21px !important;
}
.ui-state-hover{
	background: #E8E8E8 !important;
}
.ui-button-icon-only .ui-icon{
	margin-left: -9px !important;
}
.ui-dialog .ui-dialog-buttonpane{
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
	-webkit-border-bottom-right-radius: 4px;
	-webkit-border-bottom-left-radius: 4px;
	-moz-border-bottom-right-radius: 4px;
	-moz-border-bottom-left-radius: 4px;
}
.ui-dialog .alert{
	padding-top: 15px !important;
}
.ui-dialog .alert div{
	display: inline-block;
	vertical-align: top;
}
.ui-dialog .alert .msg{
	width: 229px;
	vertical-align: middle;
}
.ui-dialog .alert i{
	font-size: 25px;
	color: #F55757;
	margin-top: 4px;
	margin-right: 8px;
}
.ui-dialog .alert i.fa-check-circle{
	color: #6ABB32;
	margin-top: 0;
}

.ui-dialog-buttonpane button:first-child,
.ui-dialog-buttonpane .ui-button:first-child{
	background: #6ABB32 !important;
	border: 0 !important;
	color: #fff !important;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	width: 90px;
}
.ui-dialog-buttonpane button:first-child:hover,
.ui-dialog-buttonpane .ui-button:first-child:hover{
	background: #54B054 !important;
}

.ui-dialog-buttonpane button:last-child,
.ui-dialog-buttonpane .ui-button:last-child{
	background: #d9534f;
	border: 0 !important;
	color: #fff !important;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	width: 90px;
}
.ui-dialog-buttonpane button:last-child:hover,
.ui-dialog-buttonpane .ui-button:last-child:hover{
	background: #E0342F;
}


/*datepicker override*/
#ui-datepicker-div{
	border: 1px solid #316199 !important;
}
#ui-datepicker-div .ui-datepicker-header{
	background-color: #316199 !important;
}
#ui-datepicker-div .ui-datepicker-next-hover,
#ui-datepicker-div .ui-datepicker-prev-hover,
#ui-datepicker-div .ui-state-hover .ui-icon{
	background: none !important;
	border: 0 !important;
}
#ui-datepicker-div .ui-datepicker-next{
	right: -50px !important;
}
#ui-datepicker-div .ui-datepicker-prev{
	left: -50px !important;
}
#ui-datepicker-div .ui-datepicker-title select{
	border-radius: 4px !important;
	-webkit-border-radius: 4px !important;
	-moz-border-radius: 4px !important;
	font-size: 14px !important;
	width: 69px;
}
#ui-datepicker-div .ui-datepicker-title select:first-child{
	margin-right: 3px;
}
#ui-datepicker-div .ui-datepicker-calendar th,
#ui-datepicker-div .ui-datepicker-calendar td a{
	font-size: 12px !important;
	text-align: center !important;
}
#ui-datepicker-div .ui-datepicker-calendar thead{
	border-bottom: 1px solid #ddd !important;
}
#ui-datepicker-div .ui-datepicker-calendar td a{
	background-color: transparent !important;
	border: 0 !important;
	border-radius: 50% !important;
  	padding: 4px 0 !important;
  	width: 28px;
}
#ui-datepicker-div .ui-datepicker-calendar td a.ui-state-active.ui-state-hover:hover,	
#ui-datepicker-div .ui-datepicker-calendar td a.ui-state-active{
	background-color: #db5547 !important;
	color: #fff !important;
}
#ui-datepicker-div .ui-datepicker-calendar td a:hover{
	background: #FA8D82 !important;
	color: #fff;
}
#ui-datepicker-div .ui-datepicker-calendar{
	height: 160px;
}




/*font size*/
.form-control, .btn, .tbl-stl1 a, .tbl-stl1 th, .tbl-stl1 td, .box table th, .box table td, .box ul li, .multiple_rate .name, .multiple_rate #heading_name, .multiple_rate .hours_label, .trans_rate .col-md-4 p, label.lbl-chckbox, label.lbl-radio, .appraisal #rating .activeRow, .emp-prof-sidebar .emp-menu-active-links, .emp-prof-sidebar .emp-menu-non-active-links, .callendar .ui-datepicker-calendar tbody tr td, .callendar .ui-datepicker-calendar thead tr th{
	font-size: 12px !important;
	background:#ffffff !important;
	border-color:#4bdc96;
}
.nav-tabs li a{
	font-size: 12px;
	text-transform: uppercase;
}


/*processing/loading page AJAX*/
#process_indicator{
	color: #0064FF;
	background: url(../images/ajaxbg.png) top left repeat;
}
#process_indicator p{
	text-align: center;
	font-size: 30px;
}
#process_indicator p i{
	font-size: 70px;
}

.btn-purple {
	color: #fff;
	background-color: #3469ab !important;
	border: none !important;
}
/* .btn-purple:hover {
	color: #fff !important;
	background-color: #29d8d8 !important;
} */