/* Author: Mixshaker*/
/*Contact: stillgrey@mail.ru*/
.phone-ico { width: 64px; height: 64px; background-image: url('/images/call-icon.svg'); background-position: 45% 50%; background-repeat: no-repeat; background-size: 50%; display: block; }

#callbutton {
  box-sizing: content-box !important;
  position: fixed !important;
  bottom: 48%;
  right: 60px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  cursor: pointer;
  text-align: center;
  opacity: .9;
  animation: pulsat 3s ease-out;
  animation-iteration-count: infinite;
  z-index: 9999 !important;
}

#callbutton-wave {
  box-sizing: content-box !important;
  -moz-box-sizing: content-box !important;
  position: absolute;
  width: 55px;
  height: 55px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  border-width: 2px;
  border-style: solid;
  outline: 0 !important;
  -webkit-animation: pulsate 2.5s ease-out;
  -moz-animation: pulsate 2.5s ease-out;
  animation: pulsate 2.5s ease-out;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-transform-origin: center;
  -ms-transform-origin: center;
  -o-transform-origin: center;
  transform-origin: center;
  opacity: 0;
}

#callbutton-wave2 {
  box-sizing: content-box !important;
  -moz-box-sizing: content-box !important;
  position: absolute;
  margin: -10px 0 0 -10px;
  width: 60px;
  height: 60px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  border-width: 10px;
  border-style: solid;
  outline: 0 !important;
  -webkit-animation: puls 5s ease;
  -moz-animation: puls 5s ease;
  animation: puls 5s ease;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-transform-origin: center;
  -ms-transform-origin: center;
  -o-transform-origin: center;
  transform-origin: center;
  opacity: 0;
}

#callbutton:hover {
  color: #0D9D0D;
  opacity: 1;
}

#callbutton-wave + i {
  text-shadow: 1px 1px 11px grey;
  padding: 12px 0;
}

#callbutton-wave + .fa-phone {
  color: #fff !important;
  font-size: 40px !important;
}

#callbutton .cbh-tooltip {
  cursor: help;
}

.cbh-tooltip {
  padding: 0 !important;
}

.cbh-tooltip::before {
  width: 0;
  height: 0;
  border: none;
}

.cbh-tooltip::after {
  background: rgba(0, 0, 0, 0.8);
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  border-radius: 30px;
  -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);
  box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);
  font-family: Tahoma, Geneva, sans-serif !important;
  font-size: 14px;
  line-height: 15px;
  font-weight: bold;
  color: #fff;
  content: attr(data-tooltip);
  margin: 0 !important;
  padding: 10px;
  position: absolute;
  right: 80px;
  top: 10px;
  width: 220px;
  opacity: 0;
  visibility: hidden;
  transition: all 0.5s ease-in-out;
}

.cbh-tooltip:hover::after {
  opacity: 1;
  visibility: visible;
}

@-webkit-keyframes buzz {
  50% {
    -webkit-transform: rotate(7deg);
    transform: rotate(7deg);
  }

  100% {
    -webkit-transform: rotate(-7deg);
    transform: rotate(-7deg);
  }
}

@keyframes buzz {
  50% {
    -webkit-transform: rotate(7deg);
    transform: rotate(7deg);
  }

  100% {
    -webkit-transform: rotate(-7deg);
    transform: rotate(-7deg);
  }
}

@keyframes buzzlong {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  80% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }

  82% {
    -webkit-transform: rotate(7deg);
    transform: rotate(7deg);
  }

  84% {
    -webkit-transform: rotate(-7deg);
    transform: rotate(-7deg);
  }

  86% {
    -webkit-transform: rotate(7deg);
    transform: rotate(7deg);
  }

  88% {
    -webkit-transform: rotate(-7deg);
    transform: rotate(-7deg);
  }

  90% {
    -webkit-transform: rotate(7deg);
    transform: rotate(7deg);
  }

  92% {
    -webkit-transform: rotate(-7deg);
    transform: rotate(-7deg);
  }

  94% {
    -webkit-transform: rotate(7deg);
    transform: rotate(7deg);
  }

  96% {
    -webkit-transform: rotate(-7deg);
    transform: rotate(-7deg);
  }

  98% {
    -webkit-transform: rotate(7deg);
    transform: rotate(7deg);
  }

  100% {
    -webkit-transform: rotate(-7deg);
    transform: rotate(-7deg);
  }
}

@-webkit-keyframes buzzlong {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  80% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }

  82% {
    -webkit-transform: rotate(7deg);
    transform: rotate(7deg);
  }

  84% {
    -webkit-transform: rotate(-7deg);
    transform: rotate(-7deg);
  }

  86% {
    -webkit-transform: rotate(7deg);
    transform: rotate(7deg);
  }

  88% {
    -webkit-transform: rotate(-7deg);
    transform: rotate(-7deg);
  }

  90% {
    -webkit-transform: rotate(7deg);
    transform: rotate(7deg);
  }

  92% {
    -webkit-transform: rotate(-7deg);
    transform: rotate(-7deg);
  }

  94% {
    -webkit-transform: rotate(7deg);
    transform: rotate(7deg);
  }

  96% {
    -webkit-transform: rotate(-7deg);
    transform: rotate(-7deg);
  }

  98% {
    -webkit-transform: rotate(7deg);
    transform: rotate(7deg);
  }

  100% {
    -webkit-transform: rotate(-7deg);
    transform: rotate(-7deg);
  }
}

.buzz {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -moz-box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

#callbutton:hover .buzz,
#callbutton:focus .buzz,
#callbutton:active .buzz {
  -webkit-animation-name: buzz;
  animation-name: buzz;
  -webkit-animation-duration: 0.2s;
  animation-duration: 0.2s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

#callbutton .buzz {
  -webkit-animation-name: buzzlong;
  animation-name: buzzlong;
  -webkit-animation-duration: 5s;
  animation-duration: 5s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.buzz:hover,
.buzz:focus,
.buzz:active {
  -webkit-animation-name: buzz;
  animation-name: buzz;
  -webkit-animation-duration: 0.2s;
  animation-duration: 0.2s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

@-webkit-keyframes pulse {
  to {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }
}

@keyframes pulse {
  to {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }
}

.pulse {
  display: inline-block;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.pulse:hover,
.pulse:focus,
.pulse:active {
  -webkit-animation-name: pulse;
  animation-name: pulse;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}

@-webkit-keyframes pulsate {
  0% {
    transform: scale(0.9, 0.9);
    opacity: 0;
  }

  25% {
    transform: scale(1.5, 1.5);
    opacity: 0.5;
  }

  50% {
    transform: scale(1.35, 1.35);
    opacity: 0.7;
  }

  100% {
    transform: scale(1.7, 1.7);
    opacity: 0;
  }
}

@keyframes pulsate {
  0% {
    transform: scale(0.9, 0.9);
    opacity: 0;
  }

  25% {
    transform: scale(1.5, 1.5);
    opacity: 0.5;
  }

  50% {
    transform: scale(1.35, 1.35);
    opacity: 0.7;
  }

  100% {
    transform: scale(1.7, 1.7);
    opacity: 0;
  }
}

@-webkit-keyframes puls {
  0% {
    transform: scale(0.9, 0.9);
    opacity: 0;
  }

  50% {
    transform: scale(1, 1);
    opacity: .3;
  }

  75% {
    transform: scale(0.75, 0.75);
    opacity: .4;
  }

  100% {
    transform: scale(1.3, 1.3);
    opacity: 0;
  }
}

@keyframes puls {
  0% {
    transform: scale(0.9, 0.9);
    opacity: 0;
  }

  50% {
    transform: scale(1, 1);
    opacity: .3;
  }

  75% {
    transform: scale(0.75, 0.75);
    opacity: .4;
  }

  100% {
    transform: scale(1.3, 1.3);
    opacity: 0;
  }
}

@-webkit-keyframes pulsat {
  0% {
    transform: scale(1, 1);
  }

  25% {
    transform: scale(0.999, 0.999);
  }

  50% {
    transform: scale(0.995, 0.995);
  }

  75% {
    transform: scale(0.999, 0.999);
  }

  100% {
    transform: scale(1, 1);
  }
}

@keyframes pulsat {
  0% {
    transform: scale(1, 1);
  }

  25% {
    transform: scale(0.999, 0.999);
  }

  50% {
    transform: scale(0.995, 0.995);
  }

  75% {
    transform: scale(0.999, 0.999);
  }

  100% {
    transform: scale(1, 1);
  }
}

.cbh-my {
  display: inline-block;
  padding: 10px 20px !important;
  margin: 0 !important;
  color: #fff;
  line-height: 1em;
  font-family: "Exo 2", Verdana, Geneva, sans-serif !important;
  font-weight: 300;
  background: #4B0082;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  cursor: pointer;
}

.cbh-black {
  color: #000;
}

.cbh-red {
  background: #FF0000;
}

.cbh-orange {
  background: #FFA500;
}

.cbh-yellow {
  background: #FFFF00;
}

.cbh-green {
  background: #0D9D0D;
}

.cbh-cyan {
  background: #00FFFF;
}

.cbh-blue {
  background: #0000FF;
}

.cbh-purple {
  background: #800080;
}

.cbh-gray {
  background: #808080;
}

.cbh-magenta {
  background: #FF00FF;
}

.cbh-darkmagenta {
  background: #8B008B;
}

.fs10 {
  font-size: 10px;
}

.fs12 {
  font-size: 12px;
}

.fs14 {
  font-size: 14px;
}

.fs16 {
  font-size: 16px;
}

.fs18 {
  font-size: 18px;
}

.fs20 {
  font-size: 20px;
}

.fs22 {
  font-size: 22px;
}

.fs24 {
  font-size: 24px;
}

.fs26 {
  font-size: 26px;
}

.fs28 {
  font-size: 28px;
}

.fs30 {
  font-size: 30px;
}

.fs32 {
  font-size: 32px;
}

.fs34 {
  font-size: 34px;
}

.fs36 {
  font-size: 36px;
}

.fs38 {
  font-size: 38px;
}

.fs40 {
  font-size: 40px;
}

.fs42 {
  font-size: 42px;
}

.fs44 {
  font-size: 44px;
}

.fs46 {
  font-size: 46px;
}

.fs48 {
  font-size: 48px;
}

/*MINIbutton styles*/
.minibtn {
  width: 48px !important;
  height: 48px !important;
}

.minibtn #callbutton-wave {
  width: 44px !important;
  height: 44px !important;
}

.minibtn #callbutton-wave2 {
  width: 48px !important;
  height: 48px !important;
}

.minibtn #callbutton-wave + i {
  padding: 10px 0 !important;
}

.minibtn #callbutton-wave + .fa-phone {
  font-size: 32px !important;
}

.cbtn-left {
  left: 40px;
}

.cbtn-bottom {
  bottom: calc(9% + 10px) !important;
}

.tooltip-left::after {
  left: 80px !important;
}

@media screen and (max-device-width: 480px) {
  #callbutton-wave + i {
    text-shadow: none;
  }
  /*#callbutton { right: 20px;     bottom: calc(5% + 10px) !important; }*/
}