﻿body {
}
textarea {overflow: auto;
    resize: vertical;}
.proddesc {min-height:200px; font-size:0.9em;}
.body-content {
    max-width:1400px;
    margin: 12px;
}

@media only screen and (min-width: 1400px) {
    .body-content {
        margin:12px auto;
    }
    .body-content.unboundwidth {
        max-width:calc(100% - 24px);
    }
}
.form-control { padding:4px;}
.form-checkbox {display:block; height:calc(1.5em + .75rem + 2px); width:18px;}
.prodimage {
    max-height:200px; 
    cursor:pointer;
    margin-left:0;
}
.prodimage.expanded {
    max-height:none;
    position:absolute;
    margin:0 auto;
    top:30px;
    left:50%;
    margin-left:-225px;
}
.table th {text-align:left; cursor:pointer;}
.table th.qty, .table th.number {text-align:right;}

.clearfilter {display:inline-block; margin-left:30px;}
a {color:blue; text-decoration:none;}
a.level2 {text-decoration:none; font-size:0.8rem;}
.receipttotal { font-size:1.2rem; font-weight:bold; color:#051244;}
.pagemenu {border-top:1px solid #051244; border-bottom:1px solid #051244; padding:8px 4px; margin-bottom:12px;}
.pagemenu .navmenu li a {color:#051244;}
.pagemenu .navmenu li a:hover {color:silver;}
.disabled {background-color:#f5f5f5;}
.shortage {color:#f00;}
.overage {color:#25a500;}

.ui-widget button {font-family: Arial, Helvetica, sans-serif; font-size:12px;}
.ui-widget-content {color: #777; }
.ui-widget {font-size:1.0em;}
.header .navmenu li a {padding:12px 0;}
.dropdown {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  padding: 12px 8px;
  margin-top:10px;
  z-index: 99;
}
.dropdown li {padding:0; color:#051244; white-space:nowrap; display:block;}
.dropdown li a {color: #051244; display:block;}
.dropdown li a:hover {color:#808080}
.header .navmenu .dropdown li a {padding:8px;}
.header .navmenu li:hover .dropdown {
  display: block;
}
.header {background-color:#f9f9f9; color: #051244; box-shadow: 0 8px 16px #3333332b;}
#sitebrand a {color:#7e88ad; font-weight:bold;}
#topnav {background-color:inherit; border-top:none; padding:12px 10px 0 10px;}
.navmenu li a {color:#051244;}
.navmenu li a:hover {color:#777;}
.dropdown li:hover {background-color:lightsteelblue;}
body {background-color:#f9f9f9;}
.body-content {border-radius:unset; background-color:transparent; box-shadow:none;}

.linkbutton { padding-top:4px; padding-bottom:4px;}
.linkbutton:hover {color:#fff; background-color:#6f6f6f;}
.linkbutton.compact {height:24px; padding:0 8px; line-height:22px;}
.linkbutton.option {background-color: #0b09f3;
    border-color: #0b09f3;}
.linkbutton.option:hover {
    background-color: #5d5cfd;
    border-color: #5d5cfd;
}
.button.textsize {font-size:0.9em; margin:0; padding:2px 6px; height:1.5em; line-height:1.0em;}
table.focusrow tr:hover {background-color:#e1e1f7;}
tr.sticky th {
    position: sticky;
    top: 0px;
    background-color:#e0e0e0;
}
.checkyes {color:#109a10;}
.xno {color:#f00;}
.msg-icn {
  display: inline-block;
  position: relative;
  padding:  10px 20px;
  color: #fff;
  box-sizing: border-box;
  max-width: 300px;
  min-width: 80px;
  min-height: 38px;
  border-radius:8px;
}
.msg-icn:before {
  content: "";
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  border: 1px solid #e5a002;
  border-radius: 8px;
  box-sizing: border-box;
  clip-path: polygon(0% 105%, 0% 0%, 105% 0%, 105% 105%, 43px 105%, 43px 80%, 21px 80%, 21px 105%);
}
.msg-icn:after {
  content: "";
  position: absolute;
  display: block;
  width: 25px;
  height: 20px;
  background: #e5a002;
  top: calc(100% - 1px);
  left: 20px;
  box-sizing: border-box;
  clip-path: polygon(0 0, 0% 100%, 100% 0% /*, calc(100% - 2px) 0, 1px calc(100% - 2px), 1px 0*/);
}
.msg-icn.osdproductmessage {
    position:absolute;
    width:280px;
    bottom:33px;
    left:-14px;
    background-color:#555;
    color:#e2ce52;
}
.msg-icn.osdproductmessage:after {
    background-color:#555;
}