Bootstrap Circle button with 3d shadow and hover effect


	<div class="container">
	<div class="row">
        <div class="col-md-12">
		    <button class="btn btn-default orange-circle-button" href="">Read<br>more<br><span class="orange-circle-greater-than">></span></button>
	
        </div>   
	</div>
</div>
	<script type="text/javascript">
	
	</script>

    body {
 font-size: 18px;   
}
.orange-circle-button {
	box-shadow: 2px 4px 0 2px rgba(0,0,0,0.1);
	border: .5em solid #E84D0E;
	font-size: 1em;
	line-height: 1.1em;
	color: #ffffff;
	background-color: #e84d0e;
	margin: auto;
	border-radius: 50%;
	height: 7em;
	width: 7em;
	position: relative;
}
.orange-circle-button:hover {
	color:#ffffff;
    background-color: #e84d0e;
	text-decoration: none;
	border-color: #ff7536;
	
}
.orange-circle-button:visited {
	color:#ffffff;
    background-color: #e84d0e;
	text-decoration: none;
	
}
.orange-circle-link-greater-than {
    font-size: 1em;
}