JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
		<ul class="counter">
			<li class="days">
                <span>99</span>
				<div class="devider"></div>
			</li>
			<li class="hours">
                <span>17</span>
				<div class="devider"></div>
			</li>
			<li class="minutes">
                <span>36</span>
				<div class="devider"></div>
			</li>
			<li class="seconds">
                <span>04</span>
				<div class="devider"></div>
			</li>
		</ul>
		<ul class="value">
			<li>Дней</li>
			<li>Часов</li>
			<li>Минут</li>
			<li>Секунд</li>
		</ul>
	</div>

CSS

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,700,800&subset=latin,cyrillic);
body{
	font-family: 'Open Sans', sans-serif;
	font-size: 13px;
	background: #282e3a;
	color: #6f7786;
}
.container{
	width: 410px;
	margin: 100px auto;
}
.devider{
	position: absolute;
	width: 76px;
	height: 1px;
	top: 50%;
	margin-top: -1px;
    z-index: 0;
}
.counter li > span {
    z-index: 1;
    position: relative;
}
ul.counter, ul.value{
	margin: 0;
	padding: 0;
}
ul.counter li{
	position: relative;
	display: inline-block;
	width: 76px;
	height: 82px;
	font: inherit;
	font-size: 40px;
	font-weight: 700;
	color: #fff;
	border: none;
	border-radius: 15px;
	line-height: 76px;
	list-style: none;
	margin-right: 30px;
	text-align: center;
	-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.25), inset 1px 1px rgba(255,255,255,.2);
	-moz-box-shadow: 1px 1px 1px rgba(0,0,0,.25), inset 1px 1px rgba(255,255,255,.2);
	box-shadow: 1px 1px 1px rgba(0,0,0,.25), inset 1px 1px rgba(255,255,255,.2);
}
ul.counter li:after, ul.counter li:before{
	position: absolute;
	display: inline-block;
	width: 1px;
	height: 11px;
	background: #fff;
	content: '';
	top: 50%;
	margin-top: -6px;
    z-index: 1;
}
ul.counter li:after {
    left: -1px;
}
ul.counter li:before {
    right: -1px;
}
ul.counter li:last-child, ul.value li:last-child{
	margin-right: 0;
}
li.days{
	background: #fa565a;
}
li.hours{
	background: #2dcb73;
}
li.minutes{
	background: #f6bc57;
}
li.seconds{
	background: #3c67b0;
}

li.days>.devider{
	background: #d44a4d;
}
li.hours>.devider{
	background: #15ae59;
}
li.minutes>.devider{
	background: #e4a333;
}
li.seconds>.devider{
	background: #2e589f;
}
ul.value{
	margin-top: 10px;
}
ul.value li{
	display: inline-block;
	width: 76px;
	margin-right: 30px;
	font: inherit;
	font-size: 12px;
	font-weight: 800;
	text-transform: uppercase;
	text-align: center;
}