@import url(https://fonts.googleapis.com/css?family=Duru+Sans|Roboto:400,100,100italic,300italic,300,900italic,900,700italic,500italic,500,400italic,700&subset=latin,latin-ext);
body {
  font-family: 'Roboto', sans-serif;
  background-image: url('../img/back-grey-noise.png');
}
form label.invalid {
  font-size: 13px;
  font-weight: normal;
  color: #A94442;
  margin-bottom: 0;
}
form input.invalid,
form textarea.invalid {
  margin-bottom: 5px;
  background-color: #F2DEDE;
}
#topbar {
  font-family: 'Duru Sans', sans-serif;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 50px;
  background-color: #f37a28;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f37a28), to(#c05e1d));
  background-image: -webkit-linear-gradient(top, #f37a28, #c05e1d);
  background-image: -moz-linear-gradient(top, #f37a28, #c05e1d);
  background-image: -o-linear-gradient(top, #f37a28, #c05e1d);
  background-image: -ms-linear-gradient(top, #f37a28, #c05e1d);
  background-image: linear-gradient(top, #f37a28, #c05e1d);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, StartColorStr='#f37a28', EndColorStr='#c05e1d');
  color: #FFF;
  font-size: 20px;
  padding: 0 15px;
  border-bottom: 1px solid #A8551B;
  box-shadow: rgba(0, 0, 0, 0.6) 0 0 20px;
  z-index: 1000;
}
#topbar img {
  margin: 5px;
  height: 80%;
}
#topbar #app-name {
  float: left;
  margin-top: 12px;
}
#topbar #menu {
  float: left;
  margin: 10px 0 0 20px;
}
#topbar #menu a {
  display: inline-block;
  vertical-align: top;
  font-size: 13px;
  background: rgba(0, 0, 0, 0.2);
  color: #FFF;
  padding: 5px 8px;
  border-radius: 5px;
}
#topbar #last-order {
  background-color: #814011;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#814011), to(#b5591b));
  background-image: -webkit-linear-gradient(top, #814011, #b5591b);
  background-image: -moz-linear-gradient(top, #814011, #b5591b);
  background-image: -o-linear-gradient(top, #814011, #b5591b);
  background-image: -ms-linear-gradient(top, #814011, #b5591b);
  background-image: linear-gradient(top, #814011, #b5591b);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, StartColorStr='#814011', EndColorStr='#b5591b');
  border-left: 1px #834111 solid;
  border-right: 1px #834111 solid;
  display: inline-block;
  padding: 0 15px 0 5px;
  margin-left: 10px;
}
#topbar #last-order #cash-inflow,
#topbar #last-order #the-return {
  display: inline-block;
  margin: 5px 0 0 10px;
  color: #FFF;
  text-align: left;
}
#topbar #last-order #cash-inflow #cash-inflow-name,
#topbar #last-order #the-return #cash-inflow-name,
#topbar #last-order #cash-inflow #the-return-name,
#topbar #last-order #the-return #the-return-name {
  opacity: .7;
  font-size: 11px;
}
#topbar #last-order #cash-inflow #cash-inflow-value,
#topbar #last-order #the-return #cash-inflow-value,
#topbar #last-order #cash-inflow #the-return-value,
#topbar #last-order #the-return #the-return-value {
  margin-top: -4px;
  font-size: 22px;
}
#topbar #last-order #cash-inflow #cash-inflow-value,
#topbar #last-order #the-return #cash-inflow-value {
  opacity: .7;
}
#topbar #current-totals {
  display: inline-block;
  padding-left: 10px;
}
#topbar #current-totals .current-total {
  display: inline-block;
  margin: 5px 0 0 10px;
  color: #FFF;
  text-align: left;
}
#topbar #current-totals .current-total .current-total-name {
  opacity: .7;
  font-size: 11px;
}
#topbar #current-totals .current-total .current-total-value {
  margin-top: -4px;
  font-size: 22px;
  cursor: pointer;
}
#topbar #user-info {
  position: absolute;
  top: 0;
  right: 0;
  margin: 5px 10px 0 0;
  font-size: 12px;
  text-align: right;
}
#topbar #user-info a {
  color: #000;
  font-weight: bold;
}
#main {
  margin-top: 50px;
}
#login-form {
  margin: 0 auto;
  padding: 20px 0 0 0;
  width: 50%;
}
#tpv-index {
  padding: 20px;
}
#tpv-index form > div {
  margin-bottom: 20px;
}
#tpv-history {
  padding-top: 30px;
}
#tpv-history #statistics-num,
#tpv-history #statistics-total {
  background: rgba(0, 0, 0, 0.15);
  padding: 10px;
  margin-right: 10px;
  border-radius: 5px;
  display: inline-block;
  font-size: 32px;
  font-weight: 300;
}
#tpv-history #statistics-num strong,
#tpv-history #statistics-total strong {
  font-weight: bold;
  font-size: 14px;
  display: block;
}
#tpv-history .history-order {
  position: relative;
  margin-bottom: 20px;
  background-color: rgba(0, 0, 0, 0.12);
  border-radius: 5px;
}
#tpv-history .history-order > div {
  display: inline-block;
  vertical-align: top;
}
#tpv-history .history-order .history-order-info {
  background-color: rgba(0, 0, 0, 0.3);
  color: #FFF;
  font-weight: 200;
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}
#tpv-history .history-order .history-order-info .order-info-date {
  background-color: #DE6D07;
  font-size: 18px;
  padding: 5px 10px;
  border-top-left-radius: 5px;
}
#tpv-history .history-order .history-order-info .order-info-total {
  font-size: 16px;
  padding: 7px 10px;
  border-bottom: 1px solid #FFF;
  margin-bottom: 5px;
  line-height: 18px;
}
#tpv-history .history-order .history-order-info .order-info-total span {
  font-size: 11px;
}
#tpv-history .history-order .history-order-info .order-info-payment-method {
  padding: 5px 10px;
  border-bottom: 1px solid #FFF;
  margin-bottom: 5px;
}
#tpv-history .history-order .history-order-info .order-info-seller {
  padding: 5px 10px;
  border-bottom: 1px solid #FFF;
  margin-bottom: 5px;
}
#tpv-history .history-order .history-order-info .order-info-observations {
  width: 180px;
  padding: 10px;
  font-size: 12px;
  color: #DDD;
  border-bottom-left-radius: 5px;
}
#tpv-history .history-order .history-order-lines {
  padding: 15px;
}
#tpv-history .history-order .history-order-lines table {
  min-width: 300px;
}
#tpv-history .history-order .history-order-lines table tr td {
  border: 1px solid #000;
  padding: 5px 10px;
}
#tpv-history .history-order .history-order-client {
  padding: 15px;
}
#tpv-history .history-order .order-delete {
  position: absolute;
  right: 0;
  top: 0;
  padding: 4px 6px;
  border-bottom-left-radius: 5px;
  border-top-right-radius: 5px;
  background-color: rgba(0, 0, 0, 0.2);
  color: #FFF;
  cursor: pointer;
  text-decoration: none;
}
#tpv-history .history-order .order-delete:hover {
  background-color: #DC3E42;
}
#footer {
  text-align: center;
}
#footer img {
  height: 60px;
  opacity: 0;
  margin-bottom: 30px;
}