1.Btn {
2  border: none;
3  border-radius: 50%;
4  width: 45px;
5  height: 45px;
6  display: flex;
7  align-items: center;
8  justify-content: center;
9  transition-duration: .4s;
10  cursor: pointer;
11  position: relative;
12  background: #f09433;
13  background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
14  background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);
15  background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);
16  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f09433', endColorstr='#bc1888',GradientType=1 );
17  overflow: hidden;
18}
19
20.svgIcon {
21  transition-duration: .3s;
22}
23
24.svgIcon path {
25  fill: white;
26}
27
28.text {
29  position: absolute;
30  color: rgb(255, 255, 255);
31  width: 120px;
32  font-weight: 600;
33  opacity: 0;
34  transition-duration: .4s;
35}
36
37.Btn:hover {
38  width: 110px;
39  transition-duration: .4s;
40  border-radius: 30px;
41}
42
43.Btn:hover .text {
44  opacity: 1;
45  transition-duration: .4s;
46}
47
48.Btn:hover .svgIcon {
49  opacity: 0;
50  transition-duration: .3s;
51}