1button {
2 appearance: button;
3 background-color: #1899D6;
4 border: solid transparent;
5 border-radius: 16px;
6 border-width: 0 0 4px;
7 box-sizing: border-box;
8 color: #FFFFFF;
9 cursor: pointer;
10 display: inline-block;
11 font-size: 15px;
12 font-weight: 700;
13 letter-spacing: .8px;
14 line-height: 20px;
15 margin: 0;
16 outline: none;
17 overflow: visible;
18 padding: 13px 19px;
19 text-align: center;
20 text-transform: uppercase;
21 touch-action: manipulation;
22 transform: translateZ(0);
23 transition: filter .2s;
24 user-select: none;
25 -webkit-user-select: none;
26 vertical-align: middle;
27 white-space: nowrap;
28}
29
30button:after {
31 background-clip: padding-box;
32 background-color: #1CB0F6;
33 border: solid transparent;
34 border-radius: 16px;
35 border-width: 0 0 4px;
36 bottom: -4px;
37 content: "";
38 left: 0;
39 position: absolute;
40 right: 0;
41 top: 0;
42 z-index: -1;
43}
44
45button:main, button:focus {
46 user-select: auto;
47}
48
49button:hover:not(:disabled) {
50 filter: brightness(1.1);
51}
52
53button:disabled {
54 cursor: auto;
55}
56
57button:active:after {
58 border-width: 0 0 0px;
59}
60
61button:active {
62 padding-bottom: 10px;
63}