@import url("style.css");
/*
 * styles for the bigger header bar. Defining the height of the bar itself inline was unavoidable
 */
.ui-header > h1 {
  margin-top : 20px !important;
}

.ui-header > a {
  margin-top: 10px !important;
}

/*
 * styles for extra header buttons
 */
.ui-btn-left2, .ui-btn-right2 {
  position: absolute;
  top: 3px;
}
.ui-btn-left2 {
  left: 100px;
}
.ui-btn-right2 {
  left: 100px;
}

/*
 * styles for the gps status icon
 *
 . *statusDot {
 border-radius: 10px;
 height: 20px;
 margin: 0 8px;
 width: 20px;
 }*/
.blackBg {
  color: #000;
}
.darkgrayBg {
  color: #555;
}
.grayBg {
  color: #ccc;
}
.greenBg {
  color: #0c0;
}
.redBg {
  color: #e10;
}
.whiteBg {
  color: #fff;
}
.yellowBg {
  color: #fc0;
}

/*
 * styles header title
 */
.ui-header .ui-title{
  margin    : 0;
  padding   : 0;
  font-size : 10.6pt;
}

i.icon{
  margin-right: 5px;
}

div#gpssignal {
  display: inline;
}

#wwvFlowForm > .ui-content {
  background : none;
  border     : none;
}

/*
 * messaging styles
 */
div#container_messages {
  width      : 100%;
  position   : fixed;
  top        : 60px;
  left       : 0;
  bottom     : 80px;
  overflow-y : auto;
}

div#container_newmessage {
  width    : 100%;
  height   : 80px;
  position : fixed;
  left     : 0;
  bottom   : 0;
}

div#container_newmessage .ui-block-a {
  width         : 100%;
  padding-right : 100px;
}

div#container_newmessage .ui-block-a .ui-input-text {
  width : 100%;
}

div#container_newmessage .ui-block-b {
  width       : auto;
  margin-left : -100px;
}

.yssMessageEntryContainer {
  width : 100%;
  float : left;
}

.yssMessageEntryContainer:not(:first-child) {
  margin-top : 0.6em;
}

.yssMessageEntryContainer > .yssMessageEntry {
  min-width        : 20%;
  max-width        : 80%;
  background-color : #fff;
  padding          : 0.6em;
  border-radius    : 0.6em;
}

.yssMessageEntryContainer > .yssMessageEntry.fromMe {
  float : left;
}

.yssMessageEntryContainer > .yssMessageEntry.fromOther {
  float : right;
}

.yssMessageEntryContainer > .yssMessageEntry > .header {
  width         : 100%;
  float         : left;
  border-bottom : 1px solid #dbdbdb;
}

.yssMessageEntryContainer > .yssMessageEntry.unread > .header {
  font-weight : bold;
}

.yssMessageEntryContainer > .yssMessageEntry > .header > .username {
  float : left;
}

.yssMessageEntryContainer > .yssMessageEntry > .header > .timestamp {
  float : right;
}

.yssMessageEntryContainer > .yssMessageEntry > .body {
  width      : 100%;
  margin-top : 0.4em;
  float      : left;
}

.ui-listview .unreadMessageCounter {
  padding-left : 0.4em;
}

.messagesFAStack.envelope {
  width       : 1em;
  height      : 1em;
  line-height : 1em;
  cursor      : pointer;
}

.unreadMessageCounterBubble {
  color   : #ff8484;
  opacity : 0.8;
}

/* region specific text field styles */
#static_activeorder .ui-field-contain {
  margin      : 0;
  padding-top : 0.2em;
}

#static_activeorder .ui-field-contain > label {
  margin        : 0;
  display       : inline-block;
  padding-right : 0.2em;
}

/* collapsible reflow table */
.ui-table-reflow  .title > .expandCollapse {
  margin-right : 0.4em;
  float        : right;
  display      : none;
}

@media (max-width:35em) {
  .ui-table-reflow tr.collapsed > td > .ui-table-cell-label {
    display : none;
  }

  .ui-table-reflow tr.collapsed > td:not(.title) {
    display : none;
  }

  .ui-table-reflow .title > .expandCollapse {
    display : inline-block;
  }
}

/* classes for the stops report */
.highlight {
  background-color : #b7e4ff;
  text-shadow      : none;
}

.ui-popup {
  background-color : #efefef;
}