/* filename: _5_custom.css		*/
/* version for caching: 1.1.0	*/

/* Block Styles */
:root{
	--wp--preset--aspect-ratio--square: 1;
	--wp--preset--aspect-ratio--4-3: 4/3;
	--wp--preset--aspect-ratio--3-4: 3/4;
	--wp--preset--aspect-ratio--3-2: 3/2;
	--wp--preset--aspect-ratio--2-3: 2/3;
	--wp--preset--aspect-ratio--16-9: 16/9;
	--wp--preset--aspect-ratio--9-16: 9/16;
	--wp--preset--font-size--small: 13px;
	--wp--preset--font-size--medium: 20px;
	
	--wp--preset--font-size--large: 36px;
	--wp--preset--font-size--x-large: 42px;
	--wp--preset--spacing--20: 0.44rem;
	--wp--preset--spacing--30: 0.67rem;
	--wp--preset--spacing--40: 1rem;
	--wp--preset--spacing--50: 1.5rem;
	--wp--preset--spacing--60: 2.25rem;
	--wp--preset--spacing--70: 3.38rem;
	--wp--preset--spacing--80: 5.06rem;
	--wp--preset--shadow--natural: 6px 6px 9px rgba(0, 0, 0, 0.2);
	--wp--preset--shadow--deep: 12px 12px 50px rgba(0, 0, 0, 0.4);
	--wp--preset--shadow--sharp: 6px 6px 0px rgba(0, 0, 0, 0.2);
	--wp--preset--shadow--outlined: 6px 6px 0px -3px rgba(255, 255, 255, 1), 6px 6px rgba(0, 0, 0, 1);
	--wp--preset--shadow--crisp: 6px 6px 0px rgba(0, 0, 0, 1);
}

/* font-size */
.has-small-font-size {font-size: var(--wp--preset--font-size--small)}
.has-medium-font-size {font-size: var(--wp--preset--font-size--medium)}
.has-large-font-size {font-size: var(--wp--preset--font-size--large)}
.has-x-large-font-size {font-size: var(--wp--preset--font-size--x-large)}


/* border-radius */
.teaser2 img,
.size-post_thumbnail_3012,
.product-card,
.borderradius12,
.post_thumbnail_3012 {
	border-radius: 12px;
	overflow: hidden;
}


.product-card { 
	font-size: 1rem; 
	box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
}

article.product-card .entry-title {
	font-size: 1.2em
}

article.product-card .wp-block-group {
	background-color: var(--color-content-bg-alt);
	margin-block-start: 0;
	padding: 1em .5em
}



a{-webkit-tap-highlight-color: rgba(240,240,0,0);}




#footer{
	margin:30px 0 0;
	padding:0;
	background-color:var(--cs-bg-blue-4);
}
#site-info{color:#ddd;margin:0 auto;max-width:910px;padding:0 4em 0 0}
#site-info {
  padding: 12px 0;
}
#site-info a.top {
  position: absolute;
  bottom: auto;
  right: 0;
}
#site-info,
#site-info a {
  color:#ccc
}
#site-info a:hover{color:#fff}

.standard-btn.white-btn { padding: 7px 14px;}

/* --- Accordion --- */
.c-accordion__item {border-bottom:1px solid #eee;} /* The accordion item container */
.c-accordion__item:first-child {border-top:1px solid #eee;} /* The accordion item container */
.c-accordion__item.is-open {} /* is-open is added to open accordion items */
.c-accordion__item.is-read {} /* is-read is added to accordion items that have been opened at least once */
.c-accordion__title {padding-left:3em; }
.c-accordion__title::before {content: "\f543";  font-family: dashicons; color:var(--cs-link-color); margin:-0.2em 0 0 -2em; display:inline-block;width:2em;
transform:none;vertical-align:middle} /* An accordion item title */
.c-accordion__item.is-open .c-accordion__title::before {content: "\f460";}
.c-accordion__title--button {} /* An accordion item title that is using a button tag */
.c-accordion__title:hover {text-decoration: underline;} /* To modify the style when hovering over an accordion item title */
.c-accordion__title:focus {outline-color:#c60} /* To modify the style when an accordion item title currently has broswer focus */
.c-accordion__content {margin: 2em} /* An accordion item content container */
.c-accordion__title::after {content:initial}
h3.c-accordion__title {font-size:1.3em}

#site-title img {width:368px;height:42px}



/* Overwrite Waipoua Theme Options */
a, .entry-header h2.entry-title a:hover {color:var(--cs-link-color);}
.entry-meta a.share-btn {background:var(--cs-link-color) url(https://www.schablonen-technik.de/wp-content/themes/waipoua/images/standardicons.png) 7px -78px no-repeat;}
blockquote {border-left:6px solid var(--cs-link-color);background-color:transparent}
input#submit, input.wpcf7-submit, .format-link .entry-content a.link, .flickr_badge_wrapper a img:hover, .jetpack_subscription_widget form#subscribe-blog input[type="submit"] {background:var(--cs-link-color);}

#site-nav,
#site-nav-wrap {background:var(--cs-menu-bg-color);
}


h1, h2, h3, h4, h5, h6 {color: var(--cs-header-color)}


header.entry-header .entry-title a {
    color: var(--cs-header-color);
}


a {
	color:var(--cs-link-color);
}
a:hover, #content .entry-content p a:hover, #content .entry-summary p a:hover, #sidebar .textwidget a:hover, #content #comments .comment-text a:hover, #comments ol li.pingback a.url:hover {
	color:var(--cs-link-color-hover);
}
.has-super-silver-color { 
	color: var(--cs-super-silver-color)
}
.has-super-silver-background-color { 
	background-color: var(--cs-super-silver-color)
}

#sidebar {
background-color:var(--cs-background-color-2);
margin-top:0;
}
article.post {background-color:var(--cs-background-color-3)}

.c-accordion__item {
	background-color: var(--cs-background-color-2);
}
.c-accordion__title:focus {
	background-color:  var(--cs-background-color-3);
}

.page.page-id-72 #header,
.page.page-id-1404 #header {
    display: block;
}
#cn-accept-cookie:hover {
    background-color: #eee;
}
#cn-accept-cookie {
    background-color: #fff;
    border-radius: 0.3em;
    padding: 0.3em;
}
a.has-steel-blue-color { color: SteelBlue }
ä.has-steel-blue-background-color { background-color: SteelBlue }

a.has-steel-blue-background-color:hover,
a.has-steel-blue-background-color:focus { color: #fff }

a.wp-block-button__link:hover,
a.wp-block-button__link:focus { text-decoration: underline }
/*
.wp-block-button__link:visited,
.wp-block-button__link:hover,
.wp-block-button__link:focus,
.wp-block-button__link:active
{ color: SteelBlue }
*/
.wp-block-button__link.has-steel-blue-background-color { background-color: SteelBlue }

/* youtube privat */
.video-wrapped {
	width: 100% !important;
	/*height: auto !important;
	padding: 56.25% 0 0;*/
}
.video-wrapped .video-wrapped-play a {color:#ffccf3}
.video-wrapped .video-wrapped-play::before {margin:-20px 0 20px 0;
}

#wrap #content .read-more-link {
	text-decoration: none;
	display: inline-block;
	padding: 1px .5em;
	border-radius: 6px;
	border: 1px solid currentColor
}

#wrap #content .read-more-link:hover {
	background: #e9254d;
	color: #fff;
	border-color: #fbb03b
}
 
 .video-wrapped .video-wrapped-play {
    text-align: center;
    font-size: 2em;
    margin-top: 20px;
	padding:5px;
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    cursor: pointer;
	background-color: rgba(0,0,0,0.5);
}
	
.wp-block-post-title {font-size:1.4rem;line-height:125%;min-height:3.75em;margin-top:0}
.wp-block-post-date p {font-size:80%;margin-bottom:2em}
.wp-block-post-template.is-flex-container li{display:flex;flex-direction:column;border-bottom:none}

.logo #schab-logo-inline {
    margin-top: 20px;
}


svg.icon-phone {
	fill: currentColor;
	height: 1em;
	display: inline;
	vertical-align: -10%;
	margin-right: .25em;	 
}

/* Touch screen device style goes here 
@media (hover: none) and (pointer: coarse) {
}
*/

.svg-inline-icon {
	fill: currentColor;
	height: 1em;
	display: inline;
	vertical-align: middle;
}
.icon_atleft span {
    margin-left: 0.25em;
}

/* wrap */
#wrap, #site-nav-container, .l-subheader-h, .post-wrap, #content.fullwidth {
	width: 100%;
    max-width: 560px;
    margin: 0 auto;
	float: none;
}

#site-nav-container #s {
	width:490px;
}

@media screen and (min-width: 48px) {
	#wrap, #site-nav-container, #site-info, #content.fullwidth, .l-subheader-h, .post-wrap {
		max-width: 100%;
		margin: 0 auto;
	}
	#s:focus::placeholder {
		color: #afafaf;
	}
	::placeholder {
		color: #fff;
	}
}

@media screen and (min-width: 783px){
	#wrap, #site-nav-container, #site-info, #content.fullwidth, .l-subheader-h, .post-wrap {
		max-width: 728px;
	}
	#site-nav-container #s:focus {
		width: 490px;
	}
	#site-nav-container #s:focus::placeholder {
		color: #afafaf;
	}
}

@media screen and (min-width: 1024px){

	#wrap, #site-nav-container, #site-info, #content.fullwidth, .l-subheader-h, .post-wrap {
		max-width: 728px;
	}

/* --- Site Nav --- */
#site-nav-wrap a#mobile-menu-btn {
	display:none;
}
#site-nav-wrap a#home-btn {
	width:40px;
	height:60px;
	display:inline-block;
	margin:0;
	padding:0;
	text-align:left;
	background: url(https://www.schablonen-technik.de/wp-content/themes/waipoua/images/standardicons.png) 0 21px no-repeat;
	float:left;
	font-size:1.1em;
	text-decoration:none;
	text-indent:-9999em;
	opacity:0.75;
	filter: none;
}
#site-nav-wrap a#home-btn:hover {
	opacity:1;
	filter: none;
}
#site-nav {
	position:relative;
	padding:0;
	display:block !important;
	background:none;
	overflow:visible;
}
#site-nav ul {
	padding: 0;
}
#site-nav ul li {
	position:relative;
	display:inline-block;
	float:left;
	padding:0;
	background:none;
}
#site-nav ul.sub-menu,
#site-nav ul.children {
	width:auto;
	display: none;
	position:absolute;
	top:55px;
	background:#fff;
	border:1px solid #ececec;
	z-index: 99999;
}
#site-nav ul.sub-menu ul,
#site-nav ul.children ul {
	display: none;
	top:-5px;
	left:152px;
	z-index: 99999;
}
#site-nav li li {
	position:relative;
	display:block;
	width:160px;
	float:none;
	color:#333;
}
#site-nav li li li {
	width:160px;
	display:block;
}
#site-nav li a {
	height:32px;
	display:inline-block;
	margin:12px 15px 0 0;
	padding:14px;
	padding: 3px 16px 0;
	border:none;
	font-size:.95em;
	color: rgba(255, 255, 255, 0.75);
	text-transform:none;
	letter-spacing:0;
	transition: all 0.2s ease-in-out;
}
#site-nav li li a {
	height:auto;
	display:block;
	float:none;
	margin:0 15px;
	padding:12px 0;
	border-bottom:1px solid #ececec;
	font-size:.7em;
	word-break: break-word;
}
#site-nav li li li a {
	font-size:.65em;
}
#site-nav ul.menu ul.sub-menu li:last-child a,
#site-nav ul ul.children li:last-child a {
	border-bottom: none;
}
#site-nav ul.menu ul.sub-menu li ul.sub-menu li a,
#site-nav ul ul.children li ul.children li a {
	border-bottom: 1px solid #ececec;
}
#site-nav ul.menu ul.sub-menu li ul.sub-menu li:last-child a,
#site-nav ul ul.children li ul.children li:last-child a {
	border-bottom: none;
}
#site-nav li a:hover {
	background:none;
	color: rgba(255, 255, 255, 1) !important;
}
#site-nav li li a:hover {
	background:none;
	color:#333 !important;
}
#site-nav ul li:hover > ul {
	display: block;
	color:#909090;
	transition: all 0.5s ease-in-out;
}
#site-nav li:hover > a {
	color:#fff;
}
#site-nav li li:hover > a {
	background:none;
	color:#333 !important;
}
/* --- Site Nav Search --- */
#site-nav-container #searchform ::placeholder {
	color: rgba(255, 255, 255, 0.75);
}
#site-nav-container #searchform .placeholder {
	color: rgba(255, 255, 255, 0.75);
}
#site-nav-container #searchform {
	position:relative;
	float: right;
	margin-top:12px;
	margin-bottom:12px;
	padding: 0;
	background:none;
}
#site-nav-container #searchform div {
	margin: 0;
}
#site-nav-container #s {
	position:relative;
	width: 58px;
	height: 35px;
	padding:0 0 0 33px;
/*---	background:#f55243 url(https://www.schablonen-technik.de/wp-content/themes/waipoua/images/search-white.png) 10px 10px no-repeat;---*/
	border:none;
	font-size:1.05em;
	color: rgba(255, 255, 255, 0.75);
	transition: all 0.4s ease;
}
#site-nav-container #s:focus {
	width: 210px;
}
#site-nav-container #s:focus::placeholder {
	color:#afafaf;
}
}


@media screen and (min-width:1080px) {
	#wrap, #site-nav-container, #site-info, #content.fullwidth, .l-subheader-h, .post-wrap {
		max-width: 1024px;
	}
}


@media screen and (min-width: 1170px){
	#wrap, #site-nav-container, #site-info, #content.fullwidth, .l-subheader-h, .post-wrap {
		max-width: 1110px;
	}
}

@media screen and (min-width: 1440px){
	#wrap, #site-nav-container, #site-info, #content.fullwidth, .l-subheader-h, .post-wrap {
		max-width: 1280px;
	}
}


img.wp-post-image {
    width: 100%;
}
.post-thumbnail-link {display:block;margin-bottom:1em}

html {scroll-behavior: smooth;}
.tm4em {margin-top:4em}
.page-content ul{padding:2px;margin:1em 0 0}
#toc.has-background {padding:1em}

.entry-content .h2 {
	font-family: oswald,sans serif;
	color: var(--cs-header-color);
	margin: 1.4em 0 0.6em;
	font-size: 1.7em;
}

.post-wrap {max-width: 1000px;}
.post-wrap ul {margin:0 0 30px !important;}
 
.wp-block-group p {
    margin: 0 0 1.4em;
    line-height: 1.4;
}

.padding-2em {padding:0.005em 25% 3em}

/* lyte video embed */
.ytp-gradient-top,.tC{background-image:none!important}
.tT{text-shadow: 2px 2px 2px #ccc, 2px -2px 2px #ccc, -2px 2px 2px #ccc, -2px -2px 2px #ccc, 2px 0px 2px #ccc, 0px 2px 2px #ccc, -2px 0px 2px #ccc, 0px -2px 2px #ccc;color:#000!important}
.lyte_disclaimer {
	display: none;
	padding: .25em .5em;
	border: 2px solid steelblue;
	width: 100%;
	bottom: 0;
	position: relative;
	background: var(--cs-semiwhite-background-color);
}
.entry-content .is-provider-youtube {
	position:relative;
	padding-bottom:4em;
}

.entry-content .is-provider-youtube:hover .lyte_disclaimer {
	display: inline-block;
}
.play {
    top: calc(50% - 31px - 5em)!important;
}


/* archive-flexcard */
.archive-flexcard {
	background-color: var(--color-content-bg-alt);
	box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
	border-radius: 12px;
	overflow: hidden;
}
.archive-flexcard .wp-block-post-title {
	margin-top: .5em;
}

.archive-flexcard .aspect-16-9 {
    object-fit: cover;
    aspect-ratio: 16/9
}
.archive-flexcard > div, 
.archive-flexcard >  .wp-block-post-title {
	padding-left: .5rem;
	padding-right: .5rem;
}
.card-readmore {
	margin: .9em 0 1.8em;
}



/* improve gallery flex */
.no-flex-grow figure.wp-block-image:not(#individual-image) {flex-grow: inherit}
.no-flex-grow{flex-grow:inherit!important}
.is-layout-flex {display:flex;flex-flow:row wrap;row-gap: 1em}

@media (max-width: 1439px){
 .wp-block-gallery.has-nested-images.columns-default figure.wp-block-image:not(#individual-image) {
   width: calc(50% - var(--wp--style--unstable-gallery-gap, 16px)/2);
}
}

@media (max-width: 599px){
 .wp-block-gallery.has-nested-images.columns-default figure.wp-block-image:not(#individual-image) {
	 width: 100%;
}
}
.space-evenly {justify-content:space-evenly}
.fontweight400 {font-weight:normal;	font-family: oswald,sans serif;
}



/* root colors */
:root {
  --cs-bg-blue-1: #6397bf; /* HSB Gradient mit Easing */
  --cs-bg-blue-2: #4b75a4;
  --cs-bg-blue-3: #273e72;
  --cs-bg-blue-4: #182657;
/* light color-scheme */
  --cs-background-color: #eee;
  --cs-background-color-2: #f5f5f5;
  --cs-background-color-3: #f8f8f8;
  --cs-super-silver-color: #ddd;
  --cs-primary-color: #cc296d;
  --cs-primary-color-hover: #cca3b4;
  --cs-text-color: #333;
  --cs-text-color-hover: #ccc;
  --cs-text-blue: #182657;
  --cs-link-color: #3C6F9A;/*#4279A8;*/
  --cs-link-color-hover: #182657; /*#909090; */
  --cs-menu-bg-color: #182657;
  --cs-vheader-color: #4c4a4a;
  --cs-header-color: #4c4a4a;
  --cs-header-color-hover: #4279A8;
  --cs-subheader-bg: #eee;
  --cs-subheader-text: #333;
  --cs-white-background-color: #fff;
  --cs-semiwhite-background-color: rgba(255,255,255,.9);
  --wp--preset--color--distant-wind-chime: #ebeff2;
  --color-content-bg-alt: #e9ecf0;
}
@media screen and (prefers-color-scheme: dark) {
  :root {
/* dark color-scheme */
    --cs-background-color: #222;
    --cs-background-color-2: #1d1d1d;
    --cs-background-color-3: #161a1e;
    --cs-super-silver-color: #333;
    --cs-primary-color: #cc296d;
    --cs-primary-color-hover: #cca3b4;
    --cs-text-color: #ddd;
    --cs-text-color-hover: #f00;
    --cs-text-blue: #4064e5;
    --cs-link-color: #80c8ff;
    --cs-link-color-hover: #4064e5; /* #d9d9d9; */
    --cs-menu-bg-color: #182657;
    --cs-vheader-color: #ccc;
    --cs-header-color: #ccc;
    --cs-header-color-hover: #f00;
    --cs-subheader-bg: #333;
    --cs-subheader-text: #eee;
	--cs-white-background-color: #e6e6e6;
	--cs-semiwhite-background-color: rgba(0,0,0,.9);
	--wp--preset--color--distant-wind-chime: #111213;
	--color-content-bg-alt: #141618;
  }
/* _5_custom.css
	.has-white-color { color: var(--cs-background-color); }
	.has-white-background-color { background-color: var(--cs-background-color); }
	.has-super-silver-color { color: var(--cs-background-color-2); }
	.has-super-silver-background-color { background-color: var(--cs-background-color-2); }
	.has-distant-wind-chime-color { color: #111213; }
	.has-distant-wind-chime-background-color { background-color: #11f213; }
	.has-dark-slate-grey-color { color: var(--wp--preset--color--dark-slate-grey); }
	.has-dark-slate-grey-background-color { background-color: var(--wp--preset--color--dark-slate-grey); }
	.has-black-color { color: var(--wp--preset--color--super-silver); }
	.has-black-background-color { background-color: var(--wp--preset--color--super-silver); }
*/
  img {
	  filter: brightness(.85) contrast(1.15)
  }
  #site-title img {
	  filter: brightness(3.6)
  }
}


/* Screen width dependend */

@media screen and (min-width: 0px) {
    .cta87 {
        font-size: 1.25rem
    }
	.page-header { padding: .5em }
}

@media screen and (min-width: 480px) {
    .cta87 {
        font-size: 1rem
    }
}

@media screen and (min-width: 783px) {
	.page-header { padding: 0 }
    #wrap { font-size: 1.25rem }

    .single-post .entry-content p, .entry-content p, .entry-summary p {
        font-size: 1em;
        line-height: 1.5
    }
}

@media screen and (min-width: 1024px) {
    #content article>header,#content article>div,#content article>footer {
        padding-left: 1em;
        padding-right: 1em;
        padding-left: 0;
        padding-right: 0;
    }

    aside.entry-details {
        position: relative
    }
}


/* --- Font-weight --- */
body {
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: 300; /* Explicitly use the 300 weight */
}

b, strong {
    font-weight: 400; /* Explicitly use the 400 weight */
}
/* --- /Font-weight --- */


/* --- Globale Typografie-Einstellungen --- */
html {
  font-size: clamp(1rem, 0.7039rem + 0.5263vw, 1.125rem);
  line-height: 1.5;
}

/* --- Block "Teaser" --- */

/* Basis-Einstellungen für den Teaser-Container selbst.
 * Die Schriftgröße kommt vom Body, wenn sie nicht hier explizit in 'rem' überschrieben wird.
 */
.teaser-base {
	font-size: 1.25rem;
  line-height: 1.2; /* etwas engere Zeilenhöhe für den Teaser-Block */
}

.teaser-base.is-layout-flex {
	gap: 3em; 
}

.teaser-base figure, .teaser-base img {
	border-radius: 12px;
}

/* p und ul sollen wie Absätze zu wirken */
.page #content .teaser-base p,
.page #content .teaser-base ul {
	margin-top: 0;
	margin-bottom: 0.6em;
	font-size: inherit;
	line-height: inherit;
}

.teaser-base li {
  margin-top: 0;
  margin-bottom: 0;
}


.wp-block-media-text.teaser2 > .wp-block-media-text__content{
	padding:0;
}
.wp-block-media-text.teaser2 {
	column-gap: 1.5em;
	grid-template-columns: 1fr 1fr;
}
.wp-block-media-text.teaser2 > .wp-block-media-text__content p {
	font-size: 1rem;
	line-height: normal;
	font-weight: 300;
	margin-bottom: 1rem;
	hyphens: manual;
}

.wp-block-media-text.teaser2 > .wp-block-media-text__content p:first-child {
    font-size: 1.5rem;
}

.wp-block-media-text.teaser2 > .wp-block-media-text__content p strong {
    font-weight: 500;
}

.wp-block-media-text.teaser2 > .wp-block-media-text__content p:last-child {
    margin-bottom: 0;
}

/* --- /Block "Teaser" --- */


:root .entry-content :where(.is-layout-flex) {
    column-gap: 3em;
}

.row-reverse {
	flex-direction: row-reverse;
}




/* =End of File
-------------------------------------------------------------- */