
/**** Rob Carberry 5/16/2024 ****/
/**** Rob Carberry 4/1/2024 ****/
/****************************************************************************************
************************************ GLOBAL *****************************************
****************************************************************************************/

body {
     color: #434343;
     font-size: 16px;
     font-family: 'fira-sans', sans-serif !important;
     font-weight: 500;
}

.main, .main td {
     font-size: 16px;
}

h1,
h2,
h3,
h4,
h5 {
     color: #000000;
     font-family: 'fira-sans', sans-serif !important;
     letter-spacing: .08em;
     text-transform: uppercase;
}

h1 {
     font-size: 3.5rem;
}

h2 {
     margin-bottom: .5rem;
}

h3 {
     font-family: 'fira-sans', sans-serif !important;
     font-weight: bold;
     font-size: 1.25rem;
     text-transform: none;
}

.h2 {
     color: #000000;
     font-family: 'fira-sans', sans-serif !important;
     font-size: 2.375rem;
     font-weight: bold;
}

.hideit {
     display: none !important;
}

/*.fa-shopping-basket:before {
     content: "\f291";
}*/
.fa-shopping-basket:before {
     content: "\f07a" !important;
}


.basket-view .buttonsbar:nth-of-type(2) {
     display: none;
 }
 .basket-view table:has(td.previewcell) {
     display: none;
 }

/*---- CUSTOM BUTTON ---- */

button#button_save_order {
     padding: 5px 15px;
}
b.corp-division button {
     min-width: 200px !important;
}

.size-chart > button {
     font-size: 12px !important;
     line-height: 1.25;
     background-color: #8d8d8d !important;
     border: 2px solid #8d8d8d !important;
     text-transform: none;
     padding: 6px 10px;
 }
 .size-chart > button:hover {
     font-size: 12px !important;
     line-height: 1.25;
     background-color: #e3280e !important;
     border: 2px solid #e3280e !important;
     text-transform: none;
     padding: 6px 10px;
     box-shadow: none;
 }
 

/*button#submit_catalog_search {
     padding: 5px 8px 4px 8px !important;
     margin: -2.5px 0px 0px 0px !important;
     box-sizing: content-box;
     z-index: 1;
     font-size: 15px !important;
     letter-spacing: 1px;
     font-weight: 500 !important;
}*/
.form-body td.submit {
     background-color: transparent;
     /* font-family: "Poppins", sans-serif !important; */
     color: #FFFFFF;
     margin: 0px;
     padding: 5px;
     text-align: center;
}

button#button_file_upload_remove,
button {
     cursor: pointer;
     text-align: center !important;
     font-size: 13px !important;
     font-weight: 600 !important;
     text-transform: uppercase;
     /* letter-spacing: 1px !important; */
     /* padding: 6px 24px !important; */
     padding: 1.0em 1.75em;
     margin: 8px 3px !important;
     color: #FFFFFF !important;
     background-color: #1BAEA9 !important;
     /* font-family: "Poppins", sans-serif !important; */
     vertical-align: middle !important;
     text-decoration: none !important;
     border: 2px solid #1BAEA9 !important;
     /* -moz-border-radius: 50px/50px !important; */
     /* -webkit-border-radius: 50px/50px !important; */
     /* border-radius: 50px/50px !important; */
     position: relative !important;
     min-width: max-content !important;
     -webkit-box-shadow: 6px 6px 12px -7px rgba(0,0,0,0.27);
     -moz-box-shadow: 6px 6px 12px -7px rgba(0, 0, 0, 0.27);
     box-shadow: 6px 6px 12px -7px rgba(0,0,0,0.27);
     -webkit-transition: all 0.125s ease-in-out;
     transition: all 0.125s ease-in-out;
}

button#button_file_upload_remove:hover,
button:hover,
button#submit_catalog_search:hover {
     background-color: #17a19c !important;
     border-color: #17a19c !important;
     color: #FFFFFF !important;
     /* border-radius: 50px/50px !important; */
     z-index: unset;
     /* -webkit-transition: background-color 0.3s ease-in-out; */
     /* transition: background-color 0.3s ease-in-out; */
     -webkit-transition: all 0.125s ease-in-out;
     transition: all 0.125s ease-in-out;
     -webkit-box-shadow: none;
     -moz-box-shadow: none;
     box-shadow: none;

}

/*button#button_file_upload_remove:before, button:not(#submit_catalog_search):before {*/
button#button_file_upload_remove:before,
button:before {
     content: " ";
     background: transparent;
     /* background: linear-gradient(180deg,#36837d 40%,#235652); */
     /* filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#36837d",endColorstr="#235652",GradientType=1); */
     top: -2px;
     left: -2px;
     padding: 2px;
     box-sizing: content-box;
     /* -webkit-transition: background-color 0.3s ease-in-out; */
     /* transition: background-color 0.3s ease-in-out; */
     /* border-radius: 50px/50px; */
     /* -webkit-border-radius: 50px/50px; */
     display: block;
     position: absolute;
     height: 100%;
     width: 100%;
     z-index: -1;
     /*-webkit-box-shadow: 1px 1px 6px rgb(255 255 255 / 20%), 1px 2px 6px 0px rgb(0 0 0 / 70%);
     -moz-box-shadow: 1px 1px 6px rgba(255,255,255,0.2), 1px 2px 6px 0px rgba(0,0,0,0.070);
     box-shadow: 1px 1px 6px rgb(255 255 255 / 20%), 1px 2px 6px 0px rgb(0 0 0 / 70%);*/
}

.button_arrow_right_text,
.button_arrow_left_text,
.button_arrow_down_text {
     display: none;
}

.button_arrow_right::after,
.button_arrow_left::after,
.button_arrow_down::after {
     /* height: 2px; */
     display: inline-block;
     position: relative;
     height: 8px;
     width: 8px;
     top: -1px;
     border: 0 solid currentColor;
     border-width: 0 2px 2px 0;
     content: '';
}

.button_arrow_down::after {
     transform: rotate(45deg);
     margin: 0 0 0 8px
}

.button_arrow_left::after {
     transform: rotate(135deg);
     margin: 0 8px 0 0
}

.button_arrow_right::after {
     transform: rotate(-45deg);
     margin: 0 0 0 8px
}

button:disabled,
button[disabled] {
     opacity: 0.5;
     cursor: default;
     /* color: #FFFFFF !important; */
     cursor: not-allowed;
}

button#submit_cancel {
     margin-right: 5%;
     min-width: 155px;
}

/************************************/
.main,
.catalog,
form {
     /* height: 100vh; */
     height: max-content !important;
}


.full .note{
     display: none;
     white-space: nowrap;
     letter-spacing: .25px;
     padding-left: 20px;
     padding-top: 12px;
}

.full .note:has(.budget) {
     display: flex;
}
span.budget {
     padding-left: 5px;
     font-weight: 600;
}

.responsive-longname p {
     font-weight: normal;
     font-size: 13px;
     font-style: italic;
     background: rgba(0, 0, 0, .05);
     padding: 3px 15px;
     max-width: fit-content;
     margin-left: auto !important;
     margin-right: auto !important;
     text-align: center;
}
.responsive-longname span {
     color: #1baea9;
     padding: 5px !important;
     display: block;
}

/*Hide Save Order button*/
#button_save_order {
     display:none;
}
   
@media only screen and (min-width:1025px) {

     table.true-table.multisize-table {
          max-width: 315px;
          display: flex;
          overflow: auto;
          align-items: flex-end;
          margin: 8px auto;
     }
     .note.responsive-onhand {
          align-content: space-between;
          margin: 10px auto;
     }
     /* span.note:has(.budgetlbl) {
          display: flex;
          padding-left: 20px;
          padding-top: 12px;
     }
     span.budget {
          padding-left: 5px;
     } */

     img.catalog-tiny-thumbnail {
          padding: 0 5px;
     }

     /*************** header css for final approve order ***********************/
     td.label:has(>span#bill\.billcode10label) {
          white-space: nowrap;
     }

     span.standout {
          text-shadow: 1px 1px 1px rgb(125 125 125 / 75%) !important;
     }

     p.approve_order {
          font-size: 1.25em !important;
          padding: 15px;
          /*background-color: #EEE;*/
          border-radius: 0.35em;
          -webkit-box-shadow: inset 0 1px 0 rgb(255 255 255 / 20%), 0 3px 6px rgb(0 0 0 / 7%);
          -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 3px 6px rgba(0, 0, 0, 0.040);
          box-shadow: inset 0 1px 0 rgb(255 255 255), 0 3px 6px rgb(0 0 0 / 40%);
          text-shadow: 0 1px 0 rgb(0 0 0 / 5%);
     }

     p.approve_order_text {
          font-size: 1.15em !important;
          padding: 15px;
          /*font-weight: normal !important;*/
          /*background-color: #EEE;*/
          border-radius: 0.35em;
          -webkit-box-shadow: inset 0 1px 0 rgb(255 255 255 / 20%), 0 3px 6px rgb(0 0 0 / 7%);
          -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 3px 6px rgba(0, 0, 0, 0.040);
          box-shadow: inset 0 1px 0 rgb(255 255 255), 0 3px 6px rgb(0 0 0 / 40%);
          text-shadow: 0 1px 0 rgb(0 0 0 / 5%);
     }

     /*****************************************************************************/

     .main.billing.catalog--container {
          max-width: 675px !important;
          margin: 20px auto 0 !important;
     }


     /*.header-links, .header-links a {*/
     .header-links {
          display: none !important;
     }


     td:has(> img#normal_src) {
          border: solid 1px #CDCDCD;
     }

     .main .buttonsbar button {
          margin-bottom: 20px;
     }

     .main {
          background-color: transparent !important;
     }

     button:focus {
          /*border-radius: 3px;*/
     }

     h2.pagetitle,
     .pagetitle {
          font-size: 18px;
          /*color: #333;*/
          font-weight: bold;
          text-shadow: none;
          /* font-family: "Montserrat", sans-serif !important; */

     }


     .header-links a {
          text-decoration: none;
     }

     /*** Max width on all pages except the Division / Catalog pages ***/
     .shipping,
     .billing,
     .review,
     .done,
     .customer-service,
     .profile,
     .basket-view,
     .view-order,
     .shiptrack_view2,
     .waitingorders,
     .main.shiptrack.catalog--container {
          max-width: 1000px !important;
          margin: 20px auto 0 !important;
          min-height: 600px;
     }

     table.bottom-button-container {
          display: none;
     }

     .message-block {
          text-align: center;
     }

     .req_fld {
          color: red;
     }

     .form-body th,
     .tabular th,
     .form-body div.title {
          font-size: 16px;
     }

     .footer {
          padding: 15px 10px 0px !important;
          width: auto !important;
     }

     /****************************************************************************************
     ************************************** INDEX ******************************************
     ****************************************************************************************/

     .index-container {
          margin: 20px 20px;
          padding-bottom: 20px;
          font-size: 16px;
     }

     /****************************************************************************************
     ********************************* CATALOG ******************************************
     ****************************************************************************************/

     .select-items .vertical-shell {
          margin-left: 10px !important;
     }

     .select-items .image-container img {
          margin: 5px 0;
     }

     .select-items .longname *,
     .select-items .longname * {
          font-size: 16px;
     }

     .select-items .pagetitle {
          margin-left: 10px !important;
     }

     .select-items .buttonsbar button {
          margin-bottom: 20px;
     }


     #basket-list-title {
          text-align: center;
          font-size: 20px;
          /*        color: #0061df; */
          /*        border-bottom: 2px solid #0061df; */
          margin-bottom: 10px;
     }

     .basket-list-item {
          margin-bottom: 10px !important;
     }

     .basket-list-item .button {
          padding: 1px 1px 1px 5px !important;
     }

     #basket_button_container {
          text-align: center;
     }

     #submit_catalog_add {
          margin-top: 5px;
     }

     #copy4 {
          display: none;
     }

     .bundle_subitem_preview img {
          border: 1px solid gray;
     }

     .qtyspec_label {
          margin-left: 5px !important;
     }

     /****************************************************************************************
     ************************* QUOTES/SIDE BY SIDE **********************************
     ****************************************************************************************/

     .buttonsbar,
     .form-body {
          border-radius: 0px !important;
     }

     #estimate-item-container {
          padding: 20px 0;
     }

     .submit.center button {
          margin-bottom: 20px !important;
     }

     #all_options,
     #all_options_container {
          border: none !important;
     }

     .fileSpec {
          position: relative;
          left: 10px;
     }

     .form-subheader {
          text-align: left !important;
     }

     #approval_checkbox_group input * {
          width: 100px;
          height: auto;
     }

     .uploadIcon {
          margin-top: 5px !important;
     }

     div#confirm_container button {
          margin-top: 20px !important;
     }

     .checkbox-table {
          margin-left: 0 !important;
     }

     /****************************************************************************************
     ******************************* MAIL MERGE ****************************************
     ****************************************************************************************/

     .mail-merge header {
          margin-left: 25px;
     }

     .mail-merge nav.submit {
          padding-bottom: 30px !important;
     }

     #listimp-s3-section-5 div {
          margin-left: 25px;
     }

     div.error {
          margin-bottom: 10px;
     }

     #ml-handle-link {
          margin-left: 25px;
     }

     .personal-list-actions {
          text-align: center !important;
     }

     form[name='clientlist'] div:last-child {
          padding: 20px 20px !important;
     }

     /****************************************************************************************
     ****************************** BASKET VIEW ****************************************
     ****************************************************************************************/

     .basket-view td.previewcell {
          background-color: transparent !important;
     }

     .basket-view .buttonsbar button {
          margin-bottom: 20px;
     }

     /*table:not(.items-table){
          width: auto;
          margin: 0 auto;
     }*/

     /****************************************************************************************
     ***************************** DELIVERY METHODS ********************************
     ****************************************************************************************/

     tr.dpt--headerRow,
     tr.dpt--headerRow span,
     tr.dpt--headerRow *,
     tr.item_row * {
          font-size: 16px !important;
     }

     #i-dropship {
          position: relative;
          font-size: 16px;
          /*color: #00000A;*/
          /* font-family: "Poppins", sans-serif !important; */
          text-align: center;
          vertical-align: middle;
          text-decoration: none;
          font-weight: normal;
          padding: 4px 10px 4px 10px;
          border: 1px solid #CCCCCC;
          -moz-border-radius: 0em;
          -webkit-border-radius: 0em;
          border-radius: 0em;
          background: #FFFFFF;
          background: linear-gradient(#FFFFFF, #CCCCCC);
          background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#CCCCCC));
          background: -moz-linear-gradient(top, #FFFFFF, #CCCCCC);
          background: -ms-linear-gradient(#FFFFFF, #CCCCCC);
          filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#FFFFFF', endColorstr='#CCCCCC');
          -pie-background: linear-gradient(#FFFFFF, #CCCCCC);
          position: relative;
          behavior: url(../hub/css/PIE.htc);
     }

     .mail-merge .buttonsbar,
     .mail-merge .buttonsbar a,
     .mail-merge .buttonsbar a:link,
     .mail-merge .buttonsbar * {
          text-decoration: none !important;
          text-align: center !important;
     }

     .mail-merge .buttonsbar {
          margin-bottom: 10px;
     }

     tr.dpt--finalizeRow td.dpt--status {
          border-bottom: 0px !important
     }

     /****************************************************************************************
     *********************************** SHIPPING ****************************************
     ****************************************************************************************/

     .mail-merge .pagetitle {
          margin-left: 15px !important;
     }

     #see_shipping_methods {
          position: relative;
          font-size: 16px;
          /*color: #00000A;*/
          /* font-family: "Poppins", sans-serif !important; */
          text-align: center;
          vertical-align: middle;
          text-decoration: none;
          font-weight: normal;
          padding: 4px 10px 4px 10px;
          border: 1px solid #CCCCCC;
          -moz-border-radius: 0em;
          -webkit-border-radius: 0em;
          border-radius: 0em;
          background: #FFFFFF;
          background: linear-gradient(#FFFFFF, #CCCCCC);
          background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#CCCCCC));
          background: -moz-linear-gradient(top, #FFFFFF, #CCCCCC);
          background: -ms-linear-gradient(#FFFFFF, #CCCCCC);
          filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#FFFFFF', endColorstr='#CCCCCC');
          -pie-background: linear-gradient(#FFFFFF, #CCCCCC);
          position: relative;
          max-width: 150px;
          text-shadow: none !important;
     }

     .mail-merge .field-note {
          display: none !important;
          /*can't do much better without source change*/
     }

     .mail-merge #throbber {
          margin-bottom: 20px !important;
     }

     .mail-merge .field-container * {
          /*color: #333333 !important;*/
     }

     label[for="comments"] {
          position: relative;
          bottom: 12px;
     }

     .shipping .form-body {
          width: 80%;
     }

     form[action="shiptrack.cgi"] {
          padding-bottom: 25px !important;
     }

     /****************************************************************************************
     ************************************** BILLING ****************************************
     ****************************************************************************************/

     .billing .buttonsbar button {
          margin-bottom: 20px;
     }

     /*.billing * {
          font-size: 16px !important;
     }*/

     .billing .form-body {
          width: 100%;
          margin: 0 auto 20px;
     }

     /****************************************************************************************
     ************************************** REVIEW ***************************************
     ****************************************************************************************/

     .review .buttonsbar button {
          margin-bottom: 20px;
     }

     .review .pageinstructions {
          font-size: 16px;
     }

     .review * {
          font-size: 16px !important;
     }

     .review td.data {
          background-color: #eeeeee;
     }

     .review div {
          margin: 0 10px;
     }

     .main p {
          margin-left: 10px;
     }

     .accept-proofs table {
          width: 80%;
          margin-bottom: 20px;
     }

     /****************************************************************************************
     ************************************ ACCEPT *****************************************
     ****************************************************************************************/

     .done div * {
          font-size: 16px;
     }

     .done td.data {
          background-color: #eeeeee;
     }

     .done .accept-proofs .form-body {
          margin-left: 20px;
          margin-right: 20px;
          margin-bottom: 30px;
          width: 80%;
     }

     .done .accept-msg {
          margin: 0 5px;
     }

     .catalog--container .pagetitle {
          margin-top: 10px !important;
     }

     .accept-showneworderbutton {
          margin: 20px auto !important;
     }

     .accept-proofs b {
          margin-left: 20px;
          margin-top: 10px;
          line-height: 30px;
     }

     .previewcell a span {
          position: relative;
          font-size: 16px;
          /*color: #00000A;*/
          /* font-family: "Poppins", sans-serif !important; */
          text-align: center;
          vertical-align: middle;
          text-decoration: none;
          font-weight: normal;
          padding: 4px 10px 4px 10px;
          border: 1px solid #CCCCCC;
          -moz-border-radius: 0em;
          -webkit-border-radius: 0em;
          border-radius: 0em;
          background: #FFFFFF;
          background: linear-gradient(#FFFFFF, #CCCCCC);
          background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#CCCCCC));
          background: -moz-linear-gradient(top, #FFFFFF, #CCCCCC);
          background: -ms-linear-gradient(#FFFFFF, #CCCCCC);
          filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#FFFFFF', endColorstr='#CCCCCC');
          -pie-background: linear-gradient(#FFFFFF, #CCCCCC);
          position: relative;
          margin: 5px 20px;
     }

     .previewcell a {
          text-decoration: none;
          margin: 0px auto;
          line-height: 50px;
          text-align: center;
     }

     .previewcell * {
          text-align: center !important;
     }

     /*Add border to preview image on Basket, Review, Accept pages*/
     /*.previewcell img {
          border: 1px solid #918764 !important;
     }*/

     /*Remove sr_ error text from Basket, Review, Accept pages*/
     .previewcell pre {
          display: none;
     }

     /*-- CANCEL LINK ---*/
     #footer\2e footercanceltext {
          padding-right: 15px;
     }


     .catalog #upper_buttons {
          position: relative;
          right: 7%;
     }

     /* button#submit_continue {
          min-width: 155px;
     } */
     .buttonsbar {
          background-color: transparent !important;
          z-index: 1;
          position: relative;
     }


     .main.mail-merge.catalog--container form {
          max-width: fit-content;
          margin: auto;
     }

     /****** Hide Under Construction ******/
     /*td#header_title {
          display: none;
     }*/

     .centerimp {
          text-align: center !important;
     }

     td.cart_item {
          /* display: block; */
          vertical-align: top;
          display: flex;
          align-items: center;
          flex-direction: column;
     }
     
     .main.catalog--container {
          min-height: 600px;
     }

     span.onhand_lbl {
          font-size: 14px !important;
     }

     input#searchfield_input {
          padding-left: 15px;
          width: 120px;
          border-radius: 15px / 15px;
     }

     input#searchfield_input:after {
          content: "\f002";
     }




     /****************************/

     /*****************************************************************************/
     /* @media only screen and (min-width:1025px) { */

     .image-container img {
          max-width: 300px !important;
          max-height: 300px !important;
     }

     /************* Tabs Nav Menu ******************/

     /* body::before {
          content: url(../con/bg_wave.png);
          position: absolute;
          top: -9999rem;
          left: -9999rem;
          opacity: 0;
     } */

     div#TabsDiv {
          position: absolute;
          white-space: nowrap;
          /* top: 36px; */
          top: 82px;
          /* right: 16%; */
          text-align: right;
          /* --w: 1000px; */
          /* width: var(--w); */
          width: 98%;
          /* left: -webkit-calc((100% - var(--w)) / 2); */
          /* left: -moz-calc((100% - var(--w)) / 2); */
          /* left: calc((100% - var(--w)) / 2); */
     }

     nav {
          margin: 0 auto;
          height: auto;
          display: inline-block;
          background: transparent;
          font-weight: 600;
          font-size: .875rem;
          position: relative;
          z-index: 80;
          color: #434343;
     text-transform: uppercase;
     letter-spacing: 1px;
     }

     nav ul ul {
          display: none;
     }

     nav ul {
          list-style: none;
          position: relative;
          display: inline-table;
          margin: 0;
          padding: 0;
          z-index: 1001;
     }

     nav ul:after {
          content: "";
          clear: both;
          display: block;
     }

     nav ul li {
          float: left;
          padding: 0;
     }

     nav ul li a {
          display: block;
          padding: 10px 20px;
          text-decoration: none;
          width: -webkit-fill-available;
     }

     nav ul ul {
          padding: 0;
          position: absolute;
          top: 100%;
          margin-left: -20px;
          -webkit-box-shadow: 1px 1px 6px rgb(255 255 255 / 20%), 1px 2px 6px 0px rgb(0 0 0 / 70%);
          -moz-box-shadow: 1px 1px 6px rgba(255, 255, 255, 0.2), 1px 2px 6px 0px rgba(0, 0, 0, 0.070);
          box-shadow: 1px 1px 6px rgb(255 255 255 / 20%), 1px 2px 6px 0px rgb(0 0 0 / 70%);
     }

     nav ul ul li {
          float: none;
          /* border-bottom: 2px solid transparent;
          border-top: 2px solid transparent; */
          position: relative;
     }

     nav ul ul li a {
          /* padding: 8px 25px; */
          /* padding: 5px; */
          text-decoration: none;
          width: -webkit-fill-available;
     }

     nav ul ul ul {
          position: absolute;
          left: 100%;
          top: 0;
          margin-left: 0px;
     }

     /* nav ul li > a {
          font-weight: 600;
          font-size: 20px;
          text-transform: uppercase;
     } */


     nav ul li:hover {
          cursor: pointer;
     }

     nav ul li:hover>ul {
          display: block;
          background-color: #FFFFFF;
          font-size: inherit;
          padding: 5px 0px;
          font-weight: 500;
          border-radius: 0px;
          min-width: 200px;
          text-align: left;
          border-left: 2px solid #e3280e;
          border-bottom: 2px solid #e3280e;
     }

     nav ul li:hover>ul ul {
          /* margin: 32px 0 0 -275px; */
     }

     /***** Menu Colors *****/

     nav ul li.topli,
     nav ul li.subtopli,
     nav ul li.subtabliul {
          padding: 10px 20px;
     }

     :after,
     :before {
          box-sizing: border-box;
     }

     nav ul li.topli:after {
          display: inline-block;
          position: relative;
          height: 8px;
          width: 8px;
          top: -4px;
          border: 0 solid currentColor;
          border-width: 0 2px 2px 0;
          content: '';
          margin: 0 0 0 10px;
          transform: rotate(45deg);
     }

     nav ul li.subtopli:after {
          /* content: " ";
          display: inline-block;
          padding: 5px;
          margin-left: 8px !important;
          margin-bottom: 0px;
          background-repeat: no-repeat; */
          display: inline-block;
          position: relative;
          height: 8px;
          width: 8px;
          top: -1px;
          border: 0 solid currentColor;
          border-width: 0 2px 2px 0;
          content: '';
          margin: 0 0 0 10px;
          transform: rotate(-45deg);
     }

     /* nav ul li.topli:hover:after {
          background-image: url(../con/button_right_arrow.png);
     } */
     nav ul li.topli:hover {
          color: #e3280e !important;
          /* background-color: #222222 !important; */
          text-decoration-line: underline;
          -webkit-transition: text-underline-offset .3s 0s;
          transition: text-underline-offset .3s 0s;
          text-underline-offset: 8px;
          text-decoration-thickness: 2px;
     }

     nav ul li.topli {
          /*background-color: #FFFFFF !important;*/
          color: #434343 !important;
          text-decoration-color: #e3280e;
          text-underline-offset: 18px;
          padding-bottom: 20px;
     }

     nav ul li.topli:hover a {
          color: #e3280e !important;
     }

     nav ul li.topli:not(:hover) a {
          color: #434343 !important;
     }

     /* nav ul li.subtopli:hover:after {
          background-image: url(../con/button_right_arrow.png);
     } */
     nav ul li.subtopli:hover {
          color: #FFFFFF !important;
          background-color: #e3280e !important;
          /* border-bottom-color: #e3280e; */
          /* border-top-color: #e3280e */
          -webkit-transition: background-color 0.3s ease-in-out;
          transition: background-color 0.3s ease-in-out;
     }

     nav ul li.subtopli {
          /* background-color: #FFFFFF !important; */
          color: #434343 !important;
     }

     nav ul li.subtopli:hover a {
          color: #e3280e !important;
     }

     nav ul li.subtopli:not(:hover) a {
          color: #434343 !important;
     }

     nav ul li.onlyli {
          /*background-color: #FFFFFF !important;*/
          color: #434343 !important;
     }

     nav ul li.onlyli a {
          text-decoration-color: #e3280e;
          text-underline-offset: 18px;
          padding-bottom: 20px;
     }

     nav ul li.onlyli:hover {
          color: #e3280e !important;
          /* background-color: #36837d !important; */
     }

     nav ul li.onlyli:hover a {
          color: #e3280e !important;
          text-decoration-line: underline;
          -webkit-transition: text-underline-offset .3s 0s;
          transition: text-underline-offset .3s 0s;
          text-underline-offset: 8px;
          text-decoration-thickness: 2px;
     }

     /* nav ul li.onlyli:not(:hover) a {
          color: #434343 !important;
     } */

     /* nav ul li.subtab {
          background-color: #FFFFFF !important;
          color: #e3280e !important;
     } */
     nav ul li.subtab:hover {
          color: #FFFFFF !important;
          background-color: #e3280e !important;
          /* border-bottom-color: #e3280e; */
          /* border-top-color: #e3280e */
          -webkit-transition: background-color 0.3s ease-in-out;
          transition: background-color 0.3s ease-in-out;
     }

     nav ul li.subtab:hover a {
          color: #FFFFFF !important;
     }

     nav ul li.subtab:not(:hover) a {
          color: #434343 !important;
     }

     /*****************************************/



     /****** Search Input *******/

     .fa-search {
          position: absolute;
          left: 8px;
          top: calc(50% - 0.5em);
          /* Keep icon in center of input, regardless of the input height */
          color: #888;
     }

     input#searchfield_input {
          padding-left: 25px;
          width: 150px;
          border-radius: 15px / 15px;
          border: solid 1px #CDCDCD;
     }

     .input-wrapper {
          position: relative;
          display: inline-block;
          vertical-align: super;
     }

     /*** Item Search Block ***/
     .item-search-block {
          /*border-bottom: 4px solid #193451;
          padding-bottom: 8px;
          min-width: 210px;*/
          margin: unset;
     }



     .form-body .note {
          font-size: inherit;
          /* font-family: "Poppins", sans-serif !important; */
     }

     .items-table th {
          background-color: inherit;
          color: ##202A3B;
          font-weight: bold;
          margin: 0px;
          padding: 0.33em;
          font-size: inherit;
     }

     .items-table td {
          background-color: transparent;
          color: #202A3B;
          padding: 0.33em;
          font-size: inherit;
     }

     td.right-col {
          right: 5%;
          position: relative;
          padding-bottom: 20px;
     }

     .responsive-longname {
          /* min-height: 50px; */
          display: inline-flex;
          flex-wrap: wrap;
          padding: 5px 20px;
     }

     .responsive_tabs dfn {
          padding-top: 6px !important;
          padding-bottom: 6px !important;
     }

     .responsive-choose-info {
          display: block !important;
          max-height: 100rem !important;
          overflow: visible !important;
     }


     /******** Dropdown menu************/
     .dropbtn {
          /* background-color: #4CAF50; */
          color: white;
          padding: 16px;
          font-size: 16px;
          border: none;
          cursor: pointer;
     }

     /* .dropdown:hover {
          color: #FFFFFF !important;
          background-color: #e3280e !important;
     } */
     .dropdown {
          position: absolute;
          display: inline-block;
          top: -12px;
          right: 0;
          min-width: 125px;
          /* background-color: #36837d; */
          text-align: left;
          padding: 14px 10px 14px 10px;
          /* margin-bottom: 10px; */
          /* color: #434343; */
          cursor: pointer;
          z-index: 90;
     }

     .dropicon {
          position: relative;
          display: inline-block;
     }

     .dropdown-content {
          display: none;
          top: 42px;
          left: 0px;
          position: absolute;
          min-width: 140px;
          box-shadow: 0px 8px 16px 0px rgb(0 0 0 / 20%);
          text-align: left;
          z-index: 1;
          background-color: #FFFFFF;
          padding: 6px 0;
          /* text-transform: uppercase; */
     }

     .dropdown-content a {
          padding: 4px 16px;
          text-decoration: none;
          display: block !important;
          white-space: nowrap;
     }

     .dropdown-content a:hover {
          color: #FFFFFF !important;
          background-color: #e3280e !important;
          -webkit-transition: background-color 0.3s ease-in-out;
          transition: background-color 0.3s ease-in-out;
     }

     .dropdown:hover .dropdown-content {
          display: block;
     }

     /* .dropdown:hover .dropbtn {
          background-color: #3e8e41;
     } */

     span#dropicon::after {
          display: inline-block;
          position: relative;
          height: 9px;
          width: 9px;
          top: -3px;
          border: 0 solid currentColor;
          border-width: 0 2px 2px 0;
          content: '';
          margin: 0 0 0 10px;
          transform: rotate(45deg);
     }

     /****************************************************/

     /********* TopTabs **********/

     /*td.toptabs {
          padding-left: 40px;
     }*/

     .toptabs a {
          color: #36837d !important;
          /*display: inline-block;*/
          white-space: nowrap;
          text-decoration: none;
          text-transform: uppercase;
          /* font-family: "Poppins", sans-serif !important; */
     }

     /*.toptabs a:hover {
          padding: 5px;
     }*/

     /* This must be commented out for zoom images */
     /* div#all_items_view {
          width: 99% !important;
          float: none !important;
          margin: 0 auto !important;
     } */

     .basket-list-item {
          font-size: 14px !important;
          display: -webkit-box;
          padding: 5px;
          border-radius: 5px;
          -webkit-box-shadow: 1px 1px 6px rgb(255 255 255 / 20%), 1px 2px 6px 0px rgb(0 0 0 / 70%);
          -moz-box-shadow: 1px 1px 6px rgba(255, 255, 255, 0.2), 1px 2px 6px 0px rgba(0, 0, 0, 0.070);
          box-shadow: 1px 1px 6px rgb(255 255 255 / 20%), 1px 2px 6px 0px rgb(0 0 0 / 70%);
     }

     .basket-text,
     .basket-butt {
          text-align: left;
          padding-left: 5px;
          display: table-cell;
     }

     /* .toptabs a:hover, .dropdown-content a:hover {
          color: #FFFFFF;
          border-bottom: 4px solid #36837d;
     } */


     /****************************************************/

     /********* TopTabs **********/

     /*td.toptabs {
          padding-left: 40px;
     }*/

     .toptabs a {
          color: #36837d !important;
          /*display: inline-block;*/
          white-space: nowrap;
          text-decoration: none;
          text-transform: uppercase;
          /* font-family: "Poppins", sans-serif !important; */
     }

     /*.toptabs a:hover {
          padding: 5px;
     }*/

     /* This must be commented out for zoom images */
     /* div#all_items_view {
          width: 99% !important;
          float: none !important;
          margin: 0 auto !important;
     } */

     .basket-list-item {
          font-size: 14px !important;
          display: -webkit-box;
          padding: 5px;
          border-radius: 5px;
          -webkit-box-shadow: 1px 1px 6px rgb(255 255 255 / 20%), 1px 2px 6px 0px rgb(0 0 0 / 70%);
          -moz-box-shadow: 1px 1px 6px rgba(255, 255, 255, 0.2), 1px 2px 6px 0px rgba(0, 0, 0, 0.070);
          box-shadow: 1px 1px 6px rgb(255 255 255 / 20%), 1px 2px 6px 0px rgb(0 0 0 / 70%);
     }

     .basket-text,
     .basket-butt {
          text-align: left;
          padding-left: 5px;
          display: table-cell;
     }

     /* .toptabs a:hover, .dropdown-content a:hover {
          color: #FFFFFF;
          border-bottom: 4px solid #36837d;
     } */


     /****************************************************/

     /****** Hide old Tabs ********/
     .tab_html_wrapper {
          display: none;
     }

     .responsive_tabs-shell .before {
          display: none;
     }

     div#basket-list-title {
          display: none;
     }

     /*div.responsive_tabs-shell {
          display: none;
     }*/

     .responsive_tabs-shell {
          width: unset !important;
          border-collapse: collapse !important;
          border: 0px !important;
          /* font-family: inherit !important; */
          padding: 0 0 0 7px !important;
          margin: 0px !important;
          max-width: 200px !important;
          background-color: transparent !important;
          vertical-align: top !important;
          float: left !important;
          height: 65vh;
     }

     /*****************************/

     td.space {
          min-width: 45px;
          display: inline-block;
          /*border: 1px solid yellow;*/
     }


     /*** Header ***/

     img.no_mobile {
          height: auto;
          width: 180px;
     }

     td#header_logo>a img.no_mobile {
          /*max-height: 75px;*/
          width: auto;
     }

     /*.header {
          padding: 0px;
          border: 0px;
          width: 90%;
          margin: 0 auto;
     }*/

     table:not(.items-table) {
          width: auto;
          margin: 0px auto;
     }


     .header-links a:hover {
          color: #cccccc;
          border-bottom: 4px solid #434343;
     }

     .header-links,
     .header-links a {
          color: #ffffff;
          font-size: inherit !important;
          border-bottom: 4px solid transparent;
     }

     .toptabs,
     toptabs a,
     .dropdown-content a {
          color: #333333;
          /* font-size: 16px !important; */
          /* font-weight: 400; */
          /*border-bottom: 4px solid transparent;*/
     }

     .header-links a,
     .toptabs a {
          margin: 0px 15px;
          padding: 5px;
          /*border: 1px solid green;*/
     }

     #logout_userid {
          /*margin: 0px 0px 0px 15px; */
          /* padding: 5px; */
          /* border: 1px solid green; */
          display: inline-block;
          position: absolute;
          top: 2px;
          text-align: right;
          right: 175px;
          /*color: white;*/
     }

     .header-links a:hover,
     .toptabs a:hover {
          padding: 5px;
     }

     #header-wrapper {
          border-top: 25px solid transparent;
          /* border-bottom: 39px solid #000000; */
          background-color: transparent;
          color: #434343;
          height: 100px;
          -webkit-box-shadow: 0px 2px 0px rgb(17 17 17 / 5%);
          -moz-box-shadow: 0px 2px 0px rgba(17, 17, 17, .05);
          box-shadow: 0px 2px 0px rgba(17, 17, 17, .05);
     }


     #header_logo {
          padding: 30px 0;
     }


     #header_logo>img.no_mobile {
          position: absolute;
          top: 50px;
          left: 45px;
          max-width: 350px;
          /*max-height: 120px;*/
     }

     #header-links-container {
          position: absolute;
          top: 18px;
          left: 5%;
          width: 94%;
          white-space: nowrap;
          min-height: 70px;
     }

     .form-body td.label,
     .form-body td.input {
          font-size: 16px !important;
          padding: 8px 5px 8px 5px !important;
     }

     input,
     select {
          font-size: 16px;
          padding: 3px 5px;
     }

     .logolinkdiv {
          /*margin-left: 135px;*/
          /* margin-bottom: -8px; */
          /* padding-top: 8px;*/
          display: inline-block;
     }

     td#desklogo,
     td.toptabs {
          /* display: inline-block; */
          margin: 0;
          vertical-align: middle;
     }

     .container {
          text-align: center !important;
          border: 0;
     }


     .header-links {
          /*text-decoration: none;
          padding: 0px 4%px;*/

     }

     #copy5 {
          text-align: left;
          padding-left: 2%;
          padding-top: 10px;
          margin-bottom: 0px;
          font-weight: 500;
          color: #434343;
          font-size: 14px;
     }

     span.fa.fa-times.detail_closer.ng-scope {
          display: none;
     }

     div.blurb {
          /*margin-right: 90%;
          white-space: nowrap;
          text-align: left;
          position: absolute;
          top: 145px;
          color: #36837d;*/
     }

     .fa-shopping-basket:before {
          content: "\f07a" !important;
          font-size: 40px;
     }

     .fa {
          letter-spacing: initial;
          margin: 0px -2px 1px -2px;
     }

     .carticon {
          display: inline-block;
     }

     .carticon span.cart_num_items.no_mobile {
          box-shadow: 1px 1px 3px rgb(0 0 0 / 100%) !important;
     }

     .carticon span.fa.fa-shopping-basket {
          text-shadow: 1px 1px 3px rgb(0 0 0 / 100%), -1px -1px 3px rgb(0 0 0 / 100%) !important;
     }


     /*************************************** Align Stretchy_cols **********************************************/
     .multi_preview {
          /* min-height: 60px; */
          padding: 0 !important;
     }

     .stretchy_cols.responsive-item.image-row {
          vertical-align: bottom !important;
          display: inline-table;
          /*margin-bottom: 30px !important;
          min-width: unset !important;
          max-width: unset !important;
          width: unset !important;*/
     }

     .height-adjuster {
          display: block;
          margin-top: 1px !important;
          /* border-radius: 10px/10px !important; */
          max-width: 375px;
          /* background-color: rgba(91, 103, 112,0.05); */
          /* background-color: rgba(125, 125, 125, 0.025); */
          /* background-color: rgba(253, 253, 253, 1); */
          border: 2px solid #dedede;

     }

     .singleItemCenter {
          min-width: unset !important;
          max-width: unset !important;
          width: unset !important;
     }

     .stretchy_cols {
          width: 100% !important;
          max-width: 375px !important;
          /*min-width: 328px !important;
          min-height: 200px !important;*/
          box-sizing: border-box !important;
          margin: 20px 3px 0px 0px !important;
          padding: 5px !important;
          overflow: hidden !important;
          max-height: unset !important;
          min-height: 200px !important;
          /*vertical-align: bottom !important;*/
     }

     span.responsive-tagcheck.tagcheck-bottom {
          /* min-height: 117px; */
          /* border: solid 1px red; */
          display: inline-flex;
          justify-content: flex-end;
          flex-direction: column;
     }

     /* .note.responsive-pricing {
          min-height: 22px;
     } */

     .main-section {
          margin-top: 0px !important;
     }

     div:has(> #submit_catalog_add) {
          margin-bottom: 20px;
     }

     .image-container {
          /* min-height: 262px; */
          padding: 10px;
     }

     /*div#header-wrapper {
          display: none !important;
     }*/

     /*td.header-links {
          display: none !important;
     }*/

     .catalog-tab-blurb {
          text-align: left;
          line-height: 1.5em;
          font-size: 16px;
          width: 80% !important;
          margin-top: 0 !important;
     }

     .item_count,
     span.cart_num_items.no_mobile {
          font-size: .8rem;
          width: 1rem;
          height: 1rem;
          border: 1px solid #111111;
          color: #111111;
          border-radius: 100px;
          padding: 1px;
          position: relative;
          box-sizing: content-box;
          top: -24px;
          right: 14px;
          background: #FFFFFF;
          text-align: center;
          margin-right: -17px;
          display: inline-block;
     }

     .multisize-table td,
     .multisize-table th {
          padding: 0px 10px !important;
     }

     .previewcell img {
          max-width: 200px;
          border: 1px solid #999999 !important;
     }

     #jquery-lightbox {
          z-index: 100001 !important;
     }

     body#zoompopup-body img {
          border: 1px solid #999999;
     }

     /************ Handle zoom on images *****************/

     .imgwrap>label>img {
          /* transition: transform 0.25s ; */
          transition: transform 0.25s;
          cursor: zoom-in;
     }

     input[type=checkbox].zoomCheck {
          display: none;
     }

     input[type=checkbox].zoomCheck:checked~label>img {
          cursor: zoom-out;
          position: absolute;
          transform-origin: 100% 100%;
          transform: scale(2);
          z-index: 200;
     }

     /* div#all_items_view {
          width: 100% !important;
          float: none !important;
          /* float: right !important; */
     margin: 0 auto !important;
}


/* *********** End of Zoom ***************************** */



/*********************************************************************************************************/

@media only screen and (max-width:1024px) {

     .main.select-items,
     .catalog,
     form {
          margin-bottom: 15%;
     }

     .stretchy_cols {
          min-height: fit-content !important;
          max-height: 400px !important;
          height: fit-content !important;
     }

     .responsive_tabs-shell {
          background-color: #FFF;
     }

     div#tab_responsive_tabs {
          background-color: #FFFFFF;
     }

     .responsive_tabs dfn {
          padding-top: 10px;
          padding-bottom: 10px;
     }

     div#tab_0 {
          margin-top: 50px;
     }

     .fa-search:before {
          content: "\f002";
          font-size: 25px;
     }

     .select-items #searchfield_input {
          width: 55vw;
          position: absolute;
          right: calc((100% - 60vw)/2);
     }

     .select-items .item-search-block {
          /* margin-right: 7% !important; */
          margin-right: calc((100% - 85vw)/2) !important;
          margin: 0px auto;
          float: right;
     }

     button#submit_catalog_search {
          padding: 5px 2px 4px 8px !important;
          margin: 0px !important;
     }

     label.fa.fa.fa-search {
          display: none;
     }

     .footnote,
     .footnote a {
          width: 95%;
          /* margin: 45% auto; */
          background-color: #3d3d3d;
          color: #FFFFFF;
     }

     li#d_tag,
     li#d_prodcode {
          display: none;
     }

     #d_on_hand_html #d_on_hand_html_label {
          display: block !important;
     }

     div#upper_buttons {
          display: none;
     }

     /* h1, h2, h3, h4, h5, h6 {
          font-family: "Poppins", sans-serif !important;
     } */

     td#desklogo {
          padding: 0.5rem 0.625rem 0.625rem !important;
     }

     .select-items .catalog-tab-blurb {
          max-width: 95vw !important;
          overflow: hidden;
          padding: 15px !important;
          margin: 30px 0 0 !important;
          text-align: left;
     }

     i.fa.fa-shopping-basket,
     i.fa.fa-user {
          color: #434343 !important;
     }

     #mobile_link_box a {
          opacity: 1 !important;
          font-weight: 600;
          font-size: 1rem;
     }

     table thead,
     table tbody,
     table tfoot {
          border: none !important;
          background-color: transparent !important;
     }
}

@media (min-width: 320px) {
     .preview-wrapper {
          zoom: 40%;
          -moz-transform: scale(.4) !important;
          -moz-transform-origin: 8vw 0 0 !important
     }
}

@media (min-width: 375px) {
     .preview-wrapper {
          zoom: 50%;
          -moz-transform: scale(.5) !important;
          -moz-transform-origin: 20vw 0 0 !important
     }
}

@media (min-width: 481px) {
     .preview-wrapper {
          zoom: 60%;
          -moz-transform: scale(.6) !important;
          -moz-transform-origin: 0 0 !important
     }
}

@media (min-width: 641px) {
     .preview-wrapper {
          zoom: 70%;
          -moz-transform: scale(.7) !important;
          -moz-transform-origin: 0 0 !important
     }
}

@media (min-width: 645px) {
     .preview-wrapper {
          zoom: 100%;
          -moz-transform: scale(1) !important;
          -moz-transform-origin: 0 0 !important
     }
}

