/*
Theme Name: Rehmann
Theme URI: https://www.oliver-rehmann.de
Author: Oliver Rehmann
Author URI: https://www.oliver-rehmann.de
Description: Eigenes Theme für oliver-rehmann.de. Zusammengeführt aus Tatami 1.0.3 (Elmastudio) und dem Child-Theme Icke.
Version: 2.1.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: rehmann
Domain Path: /languages
*/

/* Grundlage (Tatami) steht in css/grundlage.css und wird vorher geladen. */

/* Fußzeilenfarbe, vorher Tatami-Theme-Option „Footer Background Color“ */
.site-footer {
	background: #408B80;
}



#content article:first-child .entry-header h1.entry-title {
	font-size: 1.1rem;
	font-weight: normal;
	letter-spacing: 0.1rem;
	text-transform: uppercase;
	color: #333538;
	line-height: 1.4;
}

@media screen and (min-width: 480px) {
	#content article:first-child .entry-header h1.entry-title {
		font-size: 1.3rem;
		letter-spacing: 0.2rem;
	}
}

@media screen and (min-width: 786px) {
	#content article:first-child .entry-header h1.entry-title {
    	font-size: 1.5rem;
    	letter-spacing: 0.3rem;
	}
}

@media screen and (min-width: 1260px) {
	#content article:first-child .entry-header h1.entry-title {
		font-size: 2.2rem;
		letter-spacing: 0.4rem;
	}
}

@media screen and (min-width: 1260px) {
	.page-id-3191 article:first-child .entry-header,
	.page-id-3191 article:first-child .entry-content,
	.page-id-3196 article:first-child .entry-header,
	.page-id-3196 article:first-child .entry-content {
		padding: 0 40px 0 40px !important;
		max-width: inherit !important;
	}
}

.page-id-3191 .entry-content ul li,
.page-id-3191 .entry-content blockquote p,
.page-id-2779 .entry-content ul li,
.page-id-2779 .entry-content blockquote p,
.page-id-3196 .entry-content ul li,
.page-id-3196 .entry-content blockquote p {
	line-height: 1.6;
	font-size:15px;
	font-size:0.9375rem;
}

@media screen and (min-width: 786px) {
	.page-id-3191 .entry-content ul li,
	.page-id-3191 .entry-content blockquote p,
	.page-id-2779 .entry-content ul li,
	.page-id-2779 .entry-content blockquote p,
	.page-id-3196 .entry-content ul li,
	.page-id-3196 .entry-content blockquote p {
		font-size: 17px;
		font-size: 1.0625rem;
		line-height: 1.75;
	}
}

.page-id-2551 .wp-block-cover {
	width: inherit;
	margin-bottom: 1em;
	min-height: 120px !important;
}

@media screen and (min-width: 480px) {
	.page-id-2551 .wp-block-cover {
		min-height: 200px !important;
	}
}

body {
	color:#777777;
	background-color:#e7e7e2;
}

video { width:100%; }

hr {
	border: none;
	border-bottom: 1px solid #dcdcdc;
}

.entry-content h2 {
	margin-top: 2em;
}

/* FIX: Footer Kontakt Widget */
.site-footer .widget_custom_html p {
	margin-bottom: 1em;
}

/* FIX: Footer Width */
@media screen and (min-width: 1260px) {
	.template-left-sidebar .footerwidgets {
		max-width: inherit !important;
	}
}

/* FIX: Zitat Blog Format */
.post_format-post-format-quote .entry-content .wp-block-quote p {
	margin: 0;
}



/*	-- flexibles Margin --------------------------------------------------------------	*/

hr.flex-divider,
.format-quote .entry-content hr,
.format-quote .entry-content .more-link {
	margin-top: 20px;
	margin-bottom: 20px;
}

.format-quote .entry-content ul {
	padding: 0 20px 20px;
}

.post_format-post-format-quote .entry-content .wp-block-quote {
	margin-bottom: 20px;
}

.post_format-post-format-quote .entry-content blockquote cite {
	margin-top: 20px;
}

.post_format-post-format-quote .entry-content .more-link {
	margin-left: 20px;
	margin-top: 0 !important;
}


@media screen and (min-width: 768px) {
	hr.flex-divider,
	.format-quote .entry-content hr,
	.format-quote .entry-content .more-link {
		margin-top: 30px;
		margin-bottom: 30px;
	}

	.format-quote .entry-content ul {
		padding: 0 30px 30px;
	}

	.post_format-post-format-quote .entry-content .wp-block-quote {
		margin-bottom: 30px;
	}

	.post_format-post-format-quote .entry-content blockquote cite {
		margin-top: 30px;
	}

	.post_format-post-format-quote .entry-content .more-link {
		margin-left: 30px;
	}

}

@media screen and (min-width: 1260px) {
	hr.flex-divider,
	.format-quote .entry-content hr,
	.format-quote .entry-content .more-link {
		margin-top: 40px;
		margin-bottom: 40px;
	}

	.format-quote .entry-content ul {
		padding: 0 40px 40px;
	}

	.post_format-post-format-quote .entry-content .wp-block-quote {
		margin-bottom: 40px;
	}

	.post_format-post-format-quote .entry-content blockquote cite {
		margin-top: 40px;
	}

	.post_format-post-format-quote .entry-content .more-link {
		margin-left: 40px;
	}

}



/*	-- Wordpress Button --------------------------------------------------------------	*/

.wp-block-buttons .wp-block-button .wp-block-button__link {
	display: inline-block;
	margin: 10px 10px 10px 0;
	padding: 9px 16px;
	font-size: 14px;
	font-size: 0.875rem;
	overflow: hidden;
	cursor: pointer;
	color: #fff;
	background: #69A6CC;
	border-radius: inherit;
	text-align: center;
	font-weight: normal;
	text-decoration: none !important;
	-webkit-transition: .2s background ease;
	-moz-transition: .2s background ease;
	-o-transition: .2s background ease;
	-ms-transition: .2s background ease;
	transition: .2s background ease;
}

.wp-block-buttons .wp-block-button .wp-block-button__link:hover {
	background:#4F7D99;
}

.wp-block-buttons .wp-block-button {
	display: inline-block;
	margin-right: inherit !important;
	margin-bottom: inherit !important;
}



/*	-- Bild & Video Caption ----------------------------------------------------------	*/

.responsive-video-info,
.wp-block-embed-vimeo figcaption,
.wp-block-image figcaption,
.wp-block-embed-youtube figcaption {
	font-style: italic;
	color: #ABB0B3;
	padding-top: 1em !important;
	padding-bottom: 1em !important;
	margin-left: 40px;
	margin-right: 40px;
	margin-top: .5em !important;
	margin-bottom: 1em !important;
}



/* Porträts auf About (847) und Unterricht (1884) als Block, sonst Lücke unter dem Bild.
   Die frühere Regel zum Ausblenden auf großen Bildschirmen war ungültig und griff nie. */
.wp-image-847,
.wp-image-1884 {
	display: block;
}



/* Beitragsbilder und große Bilder im Text füllen die Spalte, auch wenn die Datei schmaler ist
   (z. B. 800 px bei 840 px Spalte). Ausgerichtete und verkleinerte Bilder bleiben, wie sie sind. */
.post-thumb img.wp-post-image,
.entry-content .wp-block-image:is(.size-full, .size-large):not(.alignleft, .alignright, .aligncenter, .is-resized) img {
	width: 100%;
}



/* FIX: embeded objects */
figure.wp-block-embed-vimeo,
figure.wp-block-image,
figure.wp-block-embed-youtube {
	margin-top: 0;
}



/* FIX: Blog Seiten Menü */
@media screen and (min-width: 1260px) {
	.content-wrap .wp-pagenavi {
		margin-left: 0 !important;
		margin-right: 0 !important;
		width: 100% !important;
	}
}



/* FIX blockquote HTML */
.entry-content blockquote cite {
	display: inline-block;
	margin: 20px 0 0 0;
	padding: 0;
	font-size: 14px;
	font-size: 0.875rem;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-style: normal;
}



/* Konzerte News Eintrag */
ul.opr-konzerte {
	padding: 0 ;
	list-style-type: none;
	margin-top: 1em;
}
ul.opr-konzerte li {
	border-bottom: 1px solid #dcdcdc;
	/* border-top: 1px solid #dcdcdc;*/
	padding-top: .4em;
	padding-bottom: .4em;
	margin-left: 0;
	width:100%;
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	line-height: 1.4;
}
ul.opr-konzerte li:first-child {
	border-bottom: 1px solid #dcdcdc;
	border-top: 1px solid #dcdcdc;
}
ul.opr-konzerte li:before {
	content: "\f073";
	margin-right: .5em;
}



/* Bildunterschriften in [gallery] ausblenden */
dd {
	display:none;
}



/* Attachment Ansicht */
.previous-image,
.next-image {
	display:none;
}

.entry-content .attachment a {
   pointer-events:none;
   cursor:default;
}

.entry-content .entry-caption a {
   pointer-events:inherit;
   cursor:pointer;
}



/* Projekt Seite */
.projekt a:hover i.fa-circle {
color:#69a6cc;
}

.projekt a[href^="https://www.facebook"]:hover i.fa-circle,
.projekt a[href^="https://facebook"]:hover i.fa-circle {
color:#3b5998;
}

.projekt a[href^="https://www.youtube"]:hover i.fa-circle {
color:#c4302b;
}

.projekt a[href^="https://soundcloud"]:hover i.fa-circle {
color:#ff7700;
}

.projekt a[href^="https://www.instagram"]:hover i.fa-circle {
color:#125688;
}

.projekt a[href^="https://twitter"]:hover i.fa-circle {
color:#55acee;
}

.projekt a .fa-circle {
color: #bbbbbb;
}

.projekt p:first-of-type a .fa-circle {
color: #69a6cc;
}

.projekt .fa-stack {
width: 1.8em;
height: 1.8em;
line-height: 1.8em;
margin-right:.2em;
}
.projekt .fa-stack-1x { font-size: .9em; }
.projekt .fa-stack-2x { font-size: 1.8em; }



/*	-------------------------------------------------------------------------------------------
	Hintergrund
	-------------------------------------------------------------------------------------------   */

.opr-bg { padding-bottom:10px; }

@media screen and (min-width: 768px) {
	body {
		background: url(images/schlagzeug.jpg) no-repeat fixed;
		background-size: cover;
	}
	.opr-bg {
		background:rgba(231,231,226,.9);
		padding-bottom:20px;
	}
}

@media screen and (min-width: 1260px) {
	.opr-bg { padding-bottom:0; }
}


/*	-------------------------------------------------------------------------------------------
	Header
	-------------------------------------------------------------------------------------------   */

#site-header img { display:none; }

.site-title h1.title {
	font-weight:normal;
	font-size:1.1rem !important;
	letter-spacing: 0.1rem;
}

@media screen and (min-width: 480px) {
	.site-title h1.title {
		font-size:1.3rem !important;
		letter-spacing:0.3rem;}
}

@media screen and (min-width: 768px) {
	.site-title h1.title {
		padding-top:0px !important;
		font-size:1.5rem !important;
		letter-spacing:0.4rem;
	}

	#site-header { padding-top:6px; }

	#site-header img.opr_tablet {
		display:inline;
		width:48px;
		padding-right: 1.5rem;
		vertical-align: middle;
		padding-bottom: .2rem;
	}
}

@media screen and (min-width: 1260px) {
	.site-title h1.title {
		padding-top:4px !important;
		font-size:2.4rem !important;
		letter-spacing: 0.5rem;
	}

	.site-title h1.title span {
		display:block;
		padding-top:8px;
	}

	#site-header {
    	padding-top:22px;
   		padding-bottom:24px;
	}
	
	#site-header img.opr_tablet { display:none; }

	#site-header img.opr_full {
		display:inline;
		width:140px;
		padding-right:0px;
		padding-bottom:0px
	}

	.site-title h2.description {
		padding-top:4px;
		font-size:1rem !important;
		font-weight:normal !important;
	}
}


/*	-------------------------------------------------------------------------------------------
	Menu
	-------------------------------------------------------------------------------------------   */

.site-title h1.title a {
	color:#333538;
}

.off-canvas-nav { background-color:#ffffff !important; }

.js .menu-button {
	background:#ffffff url(images/opr-menu-btn.png) 50% 0 no-repeat;
}
.js .sidebar-button {
	background:#ffffff url(images/opr-sidebar-btn.png) 50% 0 no-repeat;
}
.js .menu-button, .js .sidebar-button {
	border-color:#E7E7E2;
}

/* Fix: Header beim "left sidebar only" Template */
@media screen and (min-width: 1024px) {
	.template-left-sidebar [role="banner"] {
  	  background: none repeat scroll 0 0 #ffffff;
	}
}

/* off canvas fix */
.js .active-sidebar [role="banner"] {	
	position: fixed;
}

.js .active-nav [role="banner"] {	
	position: fixed;
}


/*	-------------------------------------------------------------------------------------------
	Footer
	-------------------------------------------------------------------------------------------   */

.site-footer {
	/* background-color:#69cc97 !important; */ /* #43bf7d */
	margin-bottom:0;
}

.template-left-sidebar .site-info { max-width: inherit; }

/* off canvas fix */
.active-nav .site-footer, .active-sidebar .site-footer {
    display: none !important;
}


/*	-------------------------------------------------------------------------------------------
	"Weiterlesen" Link
	-------------------------------------------------------------------------------------------   */

.entry-content a.more-link {
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    font-size: 0.875rem;
    margin: 10px 10px 10px 0;
    overflow: hidden;
    padding: 9px 16px;
    text-align: center;
    text-decoration: none;
    transition: background 0.2s ease 0s;
    background: none repeat scroll 0 0 #69A6CC;
    /*letter-spacing: inherit !important;*/
    /*font-weight: normal !important;*/
    /*text-transform: inherit;*/
}

.entry-content a:hover.more-link {
	color: #FFFFFF !important;
	background:#4F7D99;
}


/*	-------------------------------------------------------------------------------------------
	Formatvorlagen
	-------------------------------------------------------------------------------------------   */

/*	-- Gallerie / Audio -----------------------------------------------------------------------   */

.format-gallery .entry-header, .format-gallery .entry-content, .format-audio .entry-header, .format-audio .entry-content {
    background-color:#408B80;
    color:#e1e2e3;
}

.format-gallery .entry-header, .format-gallery .entry-content a, .format-audio .entry-header, .format-audio .entry-content a {
    color:#e1e2e3;
}

.format-gallery .entry-header, .format-gallery .entry-content a:hover, .format-audio .entry-header, .format-audio .entry-content a:hover {
	color:#abb0b3;
}

.gallery-item img { box-shadow: inherit; } /* Schatten entfernen */

.opr_gallery_author {
	font-style: italic;
	font-size: 0.875rem !important;
	padding-bottom: 1em;
	text-align: center !important;
}
.opr_gallery_author a {
    text-decoration: none;
}


/*	-------------------------------------------------------------------------------------------
	HiDPI (=Retina) Displays
	-------------------------------------------------------------------------------------------   */

@media only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {
	.js .menu-button { background:#ffffff url(images/x2/opr-menu-btn.png) 50% 0 no-repeat; background-size: 60px 60px; }
	.js .sidebar-button { background:#ffffff url(images/x2/opr-sidebar-btn.png) 50% 0 no-repeat; background-size: 60px 60px; }
}



/* Minimum width of 480 pixels (smartphone landscape)
/* Minimum width of 768 pixels (tablet portrait)
/* Minimum width of 1024 pixels (tablet landscape)
/* Minimum width of 1260 pixels (13' and 15' screens)
/* Minimum width of 1752 pixels (bigger desktop screens)