Нет цвета при наведении

p {
  margin-top: -30px;
}

.ctc-txt.bg_ffffff.br6 {
  width: 642px;
  height: 200px;
}

.clr-txt {
  top: 160px;
}

.text-center.ct-case.mb10 {
  display: flex;
  align-items: right;
  justify-content: center;
  margin-top: -20px;
  margin-left: 120px;
}

.counter {
  margin-left: -14px;
}

#copyStr {
  margin-left: 260px;
  margin-top: -10px;
}

#text {
  top: -30px;
}

<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<link rel = "stylesheet" type = "text/css" href = "https://rawgit.com/Dieffer/test1/master/mycss.css">
<form method = "post" id = "text" action = "">
  <p class = "">
    Type or Paste your text here to change text case
  </p>
  <div class = "relative">
    <textarea class = "ctc-txt bg_ffffff br6" name = "form_content" id = "form_content" onclick = "cont()"> </textarea>
    <img class = "clr-txt" onclick = "resete()" src = "https://smallseotools.com/asets/images/cleartext.svg">
  </div>
  <div class = "col-lg-12 col-sm-12 pn pt5 pb5">
    <div class = "button_box h-a">
      <div class = "counter">
        <label>Character Count: <span id = "cc"> 0 </span></label>
        <label>- Word Count: <span id = "wc"> 0 </span></label>
      </div>
    </div>
  </div>
  <div class = "text-center ct-case mb10" id = "ctc_button_box">
    <input name = "toggle" class = "button ctc-btn br6" type = "button" id = "toggle" value = "tOGGLE cASE">
    <input name = "sentence" class = "button ctc-btn br6" type = "button" id = "sentence" value = "Sentence case">
    <input name = "lower" class = "button ctc-btn br6" type = "button" id = "lower" value = "lower case">
    <input name = "" class = "button ctc-btn br6" type = "button" id = "upper" value = "UPPER CASE">
    <input name = "capitalized" class = "button ctc-btn br6" type = "button" id = "capitalized" value = "Capitalize Word">
    <input name = "alternating" class = "button ctc-btn br6" type = "button" id = "alternating" value = "aLtErNaTe cAsE">
  </div>
</form>