/*
Input box with floating label

Floating label styles from trimble css

Markup:
<div class="input-group">
    <input class="icon user" type="text" required/>
    <label class="label float">First Name</label>
</div>

Styleguide Form Elements.Floating label
*/

@import 'colors.scss';
@import 'variables.scss';

@mixin floating-label{
    top:-1.3125rem;
    left: 0;
    font-size:$font-size-small;
    font-style: $font-style-normal;
}


input:focus ~ .label.float, input:valid ~ .label.float, select:focus ~ .label.float, select:valid ~ .label.float {
    @include floating-label;
  }