/*!
 * Common Styles
 * PWA_Shell
 */

.divider {
  margin-left: auto;
  margin-right: auto;
  margin-top: 1.4em;
  margin-bottom: 1.4em;
  max-width: 1360px;
  height: 1px;
  background-color: #eaeaea;
}
.static-content .divider {
  margin-top: 1.8em;
  margin-bottom: 1.8em;
}
.static-content p {
  text-align: justify;
}

.fence { 
  color: #444;
  padding: 0 1em;
  display: inline-block;
}

.hidden { display: none; }

.cursor { cursor: pointer; }

.table-nice {
  background-color: #eee;
  border-collapse: separate;
  border-spacing: 1px;
}
.table-nice td {
  padding: 1em;
  background-color: #fff;
}
.table-nice .row-color,
.table-nice .row-color th {
  background-color: #292929;
  color: #fff;
}
.table-nice tr:nth-of-type(even) td {
  background-color: #f2f2f2;
}
.table-nice th {
  padding: 1em;
  background-color: #e9e9e9;
}

@media (max-width: 800px) {
  table.table-nice,
  .table-nice thead,
  .table-nice tbody,
  .table-nice tfoot,
  .table-nice th,
  .table-nice td,
  .table-nice tr {
    display: block;
    width: 100%;
  }
  .table-nice thead tr {
    display:none;
  }
  .table-nice td:first-child {
    font-weight: bold;
  }
  .table-nice td,
  .table-nice th {
    padding: .5em 1em;
  }
}

@media (max-width: 600px) {
  table.mobile-table,
  .mobile-table thead,
  .mobile-table tbody,
  .mobile-table tfoot,
  .mobile-table th,
  .mobile-table td,
  .mobile-table tr {
    display: block;
    width: 100%;
  }
  .mobile-table thead tr {
    display:none;
  }
}

.button,
button {
  background-color: #0076a3;
  border: none;
  border-radius: 4px;
  padding: 1em 1em;
  color: #fff;
  font-weight: 600;
  text-align: center;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
}
.button:hover {
  color: #fff;
  opacity: .9;
}
.button-small {
  min-height: auto;
  padding: .5em 1em !important;
}
.button-large {
  min-height: auto;
  width: 100%;
  padding: 1em;
  font-size: 1.1em;
  text-transform: uppercase;
}
.button-light {
  display: inline-block;
  border: 1px solid #0076a3;
  border-radius: 4px;
  padding: 1em 2em;
  text-decoration: none !important;
  font-weight: 600;
  text-transform: uppercase;
}
a.button-white {
  color: #fff;
}
.delete,
.delete a,
.delete:hover {
  color: #b02827;
  font-weight: bold;
  text-decoration: none;
}
.black {
  color: #000;
}
.black-bg {
  background-color: #000;
}
a.white:hover {
  color: #fff;
}
.white {
  color: #fff;
}
.off-white {
  color: #fafafa;
}
.white-bg {
  background-color: #fff;
}
.red {
  color: #b02827;
}
.banners a {
  color: #fff !important;
}
.banners .banner-button {
  font-size: 1em;
  display: inline-block;
  text-decoration: none;
  background-color: #0076a3 !important;
  border: 1px solid #000;
  color: #fff !important;
  border-radius: 4px;
  padding: .8em 1em;
  margin: 1em auto 0 auto;
  width: 160px;
  border-radius: 6px;
  text-align: center;
  font-weight: 700;
  text-transform: uppercase;
}
.purple-dark {
  color: #1a1a2c;
}
.purple-dark-bg {
  background-color: #1a1a2c;
}
.purple-darkest-bg {
  background-color: #161625;
}
.red-bg {
  background-color: #bb0000;
}
.red-dark {
  color: #bb0000;
}
.red-dark-bg {
  background-color: #bb0000;
}
.green,
.green-dark {
  color: #445959;
}
.menu-subheader.green-dark {
  background-color: #445959;
  color: #fff;
}
.green-bg {
  background-color: #445959;
}
.green-dark-bg {
  background-color: #405252;
}
.blue,
.teal {
 color: #0076a3; 
}
.blue-bg,
.teal-bg {
  background-color: #0076a3; 
}
.grey {
  color: #656565;
}
.grey-bg {
  background-color: #939598;
}
.silver {
  color: #ccc;
}
.silver-bg {
  background-color: #ccc;
}
.light-grey {
  color: #e9e9e9;
}
.light-grey-bg {
  background-color: #e9e9e9;
}
.lightest-grey {
  color: #eaeaea;
}
.lightest-grey-bg {
  background-color: #f3f3f3;
}
.grey,
.text-grey {
  color: #666;
}
.dark-grey {
  color: #181818;
}
.dark-grey-bg {
  background-color: #181818;
}

.border-radius { border-radius: 6px; }
.grey-border { border: 1px solid #ddd; }
.grey-border-top { border-top: 1px solid #ddd; }
.grey-border-bottom { border-bottom: 1px solid #ddd; }
.grey-border-both { border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; }
.light-grey-border { border: 1px solid #eaeaea; }
.light-grey-border-top { border-top: 1px solid #eaeaea; }
.light-grey-border-left { border-left: 1px solid #eaeaea; }
.light-grey-border-right { border-right: 1px solid #eaeaea; }
.light-grey-border-bottom { border-bottom: 1px solid #eaeaea; }
.light-grey-border-both { border-top: 1px solid #eaeaea; border-bottom: 1px solid #eaeaea; }