*
{
	outline: 0px !important;
}

body { margin:0; padding:0; background:#eceff1; font-family: 'Open Sans';}
.navbar
{
	border-radius: 0px;
}
#top-header
{
	background: white;
	border-color: white;
	margin-bottom: 0px;
}
#top-header .navbar-right > li
{
	float: left;
}
#top-header .navbar-right li a i
{
	border: 1px solid #cfd8dc;
	border-radius: 50%;
	padding: 0px;
	width: 36px;
	height: 36px;
	text-align: center;
	color: #29387b;
	background: #cfd8dc;
	box-shadow: 0px 2px 2px 0px #bababa;
	margin-right: 5px;
	font-size: 20px;
	line-height: 35px;
}
#top-header .navbar-brand img
{
	float: left;
	
	margin-top: -5px;
	/*height: 45px;*/
}
#top-header .navbar-brand h1
{
	float: left;
	margin: 0px;
	color: #434444;
	font-size: 24px;
	letter-spacing: 1px;
	margin-left: 15px;
	margin-top: 5px;
}
.angledown-icon
{
	width: 32px;
	height: 18px;
	border: 1px solid #cfd8dc;
	float: right;
	text-align: center;
	line-height: 15px;
	margin-top: 12px;
	margin-left: 5px;
}
.angledown-icon .caret
{
	margin-left: 0px;
}
.notify-no
{
	position: absolute;
	float: left;
	width: 18px;
	height: 18px;
	background: #e32124;
	border: 1px solid #e32124;
	color: white;
	text-align: center;
	border-radius: 50%;
	font-size: 12px;
	line-height: 15px;
	right: 12px;
	top: 12px;
}
#menu-header
{
	background: #29387b;
	border-color: #29387b;
}
#menu-header .navbar-nav > .active > a
{
	background-color: #e32124;
}
#menu-header .navbar-nav
{
	margin: -1px;
}
#menu-header .navbar-nav > li > a 
{
    color: #fff;
    font-size: 13px;
    text-align: center;
    padding: 5px 16px;
    padding-bottom: 8px;
}
#menu-header .navbar-nav > li > a:hover{background-color: #e32124;}
#menu-header .navbar-nav > li.active > a::before, #menu-header .navbar-nav > li > a:hover:before
{
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	border-bottom: 8px solid #fff;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	margin-left: -9px;
	margin-top: -8px;
}
#menu-header .navbar-nav > li > a > i
{
	font-size: 20px;
}
.status-box
{
	text-align: center;
	padding: 10px 35px;
	box-shadow: 0px 1px 5px 0px #B9B9B9;
	margin-bottom: 20px;
	min-height: 150px;
	border-top: 1px solid #E7E7E7;
	background:#fff;
}
.status-box label
{
	font-size: 40px;
	margin-bottom: 20px;
}
.status-box p
{
	font-size: 12px;
	font-weight: 700;
	color: #333;
}
.status-box .text-info
{
	color: #03a9f3;
}
.status-box .text-success
{
	color: #38d47a;
}
.status-box .text-warning
{
	color: #ffbd4a;
}
.status-box .text-danger
{
	color: #f05050;
}
.outer-layer
{
	box-shadow: 0px 1px 7px 0px #B9B9B9;
	border-top: 1px solid #E7E7E7;
	background:#fff;
	font-family: 'Open Sans';
}
.leave-box
{
	padding: 10px;
	/*height: 550px;
	overflow-y: auto;*/
	margin-bottom: 20px;
}
.leave-header
{
	padding: 15px;
	border-bottom: 1px solid #DDD;
}
.leave-header h4
{
	font-size: 14px;
}
.leave-header i
{
	margin-right: 6px;

}
.leave-box .table > thead > tr > th
{
	border-bottom: 0px solid #ddd;
	font-size: 13px;
	padding: 15px;
}
.leave-box .table > tbody > tr > td
{
	/*border-top: 0px solid #ddd;
	padding: 15px;*/
}
.pending .table > thead > tr > th
{
	padding: 12px 8px;
}
.pending .table > tbody > tr > td, .pending .table > thead > tr > th
{
	padding: 6px 8px;
	vertical-align:middle;
	text-align:center !important;
}
.pending .table > thead > tr > th{padding: 12px 8px;}
.leave-box .table td, .leave-box .table th  {padding: 12px 8px;
	vertical-align:middle;
	text-align:center !important;}
.pending table th {text-align:center !important;}
table td .pending-leave{ color:#fff; background:#12afcb; display:inline-block; min-width:80px; border-radius:99px; padding:4px 8px; text-align:center;}
.pending .table > tbody > tr > td > label
{
	float: left;
	width: 40px;
	height: 40px;
	text-align: center;
	border-radius: 50%;
	line-height: 38px;
	color: white;
}
.pending .table > tbody > tr > td .btn
{
	border-radius: 25px;
	padding: 2px 12px;	
}
footer
{
	padding: 15px;
	margin-top: 30px;
	background:#fff;
}
footer > p
{
	margin-bottom: 0px;
}

.container{ width:1245px;}
.circle-small-leave{
    border-radius: 100%;
    color: #fff;
   /* display: inline-block;*/
    font-size: 16px;
    height: 35px;
    padding: 5px;
    text-align: center;
    vertical-align: top;
    width: 35px; text-transform:uppercase; font-weight:bold; display:inline-block;}
	.green-circle{ background:#2ad170;}
.blue-circle{background:#03a9f3;}
.orange-circle{background:#ffbd4a;}
.red-circle{ background:#f05050;}
.navbar-nav > li{ float:none; display:inline-block;}
.navbar-nav{ float:none;}
.leave-apply{ height:330px; /*overflow:visible;*/}
.accumulated{ height:135px;overflow: visible;}
.accumulated .progress{ width:93%; float:left;}
.holiday-no { float:right; width:5%; text-align:right;}
.remaining-leave h2 { text-transform:uppercase; padding-bottom:15px; margin-bottom:20px; border-bottom:1px solid #cccfd1; font-size:18px; font-weight:500;}
.fixed-table-sec-list{ padding:10px;}

/* 01 login page
================================================== */
.outer {
    display: table;
    position: absolute;
    height: 100%;
    width: 100%;
	
}

.middle {
    display: table-cell;
    vertical-align: middle;
	background:#eceff1;
	/*background:url(../images/login_bg.png)center top no-repeat;*/
	/*background:url(../images/shadow-bg.png) center top repeat-y;*/
	/*z-index:-1;*/
}

.inner {
    margin-left: auto;
    margin-right: auto; 
    width:100%;
	position:relative;
	z-index:99; 
}
#wrapper { width:100%; margin:0; padding:0;}

/*////// css for login page //////////////////////////*/
.login-container {
	width:644px;
	padding:50px;
	/*background:#fff;*/
	margin:0 auto;
	background:url(../images/login-bg.png) center center no-repeat;
	text-align:center;
	height:644px;
}
.login-logo {
	text-align:center;
	text-transform:uppercase;
	color:#2196f3;
	font-size:16px;
	padding-bottom:30px;
	padding-top:30px;
}
.login-container p {
	text-transform:uppercase;
	color:#1b1919;
	font-weight:bold;
	font-size:14px;
	padding-bottom:20px;
}
.login-form .form-control {
	border-radius:99px;
	box-shadow:none;
	height:48px;
	padding-left:30px;
	border:1px solid #e1dfdf;
}
.btn-login a {
	padding:12px 35px;
}
.btn-login input {
	padding:12px 35px;
	display:block;
}

.forgot-password a {
	display:block;
	text-align:center;
	padding:15px 0;
	border-radius:25px;
	border:1px solid #ebc137;
	text-decoration:none;
	color:#4c4b4b;
}
.remember-me {
	padding:5px 0;
}
.forgot-password {
	margin-top:30px;
}
.forgot-password a:hover {
	background-color:#ebc137;
	color:#31353d;
}
.input-icon {
	position:relative;
}

.login-container .alert {
	border-radius:0;
}
.login-container .has-error i {
	color:#a94442;
}
.input-icon i {
	position:absolute;
	left:10px;
	top:13px;
	color:#c5c5c5;
	font-size:19px;
}
#wrapper { background:#353e53;}
.form-section .form-control { box-shadow:none; height:42px; border-radius:99px; padding:6px 17px;}
.form-section textarea.form-control{ height:120px; resize:none; padding:6px 50px;}
.form-section{ padding:20px 0;}
.red-round{background-color: #e32124;
    border: 3px solid #e32124;
    border-radius: 99px;
    color: #fff;
    display: inline-block;
   /* font-family: 'Montserrat', sans-serif;*/
    font-size: 14px;
    font-weight: bold;
    margin: 10px 0;
    min-width: 100px;
    padding: 10px 25px;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    transition: all 0.4s ease 0s;}
	.red-round:hover{ background:#29387b;  border: 3px solid #29387b; color:#fff; text-decoration:none;}
	.blue-round{background-color: #929394;
    border: 3px solid #929394;
    border-radius: 99px;
    color: #fff;
    display: inline-block;
   /* font-family: 'Montserrat', sans-serif;*/
    font-size: 14px;
    font-weight: bold;
    margin: 10px 0;
    min-width: 100px;
    padding: 10px 25px;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    transition: all 0.4s ease 0s;}
	.blue-round:hover{background-color: #29387b;
    border: 3px solid #29387b; color:#fff; text-decoration:none;}
	.article-section{ min-height:650px; padding-top:20px;}
	.form-section label { font-size:13px; color:#3a3a3b; font-weight:600; letter-spacing:1px; font-family: 'Open Sans';}
	.table-content{ padding:15px;}
	.table-content table td, .table-content table th { text-align:center !important;}
	.edit {
	/*background:#31353d;*/
	/*padding:5px 12px;*/
	color:#feae1d;
	text-decoration:none;
	font-weight:bold;
	font-size:18px;
	padding:1px 8px;
	border-radius:3px;
	border:1px solid #feae1d;
	margin-right:5px; 
	
	/*margin-right:10px;*/
}
.edit:hover {
	/*background:#ebc137;*/
	color:#353e53;border:1px solid #353e53;
}
.view {
	/*background:#ebc137;
	padding:5px 12px;
	color:#42464d;*/
	color:#1cae59;
	text-decoration:none;
	font-weight:bold;
	font-size:18px;
	border:1px solid #1cae59;
	border-radius:3px;
	padding:1px 7px;
}
.view:hover, .delete:hover {
	/*background:#31353d;
	color:#fff;*/
	color:#353e53;border:1px solid #353e53;
}
.table-content table td a { display:inline-block;}
.waiting{ background:#12afcb; display:inline-block; min-width:80px; border-radius:99px; padding:4px 8px; color:#fff;}
.approved{ background:#0cc057;display:inline-block; min-width:80px; border-radius:99px; padding:4px 8px; color:#fff;}
.forward{ background:#feae1d;display:inline-block; min-width:80px; border-radius:99px; padding:4px 8px; color:#fff;}
.reject{ background:#f05050;display:inline-block; min-width:80px; border-radius:99px; padding:4px 8px; color:#fff;}
.edit-disabled{ opacity:0.5	; pointer-events:none;}
/*--------------------------- css for login page ------------------------------------------------------------------*/
.login-form{ width:67%; margin:0 auto; text-align:left;}
.forgot-pass{ position:absolute; display:block; right:20px; top:15px; color:#838383; font-size:13px;}
.forgot-pass:hover { color:#29387b; text-decoration:none;}
.star { color:#c52919;}
.leave-header h4 { font-weight:bold;}
#top-header .navbar-right li ul.dropdown-menu a i { border-radius:0; height:auto; font-size:16px; background:none; box-shadow:none; border:0; width:auto;}
#top-header .navbar-right.nav .open > a:focus{ background:#29387b ; color:#fff;}
.hasDatepicker[readonly] { background:#fff !important;}
.red-round:focus, .blue-round:focus{ color:#fff; text-decoration:none;}
/*.g-recaptcha>div, .g-recaptcha iframe { width:100% !important;}*/
.mob-menu{ display:none;}




.pagination-data a,  .pagination-data strong { display:inline-block; padding:6px 12px; border:1px solid #ddd; margin-left:-1px; color:#42464d;}
  .pagination-data a:hover, .pagination-data strong { background:#e32124; color:#fff; border:1px solid #e32124;}
  
  .approval:focus { color:#fff;}
.attendance-table table th span{ display:block;}
.modal-dialog{ width:900px;}
.modal-content{ border-radius:0; border:8px solid #353e53;}
.approval:focus { color:#fff;}
.attendance-table td span{ display:block;}
.attendance-table td{ vertical-align:middle !important;}
.absent{ background:#e32124; color:#fff;}
.cl{ background:#2ad170; color:#fff;}
.ml{background:#f05050; color:#fff;}
.al{background:#03a9f3; color:#fff;}
.attendance-table td span.lt { color:#c0504d; font-weight:bold;}
.record span { font-weight:bold; margin-right:8px;}
.record span.todate{ margin-left:15px;}
.holiday{ background:#4bacc6; color:#fff;}
.gapbtm15{ margin-bottom:20px;}
.od-form{ /*width:600px;*/ margin:0 auto !important; float:none !important;}
.display-none-button{pointer-events: none; opacity: 0.6;}
.record{ padding-top:10px;}
.recordper-page input[type="text"]{ margin:0 15px;}
.recordper-page .form-inline { position:relative; margin-top:-10px; text-align:right;}
.recordper-page{ padding-bottom:15px;}
.attendance-table table th, .attendance-table table td{ text-align:center;}


.fixed-table-sec .table-fixed thead {
  width: 100%;
}
.fixed-table-sec .table-fixed tbody {
  height: 467px;
  overflow-y: auto;
  width: 100%;
}
.fixed-table-sec .table-fixed thead, .table-fixed tbody, .table-fixed tr, .table-fixed td, .table-fixed th {
  display: block;
}
.fixed-table-sec .table-fixed tbody td, .table-fixed thead > tr> th {
  float: left;
  border-bottom-width: 0;
}

.fixed-table-sec-list .table-fixed thead {
  width: 100%;
}
.fixed-table-sec-list .table-fixed tbody {
  height: 230px;
  overflow-y: auto;
  width: 100%;
}
.fixed-table-sec-list .table-fixed thead, .fixed-table-sec-list .table-fixed tbody, .fixed-table-sec-list .table-fixed tr, .fixed-table-sec-list .table-fixed td, .table-fixed th {
  display: block;
}
.fixed-table-sec-list .table-fixed tbody td, .fixed-table-sec-list .table-fixed thead > tr> th {
  float: left;
  border-bottom-width: 0;
}



.pofile-photo img { max-width:100%;}
.pofile-photo{ padding:15px; background:#fff; border-top:4px solid #29387b;}
.profile-right{ background:#fff; padding:0 0 20px 0;}
.profile-right .control-label { font-size:13px; font-weight:600; margin-bottom:12px; color:#333333;}
.profile-right h2.form-head { margin-top:0; font-size:22px; padding-bottom:15px;}
.profile-right .form-row { padding:15px; margin-bottom:20px; border-bottom:1px solid #ddd;}
 .nobrdr{ padding-bottom:0 !important; border:0 !important;}
 .page-content{ min-height:570px; padding-top:20px;}
 .profile-right h2.form-head i { margin-right:10px;}

.profile-right h3 { background:#29387b; padding:10px 10px 10px 15px; color:#fff; font-size:16px; margin-top:0;}

.container .box {
 
}

.container .box .dropd {
 
  cursor: pointer;
}

.container .box .bottom {
  padding: 0px;
  background-color: fff;
  color: white;
  display: none;
  position:absolute;
  z-index:999999;
  right:0;
}
#top-header .navbar-right li .notification a i{ background:none; border:0; font-size:16px; height:30px; width:30px;}
#top-header .navbar-right li .notification a {color:#3a3a3b;}

header ul{ margin:0; padding:0; list-style:none;}
.notification{ min-width:300px; background:#fff;}
.noti-head{ margin:0; padding:10px; color:#fff; font-size:15px; background:#e22124;}
.notification ul{border:1px solid #eeeeee; border-bottom:0; box-shadow: 0 1px 7px 0 #b9b9b9;}
.notification ul li { font-size:14px; color:#3a3a3b; padding:10px; border-bottom:1px solid #eeeeee;}
.notification ul li:last-child{ border-bottom:0;}
.notification:before{ content: "\f0d8"; font-family: 'FontAwesome'; position:absolute; top:-19px; color:#e22124; font-size:22px; right:28px;}
.logo-footer{ text-align:center;}
.holiday-apply-leave{ padding-top:30px;}
.table-fix-row table th { border-bottom:0 !important;}
.table-fix-row .table { margin-bottom:10px;}
#remaining_leave_value{ font-weight:bold; color:#e9242b; padding-left:5px;}
#remaining_leave_id{ font-weight:bold;}
.working-hours { font-weight:bold;}
.working-hours span{ color:#e9242b;}
.notification.set-note{ min-width:200px;}
.two-progress{ position:relative;}
.greybarsmall{ position:absolute; right:0; z-index:999;}
.navbar-inverse .navbar-nav > .open > a,  .navbar-inverse .navbar-nav > .open > a:focus, .navbar-inverse .navbar-nav > .open > a:hover{ background:#e32124;}
.dropdown-menu > li > a{ padding:10px 20px;}
.blue-block{ color:#e32124;}
.noti-unread{ font-weight:bold !important;}

/* width of 1024 */

@media (min-width: 960px)and (max-width: 1024px) {
	.container{ width:960px;}
	#menu-header .navbar-nav > li > a{ 
		padding:5px 12px 8px;
	}

}


@media (max-width: 991px)
{
	#top-header .navbar-brand h1
	{
		font-size: 16px;
	}
}


/* #Tablet (Portrait)
================================================== */

    /* Note: Design for a width of 768px */

    @media only screen and (min-width: 768px) and (max-width: 959px) {
		
		#top-header .navbar-header { float:left;}
		#top-header .navbar-nav{ float:right !important;}
		.container{ width:100%;}
		.navbar-header {
        float: none;
    }
    .navbar-toggle {
        display: block;
    }
    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        float: none!important;
        margin: 7.5px -15px;
    }
    .navbar-nav>li {
        float: none;
		display:block;
    }
    .navbar-nav>li>a {
        padding-top: 10px;
        padding-bottom: 10px;
    }
	.navbar-collapse.collapse.in{ display:block !important;}
	.navbar-inverse .navbar-toggle{ border:1px solid #fff;}
	.mob-menu{ display:block;}
	.navbar-inverse .navbar-brand{ color:#fff;}
	#menu-header .navbar-nav > li.active > a::before, #menu-header .navbar-nav > li > a:hover::before{ display:none;}
	.edit { margin-bottom:5px; margin-right:0;}
	.recordper-page .form-inline input[type="text"]{ margin-bottom:5px;}
	#menu-header .navbar-nav > li > a{ border-bottom: 1px solid #344388; padding:10px 0;}
	.navbar-collapse{ padding:0;}
	
	
	}





@media (max-width: 767px)
{
	#top-header .navbar-brand h1 
	{
	    font-size: 18px;
	    width: 75%;
	}
	#top-header .navbar-nav .open .dropdown-menu
	{
		position: absolute;
		background-color: #fff;
		border: 1px solid rgba(0,0,0,.15);
		-webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
		box-shadow: 0 6px 12px rgba(0,0,0,.175);
	}
	#menu-header .navbar-nav > li.active > a::before
	{
		display: none;
	}
	#menu-header .navbar-collapse
	{
		padding: 0px;
	}
	#menu-header .navbar-nav 
	{
    	margin: 0px;
	}
	.login-container{ width:90%; background:#eeefee; height:auto; border:8px solid #fff; padding:15px; }
	.login-logo img { width:100%;}
	.login-form{ width:100%;}
	.login-form iframe { width:100% !important;}
	.g-recaptcha>div { width:100% !important;}
	.login-form .form-control{ padding-left:15px;}
	.container{ width:100%;}
	.navbar-header img { width:100%;}
	.navbar-brand { padding-left:0; text-align:center;}
	.mob-menu{ display:block; color:#fff !important; padding-left:10px;}
	.navbar-inverse .navbar-toggle{ border:1px solid #fff;}
	.navbar-nav > li{ display:block; text-align:left; }
	.navbar-nav > li br{ display:none;}
	#menu-header .navbar-nav > li > a{ text-align:left; padding:10px; border-bottom:1px solid #344388;}
	#menu-header .navbar-nav > li > a i { margin-right:5px;}
	.navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover{background:#e32124;}
	.edit { margin-bottom:5px; margin-right:0;}
	.recordper-page .form-inline{ text-align:left !important; margin-top:10px !important; }
	.recordper-page input[type="text"]{ margin:5px 0 !important;}
	.fixed-table-sec .table-fixed tbody td, .table-fixed thead > tr > th{ float:none;}
	/*.mCustomScrollBox{ overflow:auto;}*/
	.holiday-apply-leave .outer-layer .mCSB_scrollTools { display:none !important;}
	.holiday-apply-leave .outer-layer .scroll-div { overflow:auto !important;}
	.holiday-apply-leave .outer-layer .mCSB_container, .holiday-apply-leave .outer-layer .mCustomScrollBox { overflow:visible !important;}
	.container .box .bottom{ left:0;}
	.notification::before{ left:28px;}
	#menu-header .navbar-nav > li.active > a::before, #menu-header .navbar-nav > li > a:hover:before
{
	display:none;
}
}
.instruct{ font-size:13px; color:#4065b9; padding-top:5px;}
.edit-photo-section{ border:1px solid #ddd;}
.view-edit{ position:absolute; right:15px; background:#e8242b; border-radius:5px; padding:3px 8px; color:#fff; top:0;}
.view-edit:hover { background:#29387b; text-decoration:none; color:#fff;}
.progress-bar-section { margin-bottom:20px;}
.accumalated-new{ height:auto;}
.progress-bar-des { padding-bottom:10px;}