.stellen{
	display: grid;
	grid-template-columns: 1fr auto auto auto auto;
	gap: 0 90px;
	font-size: 16px;
	color: var(--wp--preset--color--primary-950);
	text-wrap: balance;

	.item{
		grid-column: span 5;
		display: grid;
		grid-template-columns: subgrid;
		align-items: center;
		padding: 10px 0;
		border-bottom: 1px solid var(--wp--preset--color--gray-200);
	}

	.name{
		font-weight: 700;
	}

	.button{
		white-space: nowrap;
		display: inline-flex;
		padding: 8px 16px;
		background: var(--wp--preset--color--gray-50);
		border: 0;
		font-size: 16px;
		color: var(--wp--preset--color--primary-950);
		text-decoration: none;
	}

	@media (max-width: 1199px){
		grid-template-columns: 1fr auto auto auto;
		gap: 0 60px;

		.item{
			grid-column: span 4;
		}

		.name, .info_1, .file{
			grid-row: span 2;
		}
		.info_2{
			grid-area: 1 / 3 / 2 / 4;
			align-self: end;
		}
		.info_3{
			grid-area: 2 / 3 / 3 / 4;
			align-self: start;
		}
	}

	@media (max-width: 991px){
		grid-template-columns: 1fr auto auto;
		gap: 0 40px;

		.item{
			grid-column: span 3;
		}

		.name, .file{
			grid-row: span 3;
		}
		.info_1{
			grid-area: 1 / 2 / 2 / 3;
			align-self: end;
		}
		.info_2{
			grid-area: 2 / 2 / 3 / 3;
			align-self: end;
		}
		.info_3{
			grid-area: 3 / 2 / 4 / 3;
			align-self: start;
		}
	}

	@media (max-width: 767px){
		grid-template-columns: 1fr auto;

		.item{
			grid-column: span 2;
		}

		.file{
			grid-row: span 4;
		}
		.name{
			grid-area: 1 / 1 / 2 / 2;
			align-self: end;
		}
		.info_1{
			grid-area: 2 / 1 / 3 / 2;
			align-self: end;
		}
		.info_2{
			grid-area: 3 / 1 / 4 / 2;
			align-self: end;
		}
		.info_3{
			grid-area: 4 / 1 / 5 / 2;
			align-self: start;
		}
	}

	@media (max-width: 575px){
		display: flex;
		flex-direction: column;

		.button{
			margin: 10px 0 0;
		}
	}
}

.has-gray-50-background-color .stellen .button{
	background: #fff;
	border: 1px solid var(--wp--preset--color--gray-200);
}