@media only screen and (max-device-width: 1024px){
	.parallaxContainer 													{background-attachment: scroll; background-position: center top;}
}

@media screen and (max-width: 1280px){
	.partSlider .headerContainer .h1												{font-size: 50px;}
}	

@media screen and (max-width: 1279px){
	.partNavigation.horizontal ul.level-0 > li a {font-size: 15px;}
	.partNavigation.horizontal ul.level-0 > li {margin-right: 25px;}
	#logo 																{width: 180px;}
}	

@media screen and (max-width: 1023px){
	.navigation.basicContainer 													{height: 70px;}
	.stickyScroll, .stickyScrollGhost									{height: 100px;}

	.navigation.basicContainer .partButton {margin-right: 20px;}
	

	.partNavigation.horizontal, #sideMenuLeft 								{display: none;}
	#mobileMenuToggle													{display: flex;}

	#sideMenuContent 													{padding:30px 0px 10px 0px; max-width: 700px;}
	.sideMenuContainer #sideMenuContainer, #sideMenuContent 			{display: block;}

	.whiteContainer, .greyContainer, .colorContainer, footer 			{padding-top: 40px; padding-bottom: 10px;}
	
	h1, .partSlider .headerContainer .h1							{font-size: 40px;}
	.headerContainer .h1 												{font-size: 26px;}

	h2																	{font-size: 26px;}
	.partContentText p, .partContentText ul, .partContentText ol, .partContentText table, .partButton {font-size: 16px;}

	.flexContainerColumns4 .flexItem									{width: calc(50% - 30px);}
	.flexContainerColumns3 .flexItem									{width: calc(50% - 30px);}

	#blogs .basicContainer 	{flex-direction: column;}
		.blogListLeftContainer   {width: 100%; order:2;}
		.blogListRightContainer {order: 1; width: 100%; padding-left: 0px;}

	.navigation.basicContainer .partButton {margin-right: 20px;}

	.flexContainer {padding-top: 0px;}

	.parallaxContainerTop {
	    background-position: top 100px center;
	}
}

@media screen and (max-width: 767px){
	.whiteContainer, .greyContainer, .colorContainer, footer 			{padding: 30px 0px 10px 0px;}
	#blogs, #homeBlogs 													{padding: 30px 0px 0px 0px;}

	h1, .partSlider .headerContainer .h1							{font-size: 30px;}
	h2, #mailTelContainer li a											{font-size: 22px;}

	/* footer */
	footer .basicContainer 												{display: block;}
		.footerColumn  														{width: auto;}
		.footerColumnLeft, .footerColumnRight 								{text-align: center; padding:0px;}

		.footerColumn .socialContainer 									{justify-content: center; margin-bottom: 30px;}

	#usp .partContentFileImageGallery 								{width: 40px; height: 40px;}
}

@media screen and (max-width: 667px){
	#topBarSmall .socialContainer  									{display: none;}

	.oneSecondColumn.flexItem  										{display: block;}
		.oneSecondColumn 												{width: 100%;}

	.parallaxContainerTop 											{padding-top: 0px; height: 200px; background-position: center center; background-attachment: scroll; background-size: cover;}
	.parallaxContainerMiddle 										{padding-top: 0px; height: 300px;}

	.socialShareLabel 												{display: block; width: 100%;}	

	.headerContainer .titleContainer {max-width: 300px;}
	.partSlider .headerContainer .h1 							{font-size: 22px; border-width: 3px; line-height: 1.8em;}

	.flexContainerColumns4 .flexItem								{width: calc(100% - 30px);}
	.flexContainerColumns3 .flexItem								{width: calc(100% - 30px);}
	.flexContainerColumns2 .flexItem								{width: calc(100% - 30px);}

	.blogListRightContainer #tagList {display: none;}
	.partSearchBar {margin-bottom: 0px;}

	.navigation.basicContainer .partButton {display: none;}

	#topBarSmallPhoneEmail a:last-child {display: none;}

	#diensten .flexItem .partContentText {display: none;}
}

@media screen and (max-width: 340px){
	h2, #mailTelContainer li a {font-size: 18px;}
}