.cbutton {
  overflow: visible;
  -webkit-tap-highlight-color: rgba(43, 173, 186, 0.8);
  -webkit-transition: color 0.7s;
  transition: color 0.7s;
}

.cbutton.cbutton--click,
.cbutton:focus {
  color: #fff;
  outline: none;
}

.cbutton--effect-radomir.cbutton--click::before {
  -webkit-animation: anim-effect-radomir 0.9s ease-out forwards;
  animation: anim-effect-radomir 0.9s ease-out forwards;
}

@-webkit-keyframes anim-effect-radomir {
  0% {
    opacity: 1;

    transform: scale3d(1, 1, 1);
  }
  80% {
    opacity: 0.1;
  }
  100% {
    opacity: 0;
    transform: scale3d(1.3, 2.1, 1);
  }
}

@keyframes anim-effect-radomir {
  0% {
    opacity: 1;
    transform: scale3d(1, 1, 1);
  }
  80% {

    opacity: 0.1;
  }
  100% {
    opacity: 0;
    transform: scale3d(1.3, 2.1, 1);
  }
}

.cbutton::before {
  background-color: transparent;
  border-color: var(--primary-light);
  border-radius: 8px;
  border-style: solid;
  border-width: 4px;
  bottom: 0;
  content: '';
  height: inherit;
  left: 0;
  margin: auto;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 0;
  width: inherit;
}