body {color:#000; background-color:#d0d0d0; font-weight: normal; padding: 0px; margin: 0px; font-family: Arial; font-size: 10pt; font-height: 1em;}
table {border-collapse: collapse; }
td,th,p {font-weight: normal;  vertical-align: middle; text-align: left; 
         padding: 0px; border: 0px solid #000; }
hr {color: #010101; height: 0px; border: 1px solid #555; border-top: 0px solid #000;}
legend {font-family: Arial; font-size: 1.1em; font-weight: bold;}
img {border: 0px solid #000; padding: 0px;}
form {padding: 0px; margin: 0px;}
h0,h1,h2,h3 {text-align: center; color: #010101; padding: 5px; margin: 0px;}
h0 {font-size: 1.8em;}
h1 {font-size: 1.6em;}
h2 {font-size: 1.4em;}
h3 {font-size: 1.2em; text-decoration: underline;}
div {padding: 0px;}
sup {font-size:0.7em;}
a:hover {color: #00F; text-decoration: none; }
 :visited {color: #333; text-decoration: none;}
 :active {color: #fff; }
 :link {color: #000; text-decoration: none;}
iframe {border: 0px; margin: 0px; overflow: hidden;}
input {margin: 1px;}
input.txt,select,textarea {background-color:#FFFFFF; border-radius: 3px; color:#000; vertical-align: middle; padding: 1px 3px;}
input:disabled {color:#888;background-color:#ccc;} 
input[type=text] {padding:0px 2px;}
input.txt {height: 18px; font-size: 11px; border: 1px solid #888;}
input.txt2 {height: 18px; font-size: 11px; background-color:#bbb; border: 1px solid #888; color:#000; vertical-align: middle;}
input.date {width: 98px;}
input.time {width: 43px;}
input.num1,input.num2,input.num3,input.num4,input.num5,input.num6,input.num7,input.num8 {text-align: right;}
input.btt {height: 22px; font-size: 13px; background-color:#333; border: 0px solid #888; color:#B5A294;}
input[type=button],.poi {cursor: pointer;}
input[type=button]:disabled {cursor: default;}
span#err,span.err, td.err {color:#f00; font-weight: bold;}
.test {text-align: center; color: red; font-size: 18px; font-weight: bold;}
.te_st b {color: yellow; }
.p0x {padding: 0px;}
.bold, tr.bold td {font-weight: bold;}
.over {text-decoration: overline;}
.ita {font-style: italic;}
.lith {text-decoration: line-through;}
.hpw {width: 100%; border: 0px;}
.frm {margin-top: 0px; vertical-align: middle;}
.frm td { color: #857a72;}
.l05 {float: left; padding: 0px 5px 0px 0px}
.half {width: 50%;}
.vamid {vertical-align: middle;}
.aleft {text-align: left;}
.fleft {float: left;}
.aright {text-align: right;}
.fright {float: right;}
.acent, td.acent {text-align: center;}
.vacent, td.vacent {vertical-align: middle;}
.vatop, td.vatop {vertical-align: top;}
.vabot, td.vabot {vertical-align: bottom;}
.just {text-align: justify;}
.hiddenpart, .nodisp {display: none;}
.disp {display: block;}
.dispi {display: inline;}
.disptr {display: table-row;}
.fll {float: left;}
.less {font-size: 0.9em;}
.lesser {font-size: 0.8em;}
.biger {font-size: 1.2em;}
.w20px {width: 20px;}
.w25px {width: 25px;}
.w30px {width: 30px;}
.w45px {width: 45px;}
.w70px {width: 70px;}
.w100px {width: 100px;}
.strthr {text-decoration: line-through; font-weight: normal;}
.nobord,table.nobord tr td,table.nobord tr th {border: 0px solid rgba(0,0,0,0);}
.clearb (clear: both;)
.curdef {cursor: default;}
.curpoi {cursor: pointer;}
.baa {break-after: avoid;}
.bba {break-before: avoid;}

* {box-sizing: border-box;}
.row {width: 100%}
.row::after {
  content: "";
  clear: both;
  display: block;
}

[class*="col-"] {
  float: left;
  padding: 5px;
}

/* For desktop: */
.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}

@media only screen and (max-width: 768px) {
  /* For mobile phones: */
  [class*="col-"] {
    width: 100%;
    /*font-size: 20px;*/
  }
}

.pinwin {
  background-color:#FFF;
  border: 3px solid #000;
  border-radius: 10px;
  position: fixed;
  top: 50px; left: 50%; width: 200px;
  padding: 15px 5px 5px 5px;
  margin-left: -100px;
  text-align: center;
  display: none;
}

.pinwin p {text-align: center; margin: 10px}

label {margin-right: 5px;}

.form-inline label {
  margin: 5px 5px 5px 5px;
}

.form-inline input.num1,input.num1 {width: 20px;}
.form-inline input.num2,input.num2 {width: 30px;}
.form-inline input.num3,input.num3 {width: 39px;}
.form-inline input.num4,input.num4 {width: 49px;}
.form-inline input.num5,input.num5 {width: 58px;}
.form-inline input.num6,input.num6 {width: 68px;}
.form-inline input.num7,input.num7 {width: 78px;}
.form-inline input.num8,input.num8,input.traybc {width: 88px;}

.form-inline .pincode {
  width: 48px;
  padding: 3px 5px;
}

.form-inline input {
  vertical-align: middle;
  margin: 5px 10px 5px 0;
  padding: 1px 4px;
  background-color: #fff;
  border: 1px solid #999;
  border-radius: 4px;
}

.form-inline input.time {padding: 2px 3px 2px 4px;}

.form-inline input.navupload::-webkit-file-upload-button,
.form-inline input.cashupload::-webkit-file-upload-button,
.form-inline input.trasupload::-webkit-file-upload-button {
  visibility: hidden;
}

.form-inline input.navupload::before,
.form-inline input.cashupload::before,
.form-inline input.trasupload::before {
  content: 'NAV (.csv)';
  display: inline-block;
  background: linear-gradient(top, #f9f9f9, #e3e3e3);
  background-color: white;
  border: 1px solid #999;
  border-radius: 3px;
  padding: 5px 8px;
  outline: none;
  white-space: nowrap;
  -webkit-user-select: none;
  cursor: pointer;
  text-shadow: 1px 1px #fff;
  font-weight: 700;
  font-size: 10pt;
}

.form-inline input.cashupload::before {
  content: 'Bizonylat';
}

.form-inline input.trasupload::before {
  content: 'Document';
}

.form-inline input.navupload:hover::before, 
.form-inline input.cashupload:hover::before, 
.form-inline input.trasupload:hover::before {
  border-color: black;
  background-color:#fffff0;
}

.form-inline input.navupload:active::before, 
.form-inline input.cashupload:active::before, 
.form-inline input.trasupload:active::before {
  background: -webkit-linear-gradient(top, #e3e3e3, #f9f9f9);
}
.form-inline input.navupload {background-color:#e8e8e8; border: 0px solid black;}
.form-inline input.cashupload {background-color:#f0f0f0; border: 0px solid black;}
.form-inline input.trasupload {background-color:#f0f0f0; border: 0px solid black;}

input:hover, select:hover {background-color: #ffffe0;}
.form-inline input.date {width: 100px; text-align: center; padding:3px 0px;}
.form-inline select {margin: 4px 0px 0px 0px;}
.ascell {display: inline; padding-right: 5px;}
.ascellh {display: none; padding-right: 5px;}
.form-inline .ascell {margin-top: 10px;}
input:hover:disabled, select:hover:disabled {background-color: #ffffff;}

/*.divadmhead input[type=checkbox] {vertical-align:top; margin-top:5px;}
.divadmhead label {vertical-align:bottom; margin-bottom:14px; }*/

.upload-btn-wrapper {position: relative; overflow: hidden; display: inline-block; margin: 0px 0px 0px 0px; vertical-align: bottom; cursor: pointer;}
.upload-btn-wrapper input[type=file] {font-size: 30px; position: absolute; left: 0; top: 0; opacity: 0; cursor: pointer;}
.upload-btn-wrapper img { cursor: pointer;}

.mysign {width:500px; height: auto; margin: 0px auto; padding: 20px 0; background-color:#fff; color:#000;}
.pad {width:400px;}
.sigPad {
  width: 80%;
  margin: 0 auto;
}
.signed {
  width: 275px;
  margin: 0 auto;
}
.sigPad #submit {
  float: left;
  margin-top: 15px;
}
.sigPad #clear {
  float: right;
  margin-top: 15px;
}
.sigPad .sig.sigWrapper .pad {
  border: 1px dotted #999;  
}
.error { padding: 5px; background-color:#C00; color:#fff; width: 275px; }
.current .pad {
  cursor: url("pen.png") 8 8, crosshair;
}
.contdesc,.contdata {width: 800px;}
.contdata {text-align: left;}
.recbin {float: right; margin-left:10px;}

@media (max-width: 686px) {
  .error {font-size: 1.5em; width: 100%; text-align: center;}

  .form-inline {  
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    padding: 0px; margin: 0px;
  }

  .form-inline input, .form-inline select, table.wkinp tr td input, table.wkinp tr td select,.ascell select,.ascell input,.pinwin input {
    margin: 1px 6px;
    padding: 1px 4px;
    font-size: 1.8em;
    color: black;
    width: 99%;
    background-color:#e8f8ff;
    border-radius: 5px;
  }
  .form-inline input.num1 {width: 31px;}
  .form-inline input.num2 {width: 51px;}
  .form-inline input.num3 {width: 72px;}
  .form-inline input.num4 {width: 92px;}
  .form-inline input.num5 {width: 112px;}
  .form-inline input.num6 {width: 132px;}
  .form-inline input.num7 {width: 152px;}
  .form-inline input.num8,input.traybc {width: 174px;}
  .mysign {width: 90%}
  .pad {width: 100%;}
  .form-inline input.date {width: 140px;}
  .form-inline input:hover, .form-inline select:hover {
    background-color: #fffff0;
  }
  .form-inline label,.form-inline legend {width: 100%}
  .form-inline span.pallet {font-size: 0.8em;}
  .divadmhead label {width: 80%; font-size: 1.5em; color:#007; padding: 0px 0px 0px 3px; display: inline;}
  .ascell label {font-size:1.5em; padding-left: 6px; margin-bottom: 6px; vertical-align: middle;}
  legend {font-size:1.5em; padding-left: 6px; margin-bottom: 6px; vertical-align: middle; text-align: center;}
  .err {font-size:1.5em; padding: 0px; margin: 20px 6px 10px 6px; vertical-align: middle; text-align: center;}
  .ascell input[type=checkbox] {
    padding:5px 5px 5px 2px; margin-bottom: 3px; white-space: nowrap; width: 25px; height: 25px; float:right;}
  .ascell input[type=radio] {
    padding:5px 5px 5px 2px; margin-bottom: 3px; white-space: nowrap; width: 25px; height: 25px; float:right;}
  .ascell {display: block; width: 100%;}
  input[type=submit],input[type=button] {
    background-color: #f0fff0;
  }
  .form-inline .pincode {width: 65px; padding: 3px 5px;} 
  table.wkinp {width: 60%; font-size: 13.33px;}
  table.wkinp tr th {width: 10%; font-size: 1.2em; text-align: center;}
  table.wkinp tr td input.date {width: 160px;}
  .form-inline button {font-size: 1.5em; font-weight: bold; margin: 5px; width: 99%;}
  .form-inline {
    flex-direction: column;
    align-items: stretch;
  }
  textarea {width: 100%; font-size: 1.3em;}
  .pinwin {
    background-color:#FFF;
    position: static;
    display: inline-block;
    top: 0.2%; left: 1%; width: 100%;
    padding: 15px 5px 5px 5px;
    text-align: center;
    display: none; /*inline-block;*/
    font-size: 2em;
    margin-left: 0px;
  }
  .pinwin p {text-align: center; margin: 10px}  
  .pinwin input {width: 60%}
  .pinwin img {width: 6%;}
  .upload-btn-wrapper img {height: 80px; margin: 10px 35%;}
}

/* ShowArr */
table.showarr {border: 1px solid #666;}
.showarr th {font-size: 8pt; color:#777; border: 1px solid #666; padding: 0px 4px 0px 4px; text-align: center; vertical-align: middle; }
.showarr td {font-size: 10pt; color:#000; border: 1px solid #999; padding: 0px 1px 0px 1px; text-align: center; vertical-align: middle;}
.submit {border-radius: 4px; padding: 2px 7px; background-color:#f2f2f2; }
.submit:disabled,input[type=submit][disabled=disabled],button[disabled=disabled]  {color:#aaa;}

#loadcont {position: fixed; left: 400px; top: 10px; background-color: white; border: 1px solid #000; border-radius: 5px; padding: 6px;}
div.headdiv {background-color:#f8f8f8; border-bottom: 1px solid #aaa;}
div.divadmhead {padding: 4px; background-color:#f4f4f4; border-bottom: 1px solid #aaa;}
div.divadmbody {padding: 4px 10px; background-color:#E8E8E; border-bottom: 1px solid #aaa; display: none;}
div#editor, div.editor,div.editor2 {padding: 4px 10px 6px 10px; border-bottom: 1px solid #aaa; background-color:#f0f0f0; width: 100%}
div.editor { display: none;}
.editor th {padding: 0px 5px; font-size: 0.95em;}
div.tools {padding: 4px 10px 6px 10px; border-bottom: 1px solid #aaa; background-color:#e8e8e8; width: 100%}
.tools td,.editor td {padding: 5px; vertical-align: middle;}
div.maindiv {padding: 5px 10px 3px 10px; background-color:#d8d8d8; border-bottom: 1px solid #c0c0c0; margin-bottom: 5px;}
table.worktbl,table.roletbl,table.roletbl2 {text-align:center; border: 2px solid #000; border-radius: 5px; margin-right: 5px; margin-bottom: 5px; }
.worktbl td,.roletbl td,.roletbl2 td {border: 1px solid #777; padding: 3px 5px; text-align: right; vertical-align: middle;  background-color:#f0f0f0;}
.worktbl th,.roletbl th,.roletbl2 th, .worktbl td.lochead,.scale th {
  border: 1px solid #777;  padding: 3px 5px; font-style: italic; text-align: center;vertical-align: middle; font-size: 0.8em; background-color:#e0e0e0;}
.roletbl2 td,.roletbl2 th {padding: 3px 2px; font-size: 8pt;}
.worktbl th {border-top: 0px solid #000;}
.roletbl td,.roletbl th,.roletbl2 td,.roletbl2 th {text-align: center;}
/*table.worktbl tr:nth-child(odd) td {background-color: #f8f8f8;}
table.worktbl tr:nth-child(even) td {background-color: #e8e8e8;}*/
table.itemtbl {text-align: center; border: 2px solid #000; border-radius: 5px; margin-right: 5px; margin-bottom: 5px;}
.itemtbl td {border: 1px solid #777; padding: 3px 5px; text-align: right; vertical-align: middle;  background-color:#f0f0f0;}
.itemtbl th {border: 1px solid #777;  padding: 3px 5px; font-style: italic; text-align: center;vertical-align: middle; font-size: 0.8em; background-color:#e0e0e0;}
.itemtbl td.vatop {vertical-align: top;}
/*.itemtbl th {border-top: 0px solid #000;}*/
/*table.itemtbl tr:nth-child(odd) td {background-color: #f8f8f8;}
table.itemtbl tr:nth-child(even) td {background-color: #e8e8e8;}*/
.mtask {margin: 5px;}
td.newloc {vertical-align: top;}
td.mtask_created {width: 80px; text-align: center; vertical-align: top;font-size: 0.8em;}
td.mtask_loc {text-align: center; vertical-align: top;}
td.mtask_desc,td.spr_desc {text-align: justify; vertical-align: top;}
td.mtask_desc1 {color: blue;}
td.mtask_desc2 {color: green;}
td.mtask_stat {width: 120px; text-align: center; vertical-align: top; font-size: 0.8em;}
td.spr_date {font-size: 0.9em; width: 70px; vertical-align: top; text-align: center;}
.inp_spr_date {width: 80px;}
input.sprnewdate {width: 80px;}
td.spr_spr {width: 120px; text-align: center; vertical-align: top;}
td.spr_qua {width: 80px;}
td.empty, th.empty {border: 0px solid #000; background-color:#bbb;}
td.empty2, th.empty2 {border: 0px solid #000;}
tr.dat td {font-size: 1.4em;}
tr.itemtr td {font-size: 1em;}
tr.loc td {font-size: 1.2em;}
tr.loc td.empty2 {border-top: 1px solid #777;}
.trsum td {border-bottom: 2px solid #000; font-style: italic; }
td.aleft {text-align: left;}
td.aright {text-align: right;}
tr.tas td,tr.loc td.tas {font-size: 0.9em;}
tr.tas td.hourloca {border-left: 1px solid #777;}
td.acent {text-align: center;}
th.taskname {width: 300px;}
th.matername {width: 200px;}
th.quant {width: 100px;}
th.hourloca {width: 200px;}
th.itloca {width: 120px;}
th.ittype {width: 180px;}
th.itdate {width: 80px;}
th.mdate {width: 120px;}
th.itacc {width: 180px;}
th.boss {width: 100px;}
td.ordid {font-size: 10pt;}
td.ordate {font-size: 8pt; text-align: center;}
span.orema {font-size: 10pt;}
.ostatus {margin: 0px 1px 0px 0px;}
td.orpnam {font-size: 9pt; text-align: center;}
div.orcomm {text-align: left; font-size: 8pt; line-height: 8pt; max-height: 24pt; overflow: hidden; text-overflow: ellipsis; 
           display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;}
td.orcomm {max-width: 400px;}
.listcash {display: none;}
tr.height0 {height: 0px; padding: 0px; border-bottom: 0px solid #000; display: none;}
table.wkinp td {text-align: left;}
table.wkinp th {text-align: left; border-top: 1px solid #777;}
a.pickprint {font-size: 10pt;}
tr.wksum td (border-bottom: 4px solid #000;);

.reagsel {font-size: 20pt; color: red; height: 36px;}
td.packdate {width: 80px; font-size: 0.8em;}
.small {font-size: 0.8em;}
.bgc0 td,.bgc0 th {background-color:#f8f8f8;}
.bgc1 td,.bgc1 th {background-color:#e8e8e8;}
.bgc0d td,.bgc0d th {background-color:#f8e8e8;}
.bgc1d td,.bgc1d th {background-color:#e8d8d8;}
.bgc0h td,.bgc0h th {background-color:#ffffe8;}
.bgc1h td,.bgc1h th {background-color:#eeeec8;}

.nopack td {color:#aaa;}
.bgc0t td,.bgc1t td {background-color:#f8f8d0;}
.attcol0,.attcol00,.attcol01 {color:#808080;}
.attcol1,.attcol10,.attcol11 {color:#0000ff;}
.attcol2,.attcol20,.attcol21 {color:#008000;}
.attcol3,.attcol30,.attcol31 {color:#880088;}
.attcol4,.attcol40,.attcol41 {color:#000000;}
.attcolerr {color: red;}
.attcol01 td, .attcol11 td, .attcol21 td, .attcol31 td, .attcol41 td, .attcolerr td {font-weight: bold;}
.afterddln {font-weight: bold; color: red;}
.invpayed {width: 66px; text-align: right;}
.tk{ /*Liquid Section*/
    position: relative; width: 200px; height: 200px;
    padding-top: 50px; margin: 0 auto;
    background: rgba(0,0,255,0.8);
    border-radius: 100%/40px;
    border-bottom: 3px solid #000;
    text-align: center;
    z-index: 1;
    overflow: hidden;
    color: white;
    font-size: 1.2em;
    font-weight: bold;
}
.tk:after, .lq{
    content:'';
    position: absolute;
    top: 0; left: 0; width: 100%; height: 20%;
    z-index: -1;
}
.lq{
    background: rgba(188,188,188,1);
    height: 80%; top: -2px;
    border-radius: 100%/40px;
    border-bottom: 3px solid #000;
}
.tk:after{
    height: 20%;
    border: 1px solid #000;
    border-radius: 100%; /*makes circle at top*/
}
.milli {font-size: 0.8em; font-weight: normal;}
.milli2 {font-size: 0.7em; font-weight: normal;}
.temp td {
  font-size: 10pt;
  padding: 6px;
  line-height: 0.9em;
  vertical-align: bottom;
}
.temp td.lesser { font-size: 0.8em;}
.celsi {font-size: 1.1em; font-weight: bold; text-align: right;}
.tankname {padding-top: 5px; text-align: center; font-weight: bold;}
.warn {color: red;}
.dele {color: #a0a0a0;}
.plus {color:#00a000;}
.tdchart {background-color: blue; width: 2px; height: 200px;}
.bar {width:2px; background-color: blue;}
.barlast {width:1px; background-color: blue; border-right: 1px solid #0000f0;}
.bar:hover,.barlast:hover {background-color:#00ffff; border-color:#00ffff;}
.emptybar {width: 2px; background-color: white;}
.emptybarlast {width: 1px; background-color: white; border-right: 1px solid #f8f8f8;}
table.info td {padding: 4px;}
.diagnum,.diagday,.diagdayV {font-size: 0.6em; text-align: center; background: white; border-right: 1px solid #f0f0f0; padding: 2px 0px; border-top: 1px solid #f0f0f0;}
.diagday {font-weight: bold;}
.diagdayV {font-weight: bold; color:#C00;}
table.diag {margin-bottom: 6px;}
table.diag td {padding: 0px;}
#diagdys {display: none;}
.diagbott {font-size: 0.8em;}
div.sms,div.sms2 {width: 150px; height: 14px; overflow: hidden; vertical-align: bottom;}
div.sms2 {width: 220px; height: 17px}
div.scroll {width: 1500px; height: 18px; position: relative;padding-top: 0px;}
div.scrollsc { padding-top: 2px; }
.simnum {font-size: 0.8em;}
tr.devdat td {line-height: 0.7em;}
.scale  {font-size: 0.9em; border: 2px solid #000;}
.inven td,.inven th {font-size: 0.8em; border: 1px solid #000;}
.info td .scale td {
/*  font-size:11pt;
  line-height:0.9em;
  */
  vertical-align: middle;
  padding: 4px 5px;
  border: 1px solid #777;
}
td.padding0 {padding: 0px;}
table.scale tr:nth-child(even),table.wkinp tr:nth-child(odd) td,table.wkinp tr:nth-child(odd) th td {background-color: #f8f8f8;}
table.scale tr:nth-child(odd),table.wkinp tr:nth-child(odd) td,table.wkinp tr:nth-child(odd) th {background-color: #e8e8e8;}
tr.closeerr td,.closeerr {color: red; font-weight: bold;}
.myatt_dt {font-size: 2em; font-weight: bold; margin: 5px;}
/*#myclose,#myill,#mypaid {font-size: 1.2em; font-weight: bold; margin: 5px;}*/
.workhour {font-size: 2em; padding-left: 6px}
form.loginas {display: inline;}
.employer {font-weight: bold; font-size: 20px;}
table.deliv {background-color:#fff; color:#000; border: 2px solid #000;}
table.deliv td {padding: 4px; border: 0px solid #000;}
table.deliv th {padding: 4px 6px; border: 0px solid #000; font-style: italic;}
table.deliv td.leftbord2 {border-left: 2px solid #000;}
tr.bottbord2 td,tr.bottbord2 th {border-bottom: 2px solid #000;}
tr.topbord2 td,tr.topbord2 th {border-top: 2px solid #000;}
.smallcell {width: 30px;}
.paper {width: 1000px; background-color:#fff;}
table.salahr {border: 2px solid #000;}
table.salahr th {border: 1px solid #000; font-style: italic; font-size: 0.9em; text-align: center; padding: 5px;}
table.salahr td {border: 1px solid #000; text-align: center; padding: 5px;}
.salahrfoot {font-size:1.4em; text-align:left; padding:10px 100px;}
.salafoot {font-size:1.4em; text-align:left; padding:10px 100px 0px 100px; margin-bottom:0px;}
table.salahr th.slip {width:45px;}
td.tdvatop {vertical-align: top;}
table.wrkpaygrp {border:1px solid #000;}
.invpdf, .wbpdf, .packok, .shipok {font-size: 1em; font-weight:bold; background-color: #ffe;}
.invpdf:disabled {background-color:#eee;}
.bgc0t td .packok,.bgc1t td .packok,.bgc0t td div .invpdf, .bgc1t td div .invpdf {background-color:#efe;}
.price { background-color:#ffe; font-size:1.1em; width:50px; text-align:right; font-weight:bold;}
input.priced { background-color:#ffe; font-size:1.0em; width:114px; text-align:center; font-weight:bold; }
.cl_input,#cl_show,#attachment 
   {border:2px solid black; border-radius:10px; margin:4px; 
    position: absolute; top: 150px; left:840px; background-color: #888; color: #fff; display:none;
    padding: 3px 5px; text-align:center; vertical-align:middle; font-size:1.2em;}
.cl_input table,#cl_show table {margin:5px 0px; border-radius: 4px; border: 1px solid #666;}
.cl_input td,#cl_show td {background-color: #eee; color: #000; padding: 2px 4px 2px 0px;}
.cl_input td:first-child,#cl_show td:first-child {padding-left: 4px;}
.cl_input select,.cl_input input {border: 1px solid #888; height: 22px; border-radius: 3px;}
cl_input input{width: 40px; text-align: right; font-weight: bold;}
input.claminp  {width: 66px; text-align: right; font-weight: bold;}
#clclash_input input {width: 60px; text-align: right; font-weight: bold;}
.cl_input input[type=button] {color: red;}
#attachment {padding: 0px;}
#attachment img {border-radius: 8px;}
.attach {margin-left: 1px; border-radius: 4px;}
.costloc,.clcash {font-weight: bold; }
.clOK {font-weight: normal; color:#00dd00;}
input.clsub {color:#000; padding: 0px 2px; margin: 0px; border: 0px solid #fff; font-size: 1.0em; width: 24px; vertical-align: top;}
input.clname {border: 1px solid #000;}
input.trayprc {width: 54px; font-size: 1.1em; text-align: right; font-weight: bold;}
.close-link,.ccw-link,.cw-link {color:#ffffff; opacity: 0.7; position: absolute; width: 8%;}
.close-link {top: 0.5%; right: 0.5%}
.ccw-link {top: 0.5%; left: 0.5%;}
.cw-link {bottom: 0.5%; right: 0.5%}
.close-link:hover,.ccw-link:hover,.cw-link:hover {color:#ffffff;  opacity:1;}
th.sumr{text-align: right; font-size: 1em;}
th.suml{text-align: right; font-size: 0.9em;}
.ordstasel {font-size: 0.6em; vertical-align: top;}
.wbitem td {padding: 0px 3px;}
.wbitem th {font-size: 0.9em; font-style: italic; padding: 0px 13px; 0px 3px}
table.reag td {border: 0px solid black;}
.swapimg {width: 18px; vertical-align: bottom;}
.swapimg:hover, span.tray:hover, span.trayord1:hover, span.trayord2:hover {cursor: pointer;}
span.tray {background-image:url("image/tray.png"); font-weight: bold; text-align: center; padding: 0px 15px 13px 15px; background-repeat: no-repeat; font-size: 1.1em; display: inline-block; width:63px;}
input.traybc {text-align: right; padding: 1px 4px;}
input.weight {margin-right: 0px; width: 56px; text-align: right;}
.scalerefresh {vertical-align: middle; border: 0px;}
input.taxbc {text-align: right; padding: 1px 4px; width: 110px;}
span.pallet {background-image:url("image/pallet.png"); font-weight: bold; padding: 2px 23px 16px 23px; background-repeat: no-repeat; font-size: 1.1em; display: inline-block; }
.trayw {font-size: 1.8em;}
.ltstat0 {font-weight: bold;}
.ltstat1 {color:#777;}
.ltstat2 {color:#F77;}
.ltstat00 {}
.ltstat01 {font-weight: bold;}
.ltstat10 {color:#777;}
.ltstat11 {color:#777; font-weight: bold;}
.ltstat20 {color:#F77;}
.ltstat21 {color:#F77; font-weight: bold;}
.loctask {width: 100%; background-color:#e8e8e8; padding: 10px; border: 3px solid #a0a0a0; border-top-color: #f0f0f0; border-left-color:#f0f0f0;}
.lthead {margin-bottom: 6px; text-decoration: underline; font-weight: bold; font-size: 1.3em;}
.loctask table tr td {padding: 5px 0px;}
.ltdel,.tdel,.ptdel {border-radius: 12px; border: 2px solid #FFA0A0; background-color:#ffd0d0;}
.ddwbshow {margin-top: 5px;}
.ddwbshow:hover {cursor: pointer;}
.upload-btn-wrapper img:hover,.showface {cursor: pointer;}
.curtime,.chkname,.chkdir,.chktime {font-size: 2em; font-weight: bold;}
.chkdir0 {color:#0000ff;}
.chkdir1 {color:#008000;}
.curtime {color:#666666;}
.workerface {width: 300px; margin-left: 20px; border: 9px solid white; border-radius: 3px;}
.faceact {border-color:yellow;}
.facehover {opacity: 0.3; border-color: yellow;}
.barcode {font-size: 2em; font-weight: bold; width: 156px;}
.facediv {width: 300px; padding: 160px 100px; margin-left: 20px; border: 9px solid white; border-radius: 3px; background-color:#ccc;}
.facedivhover {opacity: 0.3; border-color:#ff0; }
.facedivact {border-color:#ff0;}
#facepic {position: absolute; display: none; width: 300px; border: 9px solid white; border-radius: 3px;}
.showface {font-weight: bold;}
.wbsell {margin: 3%; width: 94%; display: none;}
.wbsell th {background-color:#c0c0c0;}
.wbsell td {background-color:#ffffff;}
.conttitle {font-size: 3em;}
.contdesc {text-align: justify;}
.contdata table td {border: 0px solid #000; padding: 5px 5px 0px 0px;}
.wschr,.wscpic {position: relative; width: 800px; background-color: green;}
/*.wscpiccontainer {position: relative; background-color: red; display: inline; padding:2px 2px;}*/
.wscvote {position: absolute; left: 35px; bottom: 4px; font-size: 1.4em; color: #ffffff; background-color: rgb(10,10,10); background-color: rgba(10,10,10,0.3); 
          padding: 5px 10px 5px 5px; border-radius:0px 6px 6px 0px;}
.wsclike {position: absolute; left: 8px; bottom: 4px; background-color: rgb(10,10,10); background-color: rgba(10,10,10,0.3); 
          padding: 6px 0px 7px 5px; border-radius: 6px 0px 0px 6px;}
.wscliked {position: absolute; left: 8px; bottom: 4px; background-color: rgb(10,10,10); background-color: rgba(10,10,10,0.3); 
          padding: 6px 0px 7px 5px; border-radius: 6px 0px 0px 6px; }
.likeimg,.likedimg {width: 2px;}
.likeimg { cursor: pointer;}
input.timeinp {width: 42px;}

* {
  box-sizing: border-box;
}
.container {
  position: relative;
  max-width: 780px; /* Maximum width */
  margin: 0 auto; /* Center it */
}

.container .content {
  position: absolute; /* Position the background text */
  bottom: 0; /* At the bottom. Use top:0 to append it to the top */
/*  background: rgb(0, 0, 0); 
  background: rgba(0, 0, 0, 0.5); 
  color: #f1f1f1; 
  width: 100%; 
  padding: 20px; */
}

.row {
  display: -ms-flexbox; 
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding: 0 4px;
}

.column {
  -ms-flex: 50%;
  flex: 50%;
  max-width: 50%;
  padding: 0 4px;
  position: relative;
}

.column .appli {
  margin-top: 8px;
  vertical-align: middle;
  width: 100%;
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 800px) {
  .column {
    -ms-flex: 100%;
    flex: 100%;
    max-width: 100%;
  }
  .contestimg,.contdesc,.contdata {width: 100%}
  .wschr {width: 100%}
}          
.taskcomm {color:#000080;}
.bankinc,.bankcas,.banksal,.bankloan {font-weight: bold}
.oldincpay {color:#A0A0A0;}
.itemtbl td table.nobord td {border: 0px solid #000;}
.bankemp td {font-size: 0.8em; padding: 0px 4px;}
.bankemp {float: left; margin-right: 20px;}
.fuelOK {color:#00A000;}
.slipatt {float: right; height: 35px; padding-left: 4px;}
.lph {color:#000080; font-weight: bold;}
.lp100km {color:#006000; font-weight: bold;}
.hoursel {padding: 0px;}
.attcnt {/*position: relative; left:-27px; top:-8px; background-color: rgba(0,0,0,0.2); color:#ffffff;*/ 
         font-weight: bold; font-size: 1.3em; padding: 7px 10px 7px 9px; border-radius: 5px; text-align: center;
         background-image: url(image/docframe_small.png); background-repeat: no-repeat; vertical-align: middle;}
.addatt {font-size: 1.5em; font-weight: bold;cursor:pointer; padding: 0px 0px 0px 4px;}         
div.multiatt {position: absolute; padding: 5px; background-color:#eee; border-radius: 8px; border: 1px solid #777; display: none; z-index: 1000;}
.miniordstat {font-size: 0.6em; padding-left: 2px;}
.downcsv {cursor: pointer;}
.padelsta {width: 14px; height: 14px; color:#fff; background-color: red; border-radius: 4px; padding: 0px; font-size: 7px; vertical-align: bottom; margin-left: 2px; border: 1px solid black;}
.checkinsel {font-size: 2em; vertical-align: top; font-weight: bold;}
.recbin {opacity: 0.3; border-radius: 16px; padding: 4px;}
.binhover {opacity: 1; background-color: rgba(255,0,0,0.5);}
.binact {opacity: 1;}

.inptpt,#inptp1,#inptp2,#inptp3,#inptp4,#inptp5,#inptp6,#inptp7,#inptp8,#inptp9,#inptp10,#inptp11,#inptp12,#inptp13,#inptp14,#inptp15 {display:none;}
.inptpt:checked + label {font-weight:bold; background-color:#ff8;}
div.qualcheck, div.pallist {position: fixed; top:10vh; left:0.5vw; border: 1px solid #909090; padding:12px 5px 5px 10px; background-color: #e8e8e8; display:none;}
.ift2,.ift3,.ift4 {color: #00f; font-weight: bold;}
.ift3 {color: #0dd;}
.ift4 {color: #0b0;}
div.pallist {top:3vh; max-height:94vh; overflow: auto;}
.cashdatesw {font-weight: bold; font-family: monospace, monospace;}
.whuni {font-size: 0.8em; vertical-align: middle; padding-left: 4px;}
.whout {color: blue;}
.delpay {border: 1px solid #800; border-radius:12px; width: 24px; height: 24px; background-color: #c00; color: white; font-size:0.6em; font-weight: bold;}
input.delpay:hover {background-color: #ff0000; color: #ffff00;}
.searchres {border: 1px solid black; border-radius: 5px; position: fixed; width: 560px; left: 320px; display: none; padding:2px; background-color: #ffffc0;}
table.srtab {border-collapse: collapse; font-size: 1.5em; }
table.srtab tr:nth-child(even) td {background-color: #ffffc0;}
table.srtab tr:nth-child(odd) td {background-color: #ffffe0;}
.searchres  td {padding: 1px 5px;}
.pale {opacity: 0.5;}
.cardname {font-size:2em; font-weight:bold; text-align: center; vertical-align:top}
.cardimg {max-width:174px; max-height:236px; width: auto; height: auto; padding:5px 0px;}
.palwei {font-size: 0.95em; line-height: 0.8}
.palwei td {border-width: 0px; padding: 0px 0px 1px 0px; font-weight: bold; text-align: right;}
.palwei tr {padding:0px;}