JSFiddle - React, Tailwind, and code Playground

HTML

<div class="menu_box">
		<div class="cell">
			<div class="line">
				<div class="marker"></div>
				<span>Lorem ipsum</span>
			</div>
			<div class="downmenu">
				
			</div>
		</div>
		<div class="cell">
			<div class="line">
				<div class="marker"></div>
				<span>Donec tincidunt laoreet</span>
			</div>
		</div>
	</div>

CSS

.menu_box {
	font-family: Oswald;
	width: 250px;
	margin:20px;
	background: #f3f3f3;
	border:1px solid #dfdfdf;
	border-bottom: none;
	font-weight: 300;
}

.marker {
	position: absolute;
	width: 8px;
	height: 8px;
	float: left;
	margin: 14px;
	background: #8f8f8f;
}

.cell .line span {
	text-transform: uppercase;
	display: block;
	position: relative;
	padding-top: 7px;
	padding-bottom: 7px;
	margin-left: 30px;
}

.cell {
	border-bottom:1px solid #dfdfdf;
	cursor: pointer;
	color: 
}

.line:hover {
    color: #29c5e6;
}

.line:hover .marker {
    background:#29c5e6;
}