1.chatBtn {
2  width: 55px;
3  height: 55px;
4  display: flex;
5  align-items: center;
6  justify-content: center;
7  border-radius: 50%;
8  border: none;
9  background-color: #FFE53B;
10  background-image: linear-gradient(147deg, #FFE53B, #FF2525,#FFE53B);
11  cursor: pointer;
12  padding-top: 3px;
13  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.164);
14  position: relative;
15  background-size: 300%;
16  background-position: left;
17  transition-duration: 1s;
18}
19
20.tooltip {
21  position: absolute;
22  top: -40px;
23  opacity: 0;
24  background-color: rgb(255, 180, 82);
25  color: white;
26  padding: 5px 10px;
27  border-radius: 5px;
28  display: flex;
29  align-items: center;
30  justify-content: center;
31  transition-duration: .5s;
32  pointer-events: none;
33  letter-spacing: 0.5px;
34}
35
36.chatBtn:hover .tooltip {
37  opacity: 1;
38  transition-duration: .5s;
39}
40
41.chatBtn:hover {
42  background-position: right;
43  transition-duration: 1s;
44}