/* ======================
		Phone
========================= */

@media only screen and (min-width : 0) and (max-width : 600px)
{	
	.sticker, .claim span:nth-child(2), .scrollicon, .call	
					{	display: none; visibility: hidden; } 
	
	.motiv, #intro 	{	height: 100%; min-height: 360px; }
	.center 		{	width: 90%; margin: 0 5%; }
	
	article:first-child	{	flex: 0 100%; padding-right: 0; border-right-width: 0; margin-bottom: 2rem; }
	article:last-child	{	flex: 0 100%; padding-left:  0;  }
	
	a.sbox				{	flex: 1 100%; margin-bottom: 0.5rem; }
	.claim {bottom: 1rem;}

	@media only screen and (orientation : portrait)
	{		
		.teaser		{	flex: 1 1 100%; border-right-width: 0; } 
		.proof		{	flex: 1 1  30%; } 
		.partner	{	flex: 1 1 100%; border-right-width: 0; } 
		
		.full figure	{	width: calc(100% - 0.50rem); }
	}
	@media only screen and (orientation : landscape)
	{		
		.teaser		{	flex: 1 1 30%; } 	.teaser:nth-child(2n)	{	border-right-width: 0; }
		.proof		{	flex: 1 1 25%; }
		.partner	{	flex: 1 1 30%; }	.partner:nth-child(2n)	{	border-right-width: 0; }
		
		.full figure	{	width: calc(50% - 1.50rem); }
	}
}

/* ======================
		PAD
========================= */

@media only screen and (min-width : 601px) and (max-width : 1024px)
{	
	.call			{	display: none; visibility: hidden; } 

	.motiv, #intro 	{	height: 100%; }
	.center 		{	width: 90%; margin: 0 5%; }	

	a.sbox			{	flex: 0 48%; margin-bottom: 1.00rem; }

	@media only screen and (orientation : portrait)
	{		
		.teaser		{	flex: 1 1 30%; } 	.teaser:nth-child(2n)	{	border-right-width: 0; }
		.proof		{	flex: 1 1 25%; } 
		.partner	{	flex: 1 1 30%; } 	.partner:nth-child(2n)	{	border-right-width: 0; }
		
		.full figure	{	width: calc(33.33% - 1.50rem); }

	}
	@media only screen and (orientation : landscape)
	{		
		.teaser		{	flex: 1 1 20%; } 	.teaser:last-child	{	border-right-width: 0; } 
		.proof		{	flex: 1 1 10%; } 
		.partner	{	flex: 1 1 20%; } 	.partner:last-child	{	border-right-width: 0; }
	}
}

/* ======================
		DESKTOP
========================= */

@media only screen and (min-width : 1025px)
{		
	.motiv, #intro 	{	height: calc(61.8% + 80px); min-height: 700px; }				
	
	.brand			{	margin-left: 30px; }

	.center 		{	min-width: 800px; margin: 0 320px; }
	
		a.more		{	display: none; }
	
		.teaser		{	flex: 1 1 20%; } 	.teaser:last-child	{	border-right-width: 0; } 
		.proof		{	flex: 1 1 10%; }		
		.partner	{	flex: 1 1 20%; }	.partner:last-child	{	border-right-width: 0;} 
}

/* ======================
		THE END
========================= */