html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
main, menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, main, menu, nav, section {
	display: block;
}

*[hidden] {
    display: none;
}

@import url("normalize.css");

@font-face {
  font-family: Klavika;
  src: url('fonts/Klavika-Regular.ttf');
  font-weight: 400;
}

.clear {clear:both;}

p {margin-bottom:14px;color:#777777;}

strong {font-weight:bold;}
em {font-style:italic;}
sup {  vertical-align: super;font-size: smaller;}
sub {  vertical-align: sub; font-size: smaller;}

body,html {
	font-family:Times;
	font-size:17px;
	line-height:22px;
	height:100%;
	
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

a, a:link, a:visited {
	text-decoration:none;
	color:#777777;
}
a:hover {
	color:#000000;
}

#sitetitle a {color:#000000;}
#sitetitle a:link {color:#000000;}
#sitetitle a:visited {color:#000000;}
#sitetitle a:active {color:#000000;}
#sitetitle a:hover {color:#000000;}

a.nav__item--act {color:#000000;}

article h2 {
	font-family:Klavika;
	font-size:17px;
	line-height:21px;
	margin-bottom:19px;
}

article h3 {
	font-family:Klavika;
	font-size:17px;
	line-height:21px;
	margin-bottom:19px;
	margin-top:-19px;
	color:#777777;
}

article time {
	font-family:Klavika;
	font-size:16px;
	line-height:22px;
}

#more__link {
	font-family:Klavika;
	font-size:16px;
}

#wrap {
	width:100%;
	position:relative;
	max-width:1240px;
	min-height:100%;
	margin-left:auto;
	margin-right:auto;
	
}

header {
	font-family:Klavika;
	font-size:28px;
	line-height:34px;
	transform: translateX(0);
	position:fixed;
	top:350px;
	width:100%;
	max-width:1240px;
}

nav ul {
	list-style-type:none;
	padding:0;
}



#sitetitle {
	width:250px;
	position:fixed;
	height:50px;
	transform:rotate(-90deg);
	transform-origin:top left;
	left:40px;
}

#nav {
	width:250px;
	position:fixed;
	height:248px;
	transform:rotate(-90deg);
	transform-origin:top left;
	right:50px/*=hoehe dieses element (300) - breite dieses elements (250) + abstand zum seitenrand (50)*/;
}

#stein {
	position:relative;
	right:15px;
}

.quote--item {
	display:none;
	font-size:18px;
	line-height:22px;
	/*position:fixed;
	top:50%;
	transform: rotateX(180deg);
	transform-origin: top;*/
}
.quote--item p {
	/*transform:rotateX(180deg);*/
	color:#000000;
}

.quote--source {
	font-size:14px;
}

main {
	width:100%;
	padding-top:30px;
	padding-bottom:30px;
}

main article {
	margin-left:100px;/*hoehe+left von #sitetitle*/
	margin-right:348px;/*hoehe+right von #nav*/
}

main article section {
	margin-bottom:35px;
}

.frontpage main article section {
	margin-bottom:0;
}

main ul {
	list-style-position:inside;
	margin-left:15px;
	color:#777777;
	margin-bottom:14px;
}

.frame-type-text a {
	text-decoration:underline;
}



body.frontpage main {
	position:absolute;
	top:50%;
	padding:0;
}

body.align_content section:first-child {
	height:320px;
}

body.align_content section:first-child img {
	min-height:320px;
	width:auto;
	max-width:300px;
	height:auto;
	max-height:320px;
}

.burger {
	
	display: none;
	width: 23px;
    height: 14px;
    position: fixed;
    z-index: 10;
    top: 60%;
    margin-top:-14px;
    right: 20px;
    cursor: pointer;
	
}


.ce-gallery.layout-1 .ce-row {
	width:240px;
	height:300px;
	margin-bottom:20px;
}

.ce-gallery.layout-2 .ce-row {
	width:240px;
	height:240px;
	margin: 10px 20px 10px 0;
	float:left;
}

.ce-gallery.layout-1 img {
	height:300px;
	width:auto;
	display:block;
}

.ce-gallery.layout-2 img {
	height:190px;
	width:auto;
	margin: auto auto auto 0;
	display:block;
	border: 1px solid #efefef;
	box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);
}

.ce-gallery.layout-0 img {
	width:100%;
	height:auto;
}

/*

#c677 .ce-gallery.layout-2 .ce-row {
	max-width:200px;
	height:200px;
	margin:10px 20px 10px 0;
	float:left;
}

#c677 .ce-gallery.layout-2 img {
	height:200px;
	width:auto;
	display:block;
	border: 1px solid #efefef;
	box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);
}

*/

section {clear:both;}





@media (max-width: 823px) {

	#sitetitle {
		width:250px;
		position:fixed;
		/*top:60px;*/
		height:50px;
		transform:rotate(-90deg);
		transform-origin:top left;
		left:20px;
	}
	
	#nav {
		width:250px;
		position:fixed;
		/*top:60px;*/
		height:248px;
		transform:rotate(-90deg);
		transform-origin:top left;
		right:20px/*=hoehe dieses element (300) - breite dieses elements (250) + abstand zum seitenrand (50)*/;
	}
	
	#stein {
		position:relative;
		right:15px;
	}
	
	#stein img {width:160px!important;}
	
	main article {
		margin-left:70px;/*hoehe+left von #sitetitle*/
		margin-right:318px;/*hoehe+right von #nav*/
	}
	

}

@media screen and (max-width: 823px) and (orientation: landscape) {
	header {top:60%;}
	body.frontpage main, body.align_content main {top:60%;}
	body.frontpage .burger {display:none;}
	
	.burger {
		 	display: block;	
	}

	
	.burger::before {
			content: "";
		    position: absolute;
		    top: 0;
		    left: 0;
		    width: 23px;
		    height: 2px;
		    background-color: #000000;
		    -webkit-transform-origin: 0 0;
		            transform-origin: 0 0;
			-webkit-transition: all 0.25s ease-in-out;
			transition: all 0.25s ease-in-out;
		}
	
	.burger--close::before {
	    	-webkit-transform: rotate(45deg) translateY(-3px);
	    	        transform: rotate(45deg) translateY(-3px);
	    }
	
	.burger__middle {
			position: absolute;
		    top: 6px;
		    left: 0;
		    width: 23px;
		    height: 2px;
		    background-color: #000000;
		    -webkit-transform-origin: 0 50%;
		    transform-origin: 0 50%;
		    -webkit-transition: all 0.25s ease-in-out;
		    transition: all 0.25s ease-in-out;
		}
	
	.burger--close .burger__middle {
		    opacity: 0;
			-webkit-transform: scaleX(0);
			        transform: scaleX(0);
		}
	
	.burger::after {
			content: "";
		    position: absolute;
		    bottom: 0;
		    left: 0;
		    width: 23px;
		    height: 2px;
		    background-color: #000000;
		    -webkit-transform-origin: 0 100%;
		            transform-origin: 0 100%;
		    -webkit-transition: all 0.25s ease-in-out;
		    transition: all 0.25s ease-in-out;
		}
	
	.burger--close::after {
			-webkit-transform: rotate(-45deg) translateY(2px);
			        transform: rotate(-45deg) translateY(2px);
		}
		
	#nav {right:60px;display:none;}
	body.frontpage #nav {right:20px;display:block;}
	main article {margin-right:60px;}
	body.frontpage main article {margin-right:300px;}
	
	
}

@media (max-width: 420px) {
	
		
	body.frontpage main {top:40%;}
	
	body.align_content main {
		margin-top:140px;
		position:static;
		top:0;
		padding:0;
	}

	header {
		font-family:Klavika;
		font-size:23px;
		line-height:26px;
		position:fixed;
		top:0;
		width:100%;
		height:118px;
		background:rgba(255, 255, 255, 0.98);
		opacity:1;
	}
	
	
	#sitetitle {
		width:90px;
		position:fixed;
		top:100px;
		height:auto;
		transform:rotate(-90deg);
		transform-origin:top left;
		left:10px;
	}
	
	#nav {
		width:100px;
		position:fixed;
		top:100px;
		height:96px;
		transform:rotate(-90deg);
		transform-origin:top left;
		right:80px;
	}
	
	#stein {
		width:100px;
		height:68px;
		right:8px;
	}
	
	#stein img {
		width:100px!important;
	}
	
	main {
		width:100%;
		padding-top:120px;
		padding-bottom:30px;
	}

	main article {
		width:auto;
		margin:15px;
		margin-top:15px!important;
	}
	
	main article section {
		margin-bottom:30px;
	}
	
	
	.quote--item {}

}

/* Bild verneinte Rationen */

#c637 {margin-top:15px;}

/* Spezial */

#image131 {margin:auto auto auto 50px;} 
#image136 {margin:auto auto auto 30px;}
#image156, #image157, #image165, #image166, #image191, #image192 {margin:auto auto auto 0;width:190px;height:auto;}

#image147,  {box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);}
#image170 {box-shadow:none;border:none;}

/* Schatten Buchcover Poesieh*
#image176, #image175, #image174, #image68, #image67, #image66, #image65, #image64, #image63 {box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 3px 10px 0 rgba(0, 0, 0, 0.1);}/

/* Überall Schatten? */
.image-embed-item {box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 3px 10px 0 rgba(0, 0, 0, 0.1);}
#image53, #image100, #image101, #image102, #image105, #image104 {box-shadow:none;}


/*
#c681 img {box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);margin-bottom:20px;max-width:450px;height:auto;}
#c686 img {box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);}
*/