div.ObservationSelector {
    .obs-card {
      margin-top: 5px;
      margin-bottom: 5px;

      .card-header{
        display: flex;
        flex-direction: row;
      }
    }
    .inputs {
        display: flex;
        > .input {
            flex: 0 1 auto;
            margin-left: 0.5em;
            margin-right: 0.5em;
        }

        .slider-container {
          width: 95%;
          margin: 10px auto;
        }
    }

    .datepicker {
      input {
        font-size: 100%;
        border-radius: 6px;
        border: 1px solid lightgrey;
        padding-left: 0.5em;
      }
    }

    .panel-heading {
      display: flex;
      justify-content: space-between;
    }

    .rc-slider-with-marks {
      margin-bottom: 1em;
    }

    .react-autosuggest__container {
      position: relative;
    }

    .react-autosuggest__input {
      font-size: 100%;
      border-radius: 6px;
      border: 1px solid lightgrey;
      padding-left: 0.5em;
    }

    .react-autosuggest__suggestions-container--open {
      position: absolute;
      border: 1px solid lightgrey;
      border-bottom-left-radius: 4px;
      border-bottom-right-radius: 4px;
      max-height: 10em;
      overflow-y: auto;
      background: white;
      width: 100%;
    }

    .react-autosuggest__suggestion {
      padding: 0.5em;

      & + .react-autosuggest__suggestion {
        border-top: 1px solid lightgrey;
      }
    }
}
