Loader by KSAplay

1.loader {
2  display: flex;
3  align-items: center;
4  justify-content: center;
5  overflow: hidden;
6  font-weight: bold;
7  font-size: 12px;
8  color: #f2df95;
9  height: 150px;
10  width: 250px;
11  background-color: #907A24;
12  border-style: solid;
13  border-width: 50px 250px 50px 0px;
14  border-color: #C9B656 #AD9531 #87621B #AD9531;
15  animation: camera_effect 4s infinite linear;
16}
17
18@keyframes camera_effect {
19  0% {
20    border-width: 0px 250px 0px 0px;
21  }
22
23  10% {
24    border-width: 45px 250px 45px 0px;
25  }
26
27  20% {
28    border-width: 50px 160px 50px 0px;
29  }
30
31  30% {
32    border-width: 50px 80px 50px 80px;
33  }
34
35  45% {
36    border-width: 45px 75px 55px 85px;
37  }
38
39  55% {
40    border-width: 55px 70px 45px 90px;
41  }
42
43  65% {
44    border-width: 55px 85px 45px 75px;
45  }
46
47  70% {
48    border-width: 50px 80px 50px 80px;
49  }
50
51  80% {
52    border-width: 50px 0px 50px 160px;
53  }
54
55  90% {
56    border-width: 45px 0px 45px 250px;
57  }
58
59  100% {
60    border-width: 0px 0px 0px 250px;
61  }
62}