/*
This CSS resource incorporates links to font software which is the valuable copyrighted
property of Monotype Imaging and/or its suppliers. You may not attempt to copy, install,
redistribute, convert, modify or reverse engineer this font software. Please contact Monotype
Imaging with any questions regarding Web Fonts:  http://www.fonts.com
*/

@font-face {
    font-family: 'Nouvelle Vague';
    src: url('../Fonts/nouvellevague-webfont.woff2') format('woff2'),
         url('../Fonts/nouvellevague-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

.grid-x { max-width: 1440px; }

.grid-container {
	padding-right: .625rem;
  padding-left: .625rem;
  max-width: 90rem;
  margin-left: auto;
  margin-right: auto;
}

body {
	font-family: BrandonTextWeb-Regular;
	font-weight: normal;
	font-style: normal;
	font-size: 18px;
	background-image: url('../img/ricepaper_v3.png');
	background-image: url('../img/vintage-concrete.png');
	color: #444;
		overflow-x: hidden;
}

/*Offcanvas*/

label.hamburger {
	color: #971215;
	font-size: 1.5rem !important;
	position: fixed;
	top: 1rem;
	right: 1rem;
	z-index: 9999;
	transition: transform .33s ease, color .33s ease, background-color .33s ease;
	/*transform-origin: 50% 42%;*/
	margin: 0;
	box-shadow: 0 .2em 1em rgba(0,0,0,.5);
	border-radius: 1em;
	width: 2em;
	height: 2em;
	background-color: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
}

.hamburger-icon {
	margin: 0;
	padding: 0;
}

#toggle:checked ~ label {
	transform: rotate(90deg);
	background-color: #9F4749;
	color: #fff;
}
#toggle:checked ~ nav.off {
	transform: translate(0px, 0);
	opacity: 1;
}

nav.off {
	height: 100%;
	width: 100%;
	background: rgba(0,0,0,.9);
	margin-left: -0.625em;
	margin-right: -0.625em;
	position: fixed;
	z-index: 100;
	padding-top: 50px;
	color: white;
	opacity: .1;
	transform: translate(0, -100%);
	transition: opacity .25s ease;
}

nav.off ul {
		margin-top: 2rem;
}

nav.off ul li a {
	margin: 0;
	padding: 1.25em 0 1em 0;
	font-size: 1.2em;
	display: block;
	width: 100%;
}
nav.off ul li {
	margin: 0;
}
nav.off ul li a {
	color: #E0D6AB;
	text-align: center;
	margin: 0;
}
nav.off ul li a:hover {
	background-color: #9F4749;
	transform: translateY(0em);
	color: #fff;
}

/*Offcanvas*/












main p, h1,h2,h3,h4,h5,h6,li,strong,b,em,dd,dt,td {
	font-feature-settings:
		'hlig' on, 
		// 'salt' on,
		// 'swsh' on,
		// 'hist' on,
		// 'ss01' on,
		// 'ss02' on,
		'ss03' on,
		'ss04' on,
		'ss11' on,
		'onum' on, 
		'liga' on, 
		'calt' on;
	font-variant-numeric: oldstyle-nums;
}

main {
	padding: 0!important;
}

p {
	font-size: 1em;
	line-height: 1.5em;
}

.blog-content {
	padding: 2em 0;
}

.blog-content p, .blog-content ul, .blog-content ol, .blog-content table {
	padding: 0em .9375rem;
}


p em, p it, em, it {
	font-family: BrandonTextWeb-Italic;
	font-weight: normal;
	font-style: normal;
}
p b, p strong {
	font-family: BrandonTextWeb-Bold;
	font-weight: normal;
	font-style: normal;
}
p b it, p it b, p strong em, p em strong, p b em, p strong it, p it strong, p em b {
	font-family: BrandonTextWeb-BoldItalic;
	font-weight: normal;
	font-style: normal;

}


a {
	color: #971215;
}
a:hover {
	color: #971215;
}

h1, h2, h3, h4 {
	font-family: "Nouvelle Vague";
}


footer h2, footer h3, footer h4 {
	font-family: BrandonTextWeb-Regular;
	font-weight: normal;
	font-style: normal;
	color: #61524a;
}


article.Liste {
	margin-bottom: 1em;
	padding: 0.9375rem;
}

article h2.title {
	font-family: "Nouvelle Vague";
	font-size: 1.8em;
	text-shadow: 1px 1px #F8F7F3, 1px 1px #F8F7F3, 3px 3px 0px rgba(151,61,50,0.2);
	font-weight: 400;
	padding: 1.5rem .9375rem 0.5rem  .9375rem;
	margin-top: 1.5rem;
}

article.Liste {
	margin-bottom: 1em;
	padding: 0.9375rem;
}


.titleimage {
	margin-top: 1em;
	margin-bottom: 2em;
	position: relative;
}

.titleimage img {
	box-shadow: 1px 2px 8px -3px rgba(0,0,0,0.5);
}



.post-comments {
	padding: .9375rem;
}

.postmeta {padding: .9375rem;}

p.post-info {
	font-size: .8em;
	font-family: BrandonTextWeb-Bold;
	font-weight: normal;
	font-style: normal;
	opacity: .8;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	margin-bottom: 0;
	padding: 0 .9375rem .9375rem .9375rem ;
}

.quip-comment-text {
	margin-bottom: 20px;
}

.quip {
	border-bottom: 1px solid #ccc;
	margin-bottom: 40px;
}

aside h3 {
	font-family: BrandonTextWeb-Bold;
	font-family: "Nouvelle Vague";
	font-weight: normal;
	font-style: normal;
}

.sidemenu ul {
	margin-left: 0;
	list-style: none;
	border-top: 1px solid #ccc;
}

.sidemenu ul li {
	padding: 0;
	border-bottom: 1px solid #ccc;
	line-height: 2.4em;
	padding: 0;
}

.sidemenu ul li a {
	line-height: 2.4em;
	-webkit-transition: all .25s ease-in-out;
	-moz-transition: all .25s ease-in-out;
	-ms-transition: all .25s ease-in-out;
	-o-transition: all .25s ease-in-out;
	transition: all .25s ease-in-out;
}

.sidemenu ul li a:hover {
	padding-left: 10px;
	/*background-color: #F5F0EB;*/
	-webkit-transition: all .25s ease-in-out;
	-moz-transition: all .25s ease-in-out;
	-ms-transition: all .25s ease-in-out;
	-o-transition: all .25s ease-in-out;
	transition: all .25s ease-in-out;
}

.sidemenu {
	margin-bottom: 40px;
}

span.post-datum {
	font-family: BrandonTextWeb-Italic;
	font-weight: normal;
	font-style: normal;
	opacity: 0.7;
}

article {
	margin-bottom: 30px;
	border-bottom: 1px solid #ccc;
}

.links {
	font-family: BrandonTextWeb-Bold;
	font-weight: normal;
	font-style: normal;
}

div.fotorama {
	display: block;
	margin-bottom: 2em;
}

div.fotorama_caption_wrap {
	background-color: rgba(255,255,255,.5);
}

.fotorama p {
	margin-bottom: 0;
}

p.Bildinfo {
	opacity: .7;
	text-align: center;
	font-size: .8em;
	margin-top: 5px;
}

.fotorama__caption__wrap {
	font-family: BrandonTextWeb-Regular;
	font-weight: normal;
	font-style: normal;
	font-size: 1rem;
}

.article {
	padding-bottom: 0px;
	margin-bottom: 20px;
}

.quip-comment-body {
	padding: 1em!important;
}

.quip-comment-author {
	font-family: BrandonTextWeb-Bold;
	font-weight: normal;
	font-style: normal;
}

.quip-comment-createdon {
	font-family: BrandonTextWeb-Italic;
	font-weight: normal;
	font-style: normal;
}

aside, aside ul {
}

p.siblingnav {
	font-family: BrandonTextWeb-Bold;
	font-weight: normal;
	font-style: normal;
}

header h1 {
	font-family: "Nouvelle Vague";
	font-size: 2em;
	margin-bottom: 0;
	margin-top: 0;
	padding-bottom: 2rem;
	line-height: 1.6em;
	font-weight: 400;
	/*text-shadow: 1px 1px #F8F7F3, 1px 1px #F8F7F3, 3px 3px 0px rgba(151,61,50,0.2), 0 0 2rem rgba(0,0,0,.5);*/
	text-shadow: 2px 3px #971215, 0 0.25rem 1.5rem rgba(0,0,0,.8);
}

header h1 a {
	color: #fff;
}
header h1 a:hover {
	color: #F7EDED;
}

.titleimage {
	margin-top: 1em;
	margin-bottom: 2em;
}

.titleimage .overlay {
  display: flex;
  flex-wrap: wrap;
  position: absolute;
  justify-content: center;
  align-items: center;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.titleimage .overlay.color {
	/*background-color: rgba(0,0,0,.2); */
}

.titleimage .overlay a {
	z-index: 10;
}

.titleimage h2.overlay.subtitle {
	font-family: BrandonTextWeb-Bold;
	font-weight: normal;
	font-style: normal;
	font-size: 0.65em;
	align-items: flex-end;
	padding-bottom: 0em;
	margin: 1em;	
	color: #fff;
	text-transform: uppercase;
	letter-spacing: .1em;
	text-align: center;
	text-shadow: 0 0 1em oklch(0 0 0 / 1);
}

.footer-color {
	background-color: #413733;
	color: #aaa;
	padding-bottom: 60px;
}

.polster-4 {
	margin: 4em 0;
}

li.quip-comment {
	background-color: #fff!important;
}

li.quip-comment .quip-comment-body {
	padding: 1em;
}

li.quip-comment .quip-comment-alt {
	background-color: #eee!important;
}

article {
	background-color: #fff;
	/*padding: 10px 8px 1px 8px!important;*/
	border-bottom: none!important;
	box-shadow: 1px 2px 8px -3px rgba(0,0,0,0.5);
}

aside .panel {
	background-color: #fff;
	border: none;
	box-shadow: 1px 2px 8px -3px rgba(0,0,0,0.5);
	font-size: 95%;
	padding: 1rem 1rem .75rem 1rem;
	margin-bottom: 2em;
}

aside .panel {
}

aside .panel.zitat {
	/*margin-top: 45px;*/
	background-color: #971215;
  font-size: 1.1rem; 
  color: white;
}

.nav ul li {
	font-family: BrandonTextWeb-Bold;
	font-weight: normal;
	font-style: normal;
	font-size: 0.85em;
	text-transform: uppercase;
	letter-spacing: .1em;
	margin: .25em .5em;
}

.nav ul li a {
	display: block;
	padding: 0.5em;
	transform: translateY(0);
	transition: transform .7s ease-in;
}

.nav ul li.active a {
	background: #9F4749;
}

.nav ul li a:hover {
	transform: translateY(.3em);
	transition: transform .2s ease-out;
}

.CSS-Galerie {
	width: 100%;
	display: grid;
	grid-gap: 1em;
	grid-template-columns: repeat(auto-fit, minmax(200px,1fr));
	grid-auto-flow: dense;
}

.CSS-Galerie img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.CSS-Galerie > div.breit {
	grid-column: span 2;
}
.CSS-Galerie > div.hoch {
	grid-row: span 2;
}
.CSS-Galerie > div.doppelt {
	grid-row: span 2;
	grid-column: span 2;
}
.CSS-Galerie > div.riesig {
	grid-row: span 2;
	grid-column: span 2;
}
@media only screen and (min-width: 700px) {
	.CSS-Galerie > div.riesig {
		grid-column: span 3;
	}
}

/*---------------------------------------------*/

@media only screen and (min-width: 40.063em) {
	header h1 {
		font-size: 3.2em;
		margin-bottom: 0.3em;
		margin-top: 0em;
		padding-bottom: 0rem;
		line-height: 1.2em;
		font-weight: 300;
	}

	header h1 span.reloaded {
		font-size: 0.5em;
	}

article h2.title {
	font-family: "Nouvelle Vague";
	font-size: 1.8em;
	text-shadow: 1px 1px #F8F7F3, 1px 1px #F8F7F3, 3px 3px 0px rgba(151,61,50,0.2);
	font-weight: 400;

	margin-bottom: 0.6em;
	line-height: 1.2em;
	margin-top: 0.4em;
	padding: 0;
}


.titleimage h2.overlay.subtitle {
		font-size: 1rem;
	}

.blog-content p, .blog-content ul, .blog-content ol, .blog-content table {
		padding: 0em 4rem;
		padding: 0em clamp(0rem, 8vw, 6rem);
	}

	.post-comments {
		padding: .0;
	}

	.postmeta {padding: 0;}

	.titlerow {
		margin-top: 1em;
	}

	.titleimage {
		margin-top: 0.5em;
		margin-bottom: 2em;
	}
	article {
		padding-bottom: 0;
		margin-bottom: 30px;
		border-bottom: 1px solid #ccc;
	}
	p.post-info {
	}
	article h2.title {
		font-family: "Nouvelle Vague";
		font-size: 2.7em;
	}
	article {
		padding: 20px 20px 10px 20px!important;
	}

}
@media only screen and (min-width: 64.063em) {
	header h1 {
		font-size: 5em;
	}
	header h1 span.reloaded {
		font-size: 0.6em;
	}
	article {
		padding: 30px 30px 10px 30px!important;
	}
}


ul.paginierung {
	display: flex;
	justify-content: space-between;
	margin-left: 0;
}

ul.paginierung li {
	list-style: none;
}

ul.paginierung li a {
	color: #9F4749;
	font-family: BrandonTextWeb-Bold;
	font-weight: normal;
	font-style: normal;
	padding: .15em .75em;
	border-radius: .2em;
}

ul.paginierung li a:hover {
	background-color: #9F4749;
	color: #fff;
}

ul.paginierung li a.active {
	background-color: #9F4749;
	color: #fff;
}

.photosphere {
	width: 100%;
}

/*Contentblocks*/

ul.special-gallery {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

ul.special-gallery li {
	display: block;
	width: 100px;
	height: 100px;
	float: left;
}

aside img {
	margin-bottom: 20px;
	box-shadow: 1px 2px 8px -3px rgba(0,0,0,0.5);
}

article.Liste {
	margin-bottom: 1em;
}

article.Liste p.post-info {
}

h3.Artikelliste {
	margin-top: 0;
	font-family: "Nouvelle Vague"!important;
}

.footer-color {
	margin-top: 40px;
	padding-top: 40px;
}

footer a {
	color: #b78486;
	font-family: BrandonTextWeb-Bold;
	font-weight: normal;
	font-style: normal;
}
footer a:hover {
	color: #d7a1a3;
}

footer p {
	color: #999;
}

footer h3 {
	font-family: BrandonTextWeb-Regular;
	font-weight: normal;
	font-style: normal;
	font-size: 1em;
	line-height: 2.4em;
	color: #ddd;
	text-transform: uppercase;
	letter-spacing: .1em;
	border-bottom: 1px solid #777;
	margin-bottom: 10px;
}

#map-canvas {
	height: 350px;
	width: 100%;
	margin-bottom: 40px;
}

/*contentblocks*/

.abstand {
	margin-bottom: 30px;
}