.button-blue {

color: white;
background-color: $blue;
border-radius: $border-radius;
transition-duration: .1s;
transition-timing-function: ease-out;
transition-property: box-shadow, background-color;

}

.button-blue:hover {

opacity: .875;

}

.button-blue:active, .button-blue.is-active {

box-shadow: inset 0 0 0 32px rgba(#000,.125), inset 0 2px 3px 0 rgba(#000,.25);

}

.button-blue:focus {

outline: none;
box-shadow: 0 0 0 2px rgba(white, .5), 0 0 1px 4px rgba($blue, .5);

}

.button-blue:disabled, .button-blue.is-disabled {

opacity: .5;

}