/* JQuery UI autocomplete */
.ui-autocomplete-loading {
    background: white url('../images/jquery/ui-anim_basic_16x16.gif') right center no-repeat;
}
.ui-autocomplete {
    max-height: 200px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
    z-index: 9999;
}
/* IE 6 doesn't support max-height
* we use height instead, but this forces the menu to always be this tall
*/
* html .ui-autocomplete {
    height: 200px;
}
.ui-widget {
    /*font: 12px/1.6em 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, Sans-Serif;*/
}


/* Filter form */
#FilterEmployeeDateRange_name {
    /*width: 200px;*/
}
#FilterEmployeeDateRange_text {
    /*width: 200px;*/
}

/* Select employee dialog */
.select-employee-dialog, .select-employee-dialog-skippable {
    text-align: left;
}
.ui-dialog-title {
    text-align: left;
}
.select-employee-dialog .info, .select-employee-dialog-skippable .info {
    padding: 2px;
    margin: 5px 0px 5px 0px;
}
.select-employee-dialog form, .select-employee-dialog-skippable form {
    background: none;
    border: none;
    padding: 0;
    margin: 0;
}
.select-employee-dialog label, .select-employee-dialog-skippable label {
    font-weight: normal;
}
#SelectEmployee_name {
    width: 95%;
    padding-left: 10px;
}
.select-employee-dialog .validateTips, .select-employee-dialog-skippable .validateTips { 
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -khtml-border-radius: 4px;
    border-radius: 4px;
    border: 1px solid transparent;
    padding: 2px;
    margin: 0;
}
.select-employee-dialog .ui-state-error, .select-employee-dialog-skippable .ui-state-error {
    border: 1px solid red;
    background: #FFEEEE;
}

/* Department drop down */
select#filter_employee_form_department {
    width: 220px;
}

/* Please wait popup window */
#please-wait-popup {
    display: none;
    position:fixed;
    top: 50%;
    left: 50%;
    width:14em;
    min-height:16px;
    margin-top: -8px; /*set to a negative number 1/2 of your height*/
    margin-left: -7em; /*set to a negative number 1/2 of your width*/
    border: 1px solid #ccc;
    background-color: #f3f3f3;
    z-index: 999;
}
#please-wait-popup img {
    background: none;
    border: none;
    vertical-align: middle;
}
/* Please wait popup window */
#please-wait-popup {
    display: none;
    position:fixed;
    top: 50%;
    left: 50%;
    width: 180px;
    min-height:16px;
    margin-top: -8px; /*set to a negative number 1/2 of your height*/
    margin-left: -90px; /*set to a negative number 1/2 of your width*/
    border: 1px solid #999;
    background-color: #f3f3f3;
    z-index: 999;
    text-align: center;
    padding: 8px;
}
#please-wait-popup img {
    background: none;
    border: none;
    vertical-align: middle;
    /*margin: 8px;*/
    /*display: inline-block*/
}

/*style for horizontal filter*/
.horizontal-filter{
    display: table;
    width: 100%;
    height: 44px;
}
/*.horizontal-filter > div{*/
    /*display: table-cell;*/
    /*text-align: left;*/
/*}*/
.horizontal-filter .input-group .form-control{
    float:none !important;
}
.horizontal-filter .filter-field:not(:last-child){
    padding-right: 8px;
}
.horizontal-filter .filter-field:last-child{
    padding-right: 0px;
}
.horizontal-filter .filter-field{
    display: table-cell;
    vertical-align: top;
}

/*next 3 rules are to imitate placeholder effect*/
.horizontal-filter select{
    color:#99999C;
}
.horizontal-filter select option:first-child{
    color:#99999C;
}
.horizontal-filter select option:not(:first-child){
    color: rgb(85, 85, 85);
}
.horizontal-filter select{
    width:90px;
    padding: 5px 5px;
}
.horizontal-filter input{
    padding: 5px 5px;
}
.horizontal-filter select[name*=period]{
    width:140px;
}
#clear-filter-text{
    color:rgb(119,126,135);
    /*font-weight: bold;*/
    cursor: pointer;
}
#clear-filter-text>span{
    vertical-align: top;
}
.horizontal-filter .year-dates{
    width: 188px;
    padding-right: 0px!important;
}
.horizontal-filter > div:last-child{
    padding-right: 0px!important;
}
.horizontal-filter .year-dates .input-group-addon{
    background-color: white;
}
.horizontal-filter .year-dates span:nth-of-type(2){
    border-right: none!important;
    border-left: none!important;
}
/*To avoid white color of filter inputs when modal is trigger*/
.horizontal-filter .input-group .form-control{
    z-index: auto;
}