﻿.order__web-id {
  font-size: 150%;
  color: #b11f25;
  text-transform: uppercase;
  font-weight: 500; }

.order__meta {
  background-color: rgba(112, 112, 112, 0.15);
  border-radius: 15px;
  padding: 10px;
  overflow: hidden;
  margin-top: 20px; }
  .order__meta .meta-field:not(:empty) {
    display: inline-block;
    white-space: nowrap;
    margin-right: 20px; }
    .order__meta .meta-field:not(:empty):before {
      content: attr(data-label);
      font-weight: 600;
      padding-right: 5px; }

.order__bill-to {
  background-color: rgba(112, 112, 112, 0.15);
  border-radius: 15px;
  padding: 10px;
  overflow: hidden;
  margin-top: 20px;
  position: relative; }

.order__ship-to {
  background-color: rgba(112, 112, 112, 0.15);
  border-radius: 15px;
  padding: 10px;
  overflow: hidden;
  margin-top: 20px;
  position: relative; }

.order .change-address-button {
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: .65rem; }

.order .order__notification-summaries {
  padding: 10px 15px; }

.order .notification-summary {
  font-size: .8rem;
  padding: 1px 10px;
  border-radius: 5px;
  color: #fff;
  background-color: #b11f25;
  float: left;
  clear: right;
  margin: 5px;
  cursor: pointer; }
  .order .notification-summary:before {
    content: '\f003';
    font-family: 'FontAwesome';
    padding-right: .5em; }
  .order .notification-summary.unread:before {
    content: '\f0e0'; }
  .order .notification-summary:first-child {
    margin-left: 0; }

.order__items {
  width: 100%;
  margin-top: 20px;
  background-color: rgba(112, 112, 112, 0.15);
  border-radius: 15px;
  padding: 10px;
  overflow: hidden;
  border-top-left-radius: 0;
  border-top-right-radius: 0; }
  @media only screen and (max-width: 650px) {
    .order__items {
      /* Force table to not be like tables anymore */
      /* Hide table headers (but not display: none;, for accessibility) */ }
      .order__items thead, .order__items tbody, .order__items th, .order__items td, .order__items tr {
        display: block; }
      .order__items thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px; }
      .order__items tr.order-item:nth-of-type(even) {
        background: #eee; }
      .order__items tr.order-item td {
        /* Behave  like a "row" */
        border: none;
        border-bottom: 1px dotted #ddd;
        position: relative;
        padding: 3px 3px 3px 50%;
        text-align: left;
        /* Label the data */ }
        .order__items tr.order-item td:before {
          /* Now like a table header */
          position: absolute;
          /* Top/left values mimic padding */
          top: 3px;
          left: 10px;
          width: 45%;
          padding-right: 10px;
          white-space: nowrap; }
        .order__items tr.order-item td:nth-of-type(1):before {
          content: "Part #"; }
        .order__items tr.order-item td:nth-of-type(2):before {
          content: "Quantity"; }
        .order__items tr.order-item td:nth-of-type(3):before {
          content: "Description"; }
        .order__items tr.order-item td:nth-of-type(4):before {
          content: "Unit Price"; }
        .order__items tr.order-item td:nth-of-type(5):before {
          content: "Extended Price"; }
      .order__items tr.total td:last-child {
        padding-right: 10px; } }
  .order__items caption {
    background: #707070;
    color: #fff;
    text-transform: uppercase;
    padding: 10px;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px; }
  .order__items thead {
    background-color: rgba(112, 112, 112, 0.3);
    color: #b11f25; }
  .order__items th {
    text-align: left;
    padding: 10px; }
    .order__items th:first-child {
      padding-left: 25px; }
    .order__items th:last-child {
      padding-right: 25px; }
    .order__items th:nth-child(4), .order__items th:nth-child(5) {
      text-align: right; }
  .order__items tr {
    line-height: 1.5432098; }
    .order__items tr.total td {
      text-align: right;
      font-weight: 600;
      padding-top: 5px;
      padding-bottom: 5px; }
    .order__items tr.total--before-discount {
      border-top: solid 1px rgba(112, 112, 112, 0.3); }
    .order__items tr.total--discount {
      color: #820A0C;
      font-weight: bold; }
  .order__items td {
    padding: 10px; }
    .order__items td:first-child {
      padding-left: 25px; }
    .order__items td:last-child {
      padding-right: 25px; }
    .order__items td:nth-child(4), .order__items td:nth-child(5) {
      text-align: right; }

.order__notes:not(:empty) {
  margin-top: 20px;
  background-color: rgba(112, 112, 112, 0.15);
  border-radius: 15px;
  padding: 10px;
  overflow: hidden; }

.order__invoice {
  text-align: center; }
  .order__invoice a:not(:empty) {
    border: none;
    background-color: #ddd;
    color: #444;
    padding: 7.5px 25px;
    border-radius: 500px;
    text-transform: uppercase;
    text-decoration: none;
    background-color: #b11f25;
    color: #fff;
    display: inline-block;
    margin: 20px 0 10px 0; }
    .order__invoice a:not(:empty):before {
      content: 'Download Invoice #'; }

.order-list__item .order__header-row {
  background-color: #707070;
  top: -10px;
  left: -10px;
  width: calc(100% + 20px);
  padding: 10px 20px; }

.order-list__item .order__web-id {
  font-size: 1.1rem;
  color: #fff;
  font-weight: 600; }

.order-list__item .order__meta, .order-list__item .order__bill-to, .order-list__item .order__ship-to {
  background-color: #ccc; }
