img

Heading here

Description goes here

img

Heading here

Description goes here

Center -> out
Left -> Right -> Left
Left -> Right -> Right
Top -> Bottom -> Top
Skew Fill Left -> Right
Rounded Corners
Scale
Border (Inner Shadow)
Border (Outer Shadow)

$color: #2194E0; @keyframes sheen { 0% { transform: skewY(-45deg) translateX(0); } 100% { transform: skewY(-45deg) translateX(12.5em); } } .wrapper { display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .button { padding: 0.75em 2em; text-align: center; text-decoration: none; color: $color; border: 2px solid $color; font-size: 24px; display: inline-block; border-radius: 0.3em; transition: all 0.2s ease-in-out; position: relative; overflow: hidden; &:before { content: ""; background-color: rgba(255,255,255,0.5); height: 100%; width: 3em; display: block; position: absolute; top: 0; left: -4.5em; transform: skewX(-45deg) translateX(0); transition: none; } &:hover { background-color: $color; color: #fff; border-bottom: 4px solid darken($color, 10%); &:before { transform: skewX(-45deg) translateX(13.5em); transition: all 0.5s ease-in-out; } } }

©Mihajlo Nenad 2017

Rechte/Rights

DE: Alle auf der Website gezeigten Werke unterliegen dem Urheberrecht. Der Eigentümer ist als einzige Person befähigt, die dargestellten Werke für kommerzielle Zwecke zu nutzen.

All rights reserved by Mihajlo Nenad.

 

EN: All works on the website are subject to copyright. The owner is the only person who is authorized to use the presented works for commercial purposes.

All rights reserved by Mihajlo Nenad.