Как сверстать данную часть header?

<div class="box">
	<div class="search">
		<!-- icon code -->
	</div>
	<div class="heart-cart">
		<div class="heart">
			<!-- icon code -->
		</div>
		<hr/>
		<div class="cart">
			<!-- icon code -->
		</div>
	</div>
	<div class="menu">
		<!-- icon code -->
	</div>
</div>

а дальше стилями добавляете отступы, цвета и иконки