.tour-header {
	container-name: artistSingleHeaderContainer;
	container-type: inline-size;
	_max-height: 600px;
	overflow: clip;
	_display: flex;
	width: auto;
	background-image: url(/files/gui/semmel_startscreen.png);
	  _height: auto;
	  background-position: center;
	  background-size: cover;
	  background-repeat: no-repeat;
}
.artwork.header img,
.artist.header img
{
	width:100%;
	height:auto;
}
@container artistSingleHeaderContainer ( min-width: 200px ) {
	.artwork.header{
		display:none;
	}
	.artist.header{
		display:flex;
	}
	
}

@container artistSingleHeaderContainer ( min-width: 600px ) {
	.artwork.header{
		display:flex;
	}
	.artist.header{
		display:none;
	}
}


/* ---------    Layout for Artist page and tour page with side Navigation --- */

.artist-sidebar.contentWrapper{
	container-name: artistSingleContentContainer;
	container-type: inline-size;
	display:grid;
	padding:30px;
	gap:2rem;
}
}


@container artistSingleContentContainer ( min-width: 200px ) {
	.artist.contentWrapper{
		grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
		grid-template-columns: 1fr;
	}
	.artist-headline{ grid-row: 1/2;}
	.artist-menue{ grid-row: 2/3; }
	.artist-description{ grid-row: 3/4; column-count:1;}
	.artist-feed {
		grid-row: 4/5;
	}
	.artist-tour {	grid-row: 5/6;}
	.artist-description-wrapper .artist.text {
		column-count:1;
		gap:3rem;
		_line-height:1.7em;
		
	}
	.colormode .artist-sidebar.boxed {
		margin-top: 2vh!important;
	}
}
@container artistSingleContentContainer ( min-width: 500px ) {

}

@container artistSingleContentContainer ( min-width: 700px ) {
	gap:2rem;
	.artist-sidebar.contentWrapper{
		grid-template-rows: 1fr 1fr 1fr 1fr 1fr ;
		grid-template-columns: 1fr 2fr;
		
	}
	.artist-headline{ 
		grid-row: 1/3;
	}
	.artist-description{ 
		grid-row: 2/3; 
		_grid-row: 2/4; 
	}
	.artist-tour {
		grid-row: 4/5;
	}
	.artist-tour_liste {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
		gap:1rem;
		_width: 100%;
		
	}	
	.artist-menue{ 
		grid-column: 2/3;
		grid-row: 1/2; 	
		width: 300px;
		
	}
	.artist-feed{ 
		grid-column: 2/3;
		grid-row: 2/6;
		display: flex;
	}

}
@container artistSingleContentContainer ( min-width: 1000px ) {
	.artist-description-wrapper .artist.text {
		column-count:2;
		gap:3rem;
		
	}
	.artist-description-wrapper .artist.text p{
		margin:0; padding:0;
		
	}
}


.artist.wrapper.colormode {
	container-name: colormodeContainer;
	container-type: inline-size;
}
@container colormodeContainer ( min-width: 200px ) {
	.colormode > .boxed {
		margin-top: 2vh!important;
		margin-bottom: 5vh!important;
	}
	.colormode > .message_box.boxed {
		margin-top:0px !important;
	}
}
@container colormodeContainer ( min-width: 1000px ) {
	.colormode .boxed {
		margin-top: 8vh!important;
	}
	.colormode .message_box.boxed {
		margin-top:0px !important;
	}
}