hokui/hokui.net

.baricon--example
    background: rgba(#000, .01)
    +baricon-size($baricon-default-size)




.gray-more-lighter
    padding: 16px
    background-color: $gray-more-lighter
.gray-lighter
    padding: 16px
    background-color: $gray-lighter
.gray-light
    padding: 16px
    background-color: $gray-light
.gray
    padding: 16px
    background-color: $gray
.gray-dark
    padding: 16px
    background-color: $gray-dark
    color: $body-bg
.gray-darker
    padding: 16px
    background-color: $gray-darker
    color: $body-bg

.primary-bg-darker
    color: $body-bg
    background-color: $brand-primary-darker
.secondary-bg-darker
    color: $body-bg
    background-color: $brand-secondary-darker
.accent-bg-darker
    color: $body-bg
    background-color: $brand-accent-darker

.primary-bg-dark
    color: $body-bg
    background-color: $brand-primary-dark
.secondary-bg-dark
    color: $body-bg
    background-color: $brand-secondary-dark
.accent-bg-dark
    color: $body-bg
    background-color: $brand-accent-dark


.primary-bg-light
    background-color: $brand-primary-light
.secondary-bg-light
    background-color: $brand-secondary-light
.accent-bg-light
    background-color: $brand-accent-light

.primary-bg-lighter
    background-color: $brand-primary-lighter
.secondary-bg-lighter
    background-color: $brand-secondary-lighter
.accent-bg-lighter
    background-color: $brand-accent-lighter