/********************  Dash Board Widget CSS ****************/

/********************  Dash Board Widget CSS ****************/


.pageLoading {
    display:    block;
    position:   fixed;
    z-index:    10000000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    opacity: 0.5;
    background: rgba(0, 0, 0, 0.3) 
                /*50% 50% */
                no-repeat;
}

.pageLoading div{
    content: url('../../../images/ajax-loader.gif'); 
    margin-top: 40%;
    margin-left: 47%;
    z-index:    100000000;
}


/* When the body has the loading class, we turn
   the scrollbar off with overflow:hidden */
body.loading {
    overflow: hidden;   
}

/* Anytime the body has the loading class, our
   modal element will be visible */
body.loading .pageLoading {
    display: block;
}

/*///////////////////////////////////////////////////////////////////////////*/
#custom-loading {
    background: #dad8d8;
    color: #666666;
    position: fixed;
    height: 100%;
    width: 100%;
    z-index: 5000;
    top: 0;
    left: 0;
    float: left;
    text-align: center;
    padding-top: 25%;
    opacity: .80;
  }

  .pageLoader1 {
    background: #fff;
    width: 720px;
    margin: auto;
    margin-top: 60px;
    list-style: none;
    padding: 0;
    -moz-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.37);
    box-shadow:      0px 0px 4px 0px rgba(0,0,0,0.37);
}
.pageLoader2 {
    width: 180px;
    height: 180px;
    line-height: 176px;
    text-align: center;
    float: left;
    background-repeat: no-repeat;
    background-position: center;
     margin-top: 20%;
    margin-left: 47%;
}
.pageLoader3 {
    vertical-align: middle;
}
.custom_spinner {
    margin: 0 auto;
    text-align: center;
}

.dot {
    background: #0097a7;
  }
  .dot, .dot:after {
    display: inline-block;
    width: 2em;
    height: 2em;
    border-radius: 50%;
    animation: a 1.5s calc(((var(--i) + var(--o, 0))/var(--n) - 1)*1.5s) infinite;
  }
  .dot:after {
    --o: 1;
    background: #0097a7;
    content: "";
  }
  
  @keyframes a {
    0%, 50% {
      transform: scale(0);
    }
  }
  
  @keyframes rotate {
      0% {
          transform: rotate(0deg);
      }
      100% {
          transform: rotate(360deg);
      }
  }
  
.paddingCls
{
    padding-right:0px !important;
    padding-left:0px !important;
}
.profilesize>img{height: 170px; width: 132px;}
.logosize>img{height: 100px; width: 150px;}



.db-bg-green {
    background-color: #00a65a !important;
}

.db-bg-red {
    background-color: #dd4b39 !important;
}

.db-bg-aqua {
    background-color: #00c0ef !important;
}

.db-bg-orange {
    background-color: #ff851b !important;
}

.db-bg-grass {
    background-color: #a1c436 !important;
}

.db-bg-corp-orange {
    background-color: #08AF7A !important;
}

.db-bg-corp-grass {
    background-color: #0097A7 !important;
}

/*Big Info widget*/
.small-box:hover {
    text-decoration: none;
    color: #f9f9f9;
}

.small-box {
    color: #f9f9f9;
    border-radius: 2px;
    position: relative;
    display: block;
    margin-bottom: 20px;
    box-shadow: 0 1px 1px rgba(0,0,0,0.1);
}

.small-box>.inner {
    padding: 10px;
}

.small-box h3, .small-box p {
    z-index: 5px;
}

.small-box h3 {
    font-size: 38px !important;
    font-weight: bold !important;
    margin: 0 0 10px 0;
    white-space: nowrap;
    padding: 0;
}

sup {
    top: -.5em;
}

sub, sup {
    position: relative;
    font-size: 75%;
    line-height: 0;
    vertical-align: baseline;
}

.small-box p {
    font-size: 15px;
    margin: 0 0 10px;
}

/*
.small-box .icon {
    position: absolute;
    top: auto;
    bottom: 8px;
    right: 5px;
    z-index: 0;
    font-size: 70px;
    color: rgba(0, 0, 0, 0.15);
}*/

.small-box .icon {
    -webkit-transition: all .3s linear;
    -o-transition: all .3s linear;
    transition: all .3s linear;
    position: absolute;
    top: 5px;
    right: 10px;
    z-index: 0;
    font-size: 90px;
    color: rgba(0,0,0,0.15);
}

.small-box:hover .icon {
    animation-name: tansformAnimation;
    animation-duration: .5s;
    animation-iteration-count: 1;
    animation-timing-function: ease;
    animation-fill-mode: forwards;
    -webkit-animation-name: tansformAnimation;
    -webkit-animation-duration: .5s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: ease;
    -webkit-animation-fill-mode: forwards;
    -moz-animation-name: tansformAnimation;
    -moz-animation-duration: .5s;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: ease;
    -moz-animation-fill-mode: forwards;
}

/*.small-box>.small-box-footer {*/
.small-box-footer {
    position: relative;
    text-align: center;
    padding: 3px 0;
    color: #fff;
    color: rgba(255,255,255,0.8);
    display: block;
    z-index: 10;
    background: rgba(0,0,0,0.1);
    text-decoration: none;
}

/*Medium size infor panel with progress bar*/
.db-info-box {
    display: block;
    min-height: 90px;
    background: #fff;
    width: 100%;
    box-shadow: 0 1px 1px rgba(0,0,0,0.1);
    border-radius: 2px;
    margin-bottom: 15px;
}

.db-info-box-icon {
    border-top-left-radius: 2px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 2px;
    display: block;
    float: left;
    height: 90px;
    width: 90px;
    text-align: center;
    font-size: 45px;
    line-height: 90px;
    background: rgba(0,0,0,0.2);
}

.db-info-box-content {
    padding: 5px 10px;
    margin-left: 90px;
}

.db-info-box-text {
    text-transform: uppercase;
}

.db-progress-description, .db-info-box-text {
    display: block;
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.db-info-box-number {
    display: block;
    font-weight: bold;
    font-size: 18px;
}

.db-info-box .progress, .db-info-box .progress .progress-bar {
    border-radius: 0;
}

.db-info-box .progress {
    background: rgba(0,0,0,0.2);
    margin: 5px -10px 5px -10px;
    height: 2px;
}

.progress, .progress>.progress-bar, .progress .progress-bar, .progress>.progress-bar .progress-bar {
    border-radius: 1px;
}

.progress, .progress>.progress-bar {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.progress {
    height: 20px;
    margin-bottom: 20px;
    overflow: hidden;
    background-color: #f5f5f5;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
    box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
}

.progress-description {
    margin: 0;
}

.progress-description, .db-info-box-text {
    display: block;
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.db-info-box .progress .progress-bar {
    background: #fff;
}

.progress-bar {
    float: left;
    width: 0;
    height: 100%;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    text-align: center;
    background-color: #337ab7;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
    box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
    -webkit-transition: width .6s ease;
    -o-transition: width .6s ease;
    transition: width .6s ease;
}

/***********************************************************/

table thead th.no_filter input[type=text] {
    display: none;
}

table.dataTable.select tbody tr,
table.dataTable thead th:first-child {
  cursor: pointer;
}

.dropdown-menu .divider {
    background-color: #e5e5e5 !important;
}

.dropdown-menu > li > a.toggle-vis {
    padding: 0px 20px;
}

.billing-dropdown-menu li a i {
    font-size: 15px;
}

.dropdown-menu.billing-dropdown-menu > li > a {
    padding: 5px 10px !important;
}

#context-menu ul.dropdown-menu, .context-menu ul.dropdown-menu {
    background: white;
    border-radius: 2px;
}

#context-menu .dropdown-menu li, .context-menu .dropdown-menu li {
    margin: 5px 0px;
    cursor: pointer;
}

#context-menu .dropdown-menu li:hover, .context-menu .dropdown-menu li:hover {
    background: #e0e0e0;
}

/************ View field value *************/
.view-hr{
    width: 100%;
    color: black;
    height: 0px;
    background-color:black;
}

.view-label{
    margin-left: 5px;
}

/*************************/

table tr.row_selected td, table tr.sub_grid_row_selected td {
    background-color: #dce1e4 !important;
}

table > tbody > tr.row_selected:hover > td, table > tbody > tr.sub_grid_row_selected:hover > td {
    background-color: #bdbdbd !important;
}

.table tbody tr {
    cursor: pointer;
}

/*.sidebar .logopanel a {*/
/*    background: url(../../../images/white_text_onlya.png) no-repeat;*/
/*    position:absolute;*/
/*    width:126px; */
/*    height:28px; */
/*    left:50%; */
/*    top:50%;*/
/*    margin-left:-63px; */
/*    margin-top:-14px; */
/*}*/

/*.sidebar .logopanel a {
background: url(../../../images/Lekhajokha_CAPS.png) no-repeat;
position: absolute;
display: block;
width: 100%;
height: 50%;
top: 30%;
margin-left: 11%;
}*/

.sidebar .logopanel div{
/*background: url(../../../images/Lekhajokha_CAPS.png) no-repeat;*/
/*position: absolute;*/
/*display: block;*/
width: 100%;
height: 100%;
color: white;
font-weight: bold;
text-align: center;
font-size: 190%;
/*top: 10%;*/
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;

}


/*.sidebar .logopanel a {
    background: url(../../../images/white_text_with_logo.png) no-repeat;
    display: block;
    height: 40px;
}*/

.modal-content .modal-body {
    padding: 10px 24px 16px 24px;
}

@media screen and (max-width: 430px) {
    .topbar .header-right .header-menu #notifications-header {
         display: block; 
    }
}

.main-content.adjustPadding .page-content {
    padding: 20px 30px 0;
}

@media screen and (max-width: 991px) {
    .main-content.adjustPadding .page-content {
        padding: 0px 5px 0px !important;
    }
    
    /*.main-content.adjustPadding .page-content .panel-content {*/
    /*    padding: 5px 20px 5px 0px;*/
    /*}*/
}

@media (max-width: 768px) {
    /**
     * Original Code : .form-inline { margin-left: 15px; }
     * So we reduce margin-left to 0px for better ui in mobile
    */
    .dataTables_wrapper.form-inline {
         margin-left: 0px; 
    }
}

@media (min-width: 768px),(max-width: 992px) {
    .adjustMargin{
        margin-top: 0% !important;
    }
}

@media (min-width: 993px) {
    .adjustMargin{
        margin-top: -2% !important;
    }
}

.main-content .page-content .panel:hover .control-btn a:nth-child(2),
.main-content .page-content .panel:hover .control-btn a:nth-child(5) {
    display: none !important;
}

.main-content .page-content .panel:hover .control-btn > a.hidden.panel-reload,
.main-content .page-content .panel:hover .control-btn > a.hidden.panel-popout {
    color: #000000 !important;
}

.toolbar-icons i, .print-toolbar-icons i {
    font-size: 16px;
}

.toolbar-icons, .print-toolbar-icons {
    padding: 8px 15px;
}

.form-icons i {
    font: normal normal normal 24px/1 'Material-Design-Icons';
}

.icon-label-required {
    font-size: 1em;
    color: red;
}

.form-icons {
    padding: 6px 10px;
}

.sub-table {
    color: #000000;
}

.sub-table:hover {
    color: #0097a7;
}

.sub-table tr td {
    padding: 5px 10px;   
}

.short_explanation {
    font-size: 1em;
    color: red;
}

.btn-on {
    display: inline;
}

.btn-off {
    display: none;
}

.modal-body p {
    word-wrap: break-word;
}

.groupFrom, .groupTo {
    width: 40% !important;
    float: left;
}

.groupDivider {
    width: 10% !important;
    float: left;
}

.addedBy {
    background-color:#D0F889 !important;
}


/*.modal#modal-slideright .modal-body {
    max-height: 420px;
    overflow-y: auto;
}

.modal-open .modal#modal-slideright {
    overflow-y: hidden;
}*/

/*.modal-body {
    max-height: calc(100vh - 212px);
    overflow-y: auto;
}*/





/*************************/
/**
 *  Search page CSS
*/
.prepend-icon input {
    padding-left: 65px !important;
}

.capitalize {
    text-transform: capitalize;
}

.morphsearch-content {
    margin-top: 2em;
    padding: 0 3%;
}

.morphsearch.open .morphsearch-form {
    height: 80px;
    width: 90%;
}

.morphsearch.open .morphsearch-input {
    font-size: 4em;
}

.dummy-column {
    float: left;
    width: 100%;
    padding: 0px;
}

@media screen and (max-width: 1000px) {
    .morphsearch .dummy-column {
        float: left;
    }
}

.morphsearch .dummy-media-object {
    background : none;
    margin: .3em .3em;
    width: 130px;
    float: left;
    clear: right;
}

.morphsearch .dummy-media-object h3 {
    color: white;
    text-align: -webkit-center;
    text-align: center;
    width: 100%;
    height: 30px;
    font-size: .8em;
    margin: 5px auto;
}

.morphsearch .dummy-column:nth-child(2), .morphsearch .dummy-column:nth-child(5) {
    margin: 0;
}

/**
 *  Attendance Box
*/
.fa-1-half-x {
    font-size: 1.5em;
}

.att-box {
    background-color: #FFF;
    float: left;
    width: 100%;
}

.att-box p {
    font-size: 14px;
    color: #666;
    text-align: center;
    /*padding: 15px 0 0px 0px;*/
    padding: 21px 0 0px 0px;
}



.att-time {
    font-size: 24px;
    color: #4a89dc;
    text-align: center;
    /*margin: 10px 0 3px 0;*/
    padding: 10px 0 3px 0px;
    word-spacing: 10px;
}

.cursorPoint {
    cursor: pointer;
}

.att-time-zone {
    font-size: 12px;
    color: #999;
    float: right;
    margin: 0 50px 15px 0;
    /*margin:6px 50px 15px 0;*/
}

.att-time-zone span {
    float: left;
    margin-top: 5px;
}

.zone-float {
    float: left;
}

.zone-globel {
    margin-top: 5px;
    margin-right: 5px;
}

.att-in-out {
    margin-left: 10px;
    margin-top: 3px;
    float: left;
    padding-left: 5px;
}

.att-in-out-text {
    margin-left: 5px;
    margin-top: 8px;
    float: left;
    padding-left: 0px;
    cursor: pointer;
}

.att-but {
    background-color: #FAFAFA;
    border-top: 1px solid #eeeeee;
    border-bottom: 1px solid #d9d9d9;
    height: 42px;
    float: left;
    width: 100%;
}

.attClock {
    font-size: 24px;
    color: #666;
    float: right;
    margin-right: 15px;
    line-height: 40px;
    letter-spacing: 1px;
}

.attTimeViewPanel {
    position: relative;
    background-color: #FFF;
    border-left: 1px solid #eeeeee;
    float: right;
    padding: 10px;
}

.attViewList, .ZPalistsel, .floatPanelButton {
    width: 20px;
    height: 20px;
    overflow: hidden;
    background-repeat: no-repeat;
    cursor: pointer;
}

.attTimeViewPanel .attHiddenPanel {
    position: absolute;
    bottom: -6px;
    left: 0px;
    height: 6px;
    width: 40px;
    background-color: #FFF;
}

/* Hide / Show Panel */
.attBoxList,.hiddenGrid {
    background-color: #FFF;
    float: left;
    width: 100%;
    margin: 5px 0 0 0;
    overflow: auto;
    max-height: 200px;
}

.attBoxList ul,.hiddenGrid ul {
    margin: 0px;
    padding: 0px;
    list-style: none;
}

.attBoxList li.hed, .attBoxList li,.hiddenGrid li.hed, .hiddenGrid li {
    list-style: none;
    width: 100%;
    float: left;
}

.attBoxList li.hed,.hiddenGrid li.hed {
    line-height: 36px;
    border-bottom: 1px solid #d9d9d9;
}

.attBoxList li,.hiddenGrid li {
    line-height: 28px;
}

.attBoxList li.hed div,.hiddenGrid li.hed div {
    color: #666;
}

.row-even {
    
}

.row-odd {
    background-color: #f9f9f9;
}

.attBoxList li div {
    width: 50%;
    text-align: center;
    float: left;
    /*color: #999;*/
}

/*.attBoxList li div,.hiddenGrid li div  */   
.hiddenGrid li div.gridText {
    width: 50%;
    text-align: left;
    padding-left: 8px; 
    float: left;
    /*color: #999;*/
}

.hiddenGrid li div.gridNum {
    width: 50%;
    text-align: Center;
    /*padding-left: 8px; */
    float: left;
    /*color: #999;*/
}

.attViewEntryPanel {
    background-color: #FAFAFA;
    border-top: 1px solid #eeeeee;
    border-bottom: 1px solid #d9d9d9;
    height: 40px;
    float: left;
    width: 100%;
}

.viewAllButton {
    float: left;
    padding-left: 5px;
}

.viewAllButton span {
    float: left;
    color: #999;
    line-height: 20px;
    margin: 10px 0 0 10px;
    cursor: pointer;
}

.floatPanel {
    padding: 10px;
    float: right;
}

/***********************************************************/
/**
 *  Styles for sub menu list
*/

.hrsubmenu_img {
    /*background-color: white;
    margin-top: 10px;
    margin-left: 0px;
    margin-right: 0px;*/
    
    /*border-bottom: 1px solid white;
    margin-top: -20px;
    margin-left: -30px;
    margin-right: -30px;*/
    margin-top: -2%;
    /*margin: -2% 10% 0% 20%;*/
    background-color: white;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    text-align: center;
    /*width: 660px;*/
}

.hrsubmenu_img ul li {
    float: left;
    list-style: none;
    clear: right;
    padding: 10px 10px 5px;
    margin: 0px 10px;
}

/**
 *  Hrapp modules, form icons
*/
.hrapp-icon-size {
    font-size: 16px;
}

.hrapp-search-icons {
    font-size: 40px;
    color: white;
    padding-left: 30px;
}

.active-sub-menu, .hrsubmenu_img ul li:hover {
    border-bottom: 3px solid #319db5;
    padding-bottom: 2px !important;
}

.hrsubmenu_img ul li.active-sub-menu a i.hrapp-icon-size, .hrsubmenu_img ul li:hover, .hrsubmenu_img ul li:hover a i.hrapp-icon-size {
    color: #319db5 !important;
    padding-bottom: 2px;
}

.hrsubmenu_img ul li a i.hrapp-icon-size {
    color: #5b5b5b;
    font-size: 25px;
    padding-top: 0px;
    margin-top: 0px;
}

.hrapp_orgimg:hover,.hrapp_jobimg:hover,.hrapp_empimg:hover,.hrapp_payrollimg:hover ,.hrapp_reportimg:hover,.hrapp_helpimg:hover {
   -webkit-animation: pulse 1s;
            animation: pulse 1s;       
}

/**
 *  Organization Module
*/
.hrapp_orgimg {
	background-image:url("../../../images/org_hrappimg.png");
	background-repeat:no-repeat;
	width:50px;
	height:50px;
	margin:auto;
}

.locations_orgimg {
	background-position: -599px -3px ;
	margin: auto;
}

.locations_orggrayimg {
	background-position: -648px -3px ;
	margin: auto;
}

.departments_orgimg {
	background-position: -899px -3px ;
	margin: auto;
}

.departments_orggrayimg {
	background-position: -950px 0;
	margin: auto;
}

.projects_orgimg {
	background-position: -199px 0;
	margin: auto;
}

.projects_orggrayimg {
	background-position: -249px -3px ;
	margin: auto;
}

.organizationprofile_orgimg {
	background-position: -401px 0;
	margin: auto;
}

.organizationprofile_orggrayimg {
	background-position: -451px 0;
	margin: auto;
}

.organizationpolicies_orgimg {
	background-position: -500px 0;
	margin: auto;
}

.organizationpolicies_orggrayimg {
	background-position: -550px 0;
	margin: auto;
}

.workschedule_orgimg {
	background-position: 0 -1px ;
	margin: auto;
}

.workschedule_orggrayimg {
	background-position: -49px 0;
	margin: auto;
}

.holidays_orgimg {
	background-position: -701px -3px ;
	margin: auto;
}

.holidays_orggrayimg {
	background-position: -750px -3px ;
	margin: auto;
}

.systemlog_orgimg {
	background-position: -99px 0;
	margin: auto;
}

.systemlog_orggrayimg {
	background-position: -149px 0;
	margin: auto;
}

.organizationsettings_orgimg {
	background-position: -300px -3px ;
	margin: auto;
}

.organizationsettings_orggrayimg {
	background-position: -352px 0;
	margin: auto;
}

.employeeimport_orgimg {
	background-position: -799px 0;
	margin: auto;
	
}
.employeeimport_orggrayimg {
	background-position: -849px -2px ;
	margin: auto;
}

/**
 *  Recuritement Module
*/

.hrapp_jobimg {
	background-image:url("../../../images/recruitment_hrappimg.png");
	background-repeat:no-repeat;
	width:50px;
	height:50px;
}

.jobpostrequisition_jobimg {
	background-position: -199px -3px ;
	margin: auto;
}

.jobpostrequisition_jobgrayimg {
	background-position: -249px -3px ;
	margin: auto;
}
.jobposts_jobimg {
	background-position: -99px -3px ;
	margin: auto;
}

.jobposts_jobgrayimg {
	background-position: -150px -3px ;
	margin: auto;
}

.jobcandidates_jobimg {
	background-position: -300px -3px ;
	margin: auto;
}

.jobcandidates_jobgrayimg {
	background-position: -350px -3px ;
	margin: auto;
}

.shortlistedcandidates_jobimg {
	background-position: 0 0;
	margin: auto;
}

.shortlistedcandidates_jobgrayimg {
	background-position: -50px 0;
	margin: auto;
}

/**
 *  Employee Module
*/

.hrapp_empimg {
	background-image:url("../../../images/emp_hrappimg.png");
	background-repeat:no-repeat;
	width:50px;
	height:50px;
}

.employees_empimg {
	background-position: -1299px 0;
	margin: auto;
}

.employees_empgrayimg {
	background-position: -1350px 0;
	margin: auto;
}

.timesheets_empimg {
	background-position: -199px -2px ;
    margin: auto;
}

.timesheets_empgrayimg {
	background-position: -249px -3px ;
	margin: auto;
}

.attendance_empimg {
	background-position: -999px 0;
	margin: auto;
}

.attendance_empgrayimg {
	background-position: -1048px 0;
	margin: auto;
}

.assignments_empimg {
	background-position: -901px -3px ;
	margin: auto;
}

.assignments_empgrayimg {
	background-position: -949px -1px ;
	margin: auto;
}

.leaves_empimg {
	background-position: -700px -3px ;
	margin: auto;
}

.leaves_empgrayimg {
	background-position: -750px -3px ;
	margin: auto;
}

.transfer_empimg {
	background-position: -99px 0;
	margin: auto;
}

.transfer_empgrayimg {
	background-position: -149px -2px ;
	margin: auto;
}

.resignation_empimg {
	background-position: -398px -3px ;
	margin: auto;
}

.resignation_empgrayimg {
	background-position: -449px -3px ;
	margin: auto;
}

.employeetravel_empimg {
	background-position: -1100px 0;
	margin: auto;
}

.employeetravel_empgrayimg {
	background-position: -1150px -1px ;
	margin: auto;
}

.inbox_empimg {
	background-position: -802px -2px ;
	margin: auto;
}

.inbox_empgrayimg {
	background-position: -852px -3px ;
	margin: auto;
}

.warnings_empimg {
	background-position: 0 -2px ;
	margin: auto;
}

.warnings_empgrayimg {
	background-position: -50px 0;
	margin: auto;
}

.memos_empimg {
	background-position: -599px -3px ;
	margin: auto;
}

.memos_empgrayimg {
	background-position: -649px -3px ;
	margin: auto;
}

.awards_empimg {
	background-position: -1400px -1px ;
	margin: auto;
}

.awards_empgrayimg {
	background-position: -1449px 0;
	margin: auto;
}

.complaints_empimg {
	background-position: -1199px -1px ;
	margin: auto;
}

.complaints_empgrayimg {
	background-position: -1249px -2px ;
	margin: auto;
}

.performanceevaluation_empimg {
	background-position: -499px -3px ;
	margin: auto;
}

.performanceevaluation_empgrayimg {
	background-position: -548px -3px ;
	margin: auto;
}

.skillsetassessment_empimg {
	background-position: -300px -1px ;
	margin: auto;
}

.skillsetassessment_empgrayimg {
	background-position: -349px -3px ;
	margin: auto;
}

.miscellaneous_empimg {
	background-position: -512px 2px;
    left: 12%;
    position: relative;
}

.miscellaneous_empgrayimg {
	background-position: -567px 3px;
	position: relative;
	left: 12%;
}

/**
 *  Payroll Module
*/
.hrapp_payrollimg {
	background-image:url("../../../images/payroll_hrappimg.png");
	background-repeat:no-repeat;
	width:50px;
	height:50px;
	margin: auto;
}

.salary_payrollimg {
	background-position: -698px 0;
	margin: auto;
}

.salary_payrollgrayimg {
	background-position: -751px 0;
	margin: auto;
}

.salarypayslip_payrollimg {
	background-position: -599px 0;
	margin: auto;
}

.salarypayslip_payrollgrayimg {
	background-position: -648px 0;
	margin: auto;
}

.taxrules_payrollimg {
	background-position: -1200px 0;
	margin: auto;
}

.taxrules_payrollgrayimg {
	background-position: -1250px 0;
	margin: auto;
}

.allowances_payrollimg {
	background-position: -401px -3px ;
	margin: auto;
}

.allowances_payrollgrayimg {
	background-position: -449px 0;
	margin: auto;
}

.bonus_payrollimg {
	background-position: -201px -2px ;
	margin: auto;
}

.bonus_payrollgrayimg {
	background-position: -250px 0;
	margin: auto;
}

.commission_payrollimg {
	background-position: -100px 0;
	margin: auto;
}

.commission_payrollgrayimg {
	background-position: -151px 0;
	margin: auto;
}

.deductions_payrollimg {
	background-position: 0 0;
	margin: auto;
}

.deductions_payrollgrayimg {
	background-position: -49px 0;
	margin: auto;
}

.reimbursement_payrollimg {
	background-position: -802px 0;
	margin: auto;
}

.reimbursement_payrollgrayimg {
	background-position: -850px -1px ;
	margin: auto;
}

.providentfund_payrollimg {
	background-position: -899px 0;
	margin: auto;
}

.providentfund_payrollgrayimg {
	background-position: -950px 0;
	margin: auto;
}

.advancesalary_payrollimg {
	background-position: -500px 0;
	margin: auto;
}

.advancesalary_payrollgrayimg {
	background-position: -549px 0;
	margin: auto;
}

.loan_payrollimg {
	background-position: -999px 0;
	margin: auto;
}

.loan_payrollgrayimg {
	background-position: -1049px 0;
	margin: auto;	
}

.shift_payrollimg {
	background-position: -1401px 0;
	margin: auto;
}

.shift_payrollgrayimg {
	background-position: -1450px 0;
	margin: auto;
}

.insurance_payrollimg {
	background-position: -1100px 0;
	margin: auto;
}

.insurance_payrollgrayimg {
	background-position: -1152px 0;
	margin: auto;
}

.taxdeclarations_payrollimg {
	background-position: -1299px 0;
	margin: auto;
}

.taxdeclarations_payrollgrayimg {
	background-position: -1350px 0;
	margin: auto;
}

.balancesheettransaction_payrollimg {
	background-position: -300px 0;
	margin: auto;
}

.balancesheettransaction_payrollgrayimg {
	background-position: -352px 0;
	margin: auto;
}

/**
 *  Report Module
*/
.hrapp_reportimg {
	background-image:url("../../../images/report_hrappimg.png");
	background-repeat:no-repeat;
	width:50px;
	height:50px;
	margin: auto;
}

.attendanceshortagereports_reportimg {
	background-position: -500px 0;
	margin: auto;
}

.attendanceshortagereports_reportgrayimg {
	background-position: -551px 0;
	margin: auto;
}

.hrreports_reportimg {
	background-position: -701px 0;
	margin: auto;
}

.hrreports_reportgrayimg {
	background-position: -750px 0;
	margin: auto;
}

.employeesreports_reportimg {
	background-position: 0 -1px ;
	margin: auto;
}

.employeesreports_reportgrayimg {
	background-position: -50px 0;
	margin: auto;
}

.payrollreports_reportimg {
	background-position: -1200px -3px ;
	margin: auto;
}

.payrollreports_reportgrayimg {
	background-position: -1251px 0;
	margin: auto;
}

.recruitmentreports_reportimg {
	background-position: -2200px 0;
	margin: auto;
}

.recruitmentreports_reportgrayimg {
	background-position: -2250px -1px ;
	margin: auto;
}

/**
 *  Help Module
*/
.hrapp_helpimg {
	background-image:url("../../../images/help_hrappimg.png");
	background-repeat:no-repeat;
	width:50px;
	height:50px;
}

.helptopics_helpimg {
	background-position: 0 0;
	margin: auto;
}

.helptopics_helpgrayimg {
	background-position: -49px -1px ;
	margin: auto;
}
.contactus_helpimg {
	background-position: -98px -3px ;
	margin: auto;
}

.contactus_helpgrayimg {
	background-position: -150px -3px ;
	margin: auto;
}

/***********************************************************/

/**
 *  Custom Filter Builder
*/

.filter {
  -webkit-transition: -webkit-transform 600ms cubic-beziercubic-bezier(0.25, 0.1, 0.25, 1);
  background: #ffffff;
  border-left: 1px solid rgba(224, 226, 234, 0.53);
  bottom: 0;
  box-shadow: 0 0 9px rgba(155, 155, 155, 0.55);
  position: fixed;
  right: -250px;
  top: 0;
  transition: transform 600ms cubic-bezier(0.25, 0.1, 0.25, 1);
  width: 250px;
  z-index: 1000;
  overflow-y: auto !important;
}
.filter .inner .filter-container {
  padding: 20px;
}
.filter .inner .filter-container button {
  width: 100%;
}
.filter h4 {
  font-family: 'Lato', 'Open Sans';
  font-size: 14px;
  font-weight: 900;
  margin-bottom: 10px;
  margin-top: 10px;
  padding-top: 10px;
  text-transform: uppercase;
}
.filter a {
  color: #A1A1A1;
  display: block;
  position: relative;
  width: 100%;
}
.filter a:hover {
  color: #818181;
  text-decoration: none !important;
}
.filter a:active {
  color: #818181;
  text-decoration: none !important;
}
.filter a:focus {
  color: #818181;
  text-decoration: none !important;
}
.filter a.active {
  color: #2E2E2E;
}
.filter .filter-close {
  padding: 7px;
  position: absolute;
  right: 36px;
  top: 20px;
  width: auto;
  z-index: 10;
}
/*.filter .filter-toggle {
  cursor: pointer;
  font-size: 16px;
  height: 50px;
  left: -48px;
  line-height: 50px;
  padding-top: 2px;
  position: absolute;
  text-align: center;
  top: 15%;
  width: 54px;
  z-index: 1010;
}
.filter .filter-toggle i {
  padding-right: 5px;
}
.filter:before {
  background-color: #ffffff;
  border-bottom-left-radius: 4px;
  border-left: 1px solid rgba(224, 226, 234, 0.53);
  border-top-left-radius: 4px;
  box-shadow: -3px 2px 2px rgba(189, 189, 189, 0.28);
  content: '';
  height: 50px;
  left: -47px;
  position: absolute;
  top: 15%;
  width: 48px;
}*/
.filter.open {
  -ms-transform: translate(-100%, 0);
  -webkit-transform: translate3d(-100%, 0, 0);
  transform: translate3d(-100%, 0, 0);
}
/**********************/
/**
 *  Grid Floating Add button
*/
button.gridAdd {
    position: fixed;
    bottom: 30px;
    right: 30px;
    z-index: 9999;
    padding: 8px 15px;
    -moz-border-radius: 50% !important;
    -webkit-border-radius: 50% !important;
    border-radius: 50% !important;
    border-radius: 20px;
}

/***********************************/


/*.panel-accordion .panel-body a {*/
/*  background-color: transparent;*/
/*  color: #121212;*/
/*  display: inline-block;*/
/*  padding: 15px;*/
/*  width: 100%;*/
/*}*/

td.details-control {
    background: url('../../../images/add.png') no-repeat center center;
    cursor: pointer;
}
tr.shown td.details-control {
    background: url('../../../images/cancel.png') no-repeat center center;
}
.multiselect {
    width:20em;
    height:15em;
    border:solid 1px #c0c0c0;
    overflow:auto;
}
 
.multiselect label {
    display:block;
}
 
.multiselect-on {
    color:#ffffff;
    background-color:#000099;
}
.DTTT_Print {
margin-left: 0 !important;
margin-top: -20 !important;
}
#printReportsTable {
    width: 95%;
    margin: 10px;
    letter-spacing: 0px
}

.paymentTracker_editing_row {
    background-color: #D0F889 !important; /* Add !important to make sure override datables base styles */
}
 
@media (max-width: someresolution){
 .span8{
  width:99.3214534%;
 }
}

#print-modal-controls{border:1px solid #ccc;border-radius:8px;
-webkit-border-radius:8px;-moz-border-radius:8px;top:15px;left:50%;margin:0 0 0 -81px;position:fixed;padding:5px 0;background:rgba(250,250,250,0.75)
}
#print-modal-controls a{color:#FFF;display:block;float:left;height:32px;text-decoration:none;text-indent:-999em;width:80px
}
#print-modal-controls a:hover{opacity:.75}#print-modal-controls a.print{background:url(images/icon-print.png) no-repeat 50% 50%
}
#print-modal-controls a.close{background:url(images/icon-close.png) no-repeat 50% 50%
}


/*send mail button */
.write-answer #sendMail {
  float: right;
  margin-right: 0;
  margin-top: 20px;
}

/*mailbox*/
.attachmentname {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(29, 106, 154, 0.72);
  color: #fff;
  visibility: hidden;
  opacity: 0;
}

/*sender text overflow issue in mobile view*/

@media (max-width: 800px), (max-width: 1000px),(max-width: 1200px),(max-width: 1400px),(max-width: 1600px) {
  .page-app.mailbox .message-item .sender {
    width: 28% !important;
    margin-left: 10%;
  }
  .page-app.mailbox .message-item .subject {
    width: 43% !important;
  }
  
}

@media (max-width: 480px) {
  .page-app.mailbox .message-item .sender {
    width: 50% !important;
  }
  .page-app.mailbox .message-item .subject {
    display: none;
  }
}
/*@media (max-width: 1291px) {*/
/*  .page-app .email-details{*/
/*    display: none !important;*/
/*  }*/
/*  */
/*}*/

@media (max-width: 800px),(max-width: 1000px),(max-width: 1200px),(max-width: 1400px) {
  .page-content.mailbox:not(.mailbox-send) .email-details {
    display: none;
  }
  .page-content.mailbox:not(.mailbox-send) .email-details .email-subject .go-back-list i {
    display: block;
  }
  .page-content.mailbox-send .emails-list {
    display: none;
  }
  /*.page-app.mailbox .message-item .sender {*/
  /*  width: 150px;*/
  /*}*/
  /*.page-app.mailbox .message-item .subject {*/
  /*  width: auto;*/
  /*}*/
}
/*reducing height of mail list*/
.page-app.mailbox .message-item {
    height: 42px;
    line-height: 25px;
    /*padding: 5px 20px -25px 8px;*/
}

.tab-content{
    border-top:2px solid #bebebe !important;
    font: 13px/1.4285714 Arial, sans-serif;
}

.emails-list .nav-tabs > li i:hover {
color: #2c8ca1;
}

.emails-list .nav-tabs a::before{
    background: #667277;
}

.page-app.mailbox .messages-list:after {
border-left: none;

}

.mailbox .note-table{
    display: none;
}
.email-details .email-content {
    padding:5px;
}
#mailcc:hover,#mailbcc:hover{
    text-decoration: underline;
}

.email-details .write-answer
{
   padding: 0px; 
}

.write-answer .note-editable {
    
    min-height: 150px !important;
    height : auto !important;
}
/*.main-content .page-content {
    margin-top:20px;
}*/
[class^="flaticon-"]:before, [class*=" flaticon-"]:before, [class^="flaticon-"]:after, [class*=" flaticon-"]:after
{
    font-size:50px !important;
    color: #0097a7 !important;
}


.gmail_signature * {
    background: inherit !important;
}

.emails-list section .tab-content {
    padding: 10px; 
}

.mailbox-send {
    margin-top: 0px !important;
}

.email-details .email-subject {
    border-color: #bebebe !important;
}

.email-details .write-answer .answr-textarea {
  background: #ffffff !important;
  border: 1px solid #dfdfdf !important;
  font-family: 'Merriweather', serif !important;
  font-size: 16px !important;
  height: auto;
  margin-top: 38px !important;
  padding: 20px !important;
  width: 100% !important;
}


/*for folded corner document view  */
/*.thumbnaildiv {
  position: relative;
  width: 30%;
  padding: 1em 1.5em;
  margin: 2em auto;
  color: #fff;
  background: #97C02F;
  overflow: hidden;
}

.thumbnaildiv:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  border-width: 0 26px 26px 0;
  border-style: solid;
  border-color: #dce1e4 #dce1e4 #bebebe #bebebe;
  background: #658E15;
  -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.3), -1px 1px 1px rgba(0,0,0,0.2);
  -moz-box-shadow: 0 1px 1px rgba(0,0,0,0.3), -1px 1px 1px rgba(0,0,0,0.2);
  box-shadow: 0 1px 1px rgba(0,0,0,0.3), -1px 1px 1px rgba(0,0,0,0.2);
  
  display: block; width: 0;
}

.thumbnaildiv.rounded {
  -moz-border-radius: 5px 0 5px 5px;
   -webkit-border-radius: 5px 0 5px 5px;
  border-radius: 5px 0 5px 5px;
}

.thumbnaildiv.rounded:before {
  border-width: 8px;
  border-color: #fff #fff transparent transparent;
  -moz-border-radius: 0 0 0 5px;
  -webkit-border-radius: 0 0 0 5px;
  border-radius: 0 0 0 5px;
}    */


/*employee form tabs*/

.sf-nav-step{
    background: #585858 !important;
	color:#ADB3B8 !important;
}
.sf-arrow .sf-nav li.sf-nav-step:after
{
	border-left:26px solid #585858 !important;
}
.sf-active{
    background: #319DB5 !important;
    color: #FFF !important;
}
.sf-arrow .sf-nav li.sf-nav-step.sf-active:after{
	content: "";
	position: absolute;
	right: -24px;
	top: 0;
	width: 0;
	height: 0;
	border-top: 26px solid transparent;
	border-bottom: 26px solid transparent;
	border-left:26px solid #319DB5 !important;
}

.lockBg:hover {    
    background-color: #181a1d !important;
}

@media (max-width: 768px) {
    .billingPrintMargin{
        width:90% !important;
    }
}


.logMask {
    display:    block;
    position:   fixed;
    z-index:    10000000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    opacity: 0.5;
    background: rgba(0, 0, 0, 0.3) 
                /*50% 50% */
                no-repeat;
}

.orgProductLogoSvg path{
	fill:#727272 !important;
}