Не могу разобраться с z-index?

Question

[coi1751]

Столкнулся с применением z-index и поплыл.. В общем нужно сделать как на скрине У меня сейчас вот так .
Вот html

<div class="row text-center">
				<div class="col-xl-12">
					<div class="service-block service-block1 text-center">
						<img src="img/first_circle.png" alt="Фото" class="circle-item circle-item1">
						<img src="img/second_circle.png" alt="Фото" class="circle-item circle-item2">
						<img src="img/third-circle.png" alt="Фото" class="circle-item circle-item3">
						<h3 class="servie-block__title">
							Мечтаете о доме на Солнечном берегу?
						</h3>
						<p class="service-block__text service-block__text1">
							Или хотите выгодно инвестировать в  заграничную недвижимость? В любом случае - подходящий вариант уже ждет Вас! Большой выбор объектов жилой и коммерческой недвижимости и профессиональный сервис позволит провести сделку с удовольствием и получить нужный результат

						</p>

Вот ксс

#services {
	padding: 100px 0;
	background: url(../img/city.jpg) no-repeat top / cover;
}
.services-title {
	margin-bottom: 130px;
}
.service-block {
	width: 770px;
	background-color: #f4f4f4;
	margin: 0 auto;
	border-radius: 3px;
	box-shadow: 2px 2px 2px rgba(0,0,0,15%);
	padding-bottom: 45px;
}
.servie-block__title {
	font-size: 20px;
	margin-bottom: 14px;
	text-transform: uppercase;
}
.service-block__text1 {
	max-width: 685px;
	margin: 0 auto;
}
.service-block__text2 {
	max-width: 730px;
	margin: 0 auto;
}
.service-block1 {
	padding-top: 65px;
	margin-bottom: 8px;
	position: relative;
	z-index: 10;
}
.service-block2 {
	padding-top: 45px;
}
.circle-item {
	position: absolute;
}
.circle-item1 {
	top: -128px;
	left: 38%;
	z-index: 5;
}
.circle-item2 {
	top: -100px;
	z-index: 2;
}

.circle-item3 {

}

Помогайте))

Comments

[Сергей Горячев]

Пока не будет оформлен код на jsfiddle или codepen, надеюсь, никто не додумается помогать.

[Ankhena]

Рабочий код вот сюда: https://jsfiddle.net/

Answer 1

[Андрей]

Выньте картинки из service-block

Answer 2

[Ankhena]

https://jsfiddle.net/s88zmam8/