1.btn {
2 display: grid;
3 place-items: center;
4 background: #e3edf7;
5 padding: 1.4em;
6 border-radius: 10px;
7 box-shadow: 6px 6px 10px -1px rgba(0,0,0,0.15),
8 -6px -6px 10px -1px rgba(255,255,255,0.7);
9 border: 1px solid rgba(0,0,0,0);
10 cursor: pointer;
11 transition: transform 0.5s;
12}
13
14.btn:hover {
15 box-shadow: inset 4px 4px 6px -1px rgba(0,0,0,0.2),
16 inset -4px -4px 6px -1px rgba(255,255,255,0.7),
17 -0.5px -0.5px 0px rgba(255,255,255,1),
18 0.5px 0.5px 0px rgba(0,0,0,0.15),
19 0px 12px 10px -10px rgba(0,0,0,0.05);
20 border: 1px solid rgba(0,0,0,0.1);
21 transform: translateY(0.5em);
22}
23
24.btn svg {
25 transition: transform 0.5s;
26}
27
28.btn:hover svg {
29 transform: scale(0.9);
30 fill: #333333;
31}
32
33
