﻿/*--------------------------------------------------------
 * NOTE: We use LESS syntax in this project for our CSS.
 * "LESS extends CSS with: variables, mixins, operations,
 * and nested rules."
 * -http://lesscss.org/
 *--------------------------------------------------------*/
/* MIXINS   
----------------------------------------------------------*/
/*--------------------------------------------------------
 * NOTE: We use LESS syntax in this project for our CSS.
 * "LESS extends CSS with: variables, mixins, operations,
 * and nested rules."
 * -http://lesscss.org/
 *--------------------------------------------------------*/
/* COLORS   
----------------------------------------------------------*/
/* WIDTHS   
----------------------------------------------------------*/
/* DASHBOARD
----------------------------------------------------------*/
#dashboard {
  margin-left: -20px;
  margin-right: -20px;
  overflow: hidden;
}
#dashboard > .row {
  margin-bottom: 40px;
}
#dashboard .box {
  border: 1px solid #E3E3E3;
  border-radius: 4px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05) inset;
  padding: 20px;
  -webkit-box-shadow: 1px 3px 8px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 1px 3px 8px rgba(0, 0, 0, 0.2);
  box-shadow: 1px 3px 8px rgba(0, 0, 0, 0.2);
  margin-bottom: 40px;
}
#dashboard .box h3,
#dashboard .box h4 {
  color: #717171;
  padding-bottom: 0px;
  margin-top: 30px;
  margin-bottom: 12px;
}
#dashboard .box h3:first-of-type,
#dashboard .box h4:first-of-type {
  margin-top: 0px;
}
#dashboard .box h3 {
  background-color: #ddd;
  color: #000;
  font-size: 16px;
  margin-top: -20px !important;
  margin-left: -20px !important;
  margin-right: -20px !important;
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
}
#dashboard .box h4 {
  font-size: 16px;
}
#dashboard .box table {
  margin-bottom: 0px;
}
#dashboard .box table th:first-child,
#dashboard .box table td:first-child {
  padding-left: 0px;
}
#dashboard .box table th:last-child,
#dashboard .box table td:last-child {
  padding-right: 0px;
}
#dashboard .box .image-container {
  position: relative;
}
#dashboard .box .image-container .badge {
  position: absolute;
  bottom: 5px;
  right: 5px;
}
#dashboard .box img.wide {
  width: 100%;
}
#dashboard .box div.progress-wrapper {
  text-align: center;
}
#dashboard .box div.progress-wrapper img {
  width: auto;
}
#dashboard .box .no-data {
  color: #b2b1b1;
  font-weight: bold;
}
#dashboard .box .no-data .glyphicon {
  font-size: 64px;
  display: block;
  margin-bottom: 40px;
}
#dashboard #alerts .item {
  border-bottom: 3px dotted #ddd;
  padding-bottom: 10px;
  margin-bottom: 10px;
}
#dashboard #alerts .item .type-icon {
  width: 14px;
  margin-right: 5px;
  display: inline-block;
  vertical-align: top;
}
#dashboard #alerts .item .date {
  width: 30px;
  margin-right: 10px;
  display: inline-block;
  vertical-align: top;
  color: #999;
}
#dashboard #alerts .item .text {
  width: 80%;
  display: inline-block;
  vertical-align: top;
}
#dashboard #alerts .item .text .link {
  margin-top: 5px;
}
#dashboard #alerts .more {
  text-align: center;
}
#dashboard .getting-started-box .feature {
  margin-bottom: 20px;
}
#dashboard .getting-started-box .feature h4 {
  cursor: auto;
  display: inline-block;
  margin-left: 3px;
  margin-bottom: 5px;
}
#dashboard .getting-started-box .feature h5 {
  margin-top: 0px;
  font-size: 11px;
}
#dashboard .box-overflow {
  max-height: 500px;
  overflow-y: auto;
}
/* TRANSACTIONS
----------------------------------------------------------*/
.month {
  font-weight: bold;
  cursor: pointer;
  text-decoration: underline;
  color: #999;
  font-size: 18px;
}
.active-month {
  color: #004ccc;
}
#transaction-table .action {
  vertical-align: middle;
  width: 60px;
}
#transaction-table .reconciled {
  opacity: 0.6;
}
div.transaction-line-divider {
  border-bottom: 3px dotted #b2b1b1;
}
div.transaction-import-line-divider {
  border-bottom: 3px dotted #b2b1b1;
}
/* IMPORT
----------------------------------------------------------*/
#import-container #accounts p {
  margin-bottom: 5px;
}
#import-container #accounts .checkbox {
  margin-top: 0px;
  margin-bottom: 0px;
}
#import-container #import-rows .import-header-row td {
  padding-top: 0px;
  padding-bottom: 0px;
}
#import-container #import-rows .import-header-row td h5 {
  margin-bottom: 0px;
}
#import-container #import-rows .import-header-row td h5 i {
  margin-left: 0px;
}
#import-container #import-rows .import-row td {
  padding-top: 0px;
}
#import-container #import-rows .import-row td.read-only-row {
  cursor: pointer;
}
#import-container #import-rows .import-row td.read-only-row:hover {
  color: #004ccc;
}
#import-container #import-rows .import-row td.read-only-row:hover label {
  cursor: pointer;
  color: #004ccc;
}
#import-container #import-rows .import-row td.imported-row {
  cursor: default;
  color: #ddd;
}
#import-container #import-rows .import-row td.imported-row label {
  color: #ddd;
}
#import-container #import-rows .import-row td.imported-row:hover {
  color: #ddd;
}
#import-container #import-rows .import-row td.imported-row:hover label {
  cursor: default;
  color: #ddd;
}
#import-container #import-rows span.edit-indicator {
  display: none;
  width: 20px;
  height: 20px;
  position: absolute;
  left: -15px;
  top: 8px;
}
@media (max-width: 768px) {
  #import-container #import-rows td.action a {
    margin-left: -14px;
  }
  #import-container #import-rows span.split-indicator {
    left: -10px;
  }
}
/* PROJECTIONS
----------------------------------------------------------*/
#projections-popup div.well {
  margin-bottom: 0px !important;
  padding: 7px !important;
}
#projections-popup input,
#projections-popup .input-group {
  margin-bottom: 0px !important;
}
.label-column {
  width: 200px;
}
@media (max-width: 768px) {
  #projections-popup .label-column {
    width: inherit;
  }
}
/* SEARCH OPTIONS
----------------------------------------------------------*/
.grid-header-row {
  margin-bottom: 10px;
}
.grid-header-row #search-options label {
  font-size: 18px;
  color: #717171;
  margin-right: 5px;
}
.grid-header-row #search-options span.middle {
  font-size: 18px;
  color: #717171;
}
.grid-header-row #search-options .select-picker {
  text-align: left;
}
@media (max-width: 768px) {
  .grid-header-row .right-align {
    text-align: left;
    margin-top: 10px;
  }
}
/* REPORTS
----------------------------------------------------------*/
.report-table .img-thumbnail {
  display: inline-block;
  max-height: 120px;
  margin-top: 10px;
  margin-right: 10px;
}
.report-table label {
  color: #717171;
  margin-bottom: 0px;
}
.report-table td {
  background-color: #fff;
}
/* NOTIFICATIONS
----------------------------------------------------------*/
.notifications i {
  font-size: 100px;
  margin-top: 20px;
  margin-left: 20px;
}