.select {

&:disabled {
  opacity: .5;
}
&::-ms-expand {
  display: none;
}
font-size: 14px;
color: #3c4257;
appearance: none;
border: 0;
background: #fff;
box-shadow: 0 2px 5px 0 rgba(60, 66, 87, .12);
padding: 6px 34px 6px 10px;

background-image: url(beyond-image-path('#{$beyond-css-img-path}arrow-select.svg'));
&.active {
  background-image: url(beyond-image-path('#{$beyond-css-img-path}arrow-select-ex.svg'));
}
&[multiple] {
  background-image: none;
}
background-repeat: no-repeat;
background-position: right 14px center;
&:focus {
  @include focus-outline;
}

}

.select.select-outline {

box-shadow: 0 0 0 1px rgba(60, 66, 87, .16);
&:focus {
  outline: 0;
  box-shadow: 0 0 0 1px rgba(60, 66, 87, .16),
    0 0 0 1px rgba(60, 66, 87, .16),
    0 1px 1px 0 rgba(0, 0, 0, .12),
    0 0 0 4px rgba(58, 151, 212, .28);
}

}

.select.select-outline-strong {

box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.12),
  rgba(60, 66, 87, .16) 0 0 0 1px,
  rgba(60, 66, 87, .12) 0 2px 5px 0;
&:focus {
  outline: 0;
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.12),
    rgba(60, 66, 87, .16) 0 0 0 1px,
    rgba(60, 66, 87, .12) 0 2px 5px 0,
    0 0 0 1px rgba(60, 66, 87, .16),
    0 1px 1px 0 rgba(0, 0, 0, .12),
    0 0 0 4px rgba(58, 151, 212, .28);
}

}