%dotted-link { border-bottom: 1px dashed $primary-color; line-height: 25px; transition: all .5s; padding: .1rem .25rem; &:hover { color: $white; border-color: $hover-color; background: $primary-color; } &:hover, &:active { outline: 0; } } %background-filter { background: linear-gradient(150deg, $cover-secondary 30%, $cover-primary 70%) 0 0 / cover fixed; } %center-absolute { display: flex; align-items: center; justify-content: center; } %font-shadow { text-shadow: 0 1px 1px rgba(000, 000, 000, .4); } %btn-cover { position: relative; display: block; font-size: .9em; -webkit-font-smoothing: antialiased; font-weight: bold; letter-spacing: 1px; opacity: .8; color: $gray-lightest; border-radius: 20px; text-shadow: none; &:hover { opacity: 1; } } %btn-cover-with-border { @extend %btn-cover; border: 1px solid $gray-lightest; } @mixin placeholder { ::-webkit-input-placeholder { @content; } :-moz-placeholder { @content; } ::-moz-placeholder { @content; } :-ms-input-placeholder { @content; } }