JSFiddle - React, Tailwind, and code Playground

HTML

<table width="930px" align="center" style="margin: -20px 0 20px 0;">
<tbody>
<tr>

<table width="930px" height="300px" style="background-repeat:no-repeat; margin-top:-10px;">
<tbody>
<tr>
<td align="center" valign="top">

<tr>
<td valign="top" align="center"> <a href="#" id="try-now-btn-text">
<div class="try-now-btn" align="center">
TRY NOW
</div>
</a>
</td>
</tr>

CSS

a div.try-now-btn {
    background-color:#7DC15C;
    border-radius:5px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    padding-top:15px;
    padding-bottom:10px;
    width:200px;
    border-bottom: 5px solid #6DA850;
    display:inline-block;
}

a div.try-now-btn:hover {
    background-color:#8BD666;
    border-radius:5px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    padding-top:15px;
    padding-bottom:10px;
    width:200px;
    border-bottom: 5px solid #6DA850;
}

a#try-now-btn-text {
    color:#fff;
    font:bold 22px 'Helvetica Neue',sans-serif;
    line-height:30px;
    text-decoration:none;
    margin:none;
}