|
@@ -51,27 +51,41 @@ body {
|
51
|
51
|
}
|
52
|
52
|
|
53
|
53
|
.button {
|
|
54
|
+ outline: none;
|
|
55
|
+ border: 3px solid white;
|
|
56
|
+ border-radius: 50px;
|
|
57
|
+ height: 8vh;
|
|
58
|
+ min-width: 15vw;
|
|
59
|
+ padding: 0px 10px 0px 10px;
|
|
60
|
+ color: ;
|
54
|
61
|
font-family: 'Special Elite', cursive;
|
55
|
|
- border-radius: 20px;
|
56
|
|
- background-color: #B0C4DE;
|
57
|
|
- height: 3.8vh;
|
|
62
|
+ background-image: linear-gradient(to top, black -50%, #BF0909 80%);
|
|
63
|
+ cursor : pointer;
|
58
|
64
|
}
|
59
|
65
|
|
60
|
|
- .button:hover{
|
61
|
|
- animation-name: zslide;
|
62
|
|
- animation-duration: 3s;
|
|
66
|
+ .button:hover {
|
|
67
|
+ box-shadow: 0 0 50px #B0C4DE;
|
63
|
68
|
}
|
64
|
69
|
|
65
|
|
- @keyframes zslide {
|
|
70
|
+ .button:active {
|
|
71
|
+ background-image: linear-gradient(to top, #BF0909 20%, black 150%);
|
|
72
|
+ }
|
|
73
|
+
|
|
74
|
+ @keyframes oscille {
|
66
|
75
|
from {
|
67
|
|
- font-size: 2vw;
|
68
|
|
- opacity: 1;
|
|
76
|
+ transform: rotate(0);
|
69
|
77
|
}
|
70
|
78
|
|
71
|
|
- to {
|
72
|
|
- font-size: 6vw;
|
73
|
|
- opacity: 0;
|
|
79
|
+ 25% {
|
|
80
|
+ transform: rotate(8deg);
|
|
81
|
+ }
|
74
|
82
|
|
|
83
|
+ 75% {
|
|
84
|
+ transform: rotate(-8deg);
|
|
85
|
+ }
|
|
86
|
+
|
|
87
|
+ to {
|
|
88
|
+ transform: rotate(0);
|
75
|
89
|
}
|
76
|
90
|
}
|
77
|
91
|
|