#invoice {
  padding: 30px;
}
.invoice {
  position: relative;
  background-color: #fff;
  min-height: 680px;
  padding: 15px;
}
.invoice header {
  padding: 10px 0;
  margin-bottom: 20px;
  border-bottom: 1px solid #062d40;
}
.invoice .company-details {
  text-align: right;
}
.invoice .company-details .name {
  margin-top: 0;
  margin-bottom: 0;
}
.invoice .contacts {
  margin-bottom: 20px;
}
.invoice .invoice-to {
  text-align: left;
}
.invoice .invoice-to .to {
  margin-top: 0;
  margin-bottom: 0;
}
.invoice .invoice-details {
  text-align: right;
}
.invoice .invoice-details .invoice-id {
  margin-top: 0;
  color: #062d40;
}
.invoice main {
  padding-bottom: 50px;
}
.invoice main .thanks {
  margin-top: -100px;
  font-size: 2em;
  margin-bottom: 50px;
}
.invoice main .notices {
  padding-left: 6px;
  border-left: 6px solid #062d40;
}
.invoice main .notices .notice {
  font-size: 1.2em;
}
.invoice table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  margin-bottom: 20px;
}
.invoice table td,
.invoice table th {
  padding: 15px;
  background: #eee;
  border-bottom: 1px solid #fff;
}
.invoice table th {
  white-space: nowrap;
  font-weight: 400;
  font-size: 16px;
}
.invoice table td h3 {
  margin: 0;
  font-weight: 400;
  color: #062d40;
  font-size: 1.2em;
}
.invoice table .qty,
.invoice table .total,
.invoice table .unit {
  text-align: right;
  font-size: 1.2em;
}
.invoice table .no {
  color: #fff;
  font-size: 1.6em;
  background: #062d40;
}
.invoice table .unit {
  background: #ddd;
}
.invoice table .total {
  background: #062d40;
  color: #fff;
}
.invoice table tbody tr:last-child td {
  border: none;
}
.invoice table tfoot td {
  background: 0 0;
  border-bottom: none;
  white-space: nowrap;
  text-align: right;
  padding: 10px 20px;
  font-size: 1.2em;
  border-top: 1px solid #aaa;
}
.invoice table tfoot tr:first-child td {
  border-top: none;
}
.invoice table tfoot tr:last-child td {
  color: #062d40;
  font-size: 1.4em;
  border-top: 1px solid #062d40;
}
.invoice table tfoot tr td:first-child {
  border: none;
}
.invoice footer {
  width: 100%;
  text-align: center;
  color: #777;
  border-top: 1px solid #aaa;
  padding: 8px 0;
}
@media print {
  .invoice {
    font-size: 11px !important;
    overflow: hidden !important;
  }
  .invoice footer {
    position: absolute;
    bottom: 10px;
    page-break-after: always;
  }
  .invoice > div:last-child {
    page-break-before: always;
  }
}
.report-header-container {
  display: flex;
  justify-content: space-between;
}
.summary {
  position: relative;
  background: #fff;
  border: 1px solid #f4f4f4;
  padding: 20px;
  margin: 10px 25px;
}
.summary-title {
  margin-top: 0;
}
.summary-header {
  margin: 10px 0 20px 0;
  font-size: 22px;
}
.summary-header {
  padding-bottom: 9px;
  margin: 40px 0 20px;
  border-bottom: 1px solid #eee;
}
.table-responsive {
  min-height: 0.01%;
  overflow-x: auto;
}
.table {
  width: 100%;
  max-width: 100%;
  margin-bottom: 20px;
}
thead {
  display: table-header-group;
  vertical-align: middle;
  border-color: inherit;
}
table {
  background-color: transparent;
}
table {
  border-spacing: 0;
  border-collapse: collapse;
}
tr {
  display: table-row;
  vertical-align: inherit;
  border-color: inherit;
}
tbody {
  display: table-row-group;
  vertical-align: middle;
  border-color: inherit;
}