.multibaton {

  position: fixed;

  right: 30px;

  bottom: 50px;

  display: flex;

  flex-direction: column;

  align-items: flex-end;

  width: 70px;

  height: 70px;

  transition: 2s;

}

.active_,

.multibaton:hover {

  width: auto !important;

  height: auto !important;

}

.active_ .multibaton__list,

.multibaton:hover .multibaton__list {

  transition: 3s;

  position: relative;

  top: auto;

  bottom: 10px;

  visibility: visible;

  opacity: 1;

}

.active_ .multibaton__item,

.multibaton:hover .multibaton__item {

  transform: scaleX(100%) scaleY(100%) translateY(0);

  visibility: visible;

  opacity: 1;

  transition: 0.4s;

}

.multibaton__list {

  list-style: none;

  margin: 0;

  padding: 0;

  display: flex;

  flex-direction: column;

  align-items: flex-end;

  gap: 8px;

  position: absolute;

  right: 13px;

  top: 80px;

  transition: 3s;

}

.multibaton__item {

  visibility: hidden;

  display: flex;

  align-items: center;

  transform: scaleX(40%) scaleY(40%) translateY(150px);

  opacity: 0;

}

.multibaton__title {

  text-decoration: none !important;

  font-size: 12px;

  background: rgba(0, 0, 0, 0.8);

  padding: 10px;

  border-radius: 30px;

}

.multibaton__icon {

  color: white;

  margin-left: 10px;

  width: 44px;

  height: 44px;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

}

.multibaton__icon svg {

  width: 26px;

  height: 26px;

  fill: white;

}

.multibaton__button {

  color: white;

  width: 70px;

  height: 70px;

  background-color: #ffce09;

  display: flex;

  justify-content: center;

  align-items: center;

  border-radius: 50%;

  transition: 0.3s ease-out;

  animation: 3s linear infinite animation_multibaton__button;

}

.multibaton__button svg {

  width: 30px;

  height: 30px;

  fill: white;

}

@keyframes animation_multibaton__button {

  0% {

    box-shadow: 0 0 0 0 #ffba26, 0 0 0 0 rgba(255, 206, 9, 0.7);

  }

  40% {

    box-shadow: 0 0 0 13.62667px rgba(255, 186, 38, 0),

      0 0 0 6.81333px rgba(255, 206, 9, 0.7);

  }

  80% {

    box-shadow: 0 0 0 27.25333px rgba(255, 186, 38, 0),

      0 0 0 13.62667px rgba(255, 206, 9, 0);

  }

  100% {

    box-shadow: 0 0 0 34.06667px rgba(255, 186, 38, 0),

      0 0 0 27.25333px rgba(255, 206, 9, 0);

  }

}

@media (max-width: 800px) {

  .multibaton,

  .multibaton__button {

    width: 44px;

    height: 44px;

  }

  .multibaton__button svg,

  .multibaton__icon svg {

    width: 20px;

    height: 20px;

  }

  .multibaton {

    right: 20px;

    bottom: 40px;

  }

  .multibaton__list {

    right: 0;

  }

  .multibaton__icon {

    width: 35px;

    height: 35px;

  }

}