/* vietnamese */
@font-face {
  font-family: 'Muli';
  font-style: normal;
  font-weight: 400;
  src: local('Muli Regular'), local('Muli-Regular'), url(fonts/Ul00HI23GehQ9qPsH_7ocQ.woff2) format('woff2');
  unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Muli';
  font-style: normal;
  font-weight: 400;
  src: local('Muli Regular'), local('Muli-Regular'), url(fonts/jbCPU7JDvi-y7oVFF-ztAg.woff2) format('woff2');
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Muli';
  font-style: normal;
  font-weight: 400;
  src: local('Muli Regular'), local('Muli-Regular'), url(fonts/z6c3Zzm51I2zB_Gi7146Bg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

body {
    margin: 0%;
    color: #595959;
    font-family: 'Myriad Pro',sans-serif;
    font-family: 'Muli', sans-serif;
    font-size: 12px;
    background-color: #FBFBFB;
}
.importStatusDisplayIdCss {
    margin: 30px 10px 10px 300px;
}
.topHeaderCover {
    
    width: 100%;
    height: auto;
    top: 0%;
    left: 0%;
    right: 0%;
    clear: both;
    z-index: 10;
    overflow: hidden;
    background-color: #FCFCFC;
}
#header_bar {
    width: 100%;
    height: 100px;
}
#headerLeft {
    width: 100px;
    padding-top: 20px;
    padding-left: 8px;
    float: left;
}
#headerRight {
    height: 100px;
    float: left;
    width:89%;
}
#titleBar {
    height: 40px;
    text-align: center;
    padding-top: 10px;
    font-size:16px;
    font-weight: bold;
    color: #000053;
}
#menuBar {
    float: right;
}
#menuTabCover {
    height: 35px;
    overflow: hidden;
}
.menuTab {
    border: thin solid #C5C5C5;
    padding: 5px 10px 5px 10px;
    background-color: #F2F2F2;
    height: 20px;
    float: left;
    text-align: center;
    color: #4E4E4E;
    width: auto;
    cursor: default;
}
.menuTabLogoff {
    border: thin solid #C5C5C5;
    padding: 5px 10px 5px 10px;
    background-color: #2B61AA;
    height: 32px;
    float: left;
    text-align: center;
    color: #FDFDFD;
    width: auto;
    cursor: default;
    font-family: inherit;
}

#corporateColorBar {
    width: 100%;
    height: 10px;
}
#colorRed {
    width: 30%;
    background-color: #D20000;
    float: left;
    height: 10px;
}
#colorBlue {
    width: 70%;
    background-color: #000053;
    height: 10px;
    float: left;
}
#horizontalGap {
    height: 10px;
    clear: both;
}
#horizontalGapButtom {
    height: 10px;
    clear: both;
    padding-bottom: 30px;
}

.afterTopHeader {
    height: 10px;
    clear: both;
    border-bottom-style: solid;
    border-bottom-width: thin;
    border-bottom-color: #E9E9E9;
}

#middle_bar {
    padding: 0px 10px 1% 10px;
    border-top-style: solid;
    border-bottom-style: solid;
    border-top-width: thin;
    border-bottom-width: thin;
    border-top-color: #E9E9E9;
    border-bottom-color: #E9E9E9;
    position: relative;
}
.Login_middle_bar {
    padding: 5px 10px 1% 10px;
    border-top-style: solid;
    border-bottom-style: solid;
    border-top-width: thin;
    border-bottom-width: thin;
    border-top-color: #E9E9E9;
    border-bottom-color: #E9E9E9;
    position: relative;
}
#footer_bar {
    height: auto;
    background-color: #E6E6E6;
    color: #5B5B5B;
    font-size: small;
    position: fixed;
    bottom: 0%;
    border-top-style: solid;
    border-top-width: thin;
    border-top-color: #B2B2B2;
    width: 98%;
    padding-right: 1%;
    padding-bottom: 5px;
    padding-left: 1%;
}
#footerLeft {
    float: left;
}
#footerRight {
    float: right;
}

.FooterInfoCss {
    color: #666666;
    text-decoration:none;
}

#loginCssCover {
    margin: 0px auto 0px auto;
    width: 275px;
    height: auto;
}
#loginCss {
    padding: 20px 10px 10px 10px;
    border: thin solid #E2E2E2;
    margin: 0px auto 0px auto;
    width: 250px;
    height: auto;
    background-color: #FBFBFB;
}

#loginCss table {
}
#adjusterBar {
    height: 1px;
    clear: both;
}
#loginWrapper {
    height: 450px;
}
.userLoginInfoCss {
    height: 20px;
    padding-top: 5px;
    clear: both;
}



/*for menu*/
.Submenu_button {
    border: thin solid #C1C1C1;
    background-color: #F5F5F5;
    height: 35px;
    width: auto;
    color: #525252;
    font-weight: lighter;
}
.inputFieldCss {
    height: 30px;
    color: #525252;
    margin: 5px 0px 5px 0px;
}
.Action_button {
    border: thin solid #64B1FF;
    background-color: #64B1FF;
    height: 35px;
    width: auto;
    color: #FFFFFF;
    font-weight: lighter;
}
#preDefineCategoryCssOuter {
    padding: 20px 10px 30px 10px;
    border: medium solid #EEEEEE;
}
.pDeCaLeft {
    border: thin solid #EFEFEF;
    padding: 10px;
    float: left;
    height: auto;
    background-color: #F9F9F9;
}
.pDeCaLeftWrapper {
    float: left;
    height: auto;
    padding-right: 10px;
    padding-bottom: 10px;
}
.pDeCaRight {
    border: thin solid #EFEFEF;
    float: left;
    padding: 10px;
    background-color: #F9F9F9;
    width:auto;
}


/*for Defining Category*/
.defineCategoryPanel {
    width: 98%;
    height: auto;
    padding: 5px 1% 5px 1%;
    margin: 0px auto 0px auto;
    border-top-style: solid;
    border-bottom-style: solid;
    border-top-width: thin;
    border-bottom-width: thin;
    border-top-color: #CCCCCC;
    border-bottom-color: #CCCCCC;
}
.defineCategorySubMenuCover {
    height: 38px;
    width: auto;
    display: block;
}
.CategoryListPanel_css {
    float: left;
    padding-bottom: 10px;
    padding-right: 10px;
    padding-left: 10px;
}
.CategoryModificationPanel_css {
    float: left;
    padding-bottom: 10px;
    padding-right: 10px;
    padding-left: 30px;
}
.DisplayItemNameCodeHeader .LeftOne {
    float: left;
    height: auto;
    padding-right: 20px;
}

.DisplayItemNameCodeHeader .RightOne {
    float: right;
    height: auto;
    padding-right: 20px;
}

.DisplayAreaDefineItemCodeOuterCode {
    clear: both;
    padding-bottom: 20px;
    height: auto;
    width: auto;
}
.ItemNameCodeHeaderRowCss {
    position: absolute;
}
.DisplayAreaDefineItemCodeOuterCode table tbody tr th {
    position: relative;
}

.ItemNameCodeRowCss {
    position: relative;
    clear: both;
}
.ItemNameCodeHeaderItemCss {
    background-color: #00FFFF;
}


/* For Define Item Name Code*/
.defineItemNameCodeOuterCover {
    padding: 5px;
    background-color: #F9F9F9;
    width: auto;
    height: auto;
}
.defineItemNameCodeOuterCoverLeft {
    width: auto;
    height: auto;
}
.SelectItemCategoryLeft {
    border: thin solid #EFEFEF;
    padding: 3px;
    float: left;
    width: 300px;
}
.DisplayAreaDefineItemCode {
    border: thin solid #EFEFEF;
    padding: 3px;
    float: left;
}
.definitionAreaItemNameCodeRight {
    border: thin solid #EFEFEF;
    padding: 3px;
    float: right;
}
.DefineCategoryDisplayArea {
}
.virticalAdjustBarForDefinationPanel {
    height: 10px;
    clear: both;
}
.addNewItemNamecss {
    border-top-style: solid;
    border-bottom-style: solid;
    border-top-width: thin;
    border-bottom-width: thin;
    border-top-color: #EFEFEF;
    border-bottom-color: #EFEFEF;
    background-color: #FBFBFB;
}
.CommonVirticalAdjustBar {
    float: none;
    clear: both;
    height: 15px;
}
.DisplayItemNameCodeHeader {
    height: auto;
    width: 100%;
}
.GridViewCss {
    clear: both;
}


/* Define Price*/
.ReportWizardCss {
    height: 800px;
}
.hideReportWizard {
    width: 1px;
    height: 1px;
    overflow: hidden;
    display: none;
    visibility: hidden;
}




/*For Background for alert msg*/
.backForAlertMsg {
    position: fixed;
    z-index: 11;
    width: 100%;
    height: 100%;
    bottom: 0%;
    top: 0%;
    right: 0%;
    left: 0%;
    background-color: #FFFFFF;
    opacity: 0.8;
}

/*For Background for Display Image*/
.backForDisplayImg {
    position: fixed;
    z-index: 11;
    width: 100%;
    height: 100%;
    bottom: 0%;
    top: 0%;
    right: 0%;
    left: 0%;
    background-color: #FFFFFF;
    overflow: auto;
}

.backForDefinitiontMsgBox {
    position: fixed;
    z-index: 13;
    width: 100%;
    height: 100%;
    bottom: 0%;
    top: 0%;
    right: 0%;
    left: 0%;
    background-color: #FFFFFF;
    opacity: 0.8;
}
.MsgAtCategoryListCss {
    border: 3px solid #E0E0E0;
    margin: 0px auto 0px auto;
    padding: 5px;
    background-color: #FCFCFC;
    color: #737373;
    width: 500px;
    height: 200px;
    position: fixed;
    opacity: 1;
    z-index: 13;
    top: 25%;
    right: 25%;
    bottom: 25%;
    left: 25%;
}

.DayViewAttendanceDetailsCss {
    border: 3px solid #A6C9E2;
    margin: 0px auto 0px auto;
    padding: 5px;
    background-color: #FCFCFC;
    color: #737373;
    width: 550px;
    height: 200px;
    position: fixed;
    opacity: 1;
    z-index: 13;
    top: 25%;
    right: 25%;
    bottom: 25%;
    left: 25%;
    display:none;
}

.MsgAtDefinitiontMsgBox {
    border: 3px solid #E0E0E0;
    margin: 0px auto 0px auto;
    padding: 5px;
    background-color: #FCFCFC;
    color: #737373;
    width: 500px;
    height: 200px;
    position: fixed;
    opacity: 1;
    z-index: 14;
    top: 25%;
    right: 25%;
    bottom: 25%;
    left: 25%;
}

.ForceAttDisplayMsgBox {
    border: 3px solid #E0E0E0;
    margin: 0px auto 0px auto;
    padding: 5px;
    background-color: #FCFCFC;
    color: #737373;
    width: 680px;
    height: auto;
    position: fixed;
    opacity: 1;
    z-index: 14;
    top: 25%;
    right: 25%;
    bottom: 25%;
    left: 25%;
}

.forceAttRightIdCss {
    display: block;
    float: right;
    padding-left: 10px;
    border-left-style: double;
    border-left-width: thin;
    border-left-color: #000099;
    width: 900px;
    overflow: auto;
}
.ForceAttLeftPanelIdCss {
    display: block;
    float: left;
    width: 330px;
    height: auto;
    padding-left: 5px;
}

.textForInputBox {
    color: #737373;
}

.DefinationItemNameCss {
    border: 3px solid #E0E0E0;
    margin: 0px auto 0px auto;
    padding: 5px;
    background-color: #FCFCFC;
    color: #737373;
    width: 96%;
    height: auto;
    position: fixed;
    opacity: 1;
    z-index: 12;
    top: 20%;
    right: 2%;
    left: 2%;
    bottom: 5%;
    overflow: auto;
}
.DefinationPanelCloseCss {
    padding: 2px;
    width: 100%;
    height: 30px;
    background-color: #3399FF;
    clear: both;
}
.PageLoadingPanelCss {
    width: 25%;
    position: fixed;
    z-index: 100;
    background-color: #EFEFEF;
    left: 35%;
    text-align: center;
    padding-top: 5%;
    opacity: 0.9;
    bottom: 35%;
    top: 35%;
    right: 35%;
    height: 150px;
}
.CssLeftPartId {
    float: left;
    width: 500px;
}

.CssRightPartId {
    float: left;
    width: 500px;
    overflow: auto;
    margin-left: 15px;
}

.imgCloseCss {
    background-image: url('../../Images/close1.png');
    background-repeat: no-repeat;
}