@import 'variables';

.searchButton {
  padding: $spacer / 2;
  vertical-align: middle;
  display: inline-block;
  margin: 0;
  margin-right: $spacer / 4;

  &:focus {
    outline: 0;
  }

  svg {
    stroke: $brand-grey-light;
    width: 24px;
    height: 24px;
  }

  &:hover,
  &:focus {
    svg {
      stroke: $brand-cyan;
    }
  }

  &:active {
    svg {
      stroke: darken($brand-cyan, 30%);
    }
  }
}