﻿@page { margin: 0.5in; } /*===PAGED MEDIA (IE: PRINTER)===*/
@media print {
    .noprint {
        display:none !important;
    }
    .noprintShadow {
        box-shadow:none !important;
    }
}
@media screen {
    .noscreen {
        display:none !important;
    }
}
html { height:100%; width:100%; }
body { position:relative; height:100%; width:100%; padding:0; margin:0; }
@media print {
    body {
        print-color-adjust:exact;
    }
}
a { text-decoration: none; }
a:link, a:visited { color:blue; }
abbr { cursor:help; }
pre { tab-size:4; }
textarea { tab-size:4; }
input[type=text]:read-only {
    padding: 3px;
    background:#E9E9E9;
    border: 1px solid black;
}
.cb { clear:both; }
.cba:after { content:''; display:block; clear:both; }
.FloatRight { float:right; }
.FloatLeft { float:left; }
/* Fix to make sure Excell does not interpet a line break as a new row */
br { mso-data-placement:same-cell; }
.inBtnClr {
    border:none;
    padding:0;
    background:none;
}
.inBtnClr:focus {
    outline:none;
}
table {
    border-collapse:separate;
    border-spacing:0px;
}
.bread {
    display:table;
    margin-left:auto;
    margin-right:auto;    
    margin-bottom:15px;
    text-align:left;
}
/*.bread > *:not(:last-child):after {
    content:' > '
}*/
@media print {
    .bread {
        display:none !important;
    }
}
/* Font for Code 39 barcodes */
@font-face {
    font-family:WebCode39;
    src: url(/fonts/WebCode39H3.woff) format("woff");
    font-weight:normal;
    font-style:normal;
}
/* Font for Code 128 barcodes */
@font-face {
    font-family:WebCode128;
    src: url(/fonts/WebCode128H3.woff) format("woff");
    font-weight: normal;
    font-style: normal;
}
/*=== Page Headers, Content, Footers ====*/
.PageHead {
    display:table-header-group;
    position:relative;
}
.PageHead > div:nth-child(1) {
    position:absolute;
    top:4px;
    left:4px;
    font-size:medium;
}
.PageHead > img {
    position:absolute;
    top:4px;
    right:0;
}
.PageHead > div:nth-child(3) {
    text-align:center;
    font-size:medium;
    color:#0000FF;
    margin-top:20px;
}
@media print {
    .PageHead > div:nth-child(3) {
        margin-top:0px;
        margin-bottom:7px;
    }
}
.PageHead > div:nth-child(4) {
    text-align:center;
    font-size:small;
    color:#0000FF;
    margin-bottom:15px;
}
@media print {
    .PageHead > div:nth-child(4) {
        display:none !important;
    }
}
.PageFoot {
    display:table-footer-group;
}
.PageCont {
    display:table;
    padding:0;
    margin:0;    
    width:100%;
}
/* === Login Table === */
.LoginCont {
    display:table;
    margin:0 auto;
}
.LoginCont > div:nth-child(1) {
    text-align:center;
    font-weight:bold;
    font-size:large;
    margin-bottom:25px;
}
.LoginCont > div:nth-child(2) {
    margin:30px 0 15px;
}
.LoginCont > table {
    width:315px;
    border-collapse:separate;
    border-spacing:0px;
    /*background-color:#C0C0C0;*/
    background:rgba(160, 205, 255, 0.70);
    box-shadow:3px 3px 15px 0px rgba(0,0,0,0.70);
    border-radius:5px;
    padding:10px;
}
.LoginCont > table > tbody > tr > th,
.LoginCont > table > tbody > tr > td {
    padding:5px;
    white-space:nowrap;    
}
.LoginCont > table > tbody > tr:last-child td {
    text-align:center;
    padding-top:20px;
}
.LoginCont input[type=text],
.LoginCont input[type=password] {
    width:200px;
}
/*===Text Buttons===*/
button,
input[type=submit],
.btnStd {
    background:#c9c9c9;
    background:linear-gradient(to bottom, #e8e8e8, #cfc9cf);
    display:inline-block;
    color:black;
    padding:2px 8px;
    margin:0px;
    text-decoration:none;
    border:1px solid black;
    font-family:Arial;
    font-size:15px;
    cursor:default;
    /*margin:5px;
    box-shadow:inset 0px 1px 0px 0px #ffffff;
    background:linear-gradient(to bottom, #f9f9f9 5%, #e9e9e9 100%);
    background-color:#f9f9f9;
    border-radius:6px;
    border:1px solid #dcdcdc;
    display:inline-block;
    cursor:pointer;
    color:#666666;
    font-family:Arial;
    font-size:15px;
    font-weight:bold;
    padding:6px 24px;
    text-decoration:none;
    text-shadow:0px 1px 0px #ffffff;*/
}
button:hover,
input[type=submit]:hover,
.btnStd:hover {
  background:#808080;
  background-image:linear-gradient(to bottom, #cfc9cf, #e8e8e8);
}
button:link, button:visited,
input[type=submit]:link,
input[type=submit]:visited,
.btnStd:link,
.btnStd:visited {
    color:black;
}
button:disabled,
input[type=submit]:disabled,
.btnStdDisable {
  background:#c9c9c9;
  background-image:linear-gradient(to bottom, #cfc9cf, #e8e8e8); /*Reverse shading*/
  color:gray;
  padding-left:8px;
  padding-right:8px;
  text-decoration:none;
  border:1px solid black;
}
input[type=submit]:disabled:link,
input[type=submit]:disabled:visited,
.btnStdDisable:link,
.btnStdDisable:visited {
    color:gray;
}
/*===Prod Description Div===*/
.InfoProd {
    float:left;
    margin-top:20px;
    margin-right:25px;
}
/*===Track Description Div===*/
.InfoTrack {
    float:left;
    margin-top:20px;
}
/*=====================*/
.tStdCont2 {
    border-collapse:separate;
    border-spacing:0;
}
.tStdCont2 > tbody > tr > td {
    vertical-align:top;
}
.tStdCont2 > tbody > tr > td:first-child {
    padding-top:4px;
}
/*===Faux Table Standard===*/
 .fCont {
    max-width:510px;
    background:rgba(160, 205, 255, 0.70);
    box-shadow:3px 3px 15px 0 rgba(0,0,0,0.70);
    border-radius:5px;
 }
 .fCont > div.fMnuAct {
     text-align:center;
     padding:5px;
     color:red;
     font-weight:bold;
 }
 .fCont > div.fMnuAct > a:link,
 .fCont > div.fMnuAct > a:visited,
 .fCont > div.fMnuAct > a:active {
     color:red;
 }
 .fCont > div.fMnu {
    display:flex;
    flex-direction:row;
    justify-content:center;
    align-items:stretch;
    flex-wrap:wrap;
    align-content:flex-start;
}
.fCont > div > div h2 {
    font-weight:bold;
    font-size:14px;
}
/*===STANDARD TABLE===*/
.tStd {
    border-collapse:separate; /* Separate allows for curved cornders */
    border-spacing:0;
}
/*====tStd0=======================*/
.tStd0 {
    border-collapse:separate; /* Separate allows for curved cornders */
    border-spacing:0;
}
.tStd0 > tbody > tr {
    page-break-inside:avoid;
}
.tStd0 > thead > tr > th,
.tStd0 > tbody > tr > th {
    background-color:#C0C0C0;
    padding:4px 6px;
    border:1px solid black;
    border-left:none;
    border-right:none;
}
.tStd0 > tbody > tr > td {
    padding:3px 6px;
    vertical-align:top;
}
.tStd0 > tbody > tr.n > td { /* Line between even and odd rows */
    border-top:1px solid #A0A0A0;
}
.tStd0 > tbody > tr:last-child {
    border-bottom:1px solid #A0A0A0;
}
/* Row background color */
.tStd0 > tbody > tr:nth-child(2n+1) {
    background-color:#E8E8E8;
}
.tStd0 > tbody > tr:nth-child(2n) {
    background-color:#FFFFFF;
}
/* Row background color ===OVERRIDE=== */
.tStd0 > tbody > tr.o {
    background-color:#E8E8E8;
}
.tStd0 > tbody > tr.e {
    background-color:#FFFFFF;
}
/* Hover color */
.tStd0 > tbody > tr:hover > td {
    background-color:rgba(160, 205, 255, 0.70);
}
/*====tStd1== (For use with multiple tbodys====*/
.tStd1 {
    border-collapse:separate; /* Separate allows for curved cornders */
    border-spacing:0;
}
.tStd1 > thead > tr > th,
.tStd1 > tbody > tr > th {
    background-color:#C0C0C0;
    padding:4px 6px;
    /*border:1px solid black;*/
    border:1px solid #C0C0C0;
    border-left:none;
    border-right:none;
}
.tStd1 > tbody > tr > td {
    padding:3px 6px;
    vertical-align:top;
}
.tStd1 > tbody {
    page-break-inside:avoid;
}
/* Line between even and odd rows */
.tStd1 > tbody > tr:nth-of-type(1) > td {
    border-top:1px solid #D0D0D0;
    /*border-top: 1px solid #E0E0E0;*/
}
/* Line on bottom of table */
.tStd1 > tbody:nth-last-of-type(1) > tr:nth-last-of-type(1) > td { 
    border-bottom:1px solid #D0d0D0;
    /*border-bottom: 1px solid #E0E0E0;*/
}
/* Table Body background color */
.tStd1 > tbody:nth-of-type(odd) > tr {
    background-color:#E8E8E8;
    /*background-color:#F7F6F3;*/
    /*background-color:#E7E6E3;*/
}
.tStd1 > tbody:nth-of-type(even) > tr {
    background-color:#FFFFFF;    
}
/* Hover color (can be overide in specific table style) */
.tStd1 > tbody > tr:hover > td {
    background-color:rgba(160, 205, 255, 0.70);
}
/*====tStdD== Detail Standard Table*/
.tStdD {
    border-collapse:separate; /* Separate allows for curved cornders */
    border-spacing:0;
}
.tStdD > tbody > tr > td:first-child {
    background-color:#C0C0C0;
}
.tStdD > tbody > tr > td {
    vertical-align:top;
    padding:5px;
    border:1px solid gray;
}
/*===REPORT Views form including information===*/
.RepView {
	display:table;
    margin:0 auto;
}
.RepView > div:nth-child(1) {
    float:left;
    margin-right:5px;
}
.RepView > div:nth-child(2) {
    float:right;
    margin-left:5px;
}
.RepView > div:nth-child(3) {
    clear:both;
}
.RepView > div:nth-child(2) > select {
    direction:ltr;
}
.RepView > div:nth-child(2) > select > option {
    direction:rtl;
}
/*===Invoice Report TABLE===*/
.tSRep {
    margin-left:auto;
    margin-right:auto;
}
.tSRep > tbody > tr > td {
    font-family:Consolas, Courier New, Courier, monospace;
}
.tSRep > tbody > tr > td:nth-child(8) {
    border-left:1px solid #c0c0c0;
}
.tSRep > tbody > tr > td:nth-child(1),
.tSRep > tbody > tr > td:nth-child(2),
.tSRep > tbody > tr > td:nth-child(3),
.tSRep > tbody > tr > td:nth-child(7),
.tSRep > tbody > tr > td:nth-child(8),
.tSRep > tbody > tr > td:nth-child(10),
.tSRep > tbody > tr > td:nth-child(13) {
    text-align:right;
}
.tSRep > tbody > tr > td:nth-child(4),
.tSRep > tbody > tr > td:nth-child(5),
.tSRep > tbody > tr > td:nth-child(12),
.tSRep > tbody > tr > td:nth-child(14),
.tSRep > tbody > tr > td:nth-child(15) {
    text-align:center;
}
.tSRep > tbody > tr > td:nth-child(4),
.tSRep > tbody > tr > td:nth-child(5),
.tSRep > tbody > tr > td:nth-child(9) {
    white-space:nowrap;
}
.tSRep > tbody > tr.t > td:nth-child(8),
.tSRep > tbody > tr.t > td:nth-child(9),
.tSRep > tbody > tr.t > td:nth-child(10),
.tSRep > tbody > tr.t > td:nth-child(11),
.tSRep > tbody > tr.t > td:nth-child(12),
.tSRep > tbody > tr.t > td:nth-child(13),
.tSRep > tbody > tr.t > td:nth-child(14) {
    border-top:1px solid black;    
    font-weight:bold;
}
/*===========================*/
.tSInf > tbody > tr > td {
    border:1px solid silver;
    padding:6px;
}
.tSInf > tbody > tr > td:first-child {
    background-color:#C0C0C0;
    border:1px solid black;
}
.tSInfE {
    border-collapse:collapse;
}
.tSItm > tbody > tr > td,
.tSItmE > tbody > tr > td {
    font-family:Consolas, Courier New, Courier, monospace;
}
.tSItm > tbody > tr > td:nth-child(2),
.tSItm > tbody > tr > td:nth-child(3) {
    text-align:left;
    white-space:nowrap;
}
.tSItm > tbody > tr > td:nth-child(1),
.tSItm > tbody > tr > td:nth-child(4),
.tSItm > tbody > tr > td:nth-child(10) {
    text-align:right;
    white-space:nowrap;
}
.tSItm > tbody > tr > td:nth-child(5),
.tSItm > tbody > tr > td:nth-child(6),
.tSItm > tbody > tr > td:nth-child(7),
.tSItm > tbody > tr > td:nth-child(8),
.tSItm > tbody > tr > td:nth-child(9) {
    text-align:center;
    white-space:nowrap;
}
.tSItmE > tbody > tr > td:nth-child(2),
.tSItmE > tbody > tr > td:nth-child(3),
.tSItmE > tbody > tr > td:nth-child(5) {
    text-align:left;
    white-space:nowrap;
}
.tSItmE > tbody > tr > td:nth-child(4) {
    text-align:right;
    white-space:nowrap;
}
.tSItmE > tbody > tr > td:nth-child(4),
.tSItmE > tbody > tr > td:nth-child(6),
.tSItmE > tbody > tr > td:nth-child(7),
.tSItmE > tbody > tr > td:nth-child(8),
.tSItmE > tbody > tr > td:nth-child(9),
.tSItmE > tbody > tr > td:nth-child(10) {
    text-align:center;
    white-space:nowrap;
}
/* BOX */
.tSBox > tbody > tr > td:nth-child(4) {
    text-align:center;
}
/*======== Amendment Record Tables =============*/
.tStdAmnd > tbody > tr > td:nth-child(1),
.tStdAmnd > tbody > tr > td:nth-child(2),
.tStdAmnd > tbody > tr > td:nth-child(3)  {
    text-align:center;
}
.tStdAmnd > tbody > tr > td:nth-child(4)  {
    text-align:right;
}
/*============ Content Appearance ============*/
.contMain {
    display:table;
    margin-left:auto;
    margin-right:auto;
    margin-top:20px;
    padding:10px;
    position:relative;
}
/*======= Sheet Appearance ========*/
.SheetCont {
    display: table;
    margin: 0 auto;
}
.SheetStd {
    position: relative;
    background-color: #ffffff; /*White*/
}
@media screen {
    .SheetStd {
        box-shadow:rgba(64,64,64,1) 0 0 20px -1px;
        padding:15px 10px;
    }
}
.dRepRes {
    display:table;
    margin-left:auto;
    margin-right:auto;
    margin-bottom:15px;
}
.dBtnTop {
    position: absolute;
    right: 0px;
    top: -35px;
}
@media print {
    .dBtnTop {
        display: none;
    }
}
.dBtnTopL {
    position:absolute;
    left: 0px;
    top: -35px;
}
/*======= Order, Quote, and Invoice ========*/
.SheetPrep {
    background-color:#ffffe6; /*Yellow*/
    box-shadow:rgba(64,64,64,1) 0 0 20px -1px;
    padding:15px 10px;
}
.SheetInv {
    background-color:#e6f7ff; /*Blue*/
    box-shadow:rgba(64,64,64,1) 0 0 20px -1px;
    padding:15px 10px;
}
.SheetGPM {
    background-color:#ffffff; /*White*/
    box-shadow:rgba(64,64,64,1) 0 0 20px -1px;
    padding:10px 10px;
}
.SheetOrd {
    background-color:#ffffcc; /*Yellow*/
    box-shadow:rgba(64,64,64,1) 0 0 20px -1px;
    padding:15px 10px;
}
.SheetErr {
    margin-top:10px;
    color:red;
}
/* ---------------------- */
/* Default Page           */
/* ---------------------- */
/*=========================================================*/
/*=========================================================*/
.mCont {    
    position: relative;
    padding: 10px;
    background: rgba(160, 205, 255, 0.7);
    box-shadow: 3px 3px 15px 0 rgba(0, 0, 0, 0.7);
    border-radius: 5px;
    max-width: 700px;
    margin: 0px auto;
}
.mMain {
    --mItemSpeed: 0.0s;
    position: relative;
    column-width: 200px;
    column-rule: 1px solid lightblue;
    column-gap: 20px;
    text-align: center;
    margin-top: 50px;
}
@media only screen and (max-width:700px) {
    .mCont {
        margin: 0px 10px 0px;
    }
}
.mGrp {
    position: relative;
    width: 198px;
    display: inline-block;
    box-sizing: border-box;
    margin: 0px 0px 10px;
    padding: 6px;
    /*background-color: rgb(159, 199, 242);*/
    /*background-color: rgb(168, 210, 255);*/
    background-color: rgb(164, 205, 249);
}
.mGrp > input {
    display: none;
}
.mGrp > label {
    font-weight: bold;
    margin-bottom: 10px;
    position: relative;
    user-select: none;
    display: block;
    cursor: pointer;
}
.mGrp > label::before {
    position: absolute;
    font-weight: bold;
    top: -3px;
    content: "\02771";
    transition: rotate var(--mItemSpeed);
    rotate: 90deg;
}
.mGrp > label::before {    
    left: 5px;
}
.mGrp > label::after {
    right: 0px;
}
.mGrp > input[type="checkbox"]:checked + label::before {
    rotate: 0deg;
}
.mGrp > input[type="checkbox"]:checked + label::after {
    rotate: 180deg;
}
.mGrp > div {
    padding: 0px 5px;
    border-radius: 5px;
    display: grid;
    grid-template-rows: 1fr;
    transition: grid-template-rows var(--mItemSpeed);  
}
.mGrp > div > div {
    overflow: hidden;  
}
.mGrp > input[type="checkbox"]:checked ~ div {
    grid-template-rows: 0fr;
}
.mGrp a {
    text-decoration: none;
    color: black;
    background-color: #c0c0c0;
    border-left: 1px solid #ccc;
    border-right: 1px solid black;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid black;
    display: block;
    box-sizing: border-box;
    margin: 5px 0px;
    padding: 6px 1px;
}
.mGrp a:hover {
    background-color: #ccc;
}
.mCont .mOpt {
    position: absolute;
    top: -45px;
    text-align: left;
    padding: 0;
    background:none;
}
.mCont .mOpt button {
    all: unset;
    width: 1.5em;
    height: 1.5em;
    text-align: center;
    cursor: pointer;
    user-select: none;
    margin: 0px;
    padding:5px;
    border:0px;    
    display:inline-block;
    vertical-align:top;
}
.mCont .mOpt > div 
{
    display: flex;
    width: min-content;
    padding: 0px;
    /*background-color: rgb(159, 199, 242);*/
    /*background-color: rgb(168, 210, 255);*/
    background-color: rgb(164, 205, 249);
    border-radius: 0px;
}
.mCont .mOpt > div > div {
    flex: 1;
    padding:0;
    margin:0;
}
.mCont .mOpt > div > div:nth-child(2) > button {
    border-bottom: 1px solid lightblue;
    rotate: 90deg;
}
/*=========================================================*/
/*=========================================================*/
.TBLShipAdd > tbody > tr > td {
    vertical-align:top;
}
.TBLShipAdd > tbody > tr > td > select,
.TBLShipAdd > tbody > tr > td > select > option {
    cursor:default;
}
/*===ShipEdit=====*/
.EdHeader {
    background-color:#cfcfcf;
    background-image:linear-gradient(to bottom, #e8e8e8, #cfc9cf);
    padding:1px 3px;
    font-weight:bold;
}
.EdItmAdd input[type="text"] {
    width:190px;
}
/*=Revision Module===========================================================================*/
.RevStamp {
    position:fixed;
    bottom:0;
    right:0;
    text-align:right;
    font-size:small;
    padding-right:4px;
}
/*===== Report Options ======*/
.dRepOpt {
    margin:0 auto 15px;
    display:table;
    position:relative;
}
.dRepRes {
    margin:0 auto 15px;
    display:table;
}
/*===Standard Report Filte===*/
.sRepFiltCont {
    border-collapse:collapse;
}
.sRepFiltCont > tbody > tr > td > table > tbody > tr > td:first-child {
    white-space:nowrap;
}
.sRepFiltCont > tbody > tr > td {
    vertical-align:top;
    text-align:left;
    border-left:1px solid black;
    padding:0 10px;
}
.sRepFiltCont > tbody > tr > td:first-child {
    border-left:none;
    padding:0 10px 0 0;
}
.sRepFiltCont > tbody > tr > td:last-child {
    padding:0 0 0 10px;    
}
.sRepFilt {
    border-collapse:collapse;
}
.sRepFilt > tbody > tr > td {
    vertical-align:top;
}
.sRepFilt > tbody > tr > th {
    position:relative;
    text-align:center;
    vertical-align:top;
    background-color:#C0C0C0;
}
.sRepFilt > tbody > tr > td > input[type=text] {
    width:200px;
}
/*==================== Button Link============*/
.btnLink {
  background:none;
  border:none;
  color:blue;
  text-decoration:none;
  cursor:pointer;
  font-size:1em;
  font-family:serif;
}
.btnLink:focus {
  outline:none;
}
.btnLink:active {
  color:red;
}
/*==========Pop Up Confirmation =================*/
/*Popup Container*/
.puConf {
    display:inline-block;
    position:relative;
}
/*Popup Background*/
.puConf > div:nth-child(2) {
    display:none;
    vertical-align:central;
    position:fixed;
    background-color:rgba(80,80,80,0.40);
    top:0;
    right:0;
    width:100%;
    height:100%;
    z-index:999;
}
/*Popup Window*/
.puConf > div:nth-child(2) > div {
    position:relative;
    border:1px solid #dcdcdc;
    box-shadow:5px 5px 12px 2px rgba(0,0,0,0.42);
    padding:10px;
    /*display:none;*/
    /*position:absolute;*/
    /*right:0;*/
    /*top:0;*/
    top:25%;
    transform:perspective(1px) translateY(-25%);
    width:200px;
    background-color:white;
    text-align:center;
    border-radius:6px;
    cursor:default;
    margin:0px auto;
    display:table;
}
.puConf > div:target {
    display:block;
}
/*Popup Buttons*/
.puConf > div:nth-child(2) > div > div:nth-child(2) {
    white-space:nowrap;
}
.puConf > div:nth-child(2) > div > div:nth-child(2) button,
.puConf > div:nth-child(2) > div > div:nth-child(2) a {
    margin:5px;
    box-shadow:inset 0px 1px 0px 0px #ffffff;
    background:linear-gradient(to bottom, #f9f9f9 5%, #e9e9e9 100%);
    background-color:#f9f9f9;
    border-radius:6px;
    border:1px solid #dcdcdc;
    display:inline-block;
    cursor:pointer;
    color:#666666;
    font-family:Arial;
    font-size:15px;
    font-weight:bold;
    padding:6px 24px;
    text-decoration:none;
    text-shadow:0px 1px 0px #ffffff;
}
.puConf > div:nth-child(2) > div > div:nth-child(2) button:hover,
.puConf > div:nth-child(2) > div > div:nth-child(2) a:hover {
    background:linear-gradient(to bottom, #e9e9e9 5%, #f9f9f9 100%);
    background-color:#e9e9e9;
}
.puConf > div:nth-child(2) > div > div:nth-child(2) button:active,
.puConf > div:nth-child(2) > div > div:nth-child(2) a:active {
    position:relative;
    top:1px;
}
/*Popup Text*/
.puConf > div:nth-child(2) > div > div:nth-child(1) {
    margin-bottom:10px;
    text-align:center;
}
/*Popup tables*/
.puConf table td {
    text-align:left;
}
/* ===================================== */
.tabbed > input[type=radio]:checked + label + div {
    display:block;
}
/*===== Required Information Marker ======*/
.rqd {
    color:red;
    font-weight:bold;
}
.tNoWrap > tbody > tr > td {
    white-space:nowrap;
}
/*==== Page Error Information ==========*/
.pageErr {
    display: block;
    white-space: nowrap;
    margin-left: auto;
    margin-right: auto;
    max-width: 800px;
    overflow-x: auto;
}
/*===============================*/
.fro { /* Form Read Only field */
    background-color:#dfdfdf;
}
.fro > div,
.fro > span {
    padding-left:5px;
}