:root{
	--boxGap: 40px;
	--boxGapBottom: 40px;
}


.box_wrapper{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.box{
	position: relative;
	background-color: #f7f7f7;
	-webkit-box-shadow:  0px 0px 13px 0px rgba(120,120,120,0.2);
	-moz-box-shadow:  0px 0px 13px 0px rgba(120,120,120,0.2);
	box-shadow:  0px 0px 13px 0px rgba(120,120,120,0.2); 
	
	transition: .8s;
	-webkit-border-bottom-right-radius: 30px;
-moz-border-radius-bottomright: 30px;
border-bottom-right-radius: 30px;
}

.box:hover{
	background-color: var(--gelb);
/*	background: linear-gradient(0deg, rgba(245,177,62,1) 0%, rgba(255,183,65,1) 100%); */
	cursor: pointer;
	color:#fff!important;

}

.box p{
	transition: .9s;

}
.box:hover p{
/*	color:#fff!important;*/

}


.box.w1_4{
	width:calc(25% - 12px); 
	margin-bottom: 24px;
	padding: 20px;
}

.box.w1_3{
	width:calc(33.332% - 12px);
	margin-bottom: 24px;
	padding: 20px;
}

.box.w1_2{
	width:calc(50%  - 12px); 
	margin-bottom: 24px;
	padding: 20px;
}

.box.w2_3{
	width:calc(66.662% - 12px);
	margin-bottom: 24px;
	padding: 20px;
}

.box.w1_1{
	width:calc(100% - 12px); 
	margin-bottom: 24px;
	padding: 20px;
}


.box.h_1{}
.box.h_2{}
.box.h_3{}


.box .text {
	margin-top: 15px;
}


.box .text h3{
	color: var(--blau);
	font-weight: 500;
}


.pfeil{
	opacity: 0;
	transition: .6s;
	border: 2px solid #fff;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%; 
	position: absolute;
	right: 14px;
	bottom: 16px;
	width: 40px;
	height: 40px;
	background-image: url('./pfeil.svg');
	background-size: 70%;
	background-position: center;
	background-repeat: no-repeat;	
}

.box:hover .pfeil{
	opacity: 1;
}

/*Die Eigenarten der einzelnen Grid-Variationen */

.th3_gap{
	margin: 20px;
}

@media screen and (max-width: 1025px) {
	.box.w1_4, .box.w1_3,	.box.w1_2,	.box.w2_3, .box.w1_1{	width: calc(50% - 6px); }
}
@media screen and (max-width: 768px) {
	.box.w1_4,	.box.w1_3,	.box.w1_2,	.box.w2_3,	.box.w1_1{ width: 100%;	}
}