/* Statische Rekonstruktion "June LaVonne" – angelehnt an das WordPress-Theme Twenty Eleven (v1.3) */

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
	background: #bababa;               /* theme_mod background_color */
	color: #373737;
	font: 15px/1.625 Georgia, "Bitstream Charter", "Times New Roman", serif;
	-webkit-text-size-adjust: 100%;
}

img { max-width: 100%; height: auto; border: 0; }
a { color: #1982d1; text-decoration: none; }
a:hover { text-decoration: underline; }

#page {
	max-width: 1000px;
	margin: 0 auto;
	background: #fff;
}

/* ---------- Header ---------- */
#branding {
	border-top: 2px solid #1982d1;
	background: #fff;
}
.header-inner { padding: 0; }

#branding hgroup { padding: 1.833em 7.6% 0; }
#site-title {
	font-size: 26px;
	line-height: 1.2;
	font-weight: bold;
	font-family: Georgia, serif;
}
#site-title a { color: #111; }
#site-title a:hover { color: #1982d1; text-decoration: none; }
#site-description {
	margin: .3em 0 1em;
	font-size: 14px;
	font-style: italic;
	color: #7a7a7a;
	font-weight: normal;
}

#header-image { display: block; width: 100%; height: auto; }

/* ---------- Navigation ---------- */
#access {
	background: #222;
	background: linear-gradient(#252525, #0a0a0a);
	box-shadow: 0 1px 2px rgba(0,0,0,.4);
}
#access ul {
	list-style: none;
	margin: 0 auto;
	padding-left: 7.6%;
	display: flex;
	flex-wrap: wrap;
}
#access li { position: relative; }
#access a {
	display: block;
	color: #eee;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 13px;
	line-height: 3.333;
	padding: 0 1.2em;
	text-transform: none;
}
#access a:hover { color: #fff; background: #1982d1; text-decoration: none; }
#access li.current-menu-item > a { color: #fff; font-weight: bold; }

/* ---------- Main ---------- */
#main { background: #fff; }
.content-inner { padding: 2em 7.6% 1em; }

.entry-header { margin-bottom: 1em; }
.entry-title {
	font-size: 23px;
	line-height: 1.3;
	font-weight: bold;
	color: #222;
}
.entry-title a { color: #222; }
.entry-meta { margin-top: .4em; font-size: 12px; color: #666; font-family: Helvetica, Arial, sans-serif; }

.entry-content { padding-top: .5em; }
.entry-content p { margin: 0 0 1.5em; }
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4 { margin: 1.4em 0 .5em; line-height: 1.3; color: #222; }
.entry-content h1 { font-size: 21px; }
.entry-content h4 { font-size: 16px; }
.entry-content h6 { font-size: 12px; font-weight: normal; color: #666; margin-top: 1.5em; font-style: italic; }
.entry-content ul,
.entry-content ol { margin: 0 0 1.5em 1.5em; }
.entry-content li { margin-bottom: .35em; }
.entry-content blockquote {
	margin: 0 0 1.5em; padding-left: 1.2em;
	border-left: 4px solid #ddd; color: #555; font-style: italic;
}
.entry-content strong { font-weight: bold; }
.entry-content .aligncenter { display: block; margin: 0 auto 1.5em; }
.entry-content .alignleft { float: left; margin: 0 1.5em 1em 0; }
.entry-content .alignright { float: right; margin: 0 0 1em 1.5em; }
.entry-content img { height: auto; }

/* ---------- Gallery (Art) ---------- */
.gallery {
	list-style: none;
	margin: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);   /* WordPress [gallery] default = 3 columns */
	gap: 14px;
}
@media (max-width: 480px) {
	.gallery { grid-template-columns: repeat(2, 1fr); gap: 8px; }
}
.gallery-item { margin: 0; }
.gallery-item a {
	display: block;
	background: #f4f4f4;
	border: 1px solid #ddd;
	padding: 4px;
	line-height: 0;
	transition: border-color .15s;
}
.gallery-item a:hover { border-color: #1982d1; }
.gallery-item img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	display: block;
}

/* ---------- Footer ---------- */
#colophon {
	background: #fff;
	border-top: 1px solid #ddd;
}
.footer-inner {
	padding: 1.5em 7.6%;
	font-size: 12px;
	color: #777;
	font-family: Helvetica, Arial, sans-serif;
}
.footer-inner a { color: #1982d1; }

/* ---------- Responsive ---------- */
@media (max-width: 800px) {
	#access ul { padding-left: 4%; }
	.content-inner { padding: 1.5em 4%; }
	#branding hgroup { padding: 1.5em 4% 0; }
	.footer-inner { padding: 1.5em 4%; }
}
