/* Copyright 2012 Prolog Development Center
   All rights reserved. */

/* *{outline:solid 1px red}*/

@media screen {
  .onlyscreen {
  }
  .onlyprint {
    display: none;
  }
}

@media print {
  @page {
    size: landscape;
  }
  .onlyscreen {
    display: none;
  }
  .onlyprint {
  }
}

* {
  margin: 0;
  padding: 0;
}

html {
  color: #333;
}

select {
  height: 2em;
}

table {
  border-spacing: 0;
}

.fakebar {
  height: 2.5em;
}
.bar {
  height: 2.5em;
  /*
      position:fixed;
      z-index:9;
      left:0; right:0; top:0;
      */
  text-align: left;
  color: white;
  font-weight: bold;
}

.main {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 0;
  min-height: 100%;
  opacity: 0;
  -webkit-transition: all 500ms;
  -ms-transition: all 500ms;
  transition: all 500ms;
  -webkit-transform-origin: left top;
  -ms-transform-origin: left top;
  transform-origin: left top;
  transform: scaleX(0) scaleY(0);
  display: none;
}

.menu {
  /*z-index:4; position: fixed; right: 1ex;*/
  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 {
}

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_level_0 {
}
.section_level_1 {
}
.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;
}
/*.in_section {padding: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;
}
.total_arrow {
  width: 2ex;
  text-align: center;
  color: #003756;
}
.negative {
  color: red;
}

.unsaved {
  opacity: 0.5;
  -webkit-animation: blink 600ms infinite alternate;
  -moz-animation: blink 600ms infinite alternate;
  animation: blink 600ms infinite alternate;
}

.chat-recipients {
  max-height: 100%;
  overflow: auto;
  text-align: left;
  border: 1px solid #000;
  border-left-width: 0;
  border-right-width: 0;
  padding: 1%;
}

.chat-recipients label {
  display: block;
}

.chat-recipients input {
  /* .333em is the approximate width of a regular space */
  margin-right: 0.333em;
}

.recipient-group {
  font-weight: bold;
}

.recipient-person {
  margin-left: 0.333em;
}

@keyframes blink {
  from {
    opacity: 0.1;
  }
  to {
    opacity: 0.6;
  }
}

@media screen and (min-width: 37em) {
  table.month thead {
    font-size: small;
  }
}

@media screen and (min-width: 50em) {
  .main > div {
    /* Make room for navigation on the right */
    margin: 0 20em 0 0;
    max-width: none;
  }

  .main.home > div,
  .main.login > div {
    /* There is no navigation to make room for, so don't */
    margin-right: 0;
  }

  .navigation ~ .main .home,
  .navigation ~ .sub-view-container .home {
    display: none;
  }

  .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;
  }

  .sub-view-container {
    width: 20%;
    max-height: 100%;
    height: 100%;
    position: absolute;
    right: 3%;
    overflow: auto;
    display: none;
    z-index: 2;
  }

  .sub-view-container .main {
    min-height: 0;
  }

  .sub-view-container .main > div {
    margin: 0;
  }

  .chat-recipients {
    border-right-width: 1px;
  }
}

@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;
  }
}