Posicionamento de elementos

Front-end CSS
#1

Boa tarde galera, fiz o curso de HTML e CSS na Alura, e agora estou pegando alguns templates na internet e tentando implementar. Tenho o seguinte layout, mas nesta parte travei, ja fiz de diversas formas e nao cheguei no resultado final. Alguém me dá uma luz de como fazer isso

<section class="contact container">
	
	<div>
		<div><img class="img-contact" src="img/tel.png"></div>
		
		<p>+12 3456-78900</p>
		<p>+12 3456-78900</p>
	</div>
	<div>
		<div><img class="img-contact" src="img/email.png"></div>
		
		<p>osti.rdp@gmail.com</p>
		<p>osti.rdp@gmail.com</p>
	</div>
	<div>
		<div><img class="img-contact" src="img/website.png"></div>
		
		<p>cleitonosti.com</p>
		<p>cleitonosti.com</p>
	</div>
	<div>
		<div><img class="img-contact" src="img/address.png"></div>
		
		<p>
			123, Main Street, </br>Your City, New York 789456
		</p>
	</div>
</section>

CSS

.contact {
	background-color: #076cb5;

	text-align: center;
}

.contact > div {
	display: inline-block;

	width: 260px;
	height: 139px;
}

.contact > div div {
	width: 72px;
	height: 72px;

	border-radius: 50%;
	margin: 0 auto;
	background-color: #1384d6;
}

Untitled-1.png1280×250 127 KB

#2

O que você quer fazer ?? Cleiton ??

#3

Eu tenho o header, logo abaixo vem uma section de contato. Onde tenho esses 4 circulos com uma imagem dentro, e a info embaixo centralizada. Porém tentei de várias formas e não consegui desenvolver.

#4

Boa noite, Cleiton_Osti,
Disposições de div em tela fica pelo CSS. Tente usar essas propriedades no link, lembrando que o CSS respeita uma ordem hierárquica.

Link para ajuda:
http://pt-br.learnlayout.com/position.html