Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- body {
- color: #fff;
- font-family: Sans-serif;
- }
- .box {
- background: #FC466B;
- border-radius: 5px;
- height: 100px;
- left: 30%;
- line-height: 100px; /* Same as Div Height to make text appear in the middle*/
- position: absolute;
- text-align: center;
- transition: background 1s linear, border-radius 0.5s ease-out 0.5s;
- width: 100px;
- }
- .box-hover:hover {
- background: #3F5EFB;
- }
- .box-border {
- left: 50%;
- background: #3F5EFB;
- }
- .box-border:hover {
- border-radius: 50%;
- }
- button {
- background: #61dafb;
- border: none;
- /*<offset-x><offset-y><blur-radius>*/
- box-shadow: 0 5px 0 #B0C5CB;
- color: #333;
- font-family: inherit;
- font-weight: bold;
- left: 41%;
- outline: 0;
- padding: 12px 20px;
- position: absolute;
- top: 20%;
- transition: all .1s linear;
- }
- button:active {
- box-shadow: 0 2px 0 #B0C5CB;
- transform: translateY(3px);
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement