/* DEFAULTS */

* {
	font-family:
	/* 1 / -apple-system, BlinkMacSystemFont,
	/ 2 / "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans",
	/ 3 */ "Helvetica Neue", sans-serif;
}

/* GRIDS */

body {
	margin: 10px auto;
	max-width: 60em;
	color: #333333;
	display: grid;
	grid-template-columns: 1fr;
}
article-box {
		display: grid;
		grid-template-columns: 1fr;
}
header {
	grid-row: 1 / 2;
}
zert {				
	grid-row: 2 / 3;
}
menue1 {				
	grid-row: 3 / 4;
}
menue2 {				
	grid-row: 4 / 5;
}
category, footer {
	grid-column: 1 / 2;
}
article-span-col, article-box, article-span-box {
	grid-column: 1 / 2;
}


@media only screen and (min-width: 39em) {
	body {
		grid-template-columns: repeat(2, 1fr);			
	}
	article-box {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
	}
	category, footer {
		grid-column: 1 / 3;
	}
	article-span-col, article-box, article-span-box {
		grid-column: 1 / 3;
	}				
	header {
		grid-row: 1 / 4;
	}
	zert {
		grid-column-start: 2;
		grid-column-end: 3;				
		grid-row-start: 1;				
		grid-row-end: 2;
	}
			
	menue1 {
		grid-column-start: 2;
		grid-column-end: 3;				
		grid-row-start: 2;				
		grid-row-end: 3;
	}
	menue2 {
		grid-column-start: 2;
		grid-column-end: 3;
		grid-row-start: 3;				
		grid-row-end: 4;				
	}	
}

@media only screen and (min-width: 57em) {
	body {
		grid-template-columns: repeat(3, 1fr);			
	}
	article-box {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
	}
	category, footer {
		grid-column: 1 / 4;
	}
	article-span-col, article-box, article-span-box {
		grid-column: 1 / 4;
	}			
	header {
		grid-row: 1 / 4;
	}
			
	zert {
		grid-column-start: 2;
		grid-column-end: 3;				
		grid-row-start: 2;				
		grid-row-end: 3;
	}
			
	menue1 {
		grid-column-start: 2;
		grid-column-end: 3;				
		grid-row-start: 3;				
		grid-row-end: 4;
	}
	menue2 {
		grid-column-start: 3;
		grid-column-end: 4;
		grid-row-start: 3;				
		grid-row-end: 4;				
	}	
}			

h1 {
	font-size: 1.2em;
	line-height: 1em;
}

h2 {
	font-size: 1em;
	color: #524A3A;
}

h3 {
	font-size: 0.9em;
	color: #524A3A;
}
			
header {
	grid-template-rows: minmax(max-content, 200px);
}		

header img {
	max-width: 250px;
	height: auto;
}
			
zert {
	margin: 10px;			
	font-size: 0.7em;			
}
		
menue1, menue2 {
	border-radius: 0.5em;
	border: 1px solid;
	font-size: 0.9em;	
	display: flex;
	align-items: center;
	padding: 0.3em 10px;
	margin: 10px;
	background: #ffe67c;
	border-color: #524A3A;
	color: #524A3A;			
}	

menue1 a, menue2 a {
	color: #524A3A;
}

category {
	border-radius: 0px 0.5em 0.5em;
	border: 1px solid;
	padding: 0em 10px;
	margin: 10px;			
	background: #295F2d;
	border-color: #295F2d;
	color: #FFE67C;
}
	

article, article-span-col, article-box {
	border-radius: 0px 0.5em 0.5em;
	border: 1px solid;
	font-size: 1em;
}

article, article-span-col, article-box {
	background: #FFFFFF;
	border-color: #524A3A;
}

article img, article-in-box img {
    max-width: 100%;
	height: auto;
}

article a, article-span-col a, article-in-box a {
	font-size: 0.9em;
	color: #295F2d;
}

article-span-col {
	word-wrap: break-word;
}

footer {
	border-radius: 0px 0.5em 0.5em;
	border: 1px solid;
	font-size: 0.9em;	
	padding: 0em 10px;
	margin: 10px;			
	text-align: center;
	background: #524A3A;
	border-color: #524A3A;
	color: #FFE67C;
}

header, article, article-span-col, article-box {
	padding: 10px;
	margin: 10px;
}

.tob {
	unicode-bidi: bidi-override;
	direction: rtl;
	text-align: left;
}

a[href*="galerie"]:after {
	content: '';
	color: red;
	background: transparent url('../img/external_link.svg') center right no-repeat;
	padding-right: 25px;
}

a[href^='http']:not([href^='http://www.hofamhinterfeld.de']):not([href^='https://www.hofamhinterfeld.de']):after {
	content: '';
	color: red;
	background: transparent url('../img/external_link.svg') center right no-repeat;
	padding-right: 25px;
}