body {
  color: #6c757d;
  background-color: black;
  font-size: 14px;
}

a {
  color: #28a745;
}

header {
  background-size: cover;
  background-position: center; 
  padding: 10px 50px 10px 50px;
  margin-bottom: 0px;
}

.board {
  background-color: #DDEEFF;
}

.navbar {
  font-family: 'Inconsolata', monospace;
  font-size: 18px;
}

.admin {
    position: absolute;
    top: 0px;
    right: 0px;
    margin: 10px;
    color: #999;
}

a.admin, .admin a {
    color: #999;
}

footer {
  clear: both;
  margin-top: 50px;
  background-color: #F6F6F6;
  padding: 50px 0;
}

.copyright {
  padding: 50px 0;
  color: #999;
  text-align: center;
  font-size: 80%;
}

.copyright a {
  color: inherit;
}

.card {
  margin-bottom: 5px;
}

.card {
    -webkit-box-shadow: 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12), 0 2px 4px -1px rgba(0,0,0,.3);
    box-shadow: 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12), 0 2px 4px -1px rgba(0,0,0,.3);
}

.card:hover {
    -webkit-box-shadow: 0 8px 17px 0 rgba(0,0,0,.2), 0 6px 20px 0 rgba(0,0,0,.19);
    box-shadow: 0 8px 17px 0 rgba(0,0,0,.2), 0 6px 20px 0 rgba(0,0,0,.19);
}

.card {
    -webkit-transition: -webkit-box-shadow .25s;
    transition: -webkit-box-shadow .25s;
    -o-transition: box-shadow .25s;
    transition: box-shadow .25s;
    transition: box-shadow .25s,-webkit-box-shadow .25s;
}

.card-body {
  padding: 5px 10px;
}

.card-title {
  margin-bottom: 0;
}

.card p {
  margin-bottom: 0;
}

.table-sm {
  width: auto;
}

.table-sm tr td {
  max-width: 500px;
}

.invoice {
  max-width: 800px;
  font-size: 14px;
  color: #212529;
  background-color: white;
  border-radius: 5px;
  padding: 10px;
}

.invoice a {
  color: inherit;
  text-decoration: none;
}

.invoice .table td, .invoice .table th {
  border-top-color: #dee2e6;
}

.bank-details {
  margin: 20px;
}

.bank-details th {
  font-weight: normal;
  padding-right: 20px;
}

.bank-details td {
  font-weight: bold;
}

.wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 10px;
  grid-template-areas:
  "header  header  header"
  "content content sidebar";
}

.sidebar {
  grid-area: sidebar;
}

.content {
  grid-area: content;
}

.header {
  grid-area: header;
}

.table td, .table th {
  border-top-color: #333;
}

.text-muted a {
  color: inherit;
}

.icon {
  filter: grayscale(80%) brightness(40%) sepia(100%) hue-rotate(90deg);
  border-radius: 2px;
}