html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    font-size: 100%;
    vertical-align: baseline;
    border: 0;
    outline: 0;
    background: transparent;
}

ol, ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

:focus {
    outline: 0;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

* {
    margin: 0;
}

html, body {
}

html, body, form {
    height: 100%;
    margin: 0;
    padding: 0;
}

.login form {
    height: auto;
}

img {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
}

/**Login Contents**/
.LOGIN .wrapper{height:100%;width:100%;overflow:hidden;z-index:0;background:#ffffff;}
.loginContents{width:95%;max-width:415px;height:100%;margin:0 auto;position:relative;z-index:1;display:table;}
.loginFields{display:table-cell;vertical-align:middle;width:100%;}
.loginFields .logo{width:180px;margin:0 auto 20px auto;}
.loginFields .logo img{width:100%;display:block;}
.loginFields p{text-align:center;color:#212330;font-size:14px;line-height:18px;}
.loginFields p a{color:#4897d8;text-decoration:none;}
.loginFields .loginForm{background:#e8ebf0;border-radius:10px;width:calc(100% - 42px);padding:20px;border:1px solid #e8ebf0;margin-bottom:30px;}
.loginFields .loginForm h1{font-weight:700;color:#212330;font-size:20px;line-height:24px;}
.loginFields .fieldName{color:#212330;font-weight:600;margin:20px 0 5px 0;padding:0;font-size:14px;line-height:18px;display:block;}
.loginFields input[type=text],.loginFields input[type=password]{width:100%;display:block;margin:5px 0 0 0;border:1px solid #ffffff;}
.loginFields .checkmark{border:1px solid #ffffff;}
.loginFields table{width:100%;margin:10px 0 0 0;}
.loginFields table tr td{width:50%}
.loginFields table tr td:last-child{text-align:right;}
.loginFields table tr td:last-child a{color:#212330;font-size:14px;line-height:18px;text-decoration:none;}
.loginFields .checkBoxStyle{color:#212330;font-weight:400;text-transform:none;}
.loginFields ul{width:100%;text-align:center;}
.loginFields ul li{display:inline-block;vertical-align:top;padding:10px 5px 60px 5px;}
.loginFields ul li img{height:50px;display:block;}
.loginFields ul li.border img{border:1px solid #e8ebf0;border-radius:5px;}
.LOGIN .footer{font-size:12px;line-height:18px;color:#212330;border-top:1px solid #aaaaaa;width:100%;text-align:left;position:absolute;left:0;bottom:0;z-index:2;padding:25px 0;background:#ffffff;}
.LOGIN .footer .container{width:95%;margin:0 auto;}
/**Main Contents**/
.page-wrapper{background:#e8ebf0;overflow-x:hidden;position:relative;}
.page-single{background:#e8ebf0;height:100%;overflow-x:hidden;position:relative;}
.header{background:#ffffff;padding:10px 30px;width:calc(100% - 60px);font-size:0;border-bottom:1px solid #e8ebf0;position:fixed;z-index:2;}
.header .companyLogo{width:calc(100% - 70px);display:inline-block;vertical-align:middle;}
.header .companyLogo .mainMenuBtn{width:24px;display:inline-block;vertical-align:middle;cursor:pointer;}
.header .companyLogo .mainMenuBtn img{display:block;width:100%;}
.header .companyLogo .logoImg{width:90px;display:inline-block;vertical-align:middle;margin:0 20px;}
.header .companyLogo .logoImg img{display:block;width:100%;}
.header .userLogout{width:70px;display:inline-block;vertical-align:middle;}
.header .userLogout a{background:url("../../images/logout-icon.svg")no-repeat right center;display:block;color:#212330;font-size:14px;line-height:20px;padding:0 30px 0 0;text-decoration:none;}
.page-single .companyLogo{width:58px;margin:0;display:block;}
.page-single .companyLogo .logoImg{margin:0;}
.page-wrapper .footer{font-size:12px;line-height:18px;color:#212330;text-align:left;padding:15px 30px;width:calc(100% - 60px);position:fixed;bottom:0;background:#e8ebf0;}
.page-single .footer{font-size:12px;line-height:18px;color:#212330;text-align:left;padding:15px 30px;width:calc(100% - 60px);position:fixed;bottom:0;background:#e8ebf0;}
.commonPage{padding:95px 30px 60px 30px;width:calc(100% - 60px);}
.commonPage h1{font-size:20px;line-height:24px;color:#212330;margin-bottom:20px;position:relative;}
.commonPage h1 a{text-decoration:none;color:#212330;}
.commonPage h1 .edit::after{content:url("../../images/edit-icon.svg");padding:0 0 0 10px;vertical-align:-3px;width:22px;height:22px;display:inline-block;vertical-align:middle;}
.page-single .commonPage h1{text-align:left;}
/*COMMON TABLE - NORMAL*/
.normalTable{width:100%;border:1px solid #4897d8;background:#ffffff;border-radius:5px;}
.normalTable .container{width:calc(100% - 40px);padding:20px;position:relative;}
.normalTable table{width:100%;border-collapse:separate;}
.normalTable table thead tr th{color:#212330;font-size:12px;line-height:14px;font-weight:600;text-align:left;padding:7.5px 10px;vertical-align:top;border-bottom:1px solid #fde79e;}
.normalTable table tbody tr td{color:#212330;font-size:14px;line-height:18px;font-weight:400;text-align:left;padding:7.5px 10px;border-bottom:1px solid #fbf5c3;vertical-align:middle;}
.normalTable.center table thead tr th, .normalTable.center table tbody tr td{text-align:center;}
/*COMMON TABLE - RESPONSIVE*/
.responsiveTable{width:100%;border:1px solid #4897d8;background:#ffffff;border-radius:5px;}
.responsiveTable.withoutFrame{border:none;background:none;border-radius:0;}
.responsiveTable .container{width:calc(100% - 40px);padding:20px;position:relative;}
.responsiveTable h2{font-size:16px;line-height:20px;color:#212330;font-weight:600;margin-bottom:20px;}
.responsiveTable .viewAll{color:#869fb3;font-size:14px;line-height:18px;text-decoration:none;position:absolute;right:20px;top:22px;}
.responsiveTable table{width:100%;border-collapse:separate;}
.responsiveTable table thead tr th{color:#212330;font-size:12px;line-height:14px;font-weight:600;text-align:left;padding:7.5px 10px;vertical-align:top;border-bottom:1px solid #e8ebf0;}
.responsiveTable table tbody tr td{color:#869fb3;font-size:14px;line-height:18px;font-weight:400;text-align:left;padding:7.5px 10px;border-bottom:1px solid #e8ebf0;vertical-align:middle;}
.responsiveTable.center table thead tr th, .responsiveTable.center table tbody tr td{text-align:center;}
.responsiveTable table thead tr th.noPadding,
.responsiveTable table tbody tr td.noPadding{padding:7.5px 0;}
.responsiveTable table tbody tr .check{vertical-align:middle;}
.responsiveTable table tbody tr td a img{width:17px;}
.responsiveTable table tbody tr td a{color:#869fb3;}
.responsiveTable table .checkBoxStyle{padding-left:0 !important;}
.responsiveTable table td .checkBoxStyle{margin-top:-7.5px;}
.responsiveTable .noRecords td{text-align:center !important;}
.responsiveTable .disabled{pointer-events: none;display:none;}
.responsiveTable .disabled img{filter:grayscale(100%);}
.responsiveTable table td span{display:inline-block;}
.responsiveTable table td .field{display:block;}
.responsiveTable table tbody tr.rejectedRow{background:#feeff4;}
.responsiveTable table tbody tr.rejectedRow td{color:#434343;}
.freezeTable{position:relative;max-width:100%;margin:auto;overflow:hidden;}
.clone{position:absolute;top:0;left:0;pointer-events:none;}
.clone tr{background:#ffffff;}
.clone td{visibility:hidden;}
.clone th{visibility:hidden;border-color:transparent;}
.clone th a{color:#232323;pointer-events:visible !important;}
.clone thead th:nth-child(1),.clone thead th:nth-child(2),/*.clone thead th:nth-child(3),*/.clone tbody td:nth-child(1),.clone tbody td:nth-child(2)/*,.clone tbody td:nth-child(3)*/{visibility:visible;}
.commonPage .status{display:inline-block;padding:5px 0;color:#ffffff;font-size:12px;line-height:12px;font-weight:600;border-radius:3px;text-align:center;width:68px;}
.commonPage .barcode_status{display:inline-block;padding:10px 20px;color:#ffffff;font-size:14px;line-height:14px;font-weight:600;border-radius:30px;text-align:center;width:auto;}
.commonPage .status.new, .commonPage .status.active{background:#4897d8;}
.commonPage .status.pending{background:#fbc40d;}
.commonPage .status.inactive{background:#a9a9a9;}
.commonPage .status.completed{background:#00FF00;}
.commonPage .status.deleted{background:#ff0000;}
.commonPage .status.valid{background:#20b799;}
.commonPage .status.invalid{background:#fa5944;}
.commonPage .barcode_status.ready{background:#4897d8;}
.commonPage .barcode_status.valid{background:#20b799;}
.commonPage .barcode_status.invalid{background:#fa5944;}
/*SEARCH FILTER*/
.searchFilter{width:100%;font-size:0;margin-bottom:10px;}
.searchFilter span{display:inline-block;vertical-align:middle;margin-right:5px;margin-bottom:5px;width:285px;}
.searchFilter input,.searchFilter select{border:1px solid #4897d8;margin-bottom:5px !important;}
.searchFilter .selectField{width:200px;}
.searchFilter .date{display:inline-block;vertical-align:middle;width:380px;text-align:center;}
.searchFilter .date ul li{display:inline-block;vertical-align:middle;font-size:14px;line-height:18px;color:#212330;width:calc(50% - 12px);}
.searchFilter .date ul li:nth-child(2){width:24px;}
.searchFilter .btn{margin-right:5px;width:auto;}
.searchFilter select{padding:6.5px 10px;}
/**Page Number**/
.pagination{width:100%;margin:20px 0 10px 0;font-size:0;}
.pagination .page{display:inline-block;vertical-align:middle;text-align:left;color:#212330;font-size:14px;line-height:18px;width:calc(100% - 280px);}
.pagination .pageNum{display:inline-block;vertical-align:middle;text-align:right;width:280px;font-size:14px;line-height:18px;}
.pagination ul{list-style: none;}
.pagination ul li{display:inline-block;vertical-align: middle;}
.pagination ul li span{display:block;border-radius:5px;background:#ffffff; color:#212330;font-size:14px;width:30px;height:19px;padding:6px 0 5px 0;text-align:center;text-decoration:none;border:1px solid #e8ebf0;margin:0 1.5px;}
.pagination ul li a{display:block;border-radius:5px;background:#ffffff; color:#212330;font-size:14px;width:30px;height:19px;padding:6px 0 5px 0;text-align:center;text-decoration:none;border:1px solid #e8ebf0;margin:0 1.5px;}
.pagination ul li a:hover{background:#869fb3;color:#ffffff;font-weight:600;}
.pagination ul li.active .current{color:#ffffff;background:#869fb3;font-weight:600;}
/*DETAIL PAGE*/
.detailPage{width:100%;border:1px solid #4897d8;background:#ffffff;border-radius:5px;margin-bottom:20px;}
.detailPage.errorPg{background:rgba(255, 38, 107, 0.1);border:1px solid #ff266b;}
.detailPage.errorPg .fieldName{color:#ff266b;}
.detailPage .container{width:calc(100% - 40px);padding:20px;position:relative;}
.detailPage h2{font-weight:600;color:#869fb3;font-size:16px;line-height:20px;margin:0 0 20px 0;position:relative;border-bottom:1px solid #869fb3;padding:0 0 20px 0;}
.detailPage h2 span{position:absolute;left:0;top:7.5px;display:block;width:auto;background:#ffffff;padding-right:10px;}
.formFields{display:flex;flex-wrap:wrap;width:calc(100% + 20px);font-size:14px;line-height:18px;}
.formFields .fieldName{width:100%;display:block;color:#869fb3;margin:5px 0;}
.formFields .fieldName strong{font-weight:600;color:#212330;}
.formFields .fieldName em{font-size:12px;color:#212330;}
.formFields .field{width:100%;display:block;color:#212330;}
.formFields .formCol4{width:calc(25% - 20px);margin:0 20px 20px 0;}
.formFields .formCol2{width:calc(50% - 20px);margin:0 20px 20px 0;}
.formFields .formCol{width:calc(100% - 20px);margin:0 20px 20px 0;}
.formFields .field a{color:#212330;}
.formFields.topBorder{border-top:1px solid #fdf0d8;padding-top:20px;margin-top:10px;}
/*OTHERS*/
.rightBtn{position:absolute;right:0;top:-5px;}
.radioGrp{width:100%;}
.radioGrp li{display:inline-block;vertical-align:top;margin-right:10px;}
.imgPlaceholder{width:100px;}
.imgPlaceholder img{width:100%;display:block;}
.formFields .field ul{list-style:disc;margin-left:20px;margin-bottom:10px;}
.formFields .field ul li{font-size:14px;line-height:18px;padding:5px 0;}
.formFields .field p{font-size:14px;line-height:18px;margin-bottom:10px;}
.warningAlert{width:calc(100% - 20px);padding:10px;border-radius:5px;background:rgba(255, 38, 107, 0.1);border:1px solid #ff266b;font-size:0;margin-bottom:20px;}
.warningAlert.successful{background:rgba(0,147,144,0.1);border:1px solid #009390;}
.warningAlert span{display:inline-block;vertical-align:middle;width:calc(100% - 27px);font-size:14px;line-height:18px;color:#262626;}
.warningAlert .icon{width:17px;margin-right:10px;}
.warningAlert .icon img{width:100%;display:block;}
.verticalScroller{width:100%;max-height:300px;overflow-y:auto;}
.tableFixHead thead th{position:sticky;top:0;z-index:1;background:#eeeeee;}
.RESET .loginFields .loginForm p{font-size:14px;line-height:18px;margin-bottom:10px;text-align:left;}
.RESET .loginFields .loginForm ul{list-style:disc;margin-left:15px;text-align:left;}
.RESET .loginFields .loginForm ul li{font-size:12px;line-height:14px;padding:0;display:list-item;}
@media screen and (max-width:1629px){
	.searchFilter span{margin-right:5px;width:calc(50% - 5px);margin-bottom:5px;}
	.searchFilter span:nth-child(even){margin-right:0;margin-left:5px;}
	.searchFilter .btn{width:auto;margin:0 5px 5px 0 !important;}
	.searchFilter .selectField{width:calc(50% - 5px);}
	.searchFilter .date{width:calc(50% - 5px);}
	.barcodeScroller .clone tr{background:#d3e5f5;}
	.responsiveTable .barcodeScroller{width:100%;overflow-x:auto;}
	.responsiveTable .barcodeScroller table{width:1500px;}
}

@media screen and (max-width:1499px){
	.prodScroller .clone tr{background:#d3e5f5;}
	.responsiveTable .prodScroller{width:100%;overflow-x:auto;}
	.responsiveTable .prodScroller table{width:1300px;}
}

@media screen and (max-width:1279px){
	.formFields .formCol4{width:calc(50% - 20px);}
	.formFields .formCol2{width:calc(100% - 20px);}
}

@media screen and (max-width:1199px){
	.freezeTable{max-width:100%;overflow:none;}
	.clone{display:none !important;}
	.responsiveTable .prodScroller{overflow-x:hidden;}
	.responsiveTable .prodScroller table{width:100%;}
	.responsiveTable .barcodeScroller{overflow-x:hidden;}
	.responsiveTable .barcodeScroller table{width:100%;}	
	.responsiveTable{margin-top:0;}
	.responsiveTable .container{padding-bottom:0;}
	.responsiveTable table{margin:0;border-radius:5px;}
	.responsiveTable table thead{border:none;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;}
	.responsiveTable table tr{display:block;border-bottom:none;border-radius:5px;margin:10px 0 20px 0;background:#d3e5f5;}
	.responsiveTable table tbody tr td{border-top:none;display:block;text-align:right !important;padding:5px 10px;border-bottom:none;}
	.responsiveTable table td::before{content: attr(data-label);float:left;font-weight:600;color:#212330;}
	.responsiveTable table tbody tr td:last-child{paddding-bottom:0;}
	.responsiveTable table tbody tr:last-child td{border-bottom:none;}
	.responsiveTable table .checkBoxStyle{text-align:right !important;display:inline-block;padding-bottom:10px;margin:15px 15px 0 0;}
	.responsiveTable .viewAll{position:relative;right:0;top:0;text-align:right;display:block;}
	.responsiveTable input[type="text"]:disabled{border:1px solid #eaeaea;}
	.responsiveTable table thead tr th.noPadding,
	.responsiveTable table tbody tr td.noPadding{padding:5px 10px;}
	.clone{position:relative;top:0;left:0;pointer-events:none;display:none !important;}
	.clone th, .clone td{visibility:visible;}
	.clone td, .clone th{border-color:transparent;}
	.clone tbody th{visibility:visible; background:#f7b035;}
	.clone .fixed-side{border-bottom:1px solid #fdf0d8;visibility:hidden;}
	.clone tbody .fixed-side{color:#232323;font-size:14px;line-height:18px;font-weight:600;}
	.clone thead{background:transparent;}
	.clone tr{background:#fdf0d8;}
	.pagination{margin:0 0 10px 0;}
	.pagination .page{display:block;text-align:center;width:100%;}
	.pagination .pageNum{display:block;text-align:center;width:100%;margin:15px 0;}
	.pagination ul li span{margin:0;}
	.pagination ul li a{margin:0;}
	.grandTotal{width:calc(100% - 20px);float:none;margin:5px 10px;}
	.grandTotal .cost{text-align:right;}
	.backBtn.add{margin-top:0;}
}

@media screen and (max-width:999px){
	.searchFilter span{margin-right:0;width:100%;margin-bottom:5px;}
	.searchFilter span:nth-child(even){margin-left:0;}
	.searchFilter .selectField{width:100%;}
	.searchFilter .date{width:100%;}
	.searchFilter .btn{width:auto;margin-right:5px;}
}

@media screen and (max-width:800px){
	.header{padding:10.5px 15px;width:calc(100% - 30px);position:relative;z-index:0;}
	.page-wrapper .footer{position:relative;}
	.page-wrapper .footer{padding:15px;width:calc(100% - 30px);}
	.commonPage{padding:25px 15px;width:calc(100% - 30px);}
	.formFields{width:100%;font-size:14px;line-height:18px;}
	.formFields .fieldName{width:100%;}
	.formFields .formCol4{width:100%;margin:0 0 10px 0;}
	.formFields .formCol2{width:100%;margin:0 0 10px 0;}
	.formFields .formCol{width:100%;margin:0 0 10px 0;}
	.radioGrp li{display:block;margin:10px 0;}
}

@media screen and (max-width:699px){
	.rightBtn{position:relative;display:block;top:0;margin-top:15px;}
}

@media screen and (max-height:600px){
	.LOGIN .wrapper{height:auto;padding-top:20px;}
	.LOGIN .footer{position:relative;padding:15px 0;}
}

/*FOR PRINT ONLY*/
@media print {
	*{ color-adjust: exact; -webkit-print-color-adjust: exact; print-color-adjust: exact; margin:0; padding:0; }
}