/* CSS File for Backwater */

/**************************************
* Site-Wide Settings
**************************************/
/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

table { table-layout: fixed; width: 100%;}


/* td.sku    { width:  50px; max-width:  50px; }
td.mfg    { width: 150px; max-width: 150px; }
td.mfgn   { width: 200px; max-width: 200px; }
td.ti     { min-width: 300px; text-align: left; }
td.price  { width:  80px; max-width:  80px; text-align: right; padding-left: 3px; padding-right: 3px; }
td.qty    { width:  50px; max-width:  50px; }
td.action { width:  50px; max-width:  50px; } */

th, td { padding-left: 2px; padding-right: 2px; overflow: hidden;}

/* Table Formatting */
#td.last    { width:  50px; max-width:  50px; }

th.id    { width: 200px; max-width: 200px; }
th.full_name { width: 200px; max-width: 200px; }
th.last   { width: 100px; max-width: 100px; }
th.first  { width: 100px; max-width: 100px; }
th.email  { width: 200px; max-width: 200px; }

th.sku    { width:  50px; max-width:  50px; }
th.mfg    { width: 150px; max-width: 150px; }
th.mfgn   { width: 200px; max-width: 200px; }
th.ti     { min-width: 400px; text-align: left; }
th.price  { width:  80px; max-width:  80px; }
th.qty    { width:  50px; max-width:  50px; }
th.action { width:  50px; max-width:  50px; }

th.binary { width:  50px; max-width:  50px; }
th.full_address { width:  250px; max-width:  250px; }
th.notes { min-width: 100px; text-align: left; }

th.width_80  { width:  80px; max-width:  80px; }
th.width_100 { width: 100px; max-width: 100px; }

/* Table Field/Value */
table.field_value th       { display: hidden; }
table.field_value th.field { display: hidden; text-align: right; width: 100px; }
table.field_value th.value { display: hidden; text-align: left;  width: 300px;  }
table.field_value td.field { text-align: right; width: 100px; font-weight: bold; }
table.field_value td.value { text-align: left;  width: 300px; }

td.CHANGE{
  background-color: yellow;
}

tr.CHANGE{
  background-color: yellow;
}

th span.ninety
{
     -ms-writing-mode: tb-rl;
 -webkit-writing-mode: vertical-rl;
         writing-mode: vertical-rl;
            transform: rotate(180deg);
          white-space: nowrap;
}

th.th_bottom
{
  vertical-align: text-bottom;
}

dl.customer_info dt {  }
dl.customer_info dt {  }

dt { float: left; clear: left; width: 6em; font-weight: bold; }
dd { float: left; }

.slidecontainer {
  width: 100%; /* Width of the outside container */
}

/* The slider itself */
.slider {
  -webkit-appearance: none;  /* Override default CSS styles */
  appearance: none;
  width: 100%; /* Full-width */
  height: 25px; /* Specified height */
  background: #d3d3d3; /* Grey background */
  outline: none; /* Remove outline */
  opacity: 0.7; /* Set transparency (for mouse-over effects on hover) */
  -webkit-transition: .2s; /* 0.2 seconds transition on hover */
  transition: opacity .2s;
}

/* Mouse-over effects */
.slider:hover {
  opacity: 1; /* Fully shown on mouse-over */
}

/* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */
.slider::-webkit-slider-thumb {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  width: 25px; /* Set a specific slider handle width */
  height: 25px; /* Slider handle height */
  background: #04AA6D; /* Green background */
  cursor: pointer; /* Cursor on hover */
}

.slider::-moz-range-thumb {
  width: 25px; /* Set a specific slider handle width */
  height: 25px; /* Slider handle height */
  background: #04AA6D; /* Green background */
  cursor: pointer; /* Cursor on hover */
}

/* TR TD Colors */
td.odd      { background-color:#e0e0e0; }
td.even     { background-color:#ffffff; }
td.inactive { background-color:#808080; }
td.on_pnp   { background-color:lightblue; }
td.new      { background-color:lightgreen; }

th { box-sizing: border-box; }

/* TD Widths */
/*td.ID       { width: 150px; column-width: 150px; }*/
th.SORT,
th.SORT img      { height: 40px; line-height: 10px; padding-top:0px; padding-bottom:0px; margin:0px; }
th.PART_ID       { width:  30px; }
th.PART_PARTNO   { width: 170px; }
th.PART_ICON     { width:  25px; }
th.PART_SERIAL   { width:  80px; }
th.PART_SER_SHRT { width: 100px; }
th.PART_SER_LONG { width: 160px; }
th.PART_MFG      { width: 200px; }
th.PART_MPN      { width: 200px; }
th.PART_DESC     { width: 300px; }
th.PART_QTY      { width:  95px; }
th.PART_COST     { width:  70px; }
th.PART_DC       { width:  35px; }
th.PART_NOTES    { width: 300px; }
th.PART_TS       { width: 140px; }

td.LEFT  { text-align: left;  }
th.LEFT  { text-align: left;  }
td.RIGHT { text-align: right; }
th.RIGHT { text-align: right; }
td.HIDDEN { border: none; background: transparent; }
th.HIDDEN { border: none; background: transparent; }
td.WRAP  { white-space: wrap; word-wrap: break-word; overflow:visible; }

th.CONTACT_ID         { width:  30px; }
th.CONTACT_ICON       { width:  30px; }
th.CONTACT_EMAIL      { width: 200px; }
th.CONTACT_NAME       { width:  80px; }
th.CONTACT_NAME_LONG  { width: 120px; }
th.CONTACT_PHONE      { width: 100px; }
th.CONTACT_COMPANY    { width: 200px; }
th.CONTACT_ADDRESS    { width: 150px; }
th.CONTACT_CITY       { width:  80px; }
th.CONTACT_STATE      { width:  40px; }
th.CONTACT_ZIP        { width:  60px; }
th.CONTACT_TAGS       { width: 200px; }
th.CONTACT_NOTES      { width: 275px; }
th.CONTACT_TS         { width: 140px; }


p.LEFT  { text-align: left;  }
div.LEFT  { text-align: left;  }