.clearfix, #sensor-card .last-data:after {
  clear: both;
  content: '';
  display: block;
  float: none;
  height: 1px;
  width: 100%; }

BODY {
  margin: 0px;
  padding: 0px;
  position: relative; }
  BODY * {
    font-family: 'Oxygen', sans-serif; }

BODY DIV#top-bar {
  position: fixed;
  top: 0px;
  padding: 10px 20px;
  width: 100%;
  background-image: url("../gfx/submit-bg.jpg");
  background-repeat: repeat-x;
  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.65); }

BODY.login {
  margin: 0px;
  padding-top: 20px; }
  @media screen and (min-width: 600px) {
    BODY.login {
      padding-top: 30px; } }
  BODY.login .hidden {
    display: none; }
  BODY.login .clearall {
    width: 100%;
    clear: both; }
  BODY.login DIV#top-bar {
    position: fixed;
    top: 0px;
    padding: 10px 20px;
    width: 100%;
    background-image: url("../gfx/submit-bg.jpg");
    background-repeat: repeat-x;
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.65); }
  BODY.login .content-container {
    background-color: #FFF;
    color: #000;
    margin: 10px auto 0px auto;
    padding: 0px;
    width: 80%;
    border-radius: 8px 8px 8px 8px;
    -moz-border-radius: 8px;
    box-shadow: 0px 0px 10px 2px rgba(155, 0, 20, 0.4); }
    BODY.login .content-container .logo-title {
      background-color: #8e000d;
      border-radius: 8px 8px 0px 0px;
      color: #FFF;
      font-size: 22px;
      margin-bottom: 20px;
      padding: 20px;
      text-align: center; }
    @media screen and (min-width: 600px) {
      BODY.login .content-container {
        margin: 100px auto 0px auto;
        width: 300px; } }
    BODY.login .content-container .error-div {
      padding: 0px 30px;
      text-align: center; }
    BODY.login .content-container IMG {
      display: block;
      margin: 0px auto 20px auto; }
    BODY.login .content-container .error-div P {
      color: #000;
      margin-top: 0px; }
    BODY.login .content-container FORM {
      padding: 10px 30px 30px 30px; }
      BODY.login .content-container FORM div.field {
        padding: 0px 0px 10px 0px; }
      BODY.login .content-container FORM .centered {
        text-align: center; }
      BODY.login .content-container FORM INPUT[type=text],
      BODY.login .content-container FORM INPUT[type=password] {
        border: 1px solid #8e000d;
        padding: 10px 20px;
        color: #000;
        border-radius: 2px;
        font-size: 16px;
        -moz-border-radius: 2px;
        width: 100%; }
      BODY.login .content-container FORM INPUT[type=submit] {
        background-color: #8e000d;
        border: 0px;
        border-radius: 4px;
        color: #FFF;
        cursor: pointer;
        display: inline-block;
        font-size: 16px;
        font-weight: 700;
        margin-top: 30px;
        padding: 10px 20px; }

div.menu {
  position: fixed;
  background-color: #FFFFFF;
  top: 0px;
  width: 100%;
  padding-top: 0px;
  height: 60px;
  z-index: 100;
  box-shadow: 0px 3px 12px 0px rgba(50, 50, 50, 0.75); }
  div.menu #menu-inner {
    margin: 0px auto;
    max-width: 1000px; }
    div.menu #menu-inner div.menu-item {
      float: left;
      font-size: 20px;
      padding: 14px 20px 6px 20px;
      text-align: center;
      width: auto; }
      div.menu #menu-inner div.menu-item.logo {
        padding-bottom: 0px;
        padding-top: 5px; }
        div.menu #menu-inner div.menu-item.logo IMG {
          display: block;
          height: 55px;
          width: auto; }
      div.menu #menu-inner div.menu-item A {
        color: #c99e67;
        text-decoration: none;
        text-transform: uppercase; }

#sensor-card {
  margin: 100px auto 0px auto;
  max-width: 1000px; }
  #sensor-card .front,
  #sensor-card .back {
    background-color: #FFF; }
  #sensor-card .last-data {
    text-align: center; }
    #sensor-card .last-data H3.sensor-name {
      font-size: 24px;
      text-transform: uppercase; }
    #sensor-card .last-data #edit-icon {
      cursor: pointer;
      height: auto;
      width: 20px; }
    #sensor-card .last-data .data-container {
      -ms-flex-line-pack: center;
          align-content: center;
      -ms-flex-align: stretch;
          align-items: stretch;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-pack: center;
          justify-content: center;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      padding: 0px 10%; }
      @media screen and (min-width: 900px) {
        #sensor-card .last-data .data-container {
          -ms-flex-wrap: no-wrap;
              flex-wrap: no-wrap; } }
    #sensor-card .last-data .data {
      background-color: #FFF;
      border: 2px solid #8e000d;
      border-radius: 10px;
      box-sizing: border-box;
      color: #000;
      -ms-flex-preferred-size: 100%;
          flex-basis: 100%;
      -ms-flex-positive: 0;
          flex-grow: 0;
      margin: 0px 20px 20px;
      padding: 0px 0px 20px;
      -webkit-border-radius: 10px;
      -moz-border-radius: 10px; }
      @media screen and (min-width: 650px) {
        #sensor-card .last-data .data {
          -ms-flex-preferred-size: 48%;
              flex-basis: 48%; } }
      @media screen and (min-width: 900px) {
        #sensor-card .last-data .data {
          -ms-flex-preferred-size: 25%;
              flex-basis: 25%;
          margin: 0px 20px 20px;
          width: 300px; } }
      #sensor-card .last-data .data:nth-child(1) {
        -ms-flex-order: 1;
            order: 1; }
      #sensor-card .last-data .data:nth-child(2) {
        -ms-flex-order: 2;
            order: 2; }
      #sensor-card .last-data .data:nth-child(3) {
        -ms-flex-order: 3;
            order: 3; }
      #sensor-card .last-data .data:nth-child(4) {
        -ms-flex-order: 4;
            order: 4; }
      #sensor-card .last-data .data .parameter-name {
        background-color: #8e000d;
        color: #FFF;
        margin: 0px auto 10px;
        height: 25px; }
        @media screen and (min-width: 900px) {
          #sensor-card .last-data .data .parameter-name {
            height: 50px; } }
      #sensor-card .last-data .data .value,
      #sensor-card .last-data .data .unit {
        font-size: 20px; }
        @media screen and (min-width: 900px) {
          #sensor-card .last-data .data .value,
          #sensor-card .last-data .data .unit {
            font-size: 22px; } }

#modal-content-overlay {
  background-color: rgba(66, 66, 66, 0.6);
  bottom: 0px;
  display: none;
  left: 0px;
  position: absolute;
  right: 0px;
  top: 0px; }
  #modal-content-overlay .form-container {
    margin: 20px 5%; }
    @media screen and (min-width: 900px) {
      #modal-content-overlay .form-container {
        margin: 100px 10%; } }
    #modal-content-overlay .form-container .sensor-edit-form {
      background-color: #FFF;
      border: 2px solid #8e000d;
      margin: 20px auto 20px auto;
      padding: 0px;
      position: relative;
      width: 100%; }
      @media screen and (min-width: 900px) {
        #modal-content-overlay .form-container .sensor-edit-form {
          width: 700px; } }
      #modal-content-overlay .form-container .sensor-edit-form .modal-close {
        background-color: transparent;
        background-image: url(../images/icons/close_icon.svg);
        background-size: cover;
        border: 0px solid #FFF;
        cursor: pointer;
        height: 25px;
        position: absolute;
        right: 10px;
        top: 10px;
        width: 25px; }
      #modal-content-overlay .form-container .sensor-edit-form H3 {
        background-color: #8e000d;
        color: #FFF;
        display: block;
        margin-top: 0px;
        padding: 10px;
        vertical-align: super; }
      #modal-content-overlay .form-container .sensor-edit-form #back-to-data-button {
        cursor: pointer;
        display: inline-block;
        padding-top: 10px;
        width: 33px; }
      #modal-content-overlay .form-container .sensor-edit-form FORM {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        padding: 20px 50px; }
        #modal-content-overlay .form-container .sensor-edit-form FORM > .field {
          -ms-flex-preferred-size: 100%;
              flex-basis: 100%;
          margin-bottom: 10px; }
          #modal-content-overlay .form-container .sensor-edit-form FORM > .field LABEL {
            display: inline-block;
            font-weight: bold;
            margin-right: 20px; }
            #modal-content-overlay .form-container .sensor-edit-form FORM > .field LABEL:after {
              content: ':'; }
        #modal-content-overlay .form-container .sensor-edit-form FORM .fieldset {
          -ms-flex-preferred-size: 100%;
              flex-basis: 100%;
          margin-bottom: 30px; }
          @media screen and (min-width: 900px) {
            #modal-content-overlay .form-container .sensor-edit-form FORM .fieldset {
              -ms-flex-preferred-size: 50%;
                  flex-basis: 50%; } }
          #modal-content-overlay .form-container .sensor-edit-form FORM .fieldset .field {
            margin-bottom: 20px; }
          #modal-content-overlay .form-container .sensor-edit-form FORM .fieldset LABEL {
            display: inline-block;
            font-weight: bold;
            margin-bottom: 10px;
            margin-right: 10px; }
            #modal-content-overlay .form-container .sensor-edit-form FORM .fieldset LABEL:after {
              content: ':'; }
        #modal-content-overlay .form-container .sensor-edit-form FORM INPUT[type="checkbox"] {
          margin-left: 20px; }
        #modal-content-overlay .form-container .sensor-edit-form FORM INPUT[type="submit"] {
          background-color: #FFF;
          border: 2px solid #8e000d;
          color: #8e000d;
          padding: 10px 20px; }

.last-values {
  margin: 100px auto;
  width: 600px; }
  .last-values TABLE {
    border-collapse: collapse; }
    .last-values TABLE THEAD TR TH {
      background-color: #EDEDED;
      font-size: 18px;
      padding: 3px 10px;
      text-align: left; }
    .last-values TABLE TBODY TR TD {
      border: 1px solid #EDEDED;
      padding: 3px 10px; }

.log-out-link-container,
.log-in-link-container,
.admin-link-container {
  float: right;
  margin-right: 10px; }
  .log-out-link-container A,
  .log-in-link-container A,
  .admin-link-container A {
    background-position: 0px 0px;
    background-repeat: no-repeat;
    background-size: 20px auto;
    color: #c98f44;
    display: block;
    height: 33px;
    margin-top: 10px;
    padding-left: 25px;
    padding-top: 2px;
    text-decoration: none; }
    .log-out-link-container A.login,
    .log-in-link-container A.login,
    .admin-link-container A.login {
      background-image: url("../images/icons/login.png"); }
    .log-out-link-container A.logout,
    .log-in-link-container A.logout,
    .admin-link-container A.logout {
      background-image: url("../images/icons/logout.png"); }
    .log-out-link-container A.admin-link,
    .log-in-link-container A.admin-link,
    .admin-link-container A.admin-link {
      background-image: url("../images/icons/admin.png"); }

.parameter {
  margin: 30px auto;
  width: 96%; }
  @media screen and (min-width: 900px) {
    .parameter {
      width: 80%; } }
  .parameter .tabs-container {
    background-color: #EDEDED;
    color: #000;
    font-weight: bold;
    margin-bottom: 30px;
    padding: 5px 30px; }
  .parameter .graph {
    height: 400px; }

#graph-period {
  background: #F1F1F1;
  margin: 20px auto;
  max-width: 80%;
  width: 90%; }
  #graph-period div.field {
    display: inline-block;
    padding: 5px 20px 5px 10px; }
  #graph-period .submit-button {
    border: 2px solid #42E321;
    border-radius: 4px;
    cursor: pointer;
    display: inline-block;
    margin-right: 15px;
    padding: 5px 10px; }

.sensor-list {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-pack: center;
      justify-content: center;
  margin: 100px auto 10px auto;
  width: 320px; }
  @media (min-width: 625px) {
    .sensor-list {
      width: 640px; } }
  @media (min-width: 950px) {
    .sensor-list {
      width: 960px; } }
  .sensor-list .sensor {
    background-color: #FFF;
    border-radius: 10px;
    box-shadow: 0px 0px 10px 2px rgba(66, 66, 66, 0.4);
    box-sizing: border-box;
    color: #000;
    margin: 10px;
    max-width: 300px;
    min-width: 240px;
    padding: 0px 0px 0px 0px;
    width: 300px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px; }
    .sensor-list .sensor.warning {
      border: 2px solid #934532; }
    .sensor-list .sensor H3.sensor-name {
      background-color: #8e000d;
      border-radius: 10px 10px 0px 0px;
      color: #FFF;
      margin: 0px auto;
      padding: 10px;
      text-align: center; }
      .sensor-list .sensor H3.sensor-name A {
        color: #FFF;
        text-decoration: none;
        text-transform: uppercase; }
    .sensor-list .sensor SPAN.last-updated {
      display: block;
      margin: 10px auto 0px auto;
      text-align: center; }
    .sensor-list .sensor .data {
      padding: 20px; }
      .sensor-list .sensor .data P {
        margin: 5px 0px; }
        .sensor-list .sensor .data P LABEL {
          font-weight: bold; }

BODY.admin {
  padding-top: 100px; }
  BODY.admin .admin-form .form-field {
    margin-bottom: 10px; }
    BODY.admin .admin-form .form-field LABEL {
      display: inline-block;
      width: 200px; }