.qcld_floating_text_to_speech_box {
    z-index: 9999;
    width: 60px;
    height: 60px;
    line-height: 60px;
    list-style-type: none;
    margin: 0;
    padding: 0;
    text-align: center;
    cursor: pointer;
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.2), 0 2px 5px 0 rgba(0, 0, 0, 0.2);
    backface-visibility: hidden;
    padding: 0;
    border: none;
    border-radius: 50%;
    position: fixed;
    bottom: 45% !important;
    right: 5px !important;
}

.qcld_floating_text_to_speech_box .qcld_floating_text_to_speech_button {
    background-color: rgb(42, 201, 170);
    color: rgb(255, 255, 255);
    position: absolute;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    padding: 0;
    border: none;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    font-size: 20px;
}
.qcld_floating_text_to_speech_box .qcld_floating_text_to_speech_button.qcld_floating_text_to_speech_loud{
    background-color: rgb(16 176 145);
}
.qcld_floating_text_to_speech_box .qcld_floating_text_to_speech_button.qcld_floating_text_to_speech_loud img{
    background-color: rgb(16 176 145);
    animation: pulse 2s infinite;
}

.wp_button_text_to_speech-buttons.qcld_floating_text_to_speech_loud img,
.qcld_playbutton.qcld_floating_text_to_speech_loud img,
.wp_button_text_to_speech-button.qcld_floating_text_to_speech_loud img{

    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.3);
    }
    100% {
        transform: scale(1);
    }
}




button.qcld_floating_text_to_speech_button {
  position: relative;
  border: 0;
  margin: 40px auto;
  box-shadow: none;
  cursor: pointer;
  background-color: #00000036;
  width: 80px;
  height: 80px;
  border-radius: 0%;
  -webkit-backface-visibility: hidden;
  transform-origin: center;
  outline: none;
  display: flex;
  align-items: center;
  justify-content: center;
}
button.qcld_floating_text_to_speech_button:before, button.qcld_floating_text_to_speech_button:after {
  position: absolute;
  width: 100%;
  height: 100%;
  content: "";
  display: block;
  border-radius: 25%;
  top: 0;
  right: 0;
  transform: scale(0);
  transform-origin: center;
  -webkit-backface-visibility: hidden;
  z-index: -1;
  background-color: #00000036;
}
button.qcld_floating_text_to_speech_button:before {
  -webkit-animation: wave-animate 5s infinite ease-out;
          animation: wave-animate 5s infinite ease-out;
}
button.qcld_floating_text_to_speech_button:after {
  opacity: 0;
  -webkit-animation: wave-animate 5s 4.5s infinite ease-out;
          animation: wave-animate 5s 4.5s infinite ease-out;
}
button.qcld_floating_text_to_speech_button img {
  position: relative;
  z-index: 2;
  width: 60%;
  transform: rotate(0deg);
  transform-origin: center;
  fill: var(--secondaryColor);
}
button.qcld_floating_text_to_speech_button:focus {
  outline: none !important;
}
button.qcld_floating_text_to_speech_button.qcld_bounce {
  -webkit-animation: animation 1000ms linear both;
          animation: animation 1000ms linear both;
}
button.qcld_floating_text_to_speech_button.qcld_bounce img {
  -webkit-animation: rotate 500ms linear both;
          animation: rotate 500ms linear both;
}

.qcld_floating_text_to_speech_box .qcld_floating_text_to_speech_button {
    background-color: #00000036;
}
.qcld_floating_text_to_speech_box .qcld_floating_text_to_speech_button.qcld_floating_text_to_speech_loud {
    background-color: #d63638;
}
.qcld_floating_text_to_speech_box {
    width: 108px;
    height: 24px;
    line-height: 24px;
    border: none;
    border-radius: 0;
}
.qcld_floating_text_to_speech_box .qcld_floating_text_to_speech_button {
    border-radius: 15px;
    -webkit-border-radius: 15px;
    font-size: 13px;
        color: #970000;
    font-weight: bold;
}
.qcld_floating_text_to_speech_box .qcld_floating_text_to_speech_button.qcld_floating_text_to_speech_loud {
    background-color: #d63638;
    color: #fff;
}


.wp_button_text_to_speech_wrapper{
    background: #eee;
    padding: 20px;
    margin: 0 0 25px 0;
    border-right: 3px solid #0170b9;
    border-left: 3px solid #0170b9;
}
.wp_button_text_to_speech_wrapper .wp_button_text_to_speech-button {
    background: none;
    color: #0170b9;
    font-weight: bold;
    padding: 0;
    margin: 0;
}




@-webkit-keyframes rotate {
  100% {
    transform: rotate(-180deg);
  }
}

@keyframes rotate {
  100% {
    transform: rotate(-180deg);
  }
}
@-webkit-keyframes animation {
  0% {
    transform: matrix3d(0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  3.4% {
    transform: matrix3d(0.658, 0, 0, 0, 0, 0.703, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  4.7% {
    transform: matrix3d(0.725, 0, 0, 0, 0, 0.8, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  6.81% {
    transform: matrix3d(0.83, 0, 0, 0, 0, 0.946, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  9.41% {
    transform: matrix3d(0.942, 0, 0, 0, 0, 1.084, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  10.21% {
    transform: matrix3d(0.971, 0, 0, 0, 0, 1.113, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  13.61% {
    transform: matrix3d(1.062, 0, 0, 0, 0, 1.166, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  14.11% {
    transform: matrix3d(1.07, 0, 0, 0, 0, 1.165, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  17.52% {
    transform: matrix3d(1.104, 0, 0, 0, 0, 1.12, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  18.72% {
    transform: matrix3d(1.106, 0, 0, 0, 0, 1.094, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  21.32% {
    transform: matrix3d(1.098, 0, 0, 0, 0, 1.035, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  24.32% {
    transform: matrix3d(1.075, 0, 0, 0, 0, 0.98, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  25.23% {
    transform: matrix3d(1.067, 0, 0, 0, 0, 0.969, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  29.03% {
    transform: matrix3d(1.031, 0, 0, 0, 0, 0.948, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  29.93% {
    transform: matrix3d(1.024, 0, 0, 0, 0, 0.949, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  35.54% {
    transform: matrix3d(0.99, 0, 0, 0, 0, 0.981, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  36.74% {
    transform: matrix3d(0.986, 0, 0, 0, 0, 0.989, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  41.04% {
    transform: matrix3d(0.98, 0, 0, 0, 0, 1.011, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  44.44% {
    transform: matrix3d(0.983, 0, 0, 0, 0, 1.016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  52.15% {
    transform: matrix3d(0.996, 0, 0, 0, 0, 1.003, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  59.86% {
    transform: matrix3d(1.003, 0, 0, 0, 0, 0.995, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  63.26% {
    transform: matrix3d(1.004, 0, 0, 0, 0, 0.996, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  75.28% {
    transform: matrix3d(1.001, 0, 0, 0, 0, 1.002, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  85.49% {
    transform: matrix3d(0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  90.69% {
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  100% {
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
}
@keyframes animation {
  0% {
    transform: matrix3d(0.5, 0, 0, 0, 0, 0.5, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  3.4% {
    transform: matrix3d(0.658, 0, 0, 0, 0, 0.703, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  4.7% {
    transform: matrix3d(0.725, 0, 0, 0, 0, 0.8, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  6.81% {
    transform: matrix3d(0.83, 0, 0, 0, 0, 0.946, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  9.41% {
    transform: matrix3d(0.942, 0, 0, 0, 0, 1.084, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  10.21% {
    transform: matrix3d(0.971, 0, 0, 0, 0, 1.113, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  13.61% {
    transform: matrix3d(1.062, 0, 0, 0, 0, 1.166, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  14.11% {
    transform: matrix3d(1.07, 0, 0, 0, 0, 1.165, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  17.52% {
    transform: matrix3d(1.104, 0, 0, 0, 0, 1.12, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  18.72% {
    transform: matrix3d(1.106, 0, 0, 0, 0, 1.094, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  21.32% {
    transform: matrix3d(1.098, 0, 0, 0, 0, 1.035, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  24.32% {
    transform: matrix3d(1.075, 0, 0, 0, 0, 0.98, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  25.23% {
    transform: matrix3d(1.067, 0, 0, 0, 0, 0.969, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  29.03% {
    transform: matrix3d(1.031, 0, 0, 0, 0, 0.948, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  29.93% {
    transform: matrix3d(1.024, 0, 0, 0, 0, 0.949, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  35.54% {
    transform: matrix3d(0.99, 0, 0, 0, 0, 0.981, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  36.74% {
    transform: matrix3d(0.986, 0, 0, 0, 0, 0.989, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  41.04% {
    transform: matrix3d(0.98, 0, 0, 0, 0, 1.011, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  44.44% {
    transform: matrix3d(0.983, 0, 0, 0, 0, 1.016, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  52.15% {
    transform: matrix3d(0.996, 0, 0, 0, 0, 1.003, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  59.86% {
    transform: matrix3d(1.003, 0, 0, 0, 0, 0.995, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  63.26% {
    transform: matrix3d(1.004, 0, 0, 0, 0, 0.996, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  75.28% {
    transform: matrix3d(1.001, 0, 0, 0, 0, 1.002, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  85.49% {
    transform: matrix3d(0.999, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  90.69% {
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
  100% {
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
  }
}

@-webkit-keyframes wave-animate {
  0% {
    transform: scale(0);
    opacity: 1;
  }
  100% {
    transform: scale(2);
    opacity: 0;
  }
}
@keyframes wave-animate {
  0% {
    transform: scale(0);
    opacity: 1;
  }
  100% {
    transform: scale(1.6);
    opacity: 0;
  }
}



.qcld_floating_text_to_speech_box {
    right: 0;
    left: 0;
    margin: 0 auto;
    bottom: 60px !important;
    box-shadow: none;
}
.qcld_floating_text_to_speech_box .qcld_floating_text_to_speech_button.qcld_floating_text_to_speech_loud {
    font-size: 12px;
}
.qcld_floating_text_to_speech_box .qcld_floating_text_to_speech_button {
    font-size: 12px;
}

.qcld_floating_text_to_speech_box .qcld_floating_text_to_speech_button {
    background-color: #000000;
    color: #fff !important;
    border: 1px solid #fff;
}


.wp_button_text_to_speech_wrapper .wp_button_text_to_speech-button span {
    font-size: 13px;
}
.wp_button_text_to_speech_wrapper .wp_button_text_to_speech-button {
    position: absolute;
    top: -14px;
    background: #eee;
    left: 16px;
    padding: 4px 5px;
}
.wp_button_text_to_speech_wrapper {
    position: relative;
}