1.card {
2  width: 190px;
3  height: 254px;
4  background: rgb(0, 0, 0);
5  border: 2px solid rgb(255, 255, 255);
6  border-radius: 20px;
7}
8
9.card:hover {
10  width: 190px;
11  height: 254px;
12  background: rgb(255, 255, 255);
13  border: 2px solid rgb(200, 200, 200);
14  border-radius: 20px;
15  background-color: #dfdfdf;
16  transition: all .5s;
17}
18
19.secondAnimation {
20  --hoverContorno: #959595;
21}
22
23.secondAnimation:hover,
24.secondAnimation:focus {
25  -webkit-animation: cardAnimacion 1.4s;
26  animation: cardAnimacion 1.4s;
27  box-shadow: 0 0 0 0.8em rgba(255, 255, 255, 0);
28  border-radius: 20px;
29}
30
31@-webkit-keyframes cardAnimacion {
32  0% {
33    box-shadow: 0 0 0 0 var(--hoverContorno);
34  }
35}
36
37@keyframes cardAnimacion {
38  0% {
39    box-shadow: 0 0 0 0 var(--hoverContorno);
40  }
41}
42
43
44
45