JSFiddle - React, Tailwind, and code Playground

HTML

<div id="contact">

  <div class="contact_Me">
    <div id="contact_Phone3_Wrapper_mb">
        <a href="tel:+xxxxxxxxxxx">
          <h3 class="contact_Me_Line_mb">
              <div class="contact_Box_Svg_1_mb">
                  <svg version="1.1" id="phone" xmlns="http://www.w3.org/2000/svg"                   xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
                       width="15px" height="15px" viewBox="0 0 15 15" enable-background="new 0 0 15 15" xml:space="preserve">
                  <path id="call" opacity="0.4" fill="#444444" d="M12.965,0.042H2.994c-0.61,0-1.108,0.499-1.108,1.108v12.741
                      c0,0.609,0.499,1.108,1.108,1.108h9.971c0.61,0,1.11-0.499,1.11-1.108V1.15C14.073,0.541,13.575,0.042,12.965,0.042 M7.979,14.818
                      c-0.359,0-0.65-0.291-0.65-0.65c0-0.357,0.292-0.65,0.65-0.65c0.36,0,0.651,0.293,0.651,0.65
                      C8.631,14.527,8.339,14.818,7.979,14.818 M12.411,13.337H3.563H3.548V1.704h8.863V13.337z"/>
                  </svg>
              </div>
              <span class="contact_Small_Caps_mb">call:</span>
              <span id="contact_Phone_mb">+XX XXX XXX XX XX</span>
          </h3>
        </a>
    </div>

</div>

CSS

#contact_mb {
    width: 100%;
    height: 1000px;
    background: white;
    margin-top: 30em;
    padding-top: 2em;
    background: #e7e7e7;
}


#contact_Phone3_Wrapper_mb {
      display: block;
      margin: 0 auto;
      width: 90%;
      height: 60px;
      margin-bottom: .3em;
      background-color: rgba(249,249,249,.3);
      border: 1px solid #e2e2e2;
  }

#contact_Phone3_Wrapper_mb:active {
      background-color: yellow;
  }

#contact_Phone3_Wrapper_mb:active h3, #contact_Phone3_Wrapper_mb:active .contact_Small_Caps_mb {
      color: #262626;
  }

  #contact_Phone3_Wrapper_mb:active #call {
      fill: #262626;
      opacity: 1;
  }

    .contact_Me_Line_mb {
        color: rgba(68,68,68,.4);
        text-align: left;
        line-height: 1em;
        padding-left: 0em;
    }
    
.contact_Box_Svg_1_mb {
          float: left;
          width: 15px;
          height: 15px;
          margin-top: 4px;
          margin-left: 14px;
          margin-right: 12px;
        }

    .contact_Small_Caps_mb {
        font-variant: small-caps;
        font-family: times;
        font-size: .8em;
        margin-right: 4px;
        color: rgba(68,68,68,.2);
    }

    #contact_Phone_mb {
        font-family: arial;
        font-size: .7em;
    }