1.triangles {
2  transform: translate(-50%, -50%);
3  height: 81px;
4  width: 90px;
5  position: absolute;
6  left: 50%;
7  top: 50%;
8}
9
10.tri {
11  position: absolute;
12  animation: pulse_51 750ms ease-in infinite;
13  border-top: 27px solid #215A6D;
14  border-left: 15px solid transparent;
15  border-right: 15px solid transparent;
16  border-bottom: 0px;
17}
18
19.tri.invert {
20  border-top: 0px;
21  border-bottom: 27px solid #215A6D;
22  border-left: 15px solid transparent;
23  border-right: 15px solid transparent;
24}
25
26.tri:nth-child(1) {
27  left: 30px;
28}
29
30.tri:nth-child(2) {
31  left: 15px;
32  top: 27px;
33  animation-delay: -125ms;
34}
35
36.tri:nth-child(3) {
37  left: 30px;
38  top: 27px;
39}
40
41.tri:nth-child(4) {
42  left: 45px;
43  top: 27px;
44  animation-delay: -625ms;
45}
46
47.tri:nth-child(5) {
48  top: 54px;
49  animation-delay: -250ms;
50}
51
52.tri:nth-child(6) {
53  top: 54px;
54  left: 15px;
55  animation-delay: -250ms;
56}
57
58.tri:nth-child(7) {
59  top: 54px;
60  left: 30px;
61  animation-delay: -375ms;
62}
63
64.tri:nth-child(8) {
65  top: 54px;
66  left: 45px;
67  animation-delay: -500ms;
68}
69
70.tri:nth-child(9) {
71  top: 54px;
72  left: 60px;
73  animation-delay: -500ms;
74}
75
76@keyframes pulse_51 {
77  0% {
78    opacity: 1;
79  }
80
81  16.666% {
82    opacity: 1;
83  }
84
85  100% {
86    opacity: 0;
87  }
88}