/* ===================================
   Case study: infographics shown on an iPad over a background image. Script: script.js.
=================================== */

.infographics_items {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 14% 30px 12%;
	position: relative;
}
.infographics_items .bg_image {
	position: absolute;
	left: 0;
	top: 0;
}
.infographics_items .infographics_item img {
	display: block;
}

.infographics_items .infographics_item_cont {
	max-width: 948px;
	position: relative;
}

.infographics_items .infographics_item.others {
	position: absolute;
	top: 0;
	left: 0;
}
.infographics_items .infographics_item {
	opacity: 0;
	transition: 0.3s var(--ease-in-out);
	transition-property: opacity;
}
.infographics_items .infographics_item.active {
	opacity: 1;
}

.section_work_infographics.cnl-vb .infographics_items .infographics_item_cont {
	max-width: 724px;
	position: relative;
	margin-left: 4.4%;
	margin-top: -13%;
	width: 55%;
}
@media only screen and (max-width: 1438px) {
	.section_work_infographics.cnl-vb .infographics_items .infographics_item_cont {
		width: 55%;
	}
}

@media only screen and (max-width: 1024px) {
	.section_work_social_media .social_media_items {
		padding: 150px 0 80px;
		gap: 10px;
	}

	.section_work_social_media .social_media_items .social_media_item {
		width: 28%;
	}
	.section_work_infographics.cnl-vb .infographics_items .infographics_item_cont {
		width: 47.2vw;
		margin-left: 4.5%;
	}
}
@media only screen and (max-width: 800px) {
	.section_work_infographics.cnl-vb .infographics_items .infographics_item_cont {
		width: 46vw;
		margin-left: 3.8vw;
	}
}
@media only screen and (max-width: 768px) {
	.section_work_infographics.cnl-vb .infographics_items .infographics_item_cont {
		width: 45.8vw;
	}
}
@media only screen and (max-width: 650px) {
	.section_work_infographics.cnl-vb .infographics_items .infographics_item_cont {
		width: 44.8vw;
		margin-top: -13.5%;
	}
}
@media only screen and (max-width: 480px) {
	.section_work_infographics.cnl-vb .infographics_items .infographics_item_cont {
		width: 48vw;
		margin-left: 3.9vw;
		margin-top: -14%;
	}
}
