@charset "utf-8";

@media screen and (max-width: 1420px) {
	.slogan h1 {font-size: 60px;}
	.equiplogo img {width: 250px;}
	#slideH, #slideS, #slideP {height: calc(100svh - 138px);}
	
}

@media screen and (max-width: 1320px) {
	.slogan h1 {font-size: 50px;}	
}

@media screen and (max-width: 1250px) {
	.flex-3 {flex-wrap: wrap;column-gap: 0;}
	.first { flex-basis: 100%;margin-bottom: 40px;}
	.second, .third {flex-basis: 50%;}
	.second img, .third img { width: 100%;}
	.section h2, #red h2 {font-size: 30px;}
	#slideH, #slideS, #slideP {height: calc(100svh - 171px);}
	
	.mobcontact {display: block;}
}

@media screen and (max-width: 850px) {
	.flex-2 {flex-direction: column;}
	.first2 {flex-basis: 100%;margin-bottom: 40px;}
	.second2, .secondy {width: 100%;}
	.grid-2 {grid-template-columns: repeat(1,1fr);}
}

@media screen and (max-width: 850px) {
	.welk {left: 25px;bottom: 19px;}
	.welk span {font-size: 24px;padding: 20px;}
	.equiplogo {bottom: 100px;right: 25px;}
	.equiplogo.home {bottom: 50px;}
	.voor {padding: 30px 10px;}
	.slogan {margin-left: 25px;}
	#slideH, #slideS, #slideP {height: calc(100svh - 169px);}
	.equiplogo img {width: 200px;}
	.slogan h1 {font-size: 40px;}
	body {font-size: 18px;}
	.autonoom {flex-direction: column;}
	.autoimg, .firsty, .opsom1 {margin-bottom: 40px;}
	.autoimg img {width: 400px;max-width: 100%;}
	.transparent {width: 100%;}
	#end {align-items: flex-end;}
	.offerte {top: auto;position: relative;margin-bottom: 30px;}
	.offerte.ontop {right: 25px;top: 25px;}
	.wat, .aantal, .icon {font-size: 24px;}
	.equipH4, .voor {font-size: 24px;}
	.cover img {height: auto;}
	.coverimg {height: 300px;}
	.section {padding: 40px 0;}
	.sdg li {display: block;}
	#end2 h4 {font-size: 40px;}
}

@media screen and (max-width: 640px) {
	.radius .text {padding:  25px;}
	.slogan h1 {font-size: 36px;}
	.slogan {margin-top: 0;}
	.wat, .aantal, .icon {font-size: 20px;}
	.welk {left: 0px;bottom: 0px;width: 100%;}
	.welk span {font-size: 20px;padding: 20px 0;width: 100%;text-align: center;display: block;}
	.equiplogo img {width: 150px;}
	.section h2, #red h2 {font-size: 24px;}
	#end, #end2 {height: auto;padding: 60px 0;}
	.equipH3 {font-size: 20px;}
	.offerte a {width: 150px;height: 150px;font-size: 20px;}
	.offerte.ontop a {width: 150px;height: 150px;font-size: 20px;}
}

@media screen and (max-width: 480px) {
	.equiplogo {bottom: 80px;}
	.equiplogo img {width: 125px;}
	.equiplogo.home {bottom: 25px;}
	#slideH, #slideS, #slideP {height: calc(100svh - 134px);}
	
}