18F/State-TalentMAP

// Overrides styles for the react-select module
$input-height: 40px;
 
.results-search-bar {
  background-color: $tm-dark-blue;
  color: $color-white;
  height: auto;
}
 
.results-search-bar-container {
  height: auto;
 
  max-width: 1140px;
 
  padding: 0 0 15px;
 
  label {
    font-size: .8em;
  }
 
  @media screen and (max-width: $screen-xs-max) {
    fieldset {
      width: 100%;
    }
  }
 
  .label-input-wrapper {
    width: 100%;
 
    input {
      height: $input-height;
    }
  }
 
  .label-icon {
    margin-right: 9px;
  }
 
  .search-results-inputs {
    float: left;
    padding: 15px 0;
 
    input {
      border-radius: 5px;
      border-right: solid 1px;
      display: inline-block;
      max-width: 100%;
    }
 
    label {
      margin: 0 0 5px;
    }
  }
 
  .search-submit-button {
    margin-top: 35px;
 
    button {
      font-size: .9em;
      padding: 10px 25px;
    }
  }
 
 
  .search-keyword {
    float: left;
    padding: 15px 0;
 
    input {
      width: 100%;
    }
 
    label {
      display: block;
      text-align: left;
    }
  }
 
  .usa-button {
    min-width: 150px;
    padding: inherit 40px;
  }
}
 
.results-multi-search {
  $font-size: 16px;
 
  color: $color-white;
  padding-top: 1px;
 
  select {
    font-size: $font-size;
    height: $input-height;
    padding-bottom: 0;
    padding-top: 0;
  }
 
  label,
  legend {
    font-size: $font-size;
    font-weight: normal;
    margin: 0 0 5px;
  }
 
  legend {
    text-transform: capitalize;
  }
 
  .search-sub-text {
    font-size: .7em;
    font-style: italic;
    margin: 5px 0 0 10px;
    position: absolute;
    white-space: nowrap;
  }
 
  .Select {
    font-size: $font-size;
  }
 
  .Select-control {
    border-radius: 0;
    height: $input-height;
  }
 
  .Select-multi-value-wrapper {
    height: $input-height - 5; // offset height to match
  }
 
  .Select-placeholder {
    padding-top: 3px;
  }
 
  .results-search-bar {
    background-color: $tm-dark-blue;
    height: auto;
  }
 
  .search-keyword {
    position: relative;
  }
 
  .search-submit-button {
    button {
      font-size: .9em;
      line-height: rem(16);
      margin-top: 3px;
      min-width: 90px;
      padding: 12px 10px;
    }
  }
 
  @media screen and (max-width: $screen-md-max) {
    .usa-width-one-twelfth:nth-child(3n) {
      margin-right: 4.82916%;
    }
  }
 
  @media screen and (min-width: $screen-lg-min) {
    .search-results-inputs {
      margin-right: 2%;
    }
  }
}
 
.results-single-search {
 
  padding-bottom: 2px;
 
  .results-search-bar-container {
    padding-top: 3px;
  }
 
  .search-results-inputs {
    width: 100%;
  }
 
  .usa-button {
    margin-top: 3px;
  }
}