podemos-info/census

#title_bar {
  &::after {
    display: none;
  }

  margin-right: 45px;

  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: stretch;

  #titlebar_fastfilter {
    flex-grow: 1;

    #searchbox {
      position: relative;
      max-width: 500px;
      float: right;
      margin-right: 10px;
      width: 100%;

      #searchicon {
        position: absolute;
        left: 5px;
        top: 6px;
        color: #ccc;
      }

      .tip {
        border: none;
        cursor: pointer;
        background: none;
        display: none;
        position: absolute;
        width: 75px;
        font-size: 0.6rem;
        line-height: 0.6rem;
        text-align: center;
        top: 0px;
        bottom: 0px;
        right: 25px;
        margin: 0;
        padding: 0;
        color: #999;

      }

      .clear {
        position: absolute;
        right: 5px;
        top: 5px;
        color: #999;
      }

      #searchinput {
        border: 0;
        background: lighten($success-color, 45%);
        padding-left: 30px;
        padding-right: 120px;
        height: 28px;
      }

      #searchinput:not([value]) {
        background: lighten(gray, 45%);

        &:not(.changed) + .tip + .clear {
          display: none;
        }
      }

      #searchinput.changed {
        background: lighten($warning-color, 45%);
        & + .tip {
          display: block;
        }
      }
      .rotate90 {
        transform: rotate(90deg);
        display: inline-block;
        margin: 0 3px;
        padding: 3px;
        background: #ccc;
        color: white;
      }
    }
  }
}