arrow transparent

HTML

<ul>
    <li>
        <a href="" class="arrow">текст</a>        
    </li>
    <li>
        <a href="" class="arrow"> текс-текст</a>        
    </li>
    <li>
        <a href="" class="arrow">текс-текст текст</a>        
    </li>    
</ul>

<img src="http://i7.pixs.ru/storage/2/7/2/linkactive_6211644_10641272.png" alt="">

CSS

body {
    background: #575572;
} 
li {
    border-radius: 23px;
    border: 2px solid #a38b84;
    margin: 0 5px 5px;
    font-size: 22px;
    line-height: 1;
    padding: 9px 25px 10px;
    display: inline-block;
    position: relative;
  }
a {
    color: #dcb598;
    text-decoration: none;
}