/* scroll top button */
.scrolltop {
  position: fixed;
  bottom: 3rem;
  right: 2rem;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 1.4rem;
  padding: 0.3rem;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s;
  transform: translateX(200px);
  z-index: 99;
  cursor: pointer;
  box-shadow: 0 0 10px rgba(12, 105, 184, 0.1);
  /* animation: rubber 4s linear infinite; */
}
.scrolltop i {
  color: orange;
  font-weight: 600;
}
.scrolltop.active {
  transform: translateX(0px);
}
.scrolltop:hover {
  background-color: blue;
  color: var(--light-bg);
}
.whatsapp {
  position: fixed;
  bottom: 3rem;
  left: 2rem;
  width: 2.8rem;
  height: 2.8rem;
  border-radius: 1.4rem;
  padding: 0.3rem;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s;
  transform: translateX(-200px);
  z-index: 99;
  cursor: pointer;
  box-shadow: 0 0 10px rgba(12, 105, 184, 0.1);
  /* animation: rubber 4s linear infinite; */
}
/* 
@-webkit-keyframes rubber {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-15px);
  }
  100% {
    transform: translateY(0);
  }
} */
.whatsapp i {
  color: orange;
  font-weight: 400;
  font-size: 1.3rem;
  transition: all 400ms ease;
}
.whatsapp.active {
  transform: translateX(0px);
}
.whatsapp:hover {
  background-color:blue;
  color: var(--light-bg);
}
 
.whatsapp:hover i {
    color: #fff;
}
.scrolltop:hover i {
    color: #fff;
}