/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 18 Nov, 2014, 10:09:26 AM
    Author     : noonicdev
*/

@font-face {
    font-family: Tahoma;
    src: url(../fonts/TahomaRegular.ttf);
}

*, *:hover, *:focus{
    outline-style: none; -moz-outline-style:none;
}
a {
    outline-style: none; -moz-outline-style:none;
}
a:hover {
    text-decoration: none;
}
a {
    outline: 0;
}
a:focus{
    outline: 0;
}
body{
    padding: 0;
    margin: 0;
    font-family: Tahoma;
}
ul,li,p,h1,h2,h3,h4,h5,h6,label{
    padding: 0;
    margin: 0;
    color: #000;
}
ul,li{
    list-style: none;
}
label{
    font-weight: normal;
}

.lt{
    float: left;
}
.rt{
    float: right;
}
.txtBold{
    font-weight: bold;
}
.clrBlack{
    color: #000;
}
select{
    border: 1px solid #898B8C;
    border-radius: 0;
}
input{
    border: 1px solid #898B8C;
    border-radius: 0;
}

header{
    padding: 10px 0 10px 0;
}
.headerTitle{
    border-top:1px solid #e6e6e6;
    border-bottom:1px solid #e6e6e6;
    padding: 10px 0;
}
.navBarNew{
    background: none;
    border: none;
}
.dbWrap i{
    margin-right: 20px;
    background: #464648;
    border-radius: 50%;
    color: #FFF;
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 20px;
}
.userHeader i{
    background: none;
    color: #0072BC;
    margin: 0;
    font-size: 30px;
    padding-left: 50px;
    padding-top: 6px;
}
.userHeaderDetails{
    color: #0072BC;
}
.userHeaderDetails .txtBold{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    width: 170px;
}

.loginWrap{
    padding: 60px 0 60px 0;
}
.loginWrap .form-group{
    padding: 8px 0;
    margin: 0;
}
.workplanWrap .form-group{
    padding: 1px 0;
    margin: 0;    
}
.loginWrap input{
    border: 1px solid #CCCCCC;
    border-radius: 0;
    box-shadow: none;
}
.loginWrap select{
    border: 1px solid #CCCCCC;
    border-radius: 0;
}
.blueBtn{
    background: #4c7ec1 !important; /* Old browsers */
    background: -moz-linear-gradient(left, #4c7ec1 0%, #366fbf 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#4c7ec1), color-stop(100%,#366fbf)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left, #4c7ec1 0%,#366fbf 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left, #4c7ec1 0%,#366fbf 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left, #4c7ec1 0%,#366fbf 100%); /* IE10+ */
    background: linear-gradient(to right, #4c7ec1 0%,#366fbf 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c7ec1', endColorstr='#366fbf',GradientType=1 ); /* IE6-9 */
    border: 1px solid #3A73BF;
    color: #FFF;
    min-width: 150px;
    font-weight: bold;
    text-transform: uppercase;
    border-radius: 2px !important;
}
.blueBtn:hover{
    color: #FFF;
}
.redBtn{
    background: none repeat scroll 0 0 #c22233;
    border: 1px solid #c01a2c;
    color: #fff;
    font-weight: bold;
    margin: 5px 0;
    min-width: 140px;
    text-transform: uppercase;
}
.redBtn:hover{
    color: #FFF;
}

.greyBtn{
    background: #7B7979; /* Old browsers */
    border: 1px solid #656263;
    color: #FFF;
    min-width: 150px;
    font-weight: bold;
    text-transform: uppercase;
}
.greyBtn:hover{
    color: #FFF;
}
ul.headerMenu{
    text-align: right;
    padding: 30px 0;
}
ul.headerMenu li{
    display: inline-block;
    border-left: 1px solid #0072BC;
    padding: 0px 20px;
    color: #2B2724;
    cursor: pointer;
}
ul.headerMenu li:last-child{
    padding-right: 0;
}
ul.headerMenu li:hover, ul.headerMenu li a:hover, ul.headerMenu li.active a, ul.headerMenu li.active{
    color: #0072BC;
}
ul.headerMenu i{
    margin-right: 8px;
    font-size: 16px;
}
ul.headerMenu a {
    text-decoration: none;
    color: #2B2724;
}
.headerTitle p{
    color: #0072BC;  
    text-align: right;
}
.deptWrap{
    background: #F3F2F2;
    padding: 0px 20px 0px 20px;
    margin: 20px 0;
}
.deptWrap .form-group{
    padding: 20px 0 20px 0;
}
.deptWrap select, .loginWrap select{
    border: 1px solid #CCCCCC;
    border-radius: 0;
}
.deptWrap input{
    border: 1px solid #CCCCCC;
    border-radius: 0;
    box-shadow: none;
}
.deptWrap .btn{
    background: #FFF;
    border-radius: 0;
}
.deptWrap .btn-default:hover, .deptWrap .btn-default:focus, .deptWrap .btn-default.focus, .deptWrap .btn-default:active, .deptWrap .btn-default.active, .open > .dropdown-toggle.btn-default{
    background: #FFF;
    box-shadow: none;
    outline: none;
    border: 1px solid #CCCCCC;
}
.loginWrap .btn{
    background: #FFF;
    border-radius: 0;
}
.loginWrap .btn-default:hover, .loginWrap .btn-default:focus, .loginWrap .btn-default.focus, .loginWrap .btn-default:active, .loginWrap .btn-default.active, .open > .dropdown-toggle.btn-default{
    background: #FFF;
    box-shadow: none;
    outline: none;
}
.dropdown-menu{
    border-radius: 0;
    margin: 0;
}
.dropdown-menu > li{
    margin-bottom: 5px;
}
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus{
    background: #0072BC;
    color: #FFF;
}
.tmeHeadBg{
    background: #0072BC;
    padding: 15px;
    color: #FFF;
//    text-align: center;
}
.tmeHeadBgGrey{
    background: #C9C8C8;
    padding: 15px;
    color: #464648;
//    text-align: center;
}
.tmeHeadBgGrey strong {
    color: #0072BC;
}
.tmeSheetWrap{
    background: #F3F2F2 !important;
    display: inline-block;
    margin: 10px 0 0 0;
    width: 100%;
    padding: 20px 0;
    text-align: left;
}
.tmeSheetWrapGrey{
    background: #F3F2F2 !important;
    display: inline-block;
    padding: 15px;
    color: #464648;
}
.tmeSheetWrapGrey strong {
    padding-left: 15px;
}
.tmeSheetWrapGrey i {
    font-size: 18px;
}
.tmeApp{
    padding-left: 20px;
}
.nameEmpId i{
    margin-right: 6px;
    padding-left: 20px;
}
.nameEmpId{
    color: #397FCB;
    font-weight: bold;
}
.deptCnt{
    //border-right: 2px solid #7E8081;
}
.statusCircle i{
    border-left: 2px solid #7E8081;
    border-right: 2px solid #7E8081;
    padding: 0 15px;
}
.purpleBg{
    background: #5D278F;
    min-height: 120px;
    text-align: center;
    font-weight: bold;
    margin-bottom: 10px;
}
.pinkBg{
    background: #8B1B8D;
    min-height: 120px;
    text-align: center;
    font-weight: bold;
    margin-bottom: 10px;
}
.purpleBg i, .pinkBg i{
    color: #FFF;
    line-height: 80px;
    font-size: 50px;
}
.purpleBg p, .pinkBg p{
    color: #FFF;
}

.navTabsNew{
    border:none;
}
.navTabsNew li a{
    color: #000;
}
.navTabsNew li a, .navTabsNew li.active a{
    border: none;
}
.navTabsNew li.active a{
    text-decoration: none;
    color: #0072BC;
    border: none;
    //font-weight: bold;
}
.navTabsNew li:hover a, .navTabsNew li.active:hover a{
    background: none;
    border: none;
    color: #0072BC;
}
.navTabsNew li:hover a, .navTabsNew li:focus a{
    color: #0072BC;
    border: none;
}
.navTabsNew > li.active > a, .navTabsNew > li.active > a:hover, .navTabsNew > li.active > a:focus{
    border: none;
    color: #0072BC;
}
.ui-autocomplete{
    background: #FFF;
    border: 1px solid #000;

}
ul.autoCompleteCnt{
    background: #FFF;
    border: 1px solid #e6e6e6;
    display: none;
    width: 93%;
    position: absolute;
    z-index: 1;
    margin-left: 15px;
    left: 0;
}
ul.autoCompleteCnt li{
    padding: 3px 0 3px 10px;

}
ul.autoCompleteCnt li:hover, ul.autoCompleteCnt li.hovered{
    cursor: pointer;
    background: #0072BC;
    color: #FFF;
}

footer{
    border-top:1px solid #e6e6e6;
    padding: 10px 0 20px 0;
    margin-top: 20px;
}

.buttonWrapper {
    padding-bottom: 50px;
}

.requiredStar {
    color: red;
    padding-left: 5px;
}

#preloader  {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fefefe;
    z-index: 99;
    height: 100%;
    display: none;
}

#status  {
    width: 200px;
    height: 200px;
    position: absolute;
    left: 50%;
    top: 50%;
    background-image: url(../img/ajax-loader.gif);
    background-repeat: no-repeat;
    background-position: center;
    margin: -100px 0 0 -100px;
}

#messageDisplay {
    display: none;
    position: absolute;
    bottom: 10%;
    right: 0;
    width: auto;
    height: 50px;
    background-color: #dff0d8;
    line-height: 50px;
    color: #3c763d;
    font-weight: bolder;
    padding: 0 20px;
    z-index: 999;
}
#messageDisplay i {
    padding-right: 5px;
    font-size: 15px;
}
#warnDisplay {
    display: none;
    position: absolute;
    bottom: 10%;
    right: 0;
    width: auto;
    height: 50px;
    background-color: #0072BC;
    line-height: 50px;
    color: #fff;
    font-weight: bolder;
    padding: 0 20px;
    z-index: 999;
}
#warnDisplay i {
    padding-right: 5px;
    font-size: 15px;
}
ul.project_employees_list li, ul.edit_project_employees_list li, ul.activity_list li, ul.dynamic_list li {
    display: inline;
    padding: 0 5px;
}
ul.project_employees_list li i, ul.edit_project_employees_list li i, ul.activity_list li i, ul.dynamic_list li i {
    padding: 0 5px;
    cursor: pointer;
}

.greyBg{
    background: #F3F2F2;
    padding: 20px;
    margin: 20px 0;
}

.padding-bottom-10 {
    padding-bottom: 10px;
}
.navTabsWeek{
    border:none;
}
.navTabsWeek li{
    width: 20%;
    text-align: center;
}
.navTabsWeek li a{
    color: #000;
}
.navTabsWeek li a, .navTabsWeek li.active a{
    border: none;
}
.navTabsWeek li.active a{
    text-decoration: none;
    color: #0072BC;
    border: none;
    //font-weight: bold;
}
.navTabsWeek li:hover a, .navTabsWeek li.active:hover a{
    background: none;
    border: none;
    color: #0072BC;
}
.navTabsWeek li:hover a, .navTabsWeek li:focus a{
    color: #0072BC;
    border: none;
}
.navTabsWeek > li.active > a, .navTabsWeek > li.active > a:hover, .navTabsWeek > li.active > a:focus{
    border: none;
    color: #0072BC;
}
.weekDays{
    text-align: center;
}
.weekDays li{
    padding: 15px 5px 15px 5px;
    text-align: center;
    display: inline-block;
    font-size: 12px;
    vertical-align: text-top;
    width: 100px;
}
.weekDaysCnt li{
    display: inline-block;
    border: 1px solid;
    text-align: center;
    padding: 0;
    //margin: 5px 0;
    margin-bottom:5px;
    padding: 3px 5px;
    font-size: 12px;
    background: #F3F2F2;
    vertical-align: text-top;
    width: 100px;
    cursor: pointer;
}
.weekDaysCnt li.active{
    background: #FFF;
}
.weekDaysCnt li span.greenBox{
   border-color:#000;
   color: #0A0; 
}
.weekDaysCnt li span.redBox{
   border-color:#000;
   color:#A00; 
}

.weekDaysCnt li span.yellowBox {
    border-color: #000;
    /*color: #E5E500;*/
    color:#E87E04;
}

.weekDaysCnt li span.blueBox {
    border-color: #000;
    color: #336ebf;   
}
.notApproveBtn{
    background: #C22233;
    border: 1px solid #C01A2C;
    border-radius: 2px;
    color: #FFF;
    min-width: 140px;
    padding: 3px 0;
    font-weight: bold;
    margin: 5px 0 5px 0;
}
.cancelBtn{
    background: #7B7979;
    border: 1px solid #656263;
    border-radius: 2px;
    color: #FFF;
    min-width: 140px;
    padding: 3px 0;
    font-weight: bold;
    margin: 0px 0 5px 0;
}
.approveBtn{
    background: #4277C0;
    border: 1px solid #336EBF;
    border-radius: 2px;
    color: #FFF;
    min-width: 140px;
    padding: 3px 0;
    font-weight: bold;
}
.modalCnt{
    border-radius: 0;
}
.modalFooter{
    text-align: left;
}
.modalHeader{
    background: #0072BC;
    color: #FFF;
}
.modalHeader h4{
    color: #FFF;
    font-weight: bold;
}
.popupWrap{
    padding: 10px; 
    max-height: 400px;
    overflow: auto;
}
.popupWrap label{
    text-align: left;
}
.popupWrap input, .popupWrap select, .popupWrap textarea{
    border: 1px solid #CCCCCC;
    box-shadow: none;
    border-radius: 0;
}
.timeWrap .form-control{
    display: inline-block;
    /*width: 80%;*/
    padding-left: 5px;
    padding-right: 5px;
}
.empNamePopup{
    display: inline-block;
    padding-right: 20px;
}


@media screen and (max-width: 992px) {
    ul.headerMenu{
        text-align: center;
    }
    .logo{
        text-align: center;
    }
}
@media screen and (max-width: 480px) {
    .deptCnt{
        padding: 10px 0 0px 20px;
    }
    .statusCircle{
        margin-left: 20px;
    }
    .getWeek{
        display: inline-block;
        padding: 10px 0 10px 20px;
    }
    .blueBtn{
        width: 100%;
        display: inline-block;
    }
    .searchWorkPlanButton{
        margin-bottom: 5px;
    }
    ul.headerMenu li{
        display: block;
        border:none;
        color: #2B2724;
        cursor: pointer;
        text-align: left;
        margin: 10px 0;
    }
    .notApproveBtn{
        width: 100%;
    }
    .cancelBtn{
        width: 100%;
    }
    .approveBtn{
        width: 100%;
    }
}

.calendar-icon {
    bottom: 0;
    position: absolute;
    z-index: 2;
    right: 0;
}
.calendar-icon i {
    font-size: 15px;
    padding-right: 5px;
    cursor: pointer;
}
.redCircle {
    color: red;
}
.greenCircle {
    color: green;
}
.yellowCircle {
    color: yellow;
}

.darkBgModalHeader {
    background: #3E3E3F !important;
}
.redBgModalHeader {
    background: #A91F2C !important;
}
#alertDisplay {
    display: none;
    position: fixed;
    bottom: 10%;
    right: 0;
    width: auto;
    height: 50px;
    background-color: #A91F2C;
    line-height: 50px;
    color: #fff;
    font-weight: bolder;
    padding: 0 20px;
    z-index: 999;
}
#alertDisplay i {
    padding-right: 5px;
    font-size: 15px;
}
.workPlanRound{
    border: 1px solid;
    border-radius: 50%;
    display: inline-block;
    font-size: 10px;
    height: 52px;
    text-align: center;
    width: 52px;
}
.workPlanRound p{
    padding-top: 10px;
    font-size: 10px;
}
.workPlanRound p span{
    font-size: 14px;
}
.workPlanRound.green{
    border: 1px solid darkgreen;
}
.workPlanRound.yellow{
    border: 1px solid yellow;
}
.workPlanRound.red{
    border: 1px solid red;
}
.pageNotFoundWrap{
    display: table;
    width: 100%;
    vertical-align: middle;
}
.pageNotFound{
    text-align: center;
    font-family: 'Oswald', sans-serif;
    display: table-cell;
    vertical-align: middle;
    padding-top: 160px;
}
.pageNotFound h1{
    font-size: 180px;
    text-align: center;
    line-height: 180px;
    color: #0072BC;
}
.pageNotFound h2{
    font-size: 3em;
    font-weight: 300;
    text-align: center;
}
.error-class{
    border: 1px solid red;
}
.modal {
    /*position: absolute !important;*/
    overflow-y: scroll !important;
}
.dateInput, .hasDatepicker, .txtInput {
    cursor: pointer;
}

.weekDaysCnt li.redborder{
   background: none repeat scroll 0 0 #fff;
   border: 1px solid #f00 !important;
}

.resetWorkplan, .deleteWorkplan {
    cursor: pointer;
    padding-left: 10px;
    color:#4277c0;
}

.paginate_button {
    margin-right: 15px;
}

.paginate_button:hover {
    cursor: pointer;
}