@import url("MainStyle.css");

/* Login Page ------------------------------------------------ Start */

.LoginInput {
    padding-left: 30px;
}

.basicAccordion a:before {
    margin: 0 10px 0 0
}


/* Login Page ------------------------------------------------  End  */

.TopMenuIcons {
    float: left;
}

.pagesTitle {
    float: left;
    padding-left: 20px;
}


/* ### Main Page Style ----------------------------------------------------------------------- Start ### */

#security_lock_img {
    margin: 0 20px;
    left: -105px;
}

.security_div_container {
    left: -225px;
}


/* ### Main Page Style -----------------------------------------------------------------------  End  ### */


/* ### Top Page Style ------------------------------------------------------------------------ Start ### */

.companyLogo {
    float: left;
    padding-right: 75px;
}

.system_top_menu_div {
    right: 50px;
}

.top_menu_button {
    float: left;
    margin-left: -5px;
    padding-left: 18px;
    padding-top: 5px;
    background: url(system_menu_ltr.jpg) top left no-repeat;
}

.top_menu_button_over {
    float: left;
    margin-left: -5px;
    padding-left: 18px;
    background: url(system_menu_ltr_over.jpg) no-repeat;
}

.top_menu_search {
    float: left;
    margin-left: 50px;
    padding-left: 0px;
    padding-top: 0px;
}

.Main_MENU_Popup_Div {
    left: 150px;
}

table {
    text-align: left;
}

.close_button {
    right: 16px;
}

.aboutProduct {
    right: 40px;
}

.NewaboutProduct {
    right: 15px;
}

.ExtraFeature {
    margin-left: 50px;
}

.ExtraFeature div {
    float: left;
}

.NotifPopUpTitle {
    text-align: left;
    margin-right: 10px;
    margin-left: 10px;
}

.pagingationContainer input[type=text] {
    margin: 0 0 0 20px;
}

.pagingationContainer input[type=button] {
    margin-left: -10px;
}


/* SEARCH */

#employee_search_suggestions {
    box-shadow: #888 5px 10px 10px;
    -webkit-box-shadow: #888 5px 10px 10px;
    -moz-box-shadow: #888 5px 10px 10px;
    position: absolute;
    width: 427px;
    display: none;
    z-index: 9999999999 !important;
}


/* SEARCHRESULTS */

#employee_search_searchresults {
    width: 427px;
    background-color: #fff;
    font-size: 10px;
    line-height: 14px;
    cursor: pointer;
    line-height: 18px;
}

#employee_search_searchresults a {
    display: block;
    background-color: #fff;
    clear: left;
    min-height: 56px;
    text-decoration: none;
}

#employee_search_searchresults a:hover {
    background-color: #F9F9F9;
}

#employee_search_searchresults a img {
    float: left;
    margin: 10px 10px;
    height: 40px;
    width: 40px;
    border: 1px solid #d0d2da
}

#employee_search_searchresults a span.searchheading {
    display: block;
    font-weight: bold;
    padding-top: 5px;
    color: #191919;
    width: 310px;
    white-space: pre-wrap;
}

#employee_search_searchresults div.category {
    font-size: 11px;
    padding: 3px;
    color: #000;
    width: auto;
    text-align: left;
    direction: ltr;
    clear: both;
    height: 20px;
}

#employee_search_searchresults div span {
    left: 50px;
    padding-right: 15px;
    margin-right: 5px;
}

#employee_search_searchresults .failure {
    border-color: #919191;
    border-style: solid;
    background-color: #FFFFFF;
    font-size: 11px;
    line-height: 30px;
    text-align: center;
}

.employee_search_img_class {
    background: white url('../../../DB/Include/Shared/css/images/ui-anim_basic_16x16.gif') right center no-repeat;
}

#employee_search_searchresults a.selectedSystemSearchEmp {
    background-color: #fff !important;
}

#employee_search_searchresults div.category div.status_class_0 {
    color: #FFF;
    background: #0358cb;
    width: 100px;
    text-align: center;
    position: relative;
    line-height: 18px;
    float: right;
}


/*Active style */

#employee_search_searchresults div.category div.status_class_1 {
    color: #FFF;
    background: #fd6363;
    width: 100px;
    text-align: center;
    position: relative;
    line-height: 18px;
    float: right;
}


/*InActive style */

#employee_search_searchresults div.category div.status_class_2 {
    color: #FFF;
    background: #78abee;
    width: 100px;
    text-align: center;
    position: relative;
    line-height: 18px;
    float: right;
}


/*on vacation */

#employee_search_searchresults div.category div.status_class_3 {
    color: #FFF;
    background: #e50000;
    width: 100px;
    text-align: center;
    position: relative;
    line-height: 18px;
    float: right;
}


/* uspended */

#employee_search_searchresults div.category div.status_class_4 {
    color: #FFF;
    background: #b9bdc2;
    width: 100px;
    text-align: center;
    position: relative;
    line-height: 18px;
    float: right;
}


/* Terminated */

#employee_search_searchresults div.category div.status_class_5 {
    color: #FFF;
    background: #3fc362;
    width: 100px;
    text-align: center;
    position: relative;
    line-height: 18px;
    float: right;
}


/* notice period */

#employee_search_searchresults div.category div.status_class_6 {
    color: #FFF;
    background: #ff7e00;
    width: 100px;
    text-align: center;
    position: relative;
    line-height: 18px;
    float: right;
}


/* business trip */

#employee_search_searchresults div.category div.floating {
    width: 300px;
    float: left;
}

#employee_search_searchresults span.Position {
    color: #0358cb !important;
}

#employee_search_searchresults span.Department {
    color: #191919 !important;
}

input[type='checkbox'] {
    margin-right: 10px !important;
}

input[type='checkbox']:after {
    margin-right: 10px !important;
}

input[type='checkbox']:checked:after {
    margin-right: 10px !important;
}

input[type="checkbox"]:disabled:after {
    margin-right: 10px !important;
    cursor: not-allowed;
}

input[type="radio"]:disabled:after {
    cursor: not-allowed;
}

select[disabled] {
    cursor: not-allowed;
}

.employee_code {
    margin-right: 5px !important;
}

#language_div span {
    margin-right: 10px;
}

select {
    background-position: right 5px center;
    padding: 0px 20px 0px 5px;
}

select.myinputfields[multiple] {
    background-position: unset;
    padding: 0;
}

select.myinputfieldtrans[multiple] {
    background-position: unset;
    padding: 0;
}

.logout {
    margin-right: 25px;
    display: inline-block;
}

.validationErrorCSS {
    background: url('ErrorStar.png') no-repeat right !important;
}

[dir=rtl] input.validationErrorCSS[class*=myinputfieldtrans] {
    background: url('ErrorStar.png') no-repeat left !important;
}

.validationErrorCSS:not([class*=myinputfieldtrans]):not([class*=hasCalendarsPicker]) {
    background: url('ErrorStar.png') no-repeat right !important;
}

.validationErrorCSS[class*=myinputfieldtrans] {
    background: url('ErrorStar.png') no-repeat right !important;
}

.validationErrorCSS.hasCalendarsPicker {
    background: url('ErrorStar.png') no-repeat right !important;
}

.trigger {
    right: 6px;
}

input#CurrentPageSubmit {
    border-radius: 0 4px 4px 0;
}

.pagingationContainer input[type=text] {
    border-radius: 4px 0 0 4px
}

.Reload_Captcha {
    float: right;
    padding-right: 1px;
    background-color: Transparent;
    background-repeat: no-repeat;
    border: none;
    cursor: pointer;
    overflow: hidden;
}


/******    menu header table   */

@media screen and (min-width: 1300px) and (max-width:1350px) {
    .width-td-res {
        width: 66vw !important;
    }
}

@media screen and (min-width: 1300px) and (max-width:1350px) {
    .width-td-res2 {
        width: 66.2vw !important;
    }
}

@media screen and (min-width: 1300px) and (max-width:1350px) {
    .width-td-res3 {
        width: 79vw !important;
    }
}

@media screen and (min-width: 1300px) and (max-width:1350px) {
    .width-td-res4 {
        width: 65vw !important;
    }
}

@media screen and (min-width: 1351px) and (max-width:1400px) {
    .width-td-res4 {
        width: 64vw !important;
    }
}

@media screen and (min-width: 1401px) and (max-width:1420px) {
    .width-td-res4 {
        width: 63vw !important;
    }
}

@media screen and (min-width: 1421px) and (max-width:1450px) {
    .width-td-res4 {
        width: 61vw !important;
    }
}

@media screen and (min-width: 1451px) and (max-width:1500px) {
    .width-td-res4 {
        width: 59vw !important;
    }
}

@media screen and (min-width: 1501px) and (max-width:1530px) {
    .width-td-res4 {
        width: 58vw !important;
    }
}

@media screen and (min-width: 1531px) and (max-width:1580px) {
    .width-td-res4 {
        width: 56vw !important;
    }
}

@media screen and (min-width: 1580px) and (max-width:1620px) {
    .width-td-res4 {
        width: 55vw !important;
    }
}

@media screen and (min-width: 1621px) and (max-width:1650px) {
    .width-td-res4 {
        width: 54vw !important;
    }
}

@media screen and (min-width: 1651px) and (max-width:1670px) {
    .width-td-res4 {
        width: 53vw !important;
    }
}

@media screen and (min-width: 1671px) and (max-width:1700px) {
    .width-td-res4 {
        width: 52vw !important;
    }
}

@media screen and (min-width: 1701px) and (max-width:1750px) {
    .width-td-res4 {
        width: 51vw !important;
    }
}

@media screen and (min-width: 1751px) and (max-width:1800px) {
    .width-td-res4 {
        width: 49vw !important;
    }
}

@media screen and (min-width: 1801px) and (max-width:1850px) {
    .width-td-res4 {
        width: 48vw !important;
    }
}

@media screen and (min-width: 1851px) and (max-width:1900px) {
    .width-td-res4 {
        width: 47vw !important;
    }
}

@media screen and (min-width: 1901px) and (max-width:1950px) {
    .width-td-res4 {
        width: 46vw !important;
    }
}

@media screen and (min-width: 1951px) and (max-width:2000px) {
    .width-td-res4 {
        width: 46vw !important;
    }
}

@media screen and (min-width: 2560px) {
    .width-td-res4 {
        width: 34.2vw !important;
    }
}

@media screen and (min-width: 2001px) and (max-width: 2100px) {
    .width-td-res4 {
        width: 42vw !important;
    }
}

@media screen and (min-width: 2101px) and (max-width: 2200px) {
    .width-td-res4 {
        width: 41vw !important;
    }
}

@media screen and (min-width: 2201px) and (max-width: 2300px) {
    .width-td-res4 {
        width: 38.3vw !important;
    }
}

@media screen and (min-width: 2301px) and (max-width: 2400px) {
    .width-td-res4 {
        width: 42vw !important;
    }
}

@media screen and (min-width: 2401px) and (max-width: 2500px) {
    .width-td-res4 {
        width: 43vw !important;
    }
}

@media screen and (min-width: 1351px) and (max-width:1400px) {
    .width-td-res {
        width: 68vw !important;
    }
}

@media screen and (min-width: 1351px) and (max-width:1400px) {
    .width-td-res2 {
        width: 65vw !important;
    }
}

@media screen and (min-width: 1351px) and (max-width:1400px) {
    .width-td-res3 {
        width: 73vw !important;
    }
}

@media screen and (min-width: 1390px) and (max-width:1400px) {
    .width-td-res3 {
        width: 68vw !important;
    }
}

@media screen and (min-width: 1401px) and (max-width:1450px) {
    .width-td-res {
        width: 60vw !important;
    }
}

@media screen and (min-width: 1401px) and (max-width:1450px) {
    .width-td-res2 {
        width: 58vw !important;
    }
}

@media screen and (min-width: 1401px) and (max-width:1450px) {
    .width-td-res3 {
        width: 64vw !important;
    }
}

@media screen and (min-width: 1451px) and (max-width:1500px) {
    .width-td-res {
        width: 70vw !important;
    }
}

@media screen and (min-width: 1451px) and (max-width:1500px) {
    .width-td-res2 {
        width: 56vw !important;
    }
}

@media screen and (min-width: 1451px) and (max-width:1500px) {
    .width-td-res3 {
        width: 57vw !important;
    }
}

@media screen and (min-width: 1501px) and (max-width:1550px) {
    .width-td-res {
        width: 54vw !important;
    }
}

@media screen and (min-width: 1501px) and (max-width:1550px) {
    .width-td-res2 {
        width: 71vw !important;
    }
}

@media screen and (min-width: 1501px) and (max-width:1550px) {
    .width-td-res3 {
        width: 60vw !important;
    }
}

@media screen and (min-width: 1551px) and (max-width:1600px) {
    .width-td-res {
        width: 51vw !important;
    }
}

@media screen and (min-width: 1551px) and (max-width:1600px) {
    .width-td-res2 {
        width: 73vw !important;
    }
}

@media screen and (min-width: 1551px) and (max-width:1600px) {
    .width-td-res3 {
        width: 56vw !important;
    }
}

@media screen and (min-width: 1601px) and (max-width:1700px) {
    .width-td-res {
        width: 49vw !important;
    }
}

@media screen and (min-width: 1601px) and (max-width:1650px) {
    .width-td-res2 {
        width: 75vw !important;
    }
}

@media screen and (min-width: 1601px) and (max-width:1650px) {
    .width-td-res3 {
        width: 51vw !important;
    }
}

@media screen and (min-width: 1651px) and (max-width:1700px) {
    .width-td-res2 {
        width: 76vw !important;
    }
}

@media screen and (min-width: 1651px) and (max-width:1698px) {
    .width-td-res3 {
        width: 51vw !important;
    }
}

@media screen and (min-width: 1699px) and (max-width:1710px) {
    .width-td-res3 {
        width: 55vw !important;
    }
}

@media screen and (min-width: 1711px) and (max-width:1750px) {
    .width-td-res3 {
        width: 49vw !important;
    }
}

@media screen and (min-width: 1741px) and (max-width:1769px) {
    .width-td-res3 {
        width: 48vw !important;
    }
}

@media screen and (min-width: 1769px) and (max-width:1780px) {
    .width-td-res3 {
        width: 48vw !important;
    }
}

@media screen and (min-width: 1781px) and (max-width:1800px) {
    .width-td-res3 {
        width: 51vw !important;
    }
}

@media screen and (min-width: 1801px) and (max-width:1850px) {
    .width-td-res3 {
        width: 46vw !important;
    }
}

@media screen and (min-width: 1850px) and (max-width:1899px) {
    .width-td-res3 {
        width: 45vw !important;
    }
}

@media screen and (min-width: 1900px) and (max-width:1939px) {
    .width-td-res3 {
        width: 48vw !important;
    }
}

@media screen and (min-width: 1940px) and (max-width:1979px) {
    .width-td-res3 {
        width: 43vw !important;
    }
}

@media screen and (min-width: 1980px) and (max-width:2000px) {
    .width-td-res3 {
        width: 46vw !important;
    }
}

@media screen and (min-width: 2001px) {
    .width-td-res3 {
        width: 40vw !important;
    }
}

@media screen and (min-width: 1551px) and (max-width:1600px) {
    .width-td-res2 {
        width: 73vw !important;
    }
}

@media screen and (min-width: 1701px) and (max-width:1750px) {
    .width-td-res {
        width: 50vw !important;
    }
}

@media screen and (min-width: 1701px) and (max-width:1750px) {
    .width-td-res2 {
        width: 76vw !important;
    }
}

@media screen and (min-width: 1751px) and (max-width:1800px) {
    .width-td-res {
        width: 46vw !important;
    }
}

@media screen and (min-width: 1751px) and (max-width:1800px) {
    .width-td-res2 {
        width: 78vw !important;
    }
}

@media screen and (min-width: 1801px) and (max-width:1850px) {
    .width-td-res {
        width: 80vw !important;
    }
}

@media screen and (min-width: 1801px) and (max-width:1850px) {
    .width-td-res2 {
        width: 79vw !important;
    }
}

@media screen and (min-width: 1851px) and (max-width:1900px) {
    .width-td-res {
        width: 43.4vw !important;
    }
}

@media screen and (min-width: 1851px) and (max-width:1900px) {
    .width-td-res2 {
        width: 79vw !important;
    }
}

@media screen and (min-width: 1901px) and (max-width:1950px) {
    .width-td-res {
        width: 42vw !important;
    }
}

@media screen and (min-width: 1901px) and (max-width:1950px) {
    .width-td-res2 {
        width: 81vw !important;
    }
}

@media screen and (min-width: 1951px) and (max-width:2000px) {
    .width-td-res {
        width: 41vw !important;
    }
}

@media screen and (min-width: 1951px) and (max-width:2000px) {
    .width-td-res2 {
        width: 41vw !important;
    }
}

@media screen and (min-width: 2001px) {
    .width-td-res2 {
        width: 89vw !important;
    }
}

@media screen and (min-width: 2001px) {
    .width-td-res {
        width: 39vw !important;
    }
}

@media screen and (min-width: 1300px) and (max-width:1350px) {
    .width-td-res5 {
        width: 75vw !important;
    }
}

@media screen and (min-width: 1351px) and (max-width:1400px) {
    .width-td-res5 {
        width: 76vw !important;
    }
}

@media screen and (min-width: 1401px) and (max-width:1420px) {
    .width-td-res5 {
        width: 69vw !important;
    }
}

@media screen and (min-width: 1421px) and (max-width:1450px) {
    .width-td-res5 {
        width: 69vw !important;
    }
}

@media screen and (min-width: 1451px) and (max-width:1500px) {
    .width-td-res5 {
        width: 63vw !important;
    }
}

@media screen and (min-width: 1501px) and (max-width:1530px) {
    .width-td-res5 {
        width: 63vw !important;
    }
}

@media screen and (min-width: 1531px) and (max-width:1579px) {
    .width-td-res5 {
        width: 60vw !important;
    }
}

@media screen and (min-width: 1580px) and (max-width:1620px) {
    .width-td-res5 {
        width: 59vw !important;
    }
}

@media screen and (min-width: 1621px) and (max-width:1650px) {
    .width-td-res5 {
        width: 58vw !important;
    }
}

@media screen and (min-width: 1651px) and (max-width:1670px) {
    .width-td-res5 {
        width: 57vw !important;
    }
}

@media screen and (min-width: 1671px) and (max-width:1700px) {
    .width-td-res5 {
        width: 56vw !important;
    }
}

@media screen and (min-width: 1701px) and (max-width:1750px) {
    .width-td-res5 {
        width: 54vw !important;
    }
}

@media screen and (min-width: 1751px) and (max-width:1800px) {
    .width-td-res5 {
        width: 53vw !important;
    }
}

@media screen and (min-width: 1801px) and (max-width:1850px) {
    .width-td-res5 {
        width: 51vw !important;
    }
}

@media screen and (min-width: 1851px) and (max-width:1900px) {
    .width-td-res5 {
        width: 50vw !important;
    }
}

@media screen and (min-width: 1901px) and (max-width:1950px) {
    .width-td-res5 {
        width: 49vw !important;
    }
}

@media screen and (min-width: 1951px) and (max-width:2000px) {
    .width-td-res5 {
        width: 48vw !important;
    }
}

@media screen and (min-width: 2000px) {
    .width-td-res5 {
        width: 46vw !important;
    }
}

@media screen and (min-width: 2001px) and (max-width: 2100px) {
    .width-td-res5 {
        width: 46vw !important;
    }
}

@media screen and (min-width: 2101px) and (max-width: 2200px) {
    .width-td-res5 {
        width: 45vw !important;
    }
}

@media screen and (min-width: 2201px) and (max-width: 2300px) {
    .width-td-res5 {
        width: 40vw !important;
    }
}

@media screen and (min-width: 2301px) and (max-width: 2400px) {
    .width-td-res5 {
        width: 38vw !important;
    }
}

@media screen and (min-width: 2401px) and (max-width: 2500px) {
    .width-td-res5 {
        width: 38vw !important;
    }
}

input[name="authentication_code"] {
    padding-left: 30px !important;
}