@media (max-width: 1200px) 
{
	header
	{
		padding-bottom: 380px;
	}
	.headerIntro 
	{
		flex-direction: column;
		height: auto;
		position: static;
		transform: none;
		max-width: 100%;
		border-bottom-width: 3px;
	}

	.headerIntroSection 
	{
		flex: none;
		width: 100%;
		padding: 15px;
	}

	.headerIntroSection img 
	{
		width: 100%;
		height: 180px;
		object-fit: cover;
	}
	.headerIntroSection:nth-child(1) 
	{
		border-right: none;
	}
	.headerIntroSection:nth-child(2) 
	{
		flex-direction: column;
		text-align: center;
		padding: 20px 10px;
	}

	.headerIntroSection h2 
	{
		font-size: 3.2rem;
	}

	.headerIntroSection h3 
	{
		font-size: 2rem;
	}
	
	/*--- whatWeDo ---*/
	.divider
	{
		margin: 40px auto;
	}
	.whatInfo 
	{
		width: 100%;
		flex-direction: column;
		height: auto;
	}
	.whatInfoText
	{
		padding: 12px;
	}
	.whatInfo.right .whatInfoText
	{
		padding: 12px;
	}
	.whatInfoText h2
	{
		font-size: 4rem;
	}
	.whatButton
	{
		margin: 60px auto;
		
	}
	.whatInfoBullets
	{
		font-size: 1.4rem;
	}
	.whatInfoImage
	{
		max-width: 100%;
		margin-top: 40px;
	}
	.whyInfoWrap
	{
		flex-direction: column;
	}
	.whyHeadlines
	{
		max-width: 100%;
	}
	.whyInfo
	{
		max-width: 100%;
	}
	.exampleWrap
	{
		flex-direction: column;
		padding: 12px;
	}
}