@keyframes spin {
  0% {
    transform: translate(-50%, -50%) rotate(0deg); }
  50% {
    transform: translate(-50%, -50%) rotate(180deg); }
  100% {
    transform: translate(-50%, -50%) rotate(360deg); } }
div.spinner {
  width: 24px;
  height: 24px;
  display: inline-block;
  position: relative;
  padding: 0; }
  div.spinner div {
    width: 18px;
    height: 18px;
    border: 1px dotted transparent;
    border-top: 3px dotted #96aa97;
    border-bottom: 3px dotted #96aa97;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%; }
    div.spinner div.spin1 {
      animation: spin 0.8s infinite linear; }
    div.spinner div.spin2 {
      opacity: 0.6;
      animation: spin 0.9s infinite linear; }
    div.spinner div.spin3 {
      opacity: 0.4;
      animation: spin 1.4s infinite linear; }

#projects_nav {
  margin-bottom: 16px;
  padding-bottom: 4px;
  border-bottom: 1px solid #176b17; }
  #projects_nav a {
    display: inline-block;
    margin-bottom: 2px;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 12px;
    padding: 2px 4px; }
    #projects_nav a:hover {
      text-decoration: underline; }
    #projects_nav a.current {
      background-color: #daead2; }
  #projects_nav #periods a {
    color: #114c14; }
  #projects_nav #currencies a {
    color: #114c14; }

div.project-block {
  margin-bottom: 32px;
  margin-right: 32px;
  width: 560px;
  padding: 0;
  font-size: 12px;
  box-shadow: #ddd 1px 1px 4px 2px;
  float: left; }
  div.project-block.total {
    background-color: #fff5e6; }
    div.project-block.total .project-title {
      background: linear-gradient(90deg, #ffdead 40%, #ccb18a); }
  div.project-block .project-title {
    margin-bottom: 12px;
    padding: 4px 8px;
    font-size: 14px;
    font-weight: bold;
    background: linear-gradient(90deg, #daead2 40%, #B5CF96); }
  div.project-block .project-stats {
    width: 277px;
    margin-bottom: 6px;
    padding: 8px 0;
    float: left;
    position: relative; }
    div.project-block .project-stats.empty {
      opacity: 0.25; }
    div.project-block .project-stats.in {
      border-right: 1px dotted #ccc;
      margin: 0 2px; }
    div.project-block .project-stats .project-stats-label {
      position: absolute;
      top: -8px;
      right: 4px;
      padding: 2px 4px;
      color: #fff;
      background-color: #7a8473;
      font-size: 10px; }
    div.project-block .project-stats span {
      display: inline-block;
      margin: 1px;
      height: 20px;
      line-height: 20px;
      border-radius: 2px;
      text-align: center;
      float: left;
      color: #fefefe;
      overflow: hidden;
      white-space: nowrap; }
      div.project-block .project-stats span.project-stats-turnover {
        background-color: #1b85b8;
        width: 51%; }
      div.project-block .project-stats span.project-stats-income {
        background-color: #ae5a41;
        width: 21%; }
      div.project-block .project-stats span.project-stats-psp {
        background-color: #559e83;
        width: 25%; }
  div.project-block a.project-stats-link {
    display: inline-block;
    padding: 4px;
    font-size: 10px;
    text-decoration: none;
    text-transform: uppercase;
    color: #114c14; }
    div.project-block a.project-stats-link:hover {
      text-decoration: underline; }
  div.project-block a.project-stats-help {
    display: inline-block;
    text-decoration: none;
    float: right;
    cursor: pointer;
    width: 12px;
    height: 12px;
    background: url("/img/info.svg") no-repeat center;
    background-size: 12px;
    padding: 4px; }
  div.project-block div.legend-container {
    clear: both;
    height: 0;
    margin: 0 0 4px 0;
    padding: 0;
    position: relative; }
    div.project-block div.legend-container div.project-stats-legend {
      position: absolute;
      top: -12px;
      left: 4px;
      padding: 4px;
      border-radius: 2px;
      background-color: #fff;
      box-shadow: #ddd 1px 1px 2px 1px;
      z-index: 10; }
      div.project-block div.legend-container div.project-stats-legend span {
        display: inline-block;
        height: 24px;
        line-height: 24px;
        margin-right: 16px;
        vertical-align: top; }
        div.project-block div.legend-container div.project-stats-legend span.icon {
          display: inline-block;
          height: 16px;
          width: 16px;
          line-height: 16px;
          margin: 4px; }
          div.project-block div.legend-container div.project-stats-legend span.icon.project-stats-turnover {
            background-color: #1b85b8; }
          div.project-block div.legend-container div.project-stats-legend span.icon.project-stats-income {
            background-color: #ae5a41; }
          div.project-block div.legend-container div.project-stats-legend span.icon.project-stats-psp {
            background-color: #559e83; }

div.section-title {
  font-size: 16px;
  margin-top: 32px;
  background-color: #255632;
  color: #e7efe9;
  padding: 6px;
  text-transform: uppercase; }
  div.section-title.out {
    background-color: #383e71; }

table.stat-table {
  margin-bottom: 8px;
  border-width: 0px;
  border-spacing: 0;
  border-collapse: collapse;
  width: 100%;
  font-size: 80%; }
  table.stat-table tr.subtotal-row td {
    font-weight: bold; }
  table.stat-table tr.total-row td {
    background-color: #dfe;
    font-weight: bold; }
  table.stat-table tr td, table.stat-table tr th {
    padding: 2px 3px;
    border: 1px solid #d2d2d2; }
  table.stat-table tr th {
    font-weight: bold;
    text-align: center;
    background-color: #e8f8e8; }
  table.stat-table tr td.sum-cell:hover {
    background-image: url("/img/equal-24.svg");
    background-size: 12px;
    background-position: center left;
    background-repeat: no-repeat; }
  table.stat-table tr td.add-cell {
    background-color: #ffebc4;
    background-image: url("/img/plus-24.svg");
    background-size: 12px;
    background-position: center left;
    background-repeat: no-repeat; }
  table.stat-table tr td.divider {
    border: none;
    background-color: #f5fff5;
    line-height: 10px; }
  table.stat-table tr td.table-title {
    text-align: left;
    padding: 4px;
    background-color: #5b9f5b;
    color: #efe;
    font-size: 15px; }
  table.stat-table tr td span.diff {
    display: inline-block;
    margin-left: 6px;
    font-size: 90%; }
    table.stat-table tr td span.diff.negative {
      color: #b22; }
    table.stat-table tr td span.diff.positive {
      color: #282; }
  table.stat-table.out tr.total-row td {
    background-color: #def; }
  table.stat-table.out tr th {
    background-color: #dcedeb; }
  table.stat-table.out tr td.divider {
    background-color: #f0fcfa; }
  table.stat-table.tx tr.status-process_failed td {
    background-color: #f0f0f0;
    color: #888; }
  table.stat-table.tx tr.status-process_pending td {
    background-color: #eff5f8;
    color: #68b; }
  table.stat-table.tx tr.status-refunded td {
    background-color: #f5e8f0;
    color: #a56; }
  table.stat-table.tx tr.status-partially_refunded td {
    background-color: #fad8e0;
    color: #c79; }
  table.stat-table.tx tr.status-refund_error td {
    background-color: #faf0f0;
    color: #a22; }
  table.stat-table.countries {
    width: auto;
    display: inline-block;
    margin-top: 20px;
    margin-right: 40px;
    float: left; }
    table.stat-table.countries tr td {
      text-align: center; }
  table.stat-table.compare {
    width: auto; }
    table.stat-table.compare tr td {
      min-width: 180px; }
  table.stat-table span.tx {
    color: #ddd;
    font-weight: normal; }
  table.stat-table a.transaction-link {
    color: #262;
    display: inline-block;
    padding: 0 6px;
    text-decoration: none; }
    table.stat-table a.transaction-link:hover {
      color: #6b8;
      text-decoration: underline; }

p.table-help {
  font-size: 12px;
  color: #666;
  display: inline-block;
  margin: 0;
  padding: 4px 4px 4px 12px;
  position: relative; }
  p.table-help:before {
    display: block;
    position: absolute;
    content: "*";
    left: 2px;
    top: 0;
    color: #b22; }

div.project-balance {
  width: 590px;
  background-color: #fff;
  border-radius: 6px;
  padding: 0 0 4px 0;
  margin: 16px;
  box-shadow: #ddd 0 0 4px 1px;
  font-size: 12px; }
  div.project-balance .project-title {
    margin: 0 0 4px 0;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    padding: 4px 8px 1px 8px;
    border-bottom: 1px solid #f9f9f9;
    color: #b7bec5; }
  div.project-balance .account-balance {
    margin: 0;
    padding: 3px; }
    div.project-balance .account-balance.selected-balance {
      background-color: #f8fbf8; }
  div.project-balance span.account-title {
    display: inline-block;
    width: 170px;
    margin-left: 6px;
    font-size: 10px;
    color: #888; }
  div.project-balance span.balance {
    display: inline-block;
    max-width: 116px;
    margin-left: 10px;
    cursor: pointer; }
  div.project-balance span.balance-RUB {
    color: #30793c; }
  div.project-balance span.balance-USD {
    color: #194d77; }
  div.project-balance span.balance-UAH {
    color: #7c0e41; }

div#chart {
  width: 600px;
  height: 320px;
  float: left;
  box-shadow: #ddd 0 0 4px 1px; }
  div#chart::before {
    content: "";
    display: block;
    width: 26px;
    height: 20px;
    position: absolute;
    left: -30px;
    top: 0;
    background: url(/img/arrow-32.svg) 10px center no-repeat;
    background-size: 32px; }

div#filter {
  padding: 9px 4px;
  margin: 10px 0 20px 0;
  border: 1px dotted #ccc; }
  div#filter form {
    display: flex; }
  div#filter div.filter-section {
    border-right: 1px dotted #ccc;
    margin-right: 24px;
    text-align: right; }
  div#filter label {
    display: inline-block;
    height: 24px;
    line-height: 24px;
    margin-right: 24px;
    font-size: 12px; }
    div#filter label span {
      margin-right: 1px;
      padding-left: 15px;
      background: url("/img/filter.svg") left center no-repeat;
      background-size: 16px;
      font-weight: bold; }
  div#filter input, div#filter select {
    width: 110px;
    font-size: 12px; }
    div#filter input#dateRange, div#filter select#dateRange {
      width: 145px; }
    div#filter input#dateRange1, div#filter select#dateRange1 {
      width: 145px; }
    div#filter input#dateRange2, div#filter select#dateRange2 {
      width: 145px; }
    div#filter input#currency, div#filter input#invoice, div#filter select#currency, div#filter select#invoice {
      width: 55px; }
    div#filter input#project, div#filter select#project {
      width: 190px; }
    div#filter input#account, div#filter select#account {
      width: 190px; }
    div#filter input#merchant, div#filter select#merchant {
      width: 190px; }
    div#filter input#status, div#filter select#status {
      width: 120px; }
    div#filter input[type=button], div#filter select[type=button] {
      height: 24px;
      display: inline-block;
      vertical-align: top; }

div.fatal-error {
  width: 600px;
  padding: 20px;
  text-align: center;
  margin: 20px auto;
  border: 2px solid #b22; }

div.paging {
  margin-top: 12px;
  font-size: 10px; }
  div.paging span {
    display: inline-block;
    width: 65px;
    height: 24px;
    border-radius: 6px;
    text-align: center;
    text-transform: uppercase;
    color: #979e95; }
    div.paging span.csv {
      width: 90px; }
    div.paging span a {
      display: inline-block;
      color: #194d77;
      opacity: 0.4;
      line-height: 24px;
      width: 100%;
      border-radius: 6px;
      text-decoration: none;
      transition: all 0.5s ease-out; }
      div.paging span a:hover {
        opacity: 1.0;
        background-color: #fafdfa;
        box-shadow: #f0f8f0 0 1px 6px 2px; }

.pretty-dash #main {
  background-color: #f5f5f5;
  padding: 4px; }
  .pretty-dash #main .dash-container {
    width: 1068px;
    padding: 0;
    margin: 0; }
  .pretty-dash #main .dash-head {
    margin: 0 16px;
    font-size: 16px;
    padding: 4px 0;
    position: relative; }
    .pretty-dash #main .dash-head span {
      display: inline-block;
      height: 36px;
      line-height: 36px;
      text-transform: capitalize; }
    .pretty-dash #main .dash-head input#dateRange {
      position: absolute;
      top: 4px;
      right: 8px;
      display: inline-block;
      width: 140px;
      padding: 10px;
      border-radius: 6px;
      border: 1px solid #ebedf1;
      color: #888;
      font-size: 12px; }
  .pretty-dash #main .dash-element {
    float: left;
    width: 500px;
    background-color: #fff;
    border-radius: 6px;
    padding: 0;
    margin: 16px;
    box-shadow: #ddd 0 0 4px 1px;
    font-size: 12px;
    position: relative; }
    .pretty-dash #main .dash-element.wide {
      width: 640px; }
      .pretty-dash #main .dash-element.wide .block .chart {
        width: 620px; }
    .pretty-dash #main .dash-element .block-header {
      margin: 0 0 4px 0;
      border-top-left-radius: 6px;
      border-top-right-radius: 6px;
      padding: 4px 8px 1px 8px;
      border-bottom: 1px solid #f9f9f9;
      font-size: 14px; }
      .pretty-dash #main .dash-element .block-header span {
        display: inline-block;
        float: right; }
    .pretty-dash #main .dash-element .block {
      float: left;
      padding: 0;
      margin: 0; }
      .pretty-dash #main .dash-element .block .chart {
        width: 410px;
        height: 160px;
        margin: 6px 0 16px 0; }
      .pretty-dash #main .dash-element .block .geo_map {
        float: left; }
        .pretty-dash #main .dash-element .block .geo_map .chart {
          width: 250px;
          margin: 0; }
      .pretty-dash #main .dash-element .block .geo_list {
        float: left;
        margin-left: 16px; }
        .pretty-dash #main .dash-element .block .geo_list .chart {
          width: 230px;
          margin: 0; }
      .pretty-dash #main .dash-element .block .turnover_percent {
        width: 220px;
        height: 110px;
        margin: 6px 0 8px 8px;
        border-radius: 6px;
        border: 1px solid #ebedf1;
        font-size: 14px;
        color: #343434;
        float: left; }
        .pretty-dash #main .dash-element .block .turnover_percent .chart {
          float: left;
          width: 60px;
          height: 60px;
          margin: 16px;
          position: relative; }
          .pretty-dash #main .dash-element .block .turnover_percent .chart .progressbar-text {
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            padding: 0;
            margin: 0; }
        .pretty-dash #main .dash-element .block .turnover_percent .legend {
          float: left;
          width: 125px;
          margin-top: 16px;
          padding-top: 4px; }
          .pretty-dash #main .dash-element .block .turnover_percent .legend div {
            padding: 2px 0; }
            .pretty-dash #main .dash-element .block .turnover_percent .legend div.legend-title {
              font-size: 10px;
              color: #b7bec5; }
            .pretty-dash #main .dash-element .block .turnover_percent .legend div.legend-note {
              margin-top: 8px;
              font-size: 10px;
              color: #b7bec5; }
      .pretty-dash #main .dash-element .block .turnover_graph {
        float: left;
        margin: 6px 0 8px 8px;
        border-radius: 6px;
        border: 1px solid #ebedf1; }
        .pretty-dash #main .dash-element .block .turnover_graph .chart {
          width: 250px;
          height: 110px;
          margin: 0; }

div#progressBar {
  width: 350px;
  height: 16px;
  padding: 1px;
  border: 1px solid #daeda2;
  margin-top: 20px;
  position: relative; }
  div#progressBar #progress {
    height: 100%;
    width: 0;
    margin: 0;
    padding: 0;
    background-color: #262;
    transition: all 0.5s ease-in-out; }
  div#progressBar #txinfo {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 80%;
    color: #262;
    transform: translateX(120%); }

div#updateStatus {
  font-size: 12px;
  text-transform: uppercase;
  margin-top: 2px; }
  div#updateStatus.status-error {
    color: #b22; }
  div#updateStatus.status-success {
    color: #686; }

div#flash_notify {
  width: 600px;
  min-height: 18px;
  font-size: 12px;
  background-color: #343434;
  padding: 12px;
  border: 1px solid #ebedf1;
  border-radius: 6px;
  box-shadow: #ddd 0 0 4px 1px;
  opacity: 0.85;
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: left; }
  div#flash_notify .flash-time {
    vertical-align: top;
    margin-right: 10px;
    color: #8ca6bb; }
  div#flash_notify .flash-message {
    display: inline-block;
    width: 530px;
    color: #eee; }
  div#flash_notify .flash-close {
    display: block;
    position: absolute;
    width: 16px;
    height: 16px;
    top: 50%;
    right: 12px;
    transform: translate(0px, -50%);
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: 4px;
    background: url("/img/close.svg") center center no-repeat;
    background-size: 21px; }
    div#flash_notify .flash-close:hover {
      border-color: #eee; }

/*# sourceMappingURL=dash.css.map */