@media screen and (max-width: 1200px)
{

	.navbar #special-center
	{
	display:none;
	}
	
	#how-it-works
	{
	background-size: 100% calc(100% - 215px);
	background-position: 0 215px;
	padding-bottom: 80px !important;
	}
	.mechanism-container > button
	{
	padding: 8px 50px;
	}
	.mechanism-container > p
	{
	max-width: 400px;
	}
	#trial-paragraph
	{
	margin: 5px 0 0;
	}
	#trial-btn
	{
	margin: 30px auto 0;
	padding: 5px 50px;
	height: 60px
	}
	#trial-link
	{
	margin: 10px auto 0;
	}
	.difference-img-row
	{
	gap: 30px;
	}
	.difference-img-row>img
	{
	width: 50%;
	}
}
@media screen and (min-width: 1200px) and (max-width: 1400px)
{
	#how-it-works
	{
	background-size: 100% calc(100% - 215px);
	background-position: 0 215px;
	padding-bottom: 100px !important;
	}
	.mechanism-container > button
	{
	padding: 8px 70px;
	}
	.mechanism-container > p
	{
	max-width: 430px;
	}
	.difference-img-row
	{
	gap: 30px;
	}
	.difference-img-row>img
	{
	width: 50%;
	}
}
@media screen and (min-width: 1400px) and (max-width: 1600px)
{
	#how-it-works
	{
	background-size: 100% calc(100% - 215px);
	background-position: 0 215px;
	padding-bottom: 100px !important;
	}
	.mechanism-container
	{
	width: 50%;
	max-width: 700px;
	max-height: 400px;
	}
	.mechanism-container > h4
	{
	margin: 0;
	font-size: 36px;
	font-weight: 700;
	line-height: 54px;
	letter-spacing: 0em;
	}

	.mechanism-container > p
	{
	margin: 20px 0 0;
	max-width: 528px;
	font-size: 24px;
	font-weight: 400;
	line-height: 36px;
	letter-spacing: 0em;
	text-align: center;
	}
	.mechanism-container > button
	{
	padding: 8px 100px;
	}
}
@media screen and (min-width: 1600px)
{
	#hero-heading
	{
	font-size: 54px;
	line-height: 81px;
	}
	#hero-paragraph
	{
	margin: 20px 0 0;
	font-size: 30px;
	line-height: 45px;
	}
	#hero-button
	{
	margin: 40px auto 0;
	padding: 13px 60px;
	font-size: 24px;
	line-height: 36px;
	}
	#hero-mcafee-logo
	{
	display: block;
	margin: 40px auto 0;
	}
	#benefits-heading
	{
	font-size: 48px;
	}
	.benefit-container
	{
	padding: 40px;
	}
	.benefit-container>h3
	{
	margin: 31px 0 0;
	font-size: 36px;
	line-height: 54px;
	}
	.benefit-container>p
	{
	margin: 20px 0 0;
	font-size: 24px;
	line-height: 36px;
	}
	.benefit-container>button
	{
	margin: 40px 0 0;
	font-size: 28px;
	line-height: 42px;
	}
	#difference-heading,
	#mechanism-heading
	{
	margin: 180px auto 0;
	font-size: 48px;
	}
	#difference-paragraph
	{
	margin: 20px auto 0;
	font-size: 24px;
	line-height: 36px;
	}
	.mechanism-container > h3
	{
	font-size: 36px;
	line-height: 54px;
	}
	.mechanism-container > p
	{
	margin: 20px 0 0;
	font-size: 24px;
	line-height: 36px;

	}
	.mechanism-container > button
	{
	margin: 20px 0 0;
	padding: 8px 121px;
	font-size: 20px;
	}
	#trial-heading
	{
	font-size: 48px;
	line-height: 72px;
	}

	#trial-paragraph
	{
	font-size: 24px;
	line-height: 36px;
	}

	#trial-btn
	{
	margin: 52px auto 0;
	height: 72px;
	padding: 13px 60px;
	font-size: 24px;
	}

	#trial-link
	{
	margin: 20px auto 0;
	font-size: 24px;
	line-height: 36px;
	}
}



@media (min-width: 768px) {

	.container, .container-lg, .container-md, .container-sm, .container-xl
	{
	max-width:84%;
	}

}

@media (min-width: 992px) {

	.container, .container-lg, .container-md, .container-sm, .container-xl
	{
	max-width:86%;
	}

}

@media (min-width: 1200px) {

	.container, .container-lg, .container-md, .container-sm, .container-xl
	{
	max-width:100%;
	}

}