/* ********** */
div,td{
    font-family: verdana;
    font-size: 11px;
    color: #000000;
}
/* ********** */
div.brandCont{
    width: 100%;
    height: 100%;
    background: url(/images/brand/9b.jpg) no-repeat top center;
}
div#octContainer{
    position: relative;
    margin: 0 auto 0 auto;
    padding: 0;
    width: 100%;
    height: 100%;
    max-width: 1280px;
    /* min-width: 463px;
     min mobile 480px landscape, 300px for portrait, -27px for scroll */
    min-width: 600px;
    /* tablet size */
    text-align: left;
    background: #f2f2f2;
}
div#octFrmTop{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 185px;
}
@media all and (min-width: 701px){
    div.octFrmNav{
        position: absolute;
        top: 185px;
        left: 0;
        right: 0;
        bottom: 0;
        overflow: hidden;
       
        width: 240px;
    }
    div.octFrmDirOn{
        position: absolute;
        top: 185px;
        left: 240px;
        right: 0;
        bottom: 0;
        overflow-x: hidden;
        overflow-y: auto;
        
        width: 275px;
    }
    div.octFrmDirOff{
        display: none
    }
    div.octFrmContWiDir{
        position: absolute;
        top: 185px;
        left: 515px;
        right: 0;
        bottom: 0;
        overflow-x: hidden;
        overflow-y: auto;
        background: #f2f2f2;
    }
    div.octFrmContWoDir{
        position: absolute;
        top: 185px;
        left: 240px;
        right: 0;
        bottom: 0;
        overflow-x: hidden;
        overflow-y: auto;
        background: #f2f2f2;
    }
}
@media all and (max-width: 700px){
    div.octFrmNav{
        position: absolute;
        top: 185px;
        left: 0;
        right: 0;
        /*bottom: 0;
        */
        overflow: hidden;
       
        width: 86px;
    }
    div.octFrmDirOn{
        position: absolute;
        top: 185px;
        left: 86px;
        right: 0;
        /*bottom: 0;
        */
        overflow-x: hidden;
        overflow-y: auto;
      
        width: 275px;
    }
    div.octFrmDirOff{
        display: none
    }
    div.octFrmContWiDir{
        position: absolute;
        top: 185px;
        left: 361px;
        right: 0;
        /*bottom: 0;
        overflow-x: hidden;
        overflow-y: auto;
        */
        background: #f2f2f2;
    }
    div.octFrmContWoDir{
        position: absolute;
        top: 185px;
        left: 86px;
        right: 0;
        /*bottom: 0;
        overflow-x: hidden;
        overflow-y: auto;
        */
        background: #f2f2f2;
    }
}
/* ********** */
/* ********** Top Head */
/* ********** */
div.topHead{
    height: 95px;
    background: #ffffff;
}
@media all and (min-width: 701px){
    div.topLogo{
        float: left;
        width: 160px;
        height: 65px;
        padding: 15px 0 10px 30px;
        text-align: center;
    }
    div.topUser{
        float: right;
        padding: 27px 30px 0 0;
    }
    div.topUserImg{
        float: left;
    }
    div.topUserImg img{
        border-radius: 23px;
        width: 40px;
        height: 40px;
    }
    div.topUserDets{
        float: left;
        padding: 0 0 0 15px;
    }
    div.topUserName{
        padding-top: 3px;
        font-family: Flexo,verdana;
        font-size: 13px;
        color: #00a1e4;
    }
    div.topUserSearch{
        float: left;
        padding: 7px 0 0 50px;
    }
    div.topUserSearch input{
      
        width: 150px;
        height: 25px;
        border: 0;
        border-radius: 10px;
        padding-left: 30px;
    }
}
@media all and (min-width: 401px) and (max-width: 700px){
    div.topLogo{
        float: left;
        width: 160px;
        height: 65px;
        padding: 15px 0 10px 30px;
        text-align: center;
    }
    div.topUser{
        float: right;
        padding: 27px 30px 0 0;
    }
    div.topUserImg{
        float: left;
    }
    div.topUserImg img{
        border-radius: 23px;
        width: 40px;
        height: 40px;
    }
    div.topUserDets{
        float: left;
        padding: 0 0 0 15px;
    }
    div.topUserName{
        padding-top: 3px;
        font-family: Flexo,verdana;
        font-size: 13px;
        color: #00a1e4;
    }
    div.topUserSearch{
        display: none;
    }
}
@media all and (max-width: 400px){
    div.topLogo{
        padding: 5px 0 0 5px;
    }
    div.topLogo img{
        height: 35px;
    }
    div.topUser{
        padding: 0 0 0 5px;
    }
    div.topUserImg{
        float: left;
    }
    div.topUserImg img{
        border-radius: 23px;
        width: 40px;
        height: 40px;
    }
    div.topUserDets{
        float: left;
        padding: 0 0 0 15px;
    }
    div.topUserName{
        padding-top: 3px;
        font-family: Flexo,verdana;
        font-size: 13px;
        color: #00a1e4;
    }
    div.topUserSearch{
        display: none;
    }
    div.topUserSearch input{
    }
}
div.topUserLink{
    padding-top: 5px;
    font-family: Flexo,verdana;
    font-size: 11px;
    color: #000000;
}
a.topUserLink,a.topUserLink:visited,a.topUserLink:active{
    color: #000000;
    text-decoration: none;
}
a.topUserLink:hover{
    color: #00a1e4;
}
/* ********** */
/* ********** Tab */
/* ********** */
div.tabRow{
    line-height: 50px;
    height: 50px;
    background: #424242;
    overflow: hidden;
}
div.tabHorCont{
    float: right;
}
div#tabVerCont{
    display: none;
    position: absolute;
    z-index: 2;
    top: 145px;
    right: 0;
}
div#tabSpace{
    display: block;
    float: right;
    width: 25px;
    height: 50px;
}
div#tabMenu{
    display: none;
    float: right;
}
/* ********** */
a.tabHor,a.tabHor:visited,a.tabHor:active{
    display: block;
    float: left;
    height: 50px;
   
    padding: 0 15px 0 15px;
    font-family: Flexo,verdana;
    font-size: 13px;
    color: #cccccc;
    text-decoration: none;
}
a.tabHor:hover{
   
    color: #ffffff;
}
a.tabHorOn,a.tabHorOn:visited,a.tabHorOn:active,a.tabHorOn:hover{
    display: block;
    float: left;
    height: 50px;
 
    padding: 0 15px 0 15px;
    font-family: Flexo,verdana;
    font-size: 13px;
    color: #ffffff;
    text-decoration: none;
}
/* ********** */
a.tabMenu,a.tabMenu:visited,a.tabMenu:active{
    display: block;
    height: 50px;
    padding: 0 25px 0 15px;
}
a.tabMenu:hover{
    background: #cccccc;
}
/* ********** */
a.tabVer,a.tabVer:visited,a.tabVer:active{
    display: none;
    line-height: 39px;
    padding: 0 75px 0 25px;
    border-bottom: 1px solid #b3b3b3;
   
    font-family: Flexo,verdana;
    font-size: 13px;
    color: #424244;
    text-decoration: none;
}
a.tabVer:hover{
    border-bottom: 1px solid #b3b3b3;
  
}
a.tabVer:last-child{
    border-bottom: 0;
}
/* ********** */
/* ********** Action */
/* ********** */
div.actionRow{
    height: 40px;
    line-height: 40px;
    background: #e6e6e6;
}
div.actionRowFixed{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 40px;
    line-height: 40px;
    background: #e6e6e6;
}
div.actionRowFixedSpace{
    height: 40px;
}
/* ********** */
div#octBc{
    float: left;
}
a.bc1,a.bc1:visited,a.bc1:active{
    display: block;
    float: left;
    height: 40px;
    background: #00a1e4;
    padding: 0 35px 0 35px;
    font-family: Flexo-Bold,verdana;
    font-size: 15px;
    color: #ffffff;
    text-decoration: none;
}
a.bc2,a.bc2:visited,a.bc2:active,a.bc2:hover{
    display: block;
    float: left;
    height: 40px;
    background: #cccccc;
    padding: 0 35px 0 35px;
    font-family: Flexo-Bold,verdana;
    font-size: 15px;
    color: #808080;
    text-decoration: none;
}
div.bc1{
    float: left;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 20px 0 20px 20px;
    border-color: transparent transparent transparent #00a1e4;
    background: #e6e6e6;
}
div.bc1multi{
    float: left;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 20px 0 20px 20px;
    border-color: transparent transparent transparent #00a1e4;
    background: #cccccc;
}
div.bc2{
    float: left;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 20px 0 20px 20px;
    border-color: transparent transparent transparent #cccccc;
}
/* ********** */
@media all and (min-width: 991px){
    div#octRuler{
        float: left;
    }
}
@media all and (max-width: 990px){
    div#octRuler{
        display: none;
    }
}
/* ********** */
div.actionCont{
    float: right;
}
div.actionReport{
    float: left;
    padding-left: 10px;
    font-family: Flexo-Medium,verdana;
    font-size: 13px;
    color: #666666;
}
@media all and (min-width: 601px){
    a#actionAll{
        display: block;
    }
}
@media all and (max-width: 600px){
    a#actionAll{
        display: none;
    }
}
a.actionAllOff,a.actionAllOff:visited,a.actionAllOff:active{
    float: left;
    display: block;
    line-height: 40px;
    padding: 0 0 0 15px;
    background: #e6e6e6;
    font-family: Flexo-Medium,verdana;
    font-size: 13px;
    color: #666666;
    text-decoration: none;
}
a.actionAllOff:hover{
    background: #cccccc;
}
a.actionAllOn,a.actionAllOn:visited,a.actionAllOn:active,a.actionAllOn:hover{
    float: left;
    display: block;
    line-height: 40px;
    padding: 0 0 0 15px;
    background: #cccccc;
    font-family: Flexo-Medium,verdana;
    font-size: 13px;
    color: #666666;
    text-decoration: none;
}
div.actionArrowOff{
    float: left;
    width: 39px;
    height: 40px;
    padding-left: 15px;
    background: #e6e6e6;
    cursor: pointer;
}
div.actionArrowOn{
    float: left;
    width: 39px;
    height: 40px;
    padding-left: 15px;
    background: #cccccc;
    cursor: pointer;
}
div.actionArrowOff div,div.actionArrowOn div{
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 7px 7px 0 7px;
    border-color: #00a1e4 transparent transparent transparent;
    margin-top: 17px;
}
div.actionArrowPf{
    float: left;
    width: 39px;
    cursor: pointer;
}
div.actionArrowPf div{
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 7px 7px 7px;
    border-color: transparent transparent #00a1e4 transparent;
    margin-top: 5px;
}
div#octAction{
    display: none;
    position: absolute;
    z-index: 1;
    top: 185px;
    right: 0;
}
div#octActionFixed{
    display: none;
    position: absolute;
    z-index: 1;
    top: 40px;
    right: 0;
}
div#octActionPf{
    display: none;
    position: absolute;
    z-index: 1;
    bottom: 35px;
    left: 0;
}
a.action,a.action:visited,a.action:active{
    display: block;
    line-height: 40px;
    padding: 0 75px 0 25px;
    border-top: 1px solid #b3b3b3;
    background: url(../../images/aa_off.png) no-repeat center right #cccccc;
    font-family: Flexo,verdana;
    font-size: 13px;
    color: #424244;
    text-decoration: none;
}
a.action:hover{
    border-top: 1px solid #b3b3b3;
    background: url(../../images/aa_on.png) no-repeat center right #b3b3b3;
}
a.actionPf,a.actionPf:visited,a.actionPf:active,a.actionPf:hover{
    float: left;
    padding: 0 15px 0 0;
    font-family: Flexo-Medium,verdana;
    font-size: 13px;
    color: #666666;
    text-decoration: none;
}
div#octActionPf a.action{
    border-top: 0;
    border-bottom: 1px solid #b3b3b3;
}
/* ********** */
/* ********** Nav */
/* ********** */
@media all and (min-width: 701px) and (min-height: 851px){
    a.navHome,a.navHome:visited,a.navHome:active,a.navHandbook,a.navHandbook:visited,a.navHandbook:active,a.navMy,a.navMy:visited,a.navMy:active,a.navTrs,a.navTrs:visited,a.navTrs:active,a.navDirectory,a.navDirectory:visited,a.navDirectory:active,a.navSys,a.navSys:visited,a.navSys:active,a.navRecruit,a.navRecruit:visited,a.navRecruit:active,a.navAdmin,a.navAdmin:visited,a.navAdmin:active,a.navCustom,a.navCustom:visited,a.navCustom:active,a.navMin,a.navMin:visited,a.navMin:active{
        display: block;
        width: 148px;
        /* 234px */
        line-height: 64px;
        padding-left: 86px;
        white-space: nowrap;
        font-family: Flexo-Medium,verdana;
        font-size: 13px;
        color: #cccccc;
        text-decoration: none;
    }
    a.navHome,a.navHome:visited,a.navHome:active{
        background: url(../../images/nav_1.png) no-repeat center left;
    }
    a.navHandbook,a.navHandbook:visited,a.navHandbook:active{
        background: url(../../images/nav_2.png) no-repeat center left;
    }
    a.navMy,a.navMy:visited,a.navMy:active{
        background: url(../../images/nav_3.png) no-repeat center left;
    }
    a.navTrs,a.navTrs:visited,a.navTrs:active{
        background: url(../../images/nav_4.png) no-repeat center left;
    }
    a.navDirectory,a.navDirectory:visited,a.navDirectory:active{
        background: url(../../images/nav_5.png) no-repeat center left;
    }
    a.navSys,a.navSys:visited,a.navSys:active{
        background: url(../../images/nav_6.png) no-repeat center left;
    }
    a.navRecruit,a.navRecruit:visited,a.navRecruit:active{
        background: url(../../images/nav_7.png) no-repeat center left;
    }
    a.navAdmin,a.navAdmin:visited,a.navAdmin:active{
        background: url(../../images/nav_8.png) no-repeat center left;
    }
    a.navCustom,a.navCustom:visited,a.navCustom:active{
        background: url(../../images/nav_9.png) no-repeat center left;
    }
    a.navMin,a.navMin:visited,a.navMin:active{
        background: url(../../images/nav_min.png) no-repeat center left;
    }
    a.navHome:hover{
        color: #ffffff;
        background: url(../../images/nav_1.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    a.navHandbook:hover{
        color: #ffffff;
        background: url(../../images/nav_2.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    a.navMy:hover{
        color: #ffffff;
        background: url(../../images/nav_3.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    a.navTrs:hover{
        color: #ffffff;
        background: url(../../images/nav_4.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    a.navDirectory:hover{
        color: #ffffff;
        background: url(../../images/nav_5.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    a.navSys:hover{
        color: #ffffff;
        background: url(../../images/nav_6.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    a.navRecruit:hover{
        color: #ffffff;
        background: url(../../images/nav_7.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    a.navAdmin:hover{
        color: #ffffff;
        background: url(../../images/nav_8.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    a.navCustom:hover{
        color: #ffffff;
        background: url(../../images/nav_9.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    a.navMin:hover{
        color: #ffffff;
        background: url(../../images/nav_min.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    div.navEnd{
        display: none;
    }
}
@media all and (min-width: 701px) and (max-height: 850px){
    a.navHome,a.navHome:visited,a.navHome:active,a.navHandbook,a.navHandbook:visited,a.navHandbook:active,a.navMy,a.navMy:visited,a.navMy:active,a.navTrs,a.navTrs:visited,a.navTrs:active,a.navDirectory,a.navDirectory:visited,a.navDirectory:active,a.navSys,a.navSys:visited,a.navSys:active,a.navRecruit,a.navRecruit:visited,a.navRecruit:active,a.navAdmin,a.navAdmin:visited,a.navAdmin:active,a.navCustom,a.navCustom:visited,a.navCustom:active,a.navMin,a.navMin:visited,a.navMin:active{
        display: block;
        width: 148px;
        /* 234px */
        line-height: 45px;
        padding-left: 86px;
        white-space: nowrap;
        font-family: Flexo-Medium,verdana;
        font-size: 13px;
        color: #cccccc;
        text-decoration: none;
    }
    a.navHome,a.navHome:visited,a.navHome:active{
        background: url(../../images/nav_1.png) no-repeat center left;
    }
    a.navHandbook,a.navHandbook:visited,a.navHandbook:active{
        background: url(../../images/nav_2.png) no-repeat center left;
    }
    a.navMy,a.navMy:visited,a.navMy:active{
        background: url(../../images/nav_3.png) no-repeat center left;
    }
    a.navTrs,a.navTrs:visited,a.navTrs:active{
        background: url(../../images/nav_4.png) no-repeat center left;
    }
    a.navDirectory,a.navDirectory:visited,a.navDirectory:active{
        background: url(../../images/nav_5.png) no-repeat center left;
    }
    a.navSys,a.navSys:visited,a.navSys:active{
        background: url(../../images/nav_6.png) no-repeat center left;
    }
    a.navRecruit,a.navRecruit:visited,a.navRecruit:active{
        background: url(../../images/nav_7.png) no-repeat center left;
    }
    a.navAdmin,a.navAdmin:visited,a.navAdmin:active{
        background: url(../../images/nav_8.png) no-repeat center left;
    }
    a.navCustom,a.navCustom:visited,a.navCustom:active{
        background: url(../../images/nav_9.png) no-repeat center left;
    }
    a.navMin,a.navMin:visited,a.navMin:active{
        background: url(../../images/nav_min.png) no-repeat center left;
    }
    a.navHome:hover{
        color: #ffffff;
        background: url(../../images/nav_1.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    a.navHandbook:hover{
        color: #ffffff;
        background: url(../../images/nav_2.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    a.navMy:hover{
        color: #ffffff;
        background: url(../../images/nav_3.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    a.navTrs:hover{
        color: #ffffff;
        background: url(../../images/nav_4.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    a.navDirectory:hover{
        color: #ffffff;
        background: url(../../images/nav_5.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    a.navSys:hover{
        color: #ffffff;
        background: url(../../images/nav_6.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    a.navRecruit:hover{
        color: #ffffff;
        background: url(../../images/nav_7.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    a.navAdmin:hover{
        color: #ffffff;
        background: url(../../images/nav_8.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    a.navCustom:hover{
        color: #ffffff;
        background: url(../../images/nav_9.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    a.navMin:hover{
        color: #ffffff;
        background: url(../../images/nav_min.png) no-repeat center left #686869;
        border-right: 6px solid #00a1e4;
    }
    div.navEnd{
        display: none;
    }
}
@media all and (min-width: 701px) and (max-height: 600px){
    a.navHome,a.navHome:visited,a.navHome:active,a.navHandbook,a.navHandbook:visited,a.navHandbook:active,a.navMy,a.navMy:visited,a.navMy:active,a.navTrs,a.navTrs:visited,a.navTrs:active,a.navDirectory,a.navDirectory:visited,a.navDirectory:active,a.navSys,a.navSys:visited,a.navSys:active,a.navRecruit,a.navRecruit:visited,a.navRecruit:active,a.navAdmin,a.navAdmin:visited,a.navAdmin:active,a.navCustom,a.navCustom:visited,a.navCustom:active,a.navMin,a.navMin:visited,a.navMin:active{
        display: block;
        width: 198px;
        /* 234px */
        line-height: 30px;
        padding-left: 36px;
        white-space: nowrap;
        font-family: Flexo-Medium,verdana;
        font-size: 13px;
        color: #cccccc;
        text-decoration: none;
    }
    a.navHome,a.navHome:visited,a.navHome:active{
        background: none;
    }
    a.navHandbook,a.navHandbook:visited,a.navHandbook:active{
        background: none;
    }
    a.navMy,a.navMy:visited,a.navMy:active{
        background: none;
    }
    a.navTrs,a.navTrs:visited,a.navTrs:active{
        background: none;
    }
    a.navDirectory,a.navDirectory:visited,a.navDirectory:active{
        background: none;
    }
    a.navSys,a.navSys:visited,a.navSys:active{
        background: none;
    }
    a.navRecruit,a.navRecruit:visited,a.navRecruit:active{
        background: none;
    }
    a.navAdmin,a.navAdmin:visited,a.navAdmin:active{
        background: none;
    }
    a.navCustom,a.navCustom:visited,a.navCustom:active{
        background: none;
    }
    a.navMin,a.navMin:visited,a.navMin:active{
        background: none;
    }
    a.navHome:hover{
        color: #ffffff;
        background: none;
        border-right: 6px solid #00a1e4;
    }
    a.navHandbook:hover{
        color: #ffffff;
        background: none;
        border-right: 6px solid #00a1e4;
    }
    a.navMy:hover{
        color: #ffffff;
        background: none;
        border-right: 6px solid #00a1e4;
    }
    a.navTrs:hover{
        color: #ffffff;
        background: none;
        border-right: 6px solid #00a1e4;
    }
    a.navDirectory:hover{
        color: #ffffff;
        background: none;
        border-right: 6px solid #00a1e4;
    }
    a.navSys:hover{
        color: #ffffff;
        background: none;
        border-right: 6px solid #00a1e4;
    }
    a.navRecruit:hover{
        color: #ffffff;
        background: none;
        border-right: 6px solid #00a1e4;
    }
    a.navAdmin:hover{
        color: #ffffff;
        background: none;
        border-right: 6px solid #00a1e4;
    }
    a.navCustom:hover{
        color: #ffffff;
        background: none;
        border-right: 6px solid #00a1e4;
    }
    a.navMin:hover{
        color: #ffffff;
        background: none;
        border-right: 6px solid #00a1e4;
    }
    div.navEnd{
        display: none;
    }
}
@media all and (max-width: 700px){
    a.navHome,a.navHome:visited,a.navHome:active,a.navHandbook,a.navHandbook:visited,a.navHandbook:active,a.navMy,a.navMy:visited,a.navMy:active,a.navTrs,a.navTrs:visited,a.navTrs:active,a.navDirectory,a.navDirectory:visited,a.navDirectory:active,a.navSys,a.navSys:visited,a.navSys:active,a.navRecruit,a.navRecruit:visited,a.navRecruit:active,a.navAdmin,a.navAdmin:visited,a.navAdmin:active,a.navCustom,a.navCustom:visited,a.navCustom:active,a.navMin,a.navMin:visited,a.navMin:active{
        display: block;
        width: 80px;
        /* 234px */
        line-height: 64px;
        white-space: nowrap;
        text-indent: 100%;
        color: #cccccc;
    }
   
   
   
}



div.contPad{
    /* 1040px width with no scroll, - 60 padding = 980px. - 20 for scroll = 960px */
    padding: 0 30px 30px 30px;
}
div.contPadHome{
    height: 30px;
}
div.contPhoto{
    float: left;
    padding: 14px 10px 0 0;
}
div.contPhoto img{
    border-radius: 23px;
    width: 40px;
    height: 40px;
}
div.contTitle{
    float: left;
    line-height: 35px;
    min-height: 44px;
    padding-top: 20px;
    font-family: Flexo-Thin,verdana;
    font-size: 22px;
    color: #424244;
}
/* ********** */
/* ********** Scroll */
/* ********** */
div#octFrmDir::-webkit-scrollbar{
     width: 15px;
}
div#octFrmDir::-webkit-scrollbar-track{
     background-color: #1a1a1a;
}
div#octFrmDir::-webkit-scrollbar-thumb{
     background-color: #484848;
    border-radius: 10px;
    border: 4px solid #1a1a1a;
}
div#octFrmDir::-webkit-scrollbar-thumb:hover{
    background-color: #00a1e4;
    border-radius: 10px;
    border: 4px solid #1a1a1a;
}
div#octFrmDir{
    scrollbar-base-color: #00a1e4;
    scrollbar-3dlight-color: #1a1a1a;
    scrollbar-highlight-color: #1a1a1a;
    scrollbar-track-color: #1a1a1a;
    scrollbar-arrow-color: #1a1a1a;
    scrollbar-shadow-color: #1a1a1a;
    scrollbar-dark-shadow-color: #1a1a1a;
}
/* ********** */
/* ********** Transistion */
/* ********** */
div.octFrmNav,div.octFrmDirOn,div.octFrmDirOff,div.octFrmContWiDir,div.octFrmContWoDir{
    -webkit-transition: all 0.2s ease-in;
    -moz-transition: all 0.2s ease-in;
    -o-transition: all 0.2s ease-in;
    transition: all 0.2s ease-in;
}
/* ********** */
a.navHome,a.navHandbook,a.navMy,a.navTrs,a.navDirectory,a.navSys,a.navRecruit,a.navAdmin,a.navCustom,a.navMin,a.navHome,a.navHandbook,a.navMy,a.navTrs,a.navDirectory,a.navSys,a.navRecruit,a.navAdmin,a.navCustom,a.navMin{
    -webkit-transition: line-height 0.2s ease-in;
    -moz-transition: line-height 0.2s ease-in;
    -o-transition: line-height 0.2s ease-in;
    transition: line-height 0.2s ease-in;
}
/* ********** */
/* ********** Form */
/* ********** */
input,select,textarea{
    font-family: Flexo-Regular,verdana;
    font-size: 13px;
    color: #424244;
}
textarea{
    white-space: pre-wrap;
    /* fixed IE 11 nowrap issue */
}
/* ********** */
div.pfCurrency{
    width: 30px;
    height: 27px;
    line-height: 27px;
    margin-right: 4px;
    background: #cccccc;
    box-shadow: 2px 2px 0 0 #e6e6e6;
    font-family: Flexo-Regular,verdana;
    font-size: 13px;
    color: #808080;
    text-align: center;
}
.dpFix{
    width: 30px !important;
    text-align: right;
}
.dpFix img{
    width: 24px;
    height: 23px;
    background: #00a1e4;
}
td.pfDateTimeSpacer{
    width: 5px;
}
input.readonly,input.ro,input.pfCurrencyReadonly,textarea.readonly{
    background: #cccccc;
}
/* ********** */
div.pfs{
    display: none;
}
div.pfe,div.pfi{
    padding-bottom: 5px;
}
div.pfe div{
    font-family: Flexo-Bold,arial;
    font-size: 19px;
    color: #ef4338;
    padding: 0 0 5px 0;
}
div.pfi div{
    font-family: Flexo-Bold,arial;
    font-size: 19px;
    color: #00a1e4;
    padding: 0 0 5px 0;
}
div.pfs div{
    font-family: Flexo-Bold,arial;
    font-size: 19px;
    color: #98ca3c;
    padding: 0 0 5px 0;
}
div.pfIcon{
    float: right;
    cursor: pointer;
    margin-left: 5px;
}
div.pfIcon2{
    float: right;
    width: 19px;
    height: 19px;
    border-radius: 20px;
    background: #00a1e4;
    cursor: pointer;
    margin-left: 5px;
}
div.pfIcon2 img{
    padding: 2px;
}
td.pfSpinner{
    width: 26px;
    text-align: right;
    vertical-align: top;
}
/* ********** */
td.pfm{
    width: 25px;
    background: none;
}
td.pfmOn{
    width: 25px;
    background: url(/images/icon_req.png) no-repeat top left;
}
/* ********** */
@media all and (min-width: 1280px){
    td.pfl,div.pfl{
        float: left;
        padding-bottom: 9px;
        font-family: Flexo-Regular,verdana;
        font-size: 13px;
        color: #808080;
    }
}
@media all and (min-width: 701px) and (max-width: 1279px){
    td.pfl,div.pfl{
        float: left;
        padding-bottom: 9px;
        font-family: Flexo-Regular,verdana;
        font-size: 13px;
        color: #808080;
    }
}
@media all and (max-width: 700px){
    td.pfl,div.pfl{
        float: left;
        padding-bottom: 9px;
        min-width: 150px;
        font-family: Flexo-Regular,verdana;
        font-size: 13px;
        color: #808080;
    }
}
/* ********** */
td.pfr{
    float: right;
    padding-bottom: 9px;
    font-family: Flexo-Regular,verdana;
    font-size: 13px;
    color: #808080;
}
td.pfl a{
    color: #00a1e4;
    text-decoration: none;
    font-weight: normal;
}
td.pft,div.pft,a.pft{
    font-family: Flexo-Regular,verdana;
    font-size: 13px;
    color: #808080;
    /*white-space: nowrap;
    */
}
body.win td.pfl{
    min-width: auto;
}
/* ********** */
input.pf:not([type="file"]),input.readonly:not([type="file"]),input.ro:not([type="file"]){
    width: 200px;
    height: 25px;
    padding: 0 10px 0 10px;
    border: 1px solid #e6e6e6;
    box-shadow: 2px 2px 0 0 #e6e6e6;
}
input.pf[type="file"]{
    width: 222px;
    height: 25px;
    box-shadow: 2px 2px 0 0 #e6e6e6;
}
input.pfCurrency,input.pfCurrencyReadonly{
    width: 166px;
    height: 25px;
    padding: 0 10px 0 10px;
    border: 1px solid #e6e6e6;
    box-shadow: 2px 2px 0 0 #e6e6e6;
}
input.pfDate{
    width: 170px;
    height: 25px;
    padding: 0 10px 0 10px;
    border: 1px solid #e6e6e6;
    box-shadow: 2px 2px 0 0 #e6e6e6;
}
input.pfDateSmall{
    width: 70px;
    height: 25px;
    padding: 0 5px 0 5px;
    border: 1px solid #e6e6e6;
    box-shadow: 2px 2px 0 0 #e6e6e6;
}
input.pfDateTime{
    width: 88px;
    height: 25px;
    padding: 0 10px 0 10px;
    border: 1px solid #e6e6e6;
    box-shadow: 2px 2px 0 0 #e6e6e6;
}
input.pfTime{
    width: 55px;
    height: 25px;
    padding: 0 10px 0 10px;
    border: 1px solid #e6e6e6;
    box-shadow: 2px 2px 0 0 #e6e6e6;
}
input.pfSpinner{
    width: 148px;
    height: 25px;
    padding: 0 10px 0 10px;
    border: 1px solid #e6e6e6;
    box-shadow: 2px 2px 0 0 #e6e6e6;
}
select.pf{
    width: 222px;
    height: 25px;
    padding: 0 0 0 10px;
    border: 1px solid #e6e6e6;
    box-shadow: 2px 2px 0 0 #e6e6e6;
    background: #f1f1f1;
}
select.auto{
    width: auto;
}
textarea.pf,textarea.readonly{
    width: 200px;
    height: 85px;
    padding: 10px;
    border: 1px solid #e6e6e6;
    box-shadow: 2px 2px 0 0 #e6e6e6;
}
/* ********** */
textarea.homeCommHtml{
    width: 98%;
    height: 100px !important;
    font-family: courier;
    font-size: 13px;
}
/* ********** */
div.pfMultiContainer{
    min-width: 222px;
}
div.pfMultiIn1{
    overflow: auto;
}
div.pfMultiIn2{
}
div.pfMulti{
    padding: 3px;
    margin-bottom: 1px;
    cursor: pointer;
}
/* ********** */
div.pfBoxList{
    float: left;
    margin: 0 4px 0 0;
}
div.pfBoxListB{
    float: left;
}
div.pfBoxListT{
    float: left;
    padding: 4px 15px 0 5px;
    color: #808080;
}
/* ********** */
/* ********** Buttons */
/* ********** */
div.btnCont{
    float: right;
    padding: 13px 0 15px 0;
}
a.btn,a.btn:visited,a.btn:active{
    display: block;
    float: left;
    min-width: 75px;
    /*115*/
    height: 35px;
    line-height: 35px;
    padding: 0 20px 0 20px;
    margin: 1px 0 0 1px;
    background: #00a1e4;
    font-family: Flexo-Regular,verdana;
    font-size: 13px;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
}
a.btn:hover{
    color: #cccccc;
    background: #424242;
}
a.btnSave,a.btnSave:visited,a.btnSave:active,a.btnSave:hover{
    display: block;
    float: left;
    min-width: 75px;
    /*115*/
    height: 35px;
    line-height: 35px;
    padding: 0 20px 0 20px;
    margin: 1px 0 0 1px;
    background: #99ca3c;
    font-family: Flexo-Regular,verdana;
    font-size: 13px;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
}
th.btn,td.btn{
    min-width: 26px !important;
    text-align: center;
    font-weight: normal;
    padding-right: 5px !important;
    padding-left: 5px !important;
    /*padding: 0 5px 0 5px !important;
    */
}
td.btn{
    cursor: pointer;
}
/* ********** */
/* ********** Pop-Up Window */
/* ********** */
div.winDiv{
    display: none;
    position: fixed;
    top: 25px;
    left: 50%;
    background: green;
}
div.winMain{
    padding: 30px;
    background: #f2f2f2;
}
div.bar{
    height: 50px;
    white-space: nowrap;
    overflow: hidden;
}
div.barMove{
    cursor: move;
}
div.barIn{
}
div.barTxt{
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     -khtml-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
    font-family: Flexo-Thin,verdana;
    font-size: 22px;
    color: #424244;
}
div.barTxtSave{
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     -khtml-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
    font-family: Flexo-Thin,verdana;
    font-size: 22px;
    color: #424244;
}
div.barIco{
}
div.winBody{
    padding: 10px;
    background: #ffffff;
    /* iOSoverflow: auto;
    -webkit-overflow-scrolling: touch;
    */
}
div.winBtn 
/* height: 66px */
{
    float: right;
    padding-top: 30px;
}
td.winIcon,td.winIcon2{
    vertical-align: bottom;
}
/* ********** */
div.winBdr{
    height: 50px;
}
table.winBdr{
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    background: -webkit-linear-gradient(rgba(255,255,255,0),rgba(255,255,255,1));
    /*Safari 5.1-6*/
    background: -o-linear-gradient(rgba(255,255,255,0),rgba(255,255,255,1));
    /*Opera 11.1-12*/
    background: -moz-linear-gradient(,rgba(255,255,255,0),rgba(255,255,255,1));
    /*Fx 3.6-15*/
    background: linear-gradient(rgba(255,255,255,0),rgba(255,255,255,1));
    /*Standard*/
}
table.winBdr td{
    padding-top: 9px;
}
/* ********** */
/* ********** Conversion to new UI */
/* ********** */
@media all and (min-width: 1280px){
    div.areaBlock{
        float: left;
        width: 420px;
        max-height: 600px;
        background: #ffffff;
        padding: 25px;
        margin: 0 0 20px 0;
        box-shadow: 5px 5px 0 0 #e6e6e6;
    }
    div.areaBlock:nth-child(even){
        float: right;
        /*background: pink;
        */
    }
    div.areaBlock2{
        background: #ffffff;
        padding: 25px;
        margin: 0 0 20px 0;
        box-shadow: 5px 5px 0 0 #e6e6e6;
    }
    div.areaRow{
        display: table-row;
    }
    div.areaRowBlock{
        display: block;
    }
    div.areaRowSpace{
        display: table-row;
        height: 25px;
    }
    div.areaRowSpaceHide{
        display: none;
    }
    div.areaCell{
        display: table-cell;
        width: 420px;
        background: #ffffff;
        padding: 25px;
        box-shadow: 5px 5px 0 0 #e6e6e6;
    }
    div.areaCellBlock{
        background: #ffffff;
        padding: 25px;
        margin: 0 0 20px 0;
        box-shadow: 5px 5px 0 0 #e6e6e6;
    }
    div.areaCellSpace{
        display: table-cell;
        width: 25px;
    }
    div.areaCellSpaceHide{
        display: none;
    }
}
@media all and (max-width: 1279px){
    div.areaBlock,div.areaBlock2,div.areaCell,div.areaCellBlock{
        background: #ffffff;
        padding: 25px;
        margin: 0 0 20px 0;
        box-shadow: 5px 5px 0 0 #e6e6e6;
    }
    div.areaRow,div.areaRowBlock{
        dislay: block;
    }
    div.areaRowSpace,div.areaRowSpaceHide{
        display: none;
    }
    div.areaCellSpace,div.areaCellSpaceHide{
        display: none;
    }
}
div.area{
    background: #ffffff;
    padding: 25px;
    margin: 0 0 20px 0;
    box-shadow: 5px 5px 0 0 #e6e6e6;
}
div.areaFlex{
    display: flex;
    flex-wrap: wrap;
}
div.areaFlex div.area{
    margin-right: 10px;
}
div.flexFill{
     flex-basis: 100%;
}
/* ********** */
/* ********** Out */
/* ********** */
body.out{
}
@media all and (min-width: 811px){
    div.outBox{
        position: absolute;
        top: 79px;
        left: 50%;
        margin-left: -400px;
        width: 800px;
        min-height: 448px;
        background: url(/images/out/box.jpg) no-repeat top right;
    }
    div.outBoxSbv{
        position: absolute;
        top: 79px;
        left: 50%;
        margin-left: -400px;
        width: 800px;
        min-height: 448px;
        background: url(/images/out/box_sbv.jpg) no-repeat top right;
    }
    div.outBoxIn{
        padding: 130px 59px 0 478px;
    }
    div.outShadow{
        position: absolute;
        top: 527px;
        left: 50%;
        margin-left: -400px;
        width: 800px;
        height: 90px;
        line-height: 90px;
        background: url(/images/out/shadow.jpg) no-repeat top right;
        font-family: Flexo,verdana;
        font-size: 15px;
        color: #cc0000;
        text-align: center;
    }
    div.outApp{
        position: absolute;
        bottom: 8px;
        left: 10px;
    }
}
@media all and (max-width: 810px){
    div.outBox{
        position: absolute;
        top: 10px;
        left: 50%;
        margin-left: -150px;
        width: 300px;
        min-height: 448px;
        background: url(/images/out/box.jpg) no-repeat top right;
        border-radius: 10px;
    }
    div.outBoxSbv{
        position: absolute;
        top: 10px;
        left: 50%;
        margin-left: -150px;
        width: 300px;
        min-height: 448px;
        background: url(/images/out/box_sbv.jpg) no-repeat top right;
        border-radius: 10px;
    }
    div.outBoxIn{
        padding: 130px 15px 0 15px;
    }
    div.outShadow{
        display: none;
    }
    div.outApp{
        position: absolute;
        bottom: 8px;
        right: 10px;
    }
}
div.outTitle{
    font-family: Flexo-Demi,arial;
    font-size: 16pt;
    color: #ffffff;
}
div.outTitle2{
    font-family: Flexo-Demi,arial;
    font-size: 16pt;
    color: #000000;
}
div.outSplit{
    height: 35px;
    background: url(/images/out/split.gif) repeat-x center left
}
div.outText{
    font-family: Flexo-Regular,arial;
    font-size: 13px;
    color: #ffffff;
    height: 20px;
}
div.outText2{
    font-family: Flexo-Regular,arial;
    font-size: 13px;
    color: #000000;
    height: 20px;
}
div.outField{
    height: 40px;
}
div.outField input,div.outField select{
    border: 1px solid #f2f2f2;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background: #ffffff;
    height: 18px;
}
div.outField input{
    width: 263px;
    height: 25px;
    border: 0;
    background: #ffffff;
    padding-left: 5px;
}
div.outField select{
    width: auto;
    height: 25px;
    border: 0;
    background: #ffffff;
}
div.outField label{
    color: #ffffff;
}
div.outBtn{
    padding: 10px 0 10px 0;
}
input.outLogin{
    width: 124px;
    height: 30px;
    outline: 0;
    background: none;
    -moz-border-radius: 0;
    border-radius: 0;
    border: 0;
}
a.out,a.out:visited,a.out:active,a.out:hover{
    font-family: Flexo-Regular,arial;
    font-size: 13px;
    color: #ffffff;
}
a.out2,a.out2:visited,a.out2:active,a.out2:hover{
    font-family: Flexo-Regular,arial;
    font-size: 13px;
    color: #000000;
}
div#outPasswordFields{
    display: none;
}
div.outLogo{
    display: none;
}
/* ********** */
/* ********** Listview */
/* ********** */
div#lvContainer,div.bckWhite{
    background: #ffffff;
}
table.lvTable,table.oct{
    width: 100%;
}
table.lvTable th,table.oct th.curve,table.oct th.curveLeft,table.oct th.curveRight,table.ui-table-columntoggle th{
    height: 35px;
    line-height: 35px;
    padding: 0 10px 0 10px;
    font-family: Flexo-Medium,verdana;
    font-size: 14px;
    font-weight: normal;
    color: #00a1e4;
    text-align: left;
    white-space: nowrap;
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     -khtml-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
}
table.lvTable th,table.ui-table-columntoggle th{
    border-right: 1px solid #d9d9d9;
}
table.lvTable th.lvTHasc{
    color: #ffffff;
    background: url(/images/lv_down.png) no-repeat center right #00a1e4;
    padding: 0 35px 0 10px;
}
table.lvTable th.lvTHdsc{
    color: #ffffff;
    background: url(/images/lv_up.png) no-repeat center right #00a1e4;
    padding: 0 35px 0 10px;
}
table.lvTable th.lvTDheadOn 
/* for report heading */
{
    padding: 0 10px 0 10px;
}
table.lvTable td{
    padding: 10px;
}
table.lvTable td table td{
    padding: 0;
}
/* ********** */
table.ui-table-columntoggle tr{
    height: auto;
    line-height: auto;
}
table.ui-table-columntoggle td{
    padding: 10px;
}
/* ********** */
tr.lvTRodd,tr.lvTR{
    background: #f7f7f7;
}
tr.lvTReven{
    background: #ffffff;
}
tr.lvTRon,tr.lvTRon td.lvTDodd,tr.lvTRon td.lvTDeven{
    color: #424244;
    background: #cccccc;
    cursor: pointer;
}
/* ********** */
tr.lvTRodd td,tr.lvTRodd td div,tr.lvTR td{
    color: #808080;
    background: #f7f7f7;
    /* removed because of lvAction issue border-right: 1px solid #d9d9d9;
     */
}
tr.lvTReven td,tr.lvTReven td div{
    color: #808080;
    background: #ffffff;
    /* removed because of lvAction issue border-right: 1px solid #d9d9d9;
     */
}
tr.lvTRon td,tr.lvTRon td div{
    color: #424244 !important;
    background: #cccccc;
    /* removed because of lvAction issue border-right: 1px solid #d9d9d9;
     */
}
/* ********** */
td.lvTDodd,td.rowOdd,td.lvTD,div.rowOdd{
    padding: 10px;
    color: #808080;
    background: #f7f7f7;
    border-right: 1px solid #d9d9d9;
}
td.lvTDeven,td.rowEven,div.rowEven{
    padding: 10px;
    color: #808080;
    background: #ffffff;
    border-right: 1px solid #d9d9d9;
}
td.lvTDon,td.rowOn,div.rowOn{
    padding: 10px;
    color: #424244 !important;
    background: #cccccc;
    border-right: 1px solid #d9d9d9;
    cursor: pointer;
}
/* ********** */
div.rowOdd div{
    color: #808080;
}
div.rowEven div{
    color: #808080;
}
div.rowOn div{
    color: #424244;
}
/* ********** */
tr.lvTRsub,tr.lvTRtotal{
    background: #cccccc;
}
tr.lvTRsub td,tr.lvTRsub div,tr.lvTRtotal td,tr.lvTRtotal div,{
    color: #424244;
    font-weight: bold;
}
/* ********** */
table.oct td{
    padding: 5px 0 5px 10px;
    border-top: 1px solid #d9d9d9;
    font-family: Flexo-Regular,verdana;
    font-size: 13px;
    color: #808080;
}
/* ********** */
tr.lvTRodd td div,{
    color: #808080;
}
tr.lvTReven td div{
    color: #808080;
}
tr.lvTRon td div{
    color: #424244;
}
/* ********** VMS legacy */
.main_table_odd{
    color: #808080;
    background: #f7f7f7;
}
.main_table_even{
    color: #808080;
    background: #ffffff;
}
.main_table_on{
    color: #424244;
    background: #cccccc;
}
/* ********** */
td.lvAction{
    width: 26px !important;
    padding-right: 5px !important;
    padding-left: 5px !important;
}
div.lvAction{
    width: 14px;
    height: 7px;
    margin: auto;
}
div.lvAction div{
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 7px 7px 0 7px;
    border-color: #00a1e4 transparent transparent transparent;
    margin-top: 5px;
}
div#lvActionContainer{
    display: none;
    position: absolute;
}
/* ********** */
/* ********** Load */
/* ********** */
div.load{
    position: fixed;
    background: url(../../images/load.gif) no-repeat center center #ffffff;
    border-radius: 25px;
    margin: 5px;
    padding: 25px;
}
div#load1{
    display: none;
    position: fixed;
    top: 0;
    right: 0%;
    bottom: 0%;
    left: 0;
    background: url(/images/load_alpha_70.png);
}
div#load2{
    display: none;
    position: fixed;
    top: 0;
    right: 0%;
    bottom: 0%;
    left: 0;
}
div.load3{
    position: fixed;
    top: 0;
    right: 0%;
    bottom: 0%;
    left: 0;
    background: url(/images/load.png) no-repeat center center;
}
div.load4{
    position: fixed;
    top: 0;
    right: 0%;
    bottom: 0%;
    left: 0;
    background: url(/images/load.gif) no-repeat center center;
}
div#loadWin{
    display: block;
    position: fixed;
    top: 0;
    right: 0%;
    bottom: 0%;
    left: 0;
    background: url(/images/load_alpha_30.png);
}
/* ********** */
/* ********** Utils */
/* ********** */
a{
    outline: 0;
}
form{
    padding: 0;
    margin: 0;
}
div.fl{
    float: left;
}
div.fr{
    float: right;
}
div.cb{
    clear: both;
}
img,iframe{
    border: 0;
}
.ar{
    text-align: right;
}
.tar{
     margin: 0 0 0 auto;
}
.ac{
    text-align: center;
}
.tac{
     margin: 0 auto 0 auto;
}
.w100,table.pf{
    width: 100%;
}
table{
    border: 0;
    border-collapse: collapse;
}
table tr td{
    padding: 0;
}
.w5{
    width: 5px;
}
.w10{
    width: 10px;
}
.w20{
    width: 20px;
}
.w50{
    width: 50%;
}
.h5{
    height: 5px;
}
.h10{
    height: 10px;
}
.h20{
    height: 20px;
}
.vat{
    vertical-align: top;
}
td.btn{
    width: 20px;
    text-align: center;
}
.hand{
    cursor: pointer;
}
.hide{
    display: none;
}
/* ********** */
/* ********** Text */
/* ********** */
.txtTitle{
    font-family: Flexo-Thin,verdana;
    font-size: 22px;
    color: #424244;
}
.txtSubTitle{
    font-family: Flexo-Thin,verdana;
    font-size: 17px;
    color: #424244;
}
.txtBold{
    font-weight: bold;
}
/* ********** */
/* Expand/Collpapse */
/* ********** */
div.ecBar{
    background: #ffffff;
    box-shadow: 5px 5px 0 0 #e6e6e6;
    margin-bottom: 10px;
    cursor: pointer;
}
div.ecBarOn{
    background: #cccccc;
    box-shadow: 5px 5px 0 0 #e6e6e6;
    margin-bottom: 10px;
    cursor: pointer;
}
div.ecBarSave{
    background: #99ca3c;
    box-shadow: 5px 5px 0 0 #e6e6e6;
    margin-bottom: 10px;
    cursor: pointer;
}
div.ecAll{
    background: #ffffff;
    padding: 10px;
    margin-bottom: 10px;
}
table.ecBar{
    width: 100%;
}
table.ecBar td.r{
    width: 19px;
    padding-right: 20px;
}
table.ecBar td.l,table.ecBarOn td.l,table.ecBarSave td.l
/*,table.ecBar td.r,table.ecBarOn td.r,table.ecBarSave td.r*/
{
    display: none;
}
div.ecBar table.ecBar td.c{
    height: 38px;
    padding: 0 0 0 20px;
    font-family: Flexo-Regular,arial;
    font-size: 13px;
    color: #424244;
}
div.ecBarOn table.ecBar td.c{
    height: 38px;
    padding: 0 0 0 20px;
    font-family: Flexo-Regular,arial;
    font-size: 13px;
    color: #424244;
}
table.ecBarSave td.c{
    height: 38px;
    padding: 0 0 0 20px;
    font-family: Flexo-Regular,arial;
    font-size: 13px;
    color: #ffffff;
}
/* ********** */
/* Payroll Tab */
/* ********** */
div.payrollProcess{
    float: right;
    padding: 0 20px 0 20px;
    font-family: Flexo-Thin,verdana;
    font-size: 22px;
    color: #ef4338;
}
div.payrollLogo{
    float: right;
    background: #ffffff;
    border-radius: 5px;
    padding: 5px;
}
/* ********** */
/* Directory Search */
/* ********** */
div.directoryAlpha,div.directoryAlphaOn{
    float: left;
    width: 20px;
    cursor: pointer;
    font-family: Flexo-Regular,verdana;
    font-size: 13px;
    color: #666666;
    font-weight: normal;
    text-align: center;
}
div.dirPad{
    width: 100%;
    /* 275 but scroll bar */
    padding: 30px 0 0 0;
}
input.dir{
    width: 200px;
    /* 210 */
    height: 25px;
    border: 0;
    background: #ffffff;
    border-radius: 12px;
    padding: 0 0 0 10px;
}
select.dir{
    width: 210px;
    height: 25px;
    border: 0;
    background: #ffffff;
    padding: 0 0 0 10px;
}
a.dir,a.dir:visited,a.dir:active,a.dir:hover{
    font-family: Flexo-Medium,verdana;
    font-size: 13px;
    color: #999999;
    text-decoration: none;
}
div.dirl{
    width: 210px;
    padding-bottom: 5px;
    margin: auto;
    font-family: Flexo-Medium,verdana;
    font-size: 13px;
    color: #999999;
}
div.dirf{
    width: 210px;
    padding-bottom: 15px;
    margin: auto;
}
/* ********** */
/* Directory Search Results */
/* ********** */
div.dirEmpSep{
    line-height: 30px;
    background: #464648;
    padding-left: 25px;
    cursor: pointer;
    font-family: Flexo-Medium,verdana;
    font-size: 14px;
    color: #ffffff;
}
div.dirEmpFirst{
    position: relative;
    padding: 15px 0 15px 0;
    border-right: 7px solid #313131;
}
div.dirEmp{
    position: relative;
    padding: 15px 0 15px 0;
    border-right: 7px solid #313131;
    background: url(../../images/dir_sep.png) no-repeat top left;
}
div.dirEmpOn{
    position: relative;
    padding: 15px 0 15px 0;
    border-right: 7px solid #00a1e4;
    background: #5a5a5c;
    cursor: pointer;
}
div.dirEmpL{
    float: left;
    width: 50px;
    height: 60px;
    margin-left: 10px;
}
div.dirEmpL img{
    border-radius: 23px;
}
div.dirEmpR{
    float: left;
}
div.dirEmp1{
    overflow: hidden;
    white-space: nowrap;
    font-family: Flexo-Demi,verdana;
    font-size: 14px;
    color: #cccccc;
}
div.dirEmp2{
    overflow: hidden;
    white-space: nowrap;
    padding-top: 5px;
    font-family: Flexo-Regular,verdana;
    font-size: 14px;
    color: #cccccc;
}
div.dirEmp3{
    display: none;
    position: absolute;
    top: 5px;
    right: 5px;
}
div.dirEmpOn:hover div.dirEmp3{
    display: block;
}
div.dirEmpOn:hover div{
    color: #ffffff;
}
div.dirEmp4{
    position: absolute;
    bottom: 10px;
    left: 20px;
}
/* ********** */
/* Directory Tree */
/* ********** */
div.dirTree{
    margin: 15px 5px 0 5px;
    cursor: pointer;
}
div.dirTree td{
    white-space: nowrap;
    font-family: verdana;
    font-size: 11px;
    color: #cccccc;
}
div.dirTree:hover td{
    white-space: nowrap;
    font-family: verdana;
    font-size: 11px;
    color: #ffffff;
}
/* ********** */
/* Directory Detail */
/* ********** */
div.dirDetDiv{
    height: 1px;
    background: #d9d9d9;
    margin: 10px 0 25px 0;
}
div.dirDetPhoto{
    float: left;
    width: 175px;
    height: 140px
}
div.dirDetPhoto img{
    border-radius: 62px;
}
div.dirDet1{
    padding: 35px 0 10px 0;
    font-family: Flexo-Bold,verdana;
    font-size: 18px;
    color: #424244;
}
div.dirDet2{
    font-family: Flexo-Regular,verdana;
    font-size: 14px;
    color: #424244;
}
@media all and (min-width: 981px){
    div.dirDetL{
        float: left;
        min-width: 175px;
        height: 30px;
        font-family: Flexo-Regular,verdana;
        font-size: 14px;
        color: #808080;
    }
    div.dirDetR{
        float: left;
        height: 30px;
        font-family: Flexo-Regular,verdana;
        font-size: 14px;
        color: #424244;
    }
}
@media all and (max-width: 980px){
    div.dirDetL{
        height: 30px;
        font-family: Flexo-Regular,verdana;
        font-size: 14px;
        color: #808080;
    }
    div.dirDetR{
        height: 30px;
        padding-bottom: 10px;
        font-family: Flexo-Regular,verdana;
        font-size: 14px;
        color: #424244;
    }
}
div.dirDetBio{
    white-space: normal;
    line-height: 25px;
}
a.oct,a.oct:visited,a.oct:active,a.oct:hover,a.dirDet,a.dirDet:visited,a.dirDet:active,a.dirDet:hover{
    color: #00a1e4;
    text-decoration: none;
}
@media all and (min-width: 1101px){
}
@media all and (min-width: 1001px) and (max-width: 1100px){
    .dirRem2{
        display: none;
    }
}
@media all and (max-width: 1000px){
    .dirRem1{
        display: none;
    }
    .dirRem2{
        display: none;
    }
}
/* ********** */
/* Directory Recent */
/* ********** */
div#RecentEmployeeList{
    display: none;
    position: absolute;
    top: 0;
    left: 0;
}
/* ********** */
/* Employee Selector */
/* ********** */
div.empSelHead{
    line-height: 25px;
    font-family: Flexo-Medium,verdana;
    font-size: 14px;
    color: #00a1e4;
}
/* ********** */
/* Absence Tab */
/* ********** */
@media all and (min-width: 1051px){
    div.abTotalL{
        float: left;
        width: 26%;
        background: #ffffff;
        padding: 25px;
        margin: 0 0 20px 0;
        box-shadow: 5px 5px 0 0 #e6e6e6;
    }
    div.abTotalC{
        float: none;
        width: 26%;
        margin: auto;
        overflow: hidden;
        background: #ffffff;
        padding: 25px;
        margin: 0 auto 20px auto;
        box-shadow: 5px 5px 0 0 #e6e6e6;
    }
    div.abTotalR{
        float: right;
        width: 26%;
        background: #ffffff;
        padding: 25px;
        margin: 0 0 20px 0;
        box-shadow: 5px 5px 0 0 #e6e6e6;
    }
    tr.abTtlRowHide{
        display: table-row;
    }
}
@media all and (max-width: 1050px){
    div.abTotalL,div.abTotalC,div.abTotalR{
        background: #ffffff;
        padding: 25px;
        margin: 0 0 20px 0;
        box-shadow: 5px 5px 0 0 #e6e6e6;
    }
    div.abTotal{
        display: flex;
        flex-direction: column;
    }
    div.abTotal div.abTotalL{
        order: 1;
    }
    div.abTotal div.abTotalC{
        order: 2;
    }
    div.abTotal div.abTotalR{
        order: 3;
    }
    tr.abTtlRowHide{
        display: none;
    }
}
.abTtlL{
    padding: 10px;
    white-space: nowrap;
}
.abTtlR{
    text-align: right;
    padding: 10px !important;
}
.abTtlH,.abTtlS,.abTtlU,.abTtlX{
    height: 3px;
}
.abTtlH{
    background: #00a3e4;
}
.abTtlS{
    background: #fdba2f;
}
.abTtlU{
    background: #ef4338;
}
.abTtlX{
    background: #98ca3c;
    */
    bae84c;
    */
}
.abSumLeft{
    position: absolute;
    top: 0;
    left: 0;
}
.abSumRight{
    position: absolute;
    top: 0;
    right: 0;
}
.abSumTotal{
    position: absolute;
    top: 45px;
    left: 0;
    font-family: Flexo-Thin,verdana;
    font-size: 20px;
    color: #424244;
}
#abSumDate{
    position: absolute;
    top: 45px;
    right: 0;
    font-family: Flexo-Thin,verdana;
    font-size: 17px;
    color: #424244;
}
div.abHolTotal{
    width: 114px;
    height: 114px;
    background: #cccccc;
    border-radius: 57px;
    margin: 0 auto 0 auto;
    text-align: center;
}
span#abHolTotal{
    line-height: 114px;
    font-family: Flexo-Thin,verdana;
    font-size: 78px;
    color: #424244;
}
#abSumGaugeTaken{
    float: left;
    background: #00a3e4;
    /*border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    */
    opacity: 0.7;
    filter: alpha(opacity=70)font-family: Flexo-Thin,verdana;
    font-size: 15px;
    color: #ffffff;
    text-align: right;
    line-height: 50px;
    white-space: nowrap;
}
#abSumGaugeRemain{
    float: left;
    background: #00a3e4;
    /*border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    */
    font-family: Flexo-Thin,verdana;
    font-size: 15px;
    color: #ffffff;
    line-height: 50px;
    white-space: nowrap;
}
/* ********** */
/* Absence Cal */
/* ********** */
div.abCalBtmStrip{
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 55px;
    background: #ffffff;
    opacity: 0.5;
     filter: alpha(opacity=50);
}
div.abCalBtnLeft{
    position: fixed;
    bottom: 10px;
    left: 10px;
}
div.abCalBtnRight{
    position: fixed;
    bottom: 10px;
    right: 10px;
}
div#abCalLegendOn{
    display: block;
    position: fixed;
    bottom: 0;
    left: 50%;
    width: 376px;
    margin-left: -188px;
    background: #f2f2f2;
    padding: 10px;
}
div#abCalLegendOff{
    display: none;
    position: fixed;
    bottom: 0;
    left: 50%;
    width: 376px;
    margin-left: -188px;
    background: #f2f2f2;
    padding: 10px;
}
div.abCalLegend,div.abCalLegendOff{
    float: left;
    width: 110px;
    background: #ffffff;
    padding: 5px 0 5px 10px;
    margin: 0 5px 5px 0;
    cursor: pointer;
    font-family: Flexo-Regular,verdana;
    font-size: 13px;
}
div.abCalPad{
    height: 43px;
}
div#abCalTotal{
    display: none;
    position: absolute;
    top: 0;
    left: 0;
}
div#abCalTip{
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    max-width: 400px;
}
div.abCalGrid{
    border-top: 1px solid #eeeeee;
    border-left: 1px solid #eeeeee;
}
td.abCalLabel{
    padding: 5px;
    border-right: 1px solid #eeeeee;
    border-bottom: 1px solid #eeeeee;
}
td.abCalLabelTitle{
    padding: 5px;
    border-right: 1px solid #eeeeee;
    border-bottom: 1px solid #eeeeee;
    font-family: Flexo-Bold,arial;
    font-size: 15px;
    font-weight: normal;
    text-align: left;
    color: #ffffff;
    background: #00a1e4;
}
div.abCalHover1{
    background: #f2f2f2;
    padding: 10px;
    border-radius: 5px;
}
div.abCalHover2{
    background: #ffffff;
    padding: 25px;
    box-shadow: 5px 5px 0 0 #e6e6e6;
}
div.abL{
    float: left;
}
div.abR{
    float: right;
}
div.abCalUpDown,div.sortUpDown{
    width: 19px;
    height: 19px;
    border-radius: 20px;
    background: #00a1e4;
    cursor: pointer;
}
div.abCalUpDown img,div.sortUpDown img{
    padding: 2px;
}
/* ********** */
/* Absence Work Pattern */
/* ********** */
div.abWpDe{
    float: left;
    width: 31px;
    height: 20px;
    line-height: 20px;
    margin: 0 1px 1px 0;
    background: #00a1e4;
    cursor: pointer;
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     -khtml-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
    font-family: Flexo-Regular,verdana;
    font-size: 10px;
    color: #ffffff;
    text-align: center;
}
div.abWpDeOff{
    float: left;
    width: 31px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    margin: 0 1px 1px 0;
    background: #cccccc;
    cursor: default;
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     -khtml-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
    font-family: Flexo-Regular,verdana;
    font-size: 10px;
    color: #666666;
    text-align: center;
}
/* ********** */
div.patternH{
    float: left;
    width: 92px;
    margin:0 1px 1px 0;
    padding: 3px;
    background: #00a3e4;
}
div.patternS{
    float: left;
    width: 92px;
    margin:0 1px 1px 0;
    padding: 3px;
    background: #fdba2f;
}
div.patternH div{
    color: #ffffff;
    text-align: center;
}
div.patternS div{
    color: #000000;
    text-align: center;
}
div.patternH input{
    width: 60px;
    border: 1px solid #00a3e4;
    text-align: center;
}
div.patternS input{
    width: 60px;
    border: 1px solid #fdba2f;
    text-align: center;
}
div#PatternHolidayContainer,div#PatternSicknessContainer{
    background: #f2f2f2;
    padding: 10px;
}
/* ********** */
/* Event Cal */
/* ********** */
td.ec{
    border-right: 1px solid #eeeeee;
    border-bottom: 1px solid #eeeeee;
    color: #000000;
}
td.ecMonth{
    padding: 5px;
    border-right: 1px solid #eeeeee;
    border-bottom: 1px solid #eeeeee;
    font-family: Flexo-Bold,arial;
    font-size: 15px;
    font-weight: normal;
    text-align: left;
    color: #808080;
}
td.ecSpace{
    height: 15px;
}
div.ecDivTop{
    width: 100%;
    height: 18px;
    text-align: center;
    border-top: 1px solid #eeeeee;
    border-bottom: 1px solid #eeeeee;
    color: #000000;
}
div.ecDivBot{
    width: 100%;
    height: 20px;
    padding-top: 4px;
    text-align: center;
}
a.tip,a:visited.tip,a:active.tip{
    position: relative;
    z-index: 1;
    text-decoration: none;
    color: #000000;
}
a.tip:hover{
    z-index: 2;
    text-decoration: none;
}
a.tip span{
    display: none;
    text-decoration: none;
}
a.tip:hover span{
    display: block;
    position: absolute;
    padding: 10px;
    text-decoration: none;
    /*-moz-border-radius: 5px;
    border-radius: 5px;
    */
}
/* ********** */
/* Mail Merge */
/* ********** */
div.mmLeft{
    float: left;
    width: 179px;
    line-height: 29px;
    border-right: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
    padding: 0 0 0 20px;
    font-family: Flexo-Regular,verdana;
    font-size: 13px;
    color: #808080;
}
div.mmRight{
    float: left;
    width: 180px;
    line-height: 29px;
    border-bottom: 1px solid #e6e6e6;
    padding: 0 0 0 20px;
    font-family: Flexo-Regular,verdana;
    font-size: 13px;
    color: #808080;
}
div.mmLeftOn{
    cursor: pointer;
    float: left;
    width: 179px;
    line-height: 29px;
    border-right: 1px solid #e6e6e6;
    border-bottom: 1px solid #e6e6e6;
    padding: 0 0 0 20px;
    background: #00a1e4;
    font-family: Flexo-Regular,verdana;
    font-size: 13px;
    color: #ffffff;
}
div.mmRightOn{
    cursor: pointer;
    float: left;
    width: 180px;
    line-height: 29px;
    border-bottom: 1px solid #e6e6e6;
    padding: 0 0 0 20px;
    background: #00a1e4;
    font-family: Flexo-Regular,verdana;
    font-size: 13px;
    color: #ffffff;
}
/* ********** */
/* Set Rights /
/* ********** */
div.secLegend{
    float: left;
    padding: 5px;
    margin-right: 1px;
    font-family: Flexo-Regular,verdana;
    font-size: 13px;
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     -khtml-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
}
/* ********** */
.secDefault{
    color: #000000;
    background: #8b94ef;
}
.secUpdateSelf{
    color: #000000;
    background: #bcddfc;
}
.secSelfSensitive{
    color: #000000;
    background: #a4ecf7;
}
.secTeam{
    color: #000000;
    background: #f4baba;
}
.secTeamSensitive{
    color: #000000;
    background: #f7b06c;
}
.secTeamDelete{
    color: #000000;
    background: #f7df81;
}
textarea.sec{
    width: 405px;
    font-family: courier;
    font-size: 13px;
    line-height: 20px;
}
textarea.secAdv{
    width: 540px;
    height: 40px;
    margin: 10px 0 10px 0;
    font-family: courier;
    font-size: 13px;
}
/* ********** */
div.secCont{
    float: left;
    min-width: 50%;
    border-top: 1px solid #d9d9d9;
}
div.secLeft{
    float: left;
    line-height: 30px;
    padding: 0 0 0 10px;
}
div.secRight{
    float: right;
    line-height: 30px;
    padding: 0 10px 0 0;
}
/* ********** */
div.secAdvSecCont{
    background: #ffffff;
}
div.secAdvSecTitle{
    padding: 10px;
    color: #424244;
    background: #cccccc;
    cursor: pointer;
    margin-bottom: 1px;
}
div.secAdvOpCont{
}
div.secAdvOpTitle{
    float: left;
    min-width: 80px;
    padding-top: 10px;
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     -khtml-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
}
div.secAdvCellCont{
}
div.secAdvCell{
    float: left;
    padding: 10px;
}
div.secAdvTabSpace{
    height: 35px;
}
div.secAdvTab{
    width: 16px;
    white-space: nowrap;
    -ms-transform: rotate(-45deg);
    /* IE 9 */
     -webkit-transform: rotate(-45deg);
    /* Chrome, Safari, Opera */
    transform: rotate(-45deg);
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     -khtml-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
}
/* ********** */
/* Error */
/* ********** */
div.error{
    font-family: Flexo-Bold,verdana;
    color: #ef4338;
    font-size: 19px;
    text-align: center;
}
/* ********** */
/* Report */
/* ********** */
div.reportPower{
    font-family: Flexo-Regular,verdana;
    font-size: 13px;
    color: #808080;
}
/* ********** */
/* Home */
/* ********** */
div.homeTitle{
    font-family: Flexo-Regular,verdana;
    font-size: 16px;
    color: #00a1e4;
}
div.homeBrandContainerTop{
    height: 100px;
    overflow: hidden;
    margin-bottom: 20px;
}
div.homeBrandContainerBot{
    height: 100px;
    overflow: hidden;
}
div.homeBrand,div.homeBrandTop,div.homeBrandBot{
    width: 100%;
    height: 100px;
}
div.homeCommTitle{
    white-space: nowrap;
    overflow: hidden;
    font-family: Flexo-Thin,verdana;
    font-size: 23px;
    color: #424244;
}
div.homeCommDate{
    padding: 10px 0 20px 0;
    white-space: nowrap;
    overflow: hidden;
    font-family: Flexo-Thin,verdana;
    font-size: 20px;
    color: #424244;
}
div.homeCommMessage{
    overflow: auto;
    height: 130px;
    font-family: Flexo-Medium,verdana;
    font-size: 14px;
    color: #808080;
    line-height: 20px;
}
div.homeCommPrevNext{
    float: left;
    padding-top: 20px;
    font-family: Flexo-Medium,verdana;
    font-size: 12px;
    color: #00a1e4;
}
div.homeCommMore{
    float: right;
    padding-top: 20px;
    font-family: Flexo-Medium,verdana;
    font-size: 12px;
    color: #00a1e4;
}
div.homeCommTable{
    overflow: auto;
    height: 210px;
}
td.homeCommSelect{
    white-space: nowrap;
}
/* ********** */
/* Home Profile */
/* ********** */
div.homeProPhoto{
    margin: auto;
    width: 125px;
}
div.homeProPhoto img{
    border-radius: 62px;
}
div.homeProL{
    float: left;
    font-family: Flexo-Regular,verdana;
    font-size: 14px;
    color: #808080;
}
div.homeProR{
    float: right;
    font-family: Flexo-Regular,verdana;
    font-size: 14px;
    color: #424244;
}
/* ********** */
/* Dashboard */
/* ********** */
@media all and (min-width: 1280px){
    div.dbDiv{
        float: left;
        min-width: 422px;
        height: 225px;
        background: #ffffff;
        margin: 0 15px 15px 0;
        padding: 25px;
        box-shadow: 5px 5px 0 0 #e6e6e6;
        font-family: Flexo-Thin,verdana;
        font-size: 22px;
        color: #808080;
        text-align: center;
    }
    div.contPad div.dbDiv:nth-child(even){
        margin-right: 0;
    }
}
@media all and (max-width: 1279px){
    div.dbDiv{
        height: 225px;
        background: #ffffff;
        margin: 0 0 15px 0;
        padding: 25px;
        box-shadow: 5px 5px 0 0 #e6e6e6;
        font-family: Flexo-Thin,verdana;
        font-size: 22px;
        color: #808080;
        text-align: center;
    }
}
div.dbDivIn{
    height: 207px;
    overflow: auto;
    font-weight: normal;
}
div.dbDivIn2{
    padding: 10px;
    text-align: left;
}
div.dbDivIn2 div{
    font-family: Flexo-Regular,verdana;
    font-size: 13px;
    color: #808080;
}
div.dbNumber{
    width: 114px;
    line-height: 114px;
    background: #cccccc;
    border-radius: 57px;
    margin: 43px auto 0 auto;
    font-family: Flexo-Thin,verdana;
    /*font-size: 78px;
    */
    font-weight: normal;
    color: #808080;
    text-align: center;
}
/* ********** */
/* Trs */
/* ********** */
.trsText{
    font-family: Flexo-Thin,verdana;
    font-size: 22px;
    color: #424244;
    text-align: center;
}
.trsTxt2{
    font-size: 15px;
}
@media all and (min-width: 1001px){
    .trsHide{
        display: table-cell;
    }
}
@media all and (max-width: 1000px){
    .trsHide{
        display: none;
    }
}
@media all and (min-width: 801px){
    .trsHide2{
        display: table-cell;
    }
}
@media all and (max-width: 800px){
    .trsHide2{
        display: none;
    }
}
/* ********** */
/* Expense */
/* ********** */
input.expNo{
    width: 47px !important;
    text-align: right;
    padding: 0 2px 0 2px !important;
    box-shadow: none !important;
    font-family: verdana;
    font-size: 11px;
    color: #424244;
}
div#ExpenseAddArea table.lvTable td,div#TimeAddArea table.lvTable td{
    padding: 2px !important;
}
div#ExpenseAddArea select.pf,div#TimeAddArea select.pf{
    width: auto;
    padding: 0 !important;
    box-shadow: none !important;
    font-family: verdana;
    font-size: 11px;
    color: #424244;
}
div#ExpenseAddArea input.pfDateSmall,div#TimeAddArea input.pfDateSmall,div#TimeAddArea input.pfTime{
    padding: 0 2px 0 2px !important;
    box-shadow: none !important;
    font-family: verdana;
    font-size: 11px;
    color: #424244;
}
/* ********** */
/* Time */
/* ********** */
div#TimeTextSearch{
    position: absolute;
    display:none;
    background: #ffffff;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 10px;
}
div#TimeTextSearchContainer{
    background: #f2f2f2;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 10px;
}
/* ********** */
/* Custom Forms */
/* ********** */
div.customFullScreen,div.customRequired 
/* section headings in full screen form */
{
    padding-bottom: 10px;
    font-family: Flexo-Thin,verdana;
    font-size: 22px;
    color: #808080;
}
div.customMainScreen 
/* section headings in win form */
{
    padding-bottom: 10px;
    font-family: Flexo-Thin,verdana;
    font-size: 22px;
    color: #808080;
}
div.customFullScreenTitle 
/* full screen only */
{
    padding-bottom: 10px;
    font-family: Flexo-Thin,verdana;
    font-size: 13px;
    color: #808080;
}
/* ********** */
/* Perform Plan */
/* ********** */
div#PerformPlanResponse{
     display: none;
    position: fixed;
    top: 300px;
    left: 50%;
    width: 600px;
    margin-left: -300px;
    background: #f2f2f2;
    padding: 30px;
}
div#PerformPlanResponseShowHide{
    position: fixed;
    top: 50%;
    right: 0;
     display: none;
    background: #00a1e4;
    -moz-border-top-left-radius: 5px;
    border-top-left-radius: 5px;
    -moz-border-bottom-left-radius: 5px;
    border-bottom-left-radius: 5px;
    padding: 10px;
}
table.PerformPlanTable{
    width: 1
    background: #e6e6e6;
    margin: 10px 0 1v.ddBoxNew,div.ddBoxMove,div.ddBoxMoved,div.ddBoxDraggable{
    margin-bottom: 2px;
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     -khtml-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
    line-height: 25px;
    padding: 0 10px 0 10px;
    margin-bottom: 5px;
    border: 1px solid #e6e6e6;
    font-family: Flexo-Regular,verdana;
    font-size: 13px;
    color: #808080;
}
div.ddBoxMove{
    border: 1px solid #ee3425;
}
div.ddBoxMoved{
    border: 1px solid #99ca3b;
}
div.ddBoxDraggable{
     cursor: move;
}
/* legacy */
div.ddBox{
    cursor: move;
    margin-bottom: 2px;
     -webkit-touch-callout: tab a.tabOn:hover{
    float: left;
}
a.tab,a.tab:visited,a.tab:active{
    display: block;
    float: right;
    font-family: Flexo-Medium,arial;
    font-size: 13px;
    color: #cccccc;
    line-height: 30px;
    background: #424242;
    padding: 0 10px 0 10px;
    margin: 0 1px 1px 0;
    text-decoration: none;
}
a.tab:hover{
    color: #ffffff;
    background: #686869;
}
a.tabOn,a.tabOn:visited,a.tabOn:active,a.tabOn:hover{
    display: block;
    float: right;
    font-family: Flexo-Medium,arial;
    font-size: 13px;
    color: #ffffff;
    line-height: 30px;
    background: #686869;
    padding: 0 10px 0 10px;
    margin: 0 1px 1px 0;
    text-decoration: none;
}
/* ********** */
div.recruitResize{
    position: fixed;
    top: 10px;
    right: 20px;
    cursor: pointer;
}
div.recruitLookup{
    position: absolute;
    top: 0;
    left: 0;
    background: #000000;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 5px;
}
/* ********** */
/* Recruit - Tree */
/* ********** */
div.treeBtn{
    position: fixed;
    bottom: 0;
    padding-bottom: 10px;
    width: 230px;
}
div.vTreeL1{
    cursor: pointer;
    white-space: nowrap;
    padding: 15px 0 0 0;
}
a.vTreeL1,a.vTreeL1:visited,a.vTreeL1:active,a.vTreeL1:hover{
    font-family: Flexo-Demi,arial;
    font-size: 10pt;
    color: #000000;
    text-decoration: none;
}
div.vTreeL2c 
/* c = container */
{
}
div.vTreeL2{
    cursor: pointer;
    white-space: nowrap;
    padding: 5px 0 0 25px;
}
a.vTreeL2,a.vTreeL2:visited,a.vTreeL2:active,a.vTreeL2:hover{
    color: #000000;
    text-decoration: none;
}
div.vTreeL3c 
/* c = container */
{
}
div.vTreeL3{
    cursor: pointer;
    white-space: nowrap;
    padding: 3px 0 0 39px;
}
/* ********** */
/* Recruit - Vacancy Recruit */
/* ********** */
#page,#plannerVacancy{
    display: none;
}
div#recruitVacancyStageList{
    display: none;
    position: absolute;
    top: 45px;
    left: -50px;
    background: #ffffff;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 10px;
}
div.recruitVacancyStageList{
    background: #f2f2f2;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 10px;
}
div.recruitVacancyStageList table{
    min-width: 150px;
}
div#recruitCandidateEmail{
    display: none;
    position: absolute;
    top: 20px;
    left: 20px;
    background: #ffffff;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 10px;
}
div.recruitCandidateEmail{
    background: #f2f2f2;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 10px;
}
div.recruitVacancyDd{
    background: #f2f2f2;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 10px;
}
/* ********** */
/* Recruit - Form */
/* ********** */
textarea.notesVacancy,textarea.notesCandidate,textarea.notesSetting{
    width: 100%;
    height: 85px;
    padding: 10px;
    border: 1px solid #e6e6e6;
    box-shadow: 2px 2px 0 0 #e6e6e6;
}
/* ********** */
/* The OC */
/* ********** */
.txtDiv{
    padding: 5px;
    border-radius: 5px;
}
.txtTitleSub{
    margin-bottom: 10px;
    font-family: Flexo-Thin,verdana;
    font-size: 22px;
    color: #424244;
}
span.ocUat{
    color: #cc0000;
}
div.ocLogo{
    background: #f2f2f2;
    padding: 10px;
    border-radius: 5px;
    text-align: center;
    margin-bottom: 5px;
}
div.ocLogo img{
    background: #ffffff;
    border-radius: 5px;
    padding: 5px;
}
div.ocCompanyRight{
}
div.imgDir{
    float: left;
    padding: 10px;
    cursor: pointer;
}
div.ocScroll{
}
.sysText{
    font-family: courier !important;
    font-size: 13px;
    color: #808080;
}
li.novis{
    visibility: hidden;
}
.utilFormConfigLine{
    border-top: 30px solid #00a1e4;
}
ab a.tabOn:hover{
    float: left;
}
a.tab,a.tab:visited,a.tab:active{
    display: block;
    float: right;
    font-family: Flexo-Medium,arial;
    font-size: 13px;
    color: #cccccc;
    line-height: 30px;
    background: #424242;
    padding: 0 10px 0 10px;
    margin: 0 1px 1px 0;
    text-decoration: none;
}
a.tab:hover{
    color: #ffffff;
    background: #686869;
}
a.tabOn,a.tabOn:visited,a.tabOn:active,a.tabOn:hover{
    display: block;
    float: right;
    font-family: Flexo-Medium,arial;
    font-size: 13px;
    color: #ffffff;
    line-height: 30px;
    background: #686869;
    padding: 0 10px 0 10px;
    margin: 0 1px 1px 0;
    text-decoration: none;
}
/* ********** */
div.recruitResize{
    position: fixed;
    top: 10px;
    right: 20px;
    cursor: pointer;
}
div.recruitLookup{
    position: absolute;
    top: 0;
    left: 0;
    background: #000000;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 5px;
}
/* ********** */
/* Recruit - Tree */
/* ********** */
div.treeBtn{
    position: fixed;
    bottom: 0;
    padding-bottom: 10px;
    width: 230px;
}
div.vTreeL1{
    cursor: pointer;
    white-space: nowrap;
    padding: 15px 0 0 0;
}
a.vTreeL1,a.vTreeL1:visited,a.vTreeL1:active,a.vTreeL1:hover{
    font-family: Flexo-Demi,arial;
    font-size: 10pt;
    color: #000000;
    text-decoration: none;
}
div.vTreeL2c 
/* c = container */
{
}
div.vTreeL2{
    cursor: pointer;
    white-space: nowrap;
    padding: 5px 0 0 25px;
}
a.vTreeL2,a.vTreeL2:visited,a.vTreeL2:active,a.vTreeL2:hover{
    color: #000000;
    text-decoration: none;
}
div.vTreeL3c 
/* c = container */
{
}
div.vTreeL3{
    cursor: pointer;
    white-space: nowrap;
    padding: 3px 0 0 39px;
}
/* ********** */
/* Recruit - Vacancy Recruit */
/* ********** */
#page,#plannerVacancy{
    display: none;
}
div#recruitVacancyStageList{
    display: none;
    position: absolute;
    top: 45px;
    left: -50px;
    background: #ffffff;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 10px;
}
div.recruitVacancyStageList{
    background: #f2f2f2;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 10px;
}
div.recruitVacancyStageList table{
    min-width: 150px;
}
div#recruitCandidateEmail{
    display: none;
    position: absolute;
    top: 20px;
    left: 20px;
    background: #ffffff;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 10px;
}
div.recruitCandidateEmail{
    background: #f2f2f2;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 10px;
}
div.recruitVacancyDd{
    background: #f2f2f2;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 10px;
}
/* ********** */
/* Recruit - Form */
/* ********** */
textarea.notesVacancy,textarea.notesCandidate,textarea.notesSetting{
    width: 100%;
    height: 85px;
    padding: 10px;
    border: 1px solid #e6e6e6;
    box-shadow: 2px 2px 0 0 #e6e6e6;
}
/* ********** */
/* The OC */
/* ********** */
.txtDiv{
    padding: 5px;
    border-radius: 5px;
}
.txtTitleSub{
    margin-bottom: 10px;
    font-family: Flexo-Thin,verdana;
    font-size: 22px;
    color: #424244;
}
span.ocUat{
    color: #cc0000;
}
div.ocLogo{
    background: #f2f2f2;
    padding: 10px;
    border-radius: 5px;
    text-align: center;
    margin-bottom: 5px;
}
div.ocLogo img{
    background: #ffffff;
    border-radius: 5px;
    padding: 5px;
}
div.ocCompanyRight{
}
div.imgDir{
    float: left;
    padding: 10px;
    cursor: pointer;
}
div.ocScroll{
}
.sysText{
    font-family: courier !important;
    font-size: 13px;
    color: #808080;
}
li.novis{
    visibility: hidden;
}
.utilFormConfigLine{
    border-top: 30px solid #00a1e4;
}