JSFiddle - React, Tailwind, and code Playground

HTML

<div class="telefon">
    	<p>RĂĽckrufservice</p>
    </div>

CSS

.telefon {
	width:276px;
	height:30px;
	background-color:#65140a;
	background: -webkit-linear-gradient(top, rgba(120,47,38,0.5) 0%, rgba(103,21,10,1) 40%);
	background: -moz-linear-gradient(top, rgba(120,47,38,0.5) 0%, rgba(103,21,10,1) 40%);
	background: -0-linear-gradient(top, rgba(120,47,38,0.5) 0%, rgba(103,21,10,1) 40%);
	background: linear-gradient(top, rgba(120,47,38,0.5) 0%, rgba(103,21,10,1) 40%);
	border-radius:7px;
}

.telefon p:before {
	content: url(http://fs1.directupload.net/images/141207/n8hwqs9w.png);
	position: absolute;
	margin-top: -20px;
	margin-left: -68px;
	border-radius: 77%;
	background-image: linear-gradient(133deg, white 0%, black 50%); 
	padding: .6em;
}

.telefon p {
	color:#b6c3d0;
	font-weight:bold;
	font-size:.85em;
	letter-spacing:2px;
	display:block;
	padding:8px 0 8px 7em;
	text-transform:uppercase;
}