「公園に行く」赤いボタン

html

<div class="gobtn_wrapper">
<div class="gobtn">
<a href="https://maps.google.com/maps?saddr=現在地&daddr=<?php echo post_custom('緯度経度'); ?>" target="_blank" rel="noopener noreferrer">
<span>公園に<br />行く!</span></a>
</div>
</div>

css

.gobtn_wrapper{
width:120px;height:120px;
margin:20px auto;
text-align:center;
}
.gobtn{
width:100px;height:100px;
margin:10px auto;
background:#ff0c09;
border-radius:50px;
outline: solid 3px #ff0c09; 
outline-offset: 2px;
margin: 5px; 
text-align:center;
display: flex;
justify-content: center;
align-items: center;
}

.gobtn a:link{color:#ffffff;text-decoration:none;}
.gobtn a:visited{color:#ffffff;text-decoration:none;}
.gobtn a:hover{color:#FFFF00;text-decoration:none;}
.gobtn a:active{color:#ff8833;text-decoration:none;}