@charset "UTF-8";
/* CSS Document */

body{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: english-grotesque, sans-serif;
}

.section-1{
	display: flex;
	width: 100%;
	justify-content:space-between;
	aligne-items: flex-start;
	margin: 50px auto 0;
}
.imagebox{
	min-width:35%;
	align-selft: center;
	flex-grow: 5;
	
}
.picture{
	background-image: url("../images/Bild_mitten.png");
	background-size: contain;
	background-repeat: no-repeat;	
	max-width: 100%;
	padding-top: 89%;
}
.polygon-1{
	float: right;
	shape-outside: polygon(400px 0,0 700px, 400px 700px);
	height: 700px;
	width: 400px;
}
.polygon-2{
	float: left;
	shape-outside: polygon(0 0,0 700px, 400px 700px);
	height: 700px;
	width: 400px;
}
.text-1{
	padding-top:50px;
	align-self: flex-start;
	flex-shrink:1.3;
	transform:translateX(20%);
}
.text-2{
	padding-top: 50px;
	align-self: flex-start;
	flex-shrink: 1.3;
	transform:translateX(-20%);
}
.text{
	font-size: 35px;
}
.section-2{
	display: flex;
	width: 80%;
	justify-content: space-around;
	align-items: center;
	margin: -2% auto 50px;
}
.text-4{
	padding-left: 6%;
}
@media screen and (max-width: 1920px){
.text{
	font-size: 32px;
	line-height: 46px;	
	}
	.section-2{
		margin: -10% auto 50px;
	}
}
@media screen and (max-width: 1600px){
	.text{
	font-size: 30px;
	line-height: 40px;
	}
	.section-2{
	margin: -15% auto 50px;
	}
}
@media screen and (max-width: 1440px){
	.text{
	font-size: 28px;
	line-height: 40px;
	}
	.section-2{
	margin: -20% auto 50px;
	}
}
@media screen and (max-width: 1280px){
	.text{
	font-size: 24px;
	font-weight: 400;
	line-height: 36px;
	}
	.section-2{
	margin: -26% auto 50px;
	}
}
@media screen and (max-width: 1024px){
	.text{
	font-size: 24px;
	font-weight: 400;
	line-height: 32px;
	}
	.text-1{
		padding-top:0;
		transform: translateX(10%);
	}
	.imagebox{
		transform:translateX(-20%);
	}
	.text-2{
		padding-top:0px;
		transform:translateX(-50%);
	}
	.section-2{
	margin: -36% auto 50px;
	}
}
@media screen and (max-width: 900px){
	.text{
		font-weight: 300;
		line-height: 26px;
		letter-spacing: 1.8px;
	}
	.section-2{
	margin: -36% auto 50px;
	}
}
@media screen and (max-width: 768px){
	.text{
		letter-spacing:1.5px;
		line-height: 24px;
	}
}
@media screen and (max-width: 600px){
	.text{
		font-size: 13px;
		line-height: 18px;
	}
}
@media screen and (max-width: 414px){	
.text{
	font-size: 12px;
	}
}
@media screen and (max-width: 375px){
	.text{
		font-size: 10px;
		line-height: 15px;
	}
}
