/* Copyright 2012 Prolog Development Center
   All rights reserved. */

@media screen {
  .onlyprint {
    display: none;
  }
}

@media print {
  @page {
    size: landscape;
  }
  .onlyscreen {
    display: none;
  }
}

* {
  margin: 0;
  padding: 0;
}

html {
  color: #333;
}

select {
  height: 2em;
}

table {
  border-spacing: 0;
}

.fakebar {
  height: 2.5em;
}
.bar {
  height: 2.5em;
  text-align: left;
  color: white;
  font-weight: bold;
}

.menu {
  background-color: #231f20;
  border: solid 1px #efefef;
  border-radius: 0.7ex;
  padding: 0 0.5ex;
  color: white;
  font-weight: bold;
  margin: auto;
}

.navigation {
  display: none;
  z-index: 1;
}

/* If .menu is wrapped in .navigation it's displayed as a sidebar rather than a separate view */
.navigation .menu {
  border: 0;
  background-color: transparent;
}

.navigation table,
.navigation tr,
.navigation td {
  display: block;
}

.navigation td {
  border-bottom: 1px solid #fff;
}

.navigation tr:last-child td:last-child {
  border: none;
}

.navigation td:empty {
  display: none;
}

.list_week_line {
  font-size: small;
  padding: 1ex;
}
.list_cell_daylabel {
  font-size: small;
}
.list_cell_line {
  padding: 0.3ex;
}
table.week thead tr {
  height: 4.5em;
  font-size: x-small;
}

table.month thead {
  font-size: x-small;
}

table.month td {
  text-align: center;
}

.bullet-description {
  display: inline;
}

.expanded-description {
  display: none;
}

.section_level_top {
  text-align: left;
}
.section_header_level_top {
  white-space: nowrap;
  background-color: red;
  font-weight: bold;
  color: white;
}
.section_header_level_0 {
  background-color: #acd0e8;
  white-space: nowrap;
  padding: 1ex;
}
.section_header_level_1 {
  background-color: #e6e7e8;
  white-space: nowrap;
  padding: 1ex;
}
.section_header_item {
  display: inline-block;
  font-weight: bold;
}
.section_body_level_top {
  overflow: hidden;
}
.section_body_level_0 {
  background-color: #acd0e8;
  overflow: hidden;
}
.section_body_level_1 {
  background-color: #e6e7e8;
  overflow: hidden;
}
.section_content {
  padding: 0.5ex;
}
.section_content > * {
  margin: 0.5ex;
}
.label {
  color: #003756;
  font-weight: bold;
}
.row_label {
  color: #003756;
  font-weight: bold;
  height: 2em;
  padding-right: 1ex;
}
.row_data {
  width: 100%;
}
.header_label {
  font-weight: bold;
}
.total_unit {
  width: 6ex;
  text-align: center;
}
.total_value {
  width: 7ex;
  text-align: right;
}
.negative {
  color: red;
}

.recipient-group {
  font-weight: bold;
}

.recipient-person {
  margin-left: 0.333em;
}

@media screen and (min-width: 37em) {
  table.month thead {
    font-size: small;
  }
}

@media screen and (min-width: 50em) {
  .navigation {
    display: block;
    position: fixed;
    right: 0;
    top: 2.7em;
    width: 20em;
  }

  .navigation td {
    /* IE 9 specific hacks. IE 9 will not allow simply changing the
            display of table elements, so we have to add some additionals
            (they should have no effect in compliant browsers). */
    float: left;
    clear: left;
    /* Width is the width of .navigation minus the padding of the cells */
    width: 17.5em;
  }

  /* If the current view is home the user has resized the window. That's
        not a crime, but we don't want to show the navigation twice
    */
  body[data-current-view='home'] .navigation {
    display: none;
  }
}

@media screen and (min-width: 60em) {
  table.week thead tr {
    font-size: small;
  }

  table.week thead .day-label {
    text-align: center;
    width: 100%;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }

  table.week thead .day-label div {
    display: inline-block;
    margin: 0 0.25em;
  }
}

@media screen and (min-width: 95em) {
  table.month td {
    text-align: left;
  }

  .expanded-description {
    display: block;
  }

  .bullet-description {
    display: none;
  }
}
