[Zipper09]

рони,

<section id="seven">
	<div class="col-lg-3 col-sm-6">
		<div class="team team-f" id="trigger-f">
			<div class="team__img">
				<img src="img/workess.png">
			</div>
				<div class="descr descr-f">
					<p>Monetization first mover advantage iPad. Interaction design buzz handshake. Stealth agile development <br> branding. Backing facebook hackathon conversion startup scrum project niche market business-to-consumer <br>paradigm shift traction. Rockstar bandwidth twitter ownership success disruptive series A financing user<br> experience buyer client social proof validation hypotheses. User experience crowdfunding facebook seed round <br>A/B testing mass market. </p>
				</div>
		</div>
	</div>

	<div class="col-lg-3 col-sm-6">
		<div class="team team-s" id="trigger-s">
			<div class="team__img">
				<img src="img/workess.png">
			</div>
				<div class="descr descr-s">
					<p>Monetization first mover advantage iPad. Interaction design buzz handshake. Stealth agile development <br> branding. Backing facebook hackathon conversion startup scrum project niche market business-to-consumer <br>paradigm shift traction. Rockstar bandwidth twitter ownership success disruptive series A financing user<br> experience buyer client social proof validation hypotheses. User experience crowdfunding facebook seed round <br>A/B testing mass market. </p>
				</div>
		</div>
	</div>

	<div class="col-lg-3 col-sm-6">
		<div class="team team-l" id="trigger-l">
			<div class="team__img">
				<img src="img/workess.png">
			</div>
				<div class="descr descr-l">
					<p>Monetization first mover advantage iPad. Interaction design buzz handshake. Stealth agile development <br> branding. Backing facebook hackathon conversion startup scrum project niche market business-to-consumer <br>paradigm shift traction. Rockstar bandwidth twitter ownership success disruptive series A financing user<br> experience buyer client social proof validation hypotheses. User experience crowdfunding facebook seed round <br>A/B testing mass market. </p>
				</div>
		</div>
	</div>

	<div class="col-lg-3 col-sm-6">
		<div class="team team-f" id="trigger-f">
			<div class="team__img">
				<img src="img/workess.png">
			</div>
				<div class="descr descr-f">
					<p>Monetization first mover advantage iPad. Interaction design buzz handshake. Stealth agile development <br> branding. Backing facebook hackathon conversion startup scrum project niche market business-to-consumer <br>paradigm shift traction. Rockstar bandwidth twitter ownership success disruptive series A financing user<br> experience buyer client social proof validation hypotheses. User experience crowdfunding facebook seed round <br>A/B testing mass market. </p>
				</div>
		</div>
	</div>
</section>

<section id="eight">
	<div class="heading">
		<h2>Testimonials</h2>
		<h6>We understand your requirement and provide quality works</h6>
	</div>
</section>
<section id="nine">
	<div class="heading">
		<h2>Testimonials</h2>
		<h6>We understand your requirement and provide quality works</h6>
	</div>
</section>
<section id="ten">
	<div class="heading">
		<h2>Testimonials</h2>
		<h6>We understand your requirement and provide quality works</h6>
	</div>
</section>

#seven {
	background-color: #f7f7f7;
	max-height: 100%;
    padding-bottom: 40px;
}
.team {
	text-align: center;
	background: white;
	box-shadow: 0px 3px 0px 0px #FC5F45;
	position:relative;
	display: block;
	cursor: pointer;
}
.descr{
	display: none;
	position:absolute;
    background:#FFFFFF;
    height:auto;
    margin-top: 40px;
    padding: 50px 80px 20px 60px;
}
#eight{
	position: relative;
}

Получается в блоке четыре картинки. у всех у них есть дополнительный див, который открывается только после нажатие на картинку и скрывается опять при нажатие. я хочу что бы все последующие блоки сдвигались вниз как только я нажму на одну из картинок и потом обратно на место становились.