How to achieve text shadow like this?

Question

I wanted to get a shadow under a text as in attached pic. In attached we can see a shadow under a text "website". I tried using below code but unsuccessful. Any help will be highly appreciated.

#testbtn {
  display: block;
  color: #000000;
  font-weight: bold;
  text-align: center;
  margin: 0 auto;
  border: 1px solid #0098DB;
  padding: 8px 8px;
  background: #575857;
  max-width: 200px;
  border-radius: 10px;
}

.trying {
  color: white;
  content: "";
  box-shadow: 5px 5px 5px black;
  text-transform: rotateX(70deg);
}

<a id="testbtn"><span class="trying">Test</span></a>

Answer 1

I agree with @natureminded. I don't think text-transform would be best to achieve this result. I was drafting up this example after they posted their answer, but it follows the same thought process

#testbtn {
  position: relative;
  display: block;
  color: #000000;
  font-weight: bold;
  text-align: center;
  margin: 0 auto;
  border: 1px solid #0098DB;
  padding: 8px 8px; 
  background:#575857;
  max-width: 200px;
  border-radius: 10px;
  z-index: -3;
}

.trying{
  position: relative;
  color:white;
} 

.trying:before{
  content:"";
  position: absolute;
  width: 100%;
  left: 6px;
  top: 7px;
  height: 110%;
  background-color:rgba(0,0,0, .5);
  transform: skew(35deg);
  z-index:-1;
}

<a id="testbtn"><span class="trying">Test</span></a>