@charset "UTF-8";
xarticle {background-image:none;}
.borderbox-basis {max-width:70vw;}

.tipps-container {
	box-sizing: border-box;
	display:block;
	background-color: var(--background-color-1);
	box-shadow:var(--box-shadow);
	padding:.5em;
}
/*-------------------------------------------------------------------------------------------*/ 
/* Grid mit image und text                                                                   */
/*-------------------------------------------------------------------------------------------*/ 
.tipps-gridbox-container {
	box-sizing:border-box;
	background-color:var(--background-color-1);
	box-shadow:var(--box-shadow);
	display:grid;
	border:0em black solid; 
	grid-template-columns:12em auto;
	grid-template-rows: fit-content;
}
/*               grid-area:1 / 3 / span 2 / 3                                           */
/* The syntax is grid-row-start / grid-column-start / grid-row-end / grid-column-end.   */
.tipps-gridbox-container-item-1 {grid-area:1 / 1 / 1 / 1;border:0em green solid;margin:1em auto auto auto;}
.tipps-gridbox-container-item-1 img {width:10em;height:auto;border:0em black solid;}

.tipps-gridbox-container-item-2 {grid-area:1 / 2 / 1 / 2;padding:.5em;border:0em green solid;}
/*-------------------------------------------------------------------------------------------*/ 
/* Felexbox für images oder videos                                                           */
/*-------------------------------------------------------------------------------------------*/ 
.tipps-flexbox {
	border:0em red solid;
	box-sizing: border-box;
	display: flex;
	flex-wrap:wrap;
	justify-content:start;
	gap:1em;
}
.tipps-justify-content-center {justify-content:center;}
.tipps-flexbox.tipps-justify-content-1 {justify-content:center;}


.tipps-flexbox-items {
	box-sizing: border-box;
	background: transparent;
	flex-basis:auto;
	/*flex-basis: max-content;*/
	text-align: center;
}
.tipps-flexbox-items img {object-fit:cover;}
/*-------------------------------------------------------------------------------------------*/ 
/* block mit image oder video und text                                                        */
/*-------------------------------------------------------------------------------------------*/ 
.tipps-medien-block-1 {
	box-sizing: border-box;
	display:block;
	background-color: var(--background-color-1);
	box-shadow:var(--box-shadow-medien);
	box-shadow: 0.3em 0.3em 0.2em 0.2em rgba(0,0,0,0.7);
}
.tipps-medien-block-1 img {width:11em;height:auto;margin-bottom:-.4em;}
.tipps-medien-block-1 video {width:11em;height:auto;}

.tipps-medien-block-1-text {width:10.3em;font-weight:bold;padding:.3em .3em .3em .3em;background-color: var(--background-color-1);}
/*-------------------------------------------------------------------------------------------*/ 
/* Handy Querformat                                                                          */
/*-------------------------------------------------------------------------------------------*/ 
@media only screen and (min-width: 360px) and (max-width: 1024px) and (orientation:landscape) {}
/*-------------------------------------------------------------------------------------------*/ 
/* Handy Hochformat                                                                          */
/*-------------------------------------------------------------------------------------------*/ 
@media only screen and (min-width: 150px) and (max-width: 1024px) and (orientation:portrait) {
 	.borderbox-basis {max-width:100vw;text-align:center;}
	
	.tipps-flexbox {justify-content:center;}
 
	.tipps-gridbox-container-item-2 {padding:.8em;border:0em green solid;}
	.tipps-gridbox-container {display: flex;flex-wrap:wrap;justify-content:center;}
	
	.tipps-flexbox.tipps-justify-content-1 {justify-content:center;}
}