$cor-principal: #3498db 
$cor-cancelar: #e74c3c 

@mixin botao-estiloso($cor)
  padding: 10px 20px
  border-radius: 5px
  background-color: $cor
  color: #ffffff
  &:hover
    background-color: darken($cor, 10%)

.botao-comprar
  @include botao-estiloso($cor-principal)

.botao-cancelar
  @include botao-estiloso($cor-cancelar)
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.