h1 {
  text-align:center;
}

.dispo {
  margin-top:-0.5vw;
  margin-bottom:-0.5vw;
  padding-top:0.5vw;
  padding-bottom:0.5vw;
  background-color:#ffa0a0;
}

table.sales {
  margin:-.5em 0;
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 .5em;
  /*
  border-radius: 8px;
  border: solid 2px #f00000;
  box-shadow: 4px 4px 8px #333;
  */
}
table.sales > tbody > tr {
  background-color: #e0e0e0;
  box-shadow: 2px 2px 2px #999;
  vertical-align:top;
}
table.sales > tbody > tr:first-child {
  background-color:#c0c0c0;
}
table.sales > tbody > tr.highlight {
  background-color:#88ff88;
}
table.sales > tbody > tr.highlight_warn {
  background-color:#f8f860;
}
table.sales > * > tr > * {
  padding:.5em;
}
table.sales > tbody > tr, table.sales > * > tr > *:first-child {
  border-top-left-radius: .5em;
  border-bottom-left-radius: .5em;
}
table.sales > tbody > tr, table.sales > * > tr > *:last-child {
  border-top-right-radius: .5em;
  border-bottom-right-radius: .5em;
}
table.sales > tbody > tr.sale.link:nth-child(1n+2):hover {
  background-color:lightblue;
  cursor:pointer;
}
div.sales {
  margin-left: 1em;
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
div.sales > span {
  box-shadow: 2px 2px 4px #333;
  margin: 4px;
}
div.sales > span.todo {
  box-shadow: 4px 4px 8px #333;
  margin: 2px;
  font-weight:bold;
}

div.box01 {
  border:solid 1px #999;
  border-radius:.5em;
  overflow:hidden;
  background-color:#f8f8f8;
  box-shadow: 2px 2px 4px #999;
}

div.imagebox01 {
  padding:0;
  border:solid 1px #555555;
  border-radius:.5em;
  overflow:hidden;
  background-color:#f8f8f8;
  box-shadow: 2px 2px 8px #999;
}

.todo {
  background-color: #f0b8b8;
}
.done {
  background-color: #b8f0b8;
}

/* bootstrap overrides */
.form-control:disabled, .form-control[readonly] {
  background-color:#f4f4f4;
}
.btn-primary {
  color: #fff;
  background-color: #777;
  border-color: #555;
}
btn-primary.disabled, .btn-primary:disabled {
  background-color: #999;
  border-color: #777;
}
.btn-primary:not(:disabled):hover {
    background-color: #007bff;
}
.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
  box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.8);
}
.btn-secondary {
  color: #777;
  background-color: #ccc;
}
.btn-secondary:hover {
    background-color: #007bff;
}

.hidden {
  display: none !important;
}

.disabled {
  opacity:.5;
}

ul.nav, div.box01 h4 {
  background:linear-gradient(to bottom, #bbb, #eee);
  font-size:1.25rem;
  border-bottom:0;
}
div.box01 h4 {
  padding:0 1em;
}
ul.nav > li {
  overflow: hidden;
}
ul.nav > li > a {
  display:block;
  padding:0 1em;
  border:solid 5px transparent;
  border-radius:8px 8px 0 0;
  text-decoration:none;
  color:#333333;
  font-weight:500;
}
ul.nav > li > a:focus {
  color: #0075ff;
}
ul.nav > li > a.active {
  background-color: #f8f8f8;
  font-weight:500;
}
ul.nav > li.warn > a {
  border-color:red;
}

input[type=radio], input[type=checkbox] {
  width:1.25em;
  height:1.25em;
}
input.inp-num {
  text-align:right;
}
input.warn {
  outline: solid 5px #ff8080 !important;
}
input.modified, select.modified {
  border: solid 4px blue !important;
}

.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
  padding-right: .5em;
  padding-left: .5em;
}

div.input-group label {
  min-width: 8em;
}

label.pdf-upload {
  cursor: pointer;
  margin: 0;
  background: orange url(../img/pdf-upload.png) no-repeat;
  background-size: cover;
  border: 0;
  width: 3em;
}
label.pdf {
  cursor: pointer;
  margin: 0;
  background: url(../img/pdf.png) no-repeat;
  background-size: cover;
  border: 0;
  width: 3em;
}

::placeholder {
  color: #ccc !important;
}