/*
Theme Name: Twenty Twenty-Five
Theme URI: https://wordpress.org/themes/twentytwentyfive/
Author: the WordPress team
Author URI: https://wordpress.org
Description: Twenty Twenty-Five emphasizes simplicity and adaptability. It offers flexible design options, supported by a variety of patterns for different page types, such as services and landing pages, making it ideal for building personal blogs, professional portfolios, online magazines, or business websites. Its templates cater to various blog styles, from text-focused to image-heavy layouts. Additionally, it supports international typography and diverse color palettes, ensuring accessibility and customization for users worldwide.
Requires at least: 6.7
Tested up to: 6.8
Requires PHP: 7.2
Version: 1.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyfive
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news
*/

/*
 * Link styles
 * https://github.com/WordPress/gutenberg/issues/42319
 */
a {
	text-decoration: none !important;
	text-decoration-thickness: 0px !important;
	text-underline-offset: .1em;
}

/* Focus styles */
:where(.wp-site-blocks *:focus) {
	outline-width: 0px;
	outline-style: solid;
}

/* Increase the bottom margin on submenus, so that the outline is visible. */
.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation-item:not(:last-child) {
	margin-bottom: 3px;
}

/* Increase the outline offset on the parent menu items, so that the outline does not touch the text. */
.wp-block-navigation .wp-block-navigation-item .wp-block-navigation-item__content {
	outline-offset: 4px;
}

/* Remove outline offset from the submenus, otherwise the outline is visible outside the submenu container. */
.wp-block-navigation .wp-block-navigation-item ul.wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	outline-offset: 0;
}

/*
 * Progressive enhancement to reduce widows and orphans
 * https://github.com/WordPress/gutenberg/issues/55190
 */
h1, h2, h3, h4, h5, h6, blockquote, caption, figcaption, p {
	text-wrap: pretty;
}

/*
 * Change the position of the more block on the front, by making it a block level element.
 * https://github.com/WordPress/gutenberg/issues/65934
*/
.more-link {
	display: block;
}

/* ALLL THIS BELOW HERE SHALL GO TO THE CHIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIILD THEME ONE DAY SOON ... yeay ...*/
/* Verhindert Zeilenumbruch in ausgewählten Überschriften  */
/*2025_07_01*/
.no-wrap {
  white-space: nowrap;
  overflow: show;        /* no clipping looks better, just smaller the font 4 mobile */
  text-overflow: ellipsis; 
}

/*free and healthy mobile kleinersetzen mittels css klasse die if= screen < 699px then = font height = 1,4rem setzt */
@media screen and (max-width: 599px) {
  .freeandhealthy {
    white-space: wrap !important;
	overflow: clip !important;
	border-bottom: 0px !important;
	border-top: 0px !important;
  }
}

@media screen and (min-width: 1081px) {
	.freeandhealthy {
		border-bottom: 3px solid black;
		border-top: 3px solid black; 
	}
	
}

/*NEW LINKSTYLES 2025_06_30 */

/* ============== 1) Primär-Link ================= */
.link-primary,
.link-primary:visited {
    color: #E4DFCD;         /* Grundfarbe */
    text-decoration: none;        /* Kein Unterstrich */
    transition: color .25s ease;  /* Weicher Farbübergang */
}

.link-primary:hover,
.link-primary:focus-visible {      /* Tastaturfokus nicht vergessen */
    color: #FFFFFF;          /* Hover-/Fokus-Farbe */
    outline: none;			/* WEG mit dem highlight SHICE */
    outline-offset: 2px;
}

/* ============== 2) Sekundär-Link =============== */
.link-secondary,
.link-secondary:visited {
    color: #B39F80 !important;
    text-decoration: none;			/* WEG mit dem konturlinien SHICE */
    transition: color .25s ease;	
}

.link-secondary:hover,
.link-secondary:focus-visible {
    color: #111111 !important;
    outline: none;			/* WEG mit dem konturlinien SHICE */
    outline-offset: 2px;
}

/* ============== 3) Akzent-Link ================= */
.link-accent,
.link-accent:visited {
    color: #7D0B0C !important;
    text-decoration: none;			/* WEG mit dem konturlinien SHICE */
    transition: color .25s ease;
}

.link-accent:hover,
.link-accent:focus-visible {
    color: #111111 !important;
    outline: none;			/* WEG mit dem konturlinien SHICE */
    outline-offset: 2px;
}


/* ============== 4) Akzent-Link ================= */
.link-accent2,
.link-accent2:visited {
    color: #7E7F81 !important;
    text-decoration: none;			/* WEG mit dem konturlinien SHICE */
    transition: color .25s ease;
}

.link-accent2:hover,
.link-accent2:focus-visible {
    color: #111111 !important;
    outline: none;			/* WEG mit dem konturlinien SHICE */
    outline-offset: 2px;
}

/* Link Hover > Red */
.hover-link-red a:hover {
    color: #7d0b0c !important;
    border-bottom: none !important;
}


/* HAMBURGER MENÜ COLORCHANGE */
/*geschlossenes HAMBURGERMENÜ mit dunkelbeechem Hamburgerzeichen und sonst nur hellbeechem Hintergrund*/
@media (max-width:599px){
    .wp-block-navigation__responsive-container-open{
        background-color:#e4dfcd !important; /*hellbeecher Background im Block des Hamburgerzeichens*/
		color: #b39f80 !important; /*dunkel beeches hamburgersymbol */
		
    }
}

/* -.- das Menüüüüü */

@media (max-width: 599px) {
    /* Äußerer Header‑Wrapper */
    .wp-block-group.alignfull.has-custom-beech-dunkel-background-color {
        background-color: #e4dfcd !important;   /* HELLLES BEECH um den Block des Zeichens drum herum -.- */
            }
}

/* geöffnetes HAMBURGERMENÜ mainbody */
@media (max-width: 599px){
	.wp-block-navigation__responsive-container .wp-block-navigation__responsive-container-content {
		background-color:#e4dfcd !important; /*helle Farbe für den Background*/
		color: #b39f80 !important; /*dunkel beeche Schrift */
	}
}
/* geöffnetes HAMBURGERMENÜ mainbody margins */
@media (max-width: 599px){
	.wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open {
		background-color:#e4dfcd !important; /*helle Farbe für den Background*/
	}
} 

/* den Seperator beseitigen am untere Ende des Headers */

.wp-block-separator.has-alpha-channel-opacity {      /*nicht als inheritor, junge! Check your damn typingK!*/
    border: none !important;
    box-shadow: none !important;  /* falls es ein Schatten war */
}

/* das "X" zum Schließen des Menüs wieder sichtbar machen, was beim globalen restyle der Headerschriftfarbe auch hellbeech gestyled wurde .... */
.wp-block-navigation__responsive-container-close.wp-block-navigation__responsive-container-close.wp-block-navigation__responsive-container-close {
		color: #b39f80;
}

/* Die TOGGLEBOX mit SHOWBUTTON */

.showbutton {
  display: inline-block;
  background-color: rgb(179, 159, 128);
  color: #e4dfcd;
  padding: 5px 15px 3px 15px;
  border-radius: 5px;
  text-decoration: none;
  cursor: pointer;
}

.showbutton:hover {
  color: white;
}

.togglebox {
  background-color: #e4dfcd;
  padding: 0px 20px 0px 20px;
  margin-top: 15px;
  border-left: 5px solid #b39f80;
	border-right: 5px solid #b39f80;
  border-radius: 5px;
}

/* Die unterschiedlichen BOX Typen von Friedrich übernehmen: Angefangen mit der "cyrillbox" */
.cyrillbox {
    background-color: rgb(238, 238, 238);
    border-radius: 10px;
    padding: 20px;
    margin: 0 0 0px 0;
    font-size: 200%;
    line-height: 1.2;
    font-weight: 600;
    width: 100%;
	box-sizing: border-box;
    position: relative;
}

/* Die definition für mobilgeräte, damit die boxen nicht zu groß werden:*/
@media screen and (max-width: 599px) {
  .cyrillbox {
    font-size: 100%;
  }
}

/* Definitionen für die Show Klasse und red Klasse auch für Screens <599 */

.smallcaps {
	font-variant-caps:small-caps;
	font-feature-settings: smcp;
}

.red {
  color: rgb(125, 11, 12);
}
.show {
    font-size: 1.0em;
    font-weight: 600;
    line-height: 15%;
    padding: 10px 0 0 20px;
}

@media screen and (max-width:599px) {
	.show {
		font-size: 1.2em;
	}
}

/*Die Localization braucht eine andere Zeilenhöhen, damit die Tables passen */
.show2 {
    font-size: 1.0em;
    font-weight: 600;
    line-height: 100%;
    padding: 10px 0 0 20px;
}
/* Die Discreten Ligaturen brauchen auch eine besondere Zeilenhöhe. Und eigentlich auch einen "margin-block-start: 0em" anstatt "1.0em" ... aber ditte jeht nüsch hier ...*/
.show3 {
	font-size: 1.0em;
	font-weight: 600;
	line-height: 130%;
	padding: 0 0 0 20px;
	}

@media screen and (max-width:599px) {
	.show2 {
		font-size: 1.2em;
	}
}
	
.showsmall {
	font-size: 1.0em;
	font-weight: 600;
	line-height: 130%;
	letter-spacing: 0,3px;
}

.captiongreen {
	font-style: italic;
	font-size: 0.5em;
	padding-right:20px;
	font-weight:600;
	text-align: right;
	color: green;
}

/* LOCALIZATION */

.PLK {
  font-family: 'Vollkorn', serif;
  font-feature-settings: "ss02";
  font-variant: normal;
}
.NLD {
	font-family: 'Vollkorn', serif;
	font-feature-settings: "ss03";
	font-variant: normal;
}
.BGR {
	font-family: 'Vollkorn', serif;
	font-feature-settings: "ss04";
	font-variant: normal;
}
.SRB {
	font-family: 'Vollkorn', serif;
	font-feature-settings: "ss05";
	font-variant: normal;
}

.mgrk {
	font-family: 'Vollkorn', serif;
	font-feature-settings: "mgrk";
	font-variant: normal;
}

.hist {
    font-feature-settings: "hist";
}

.ss01 {
    font-feature-settings: "ss01";
}

/* Hier die CSS Klasse des "new" Banners, was am Rand der Beispielboxen wie Cyrillbox klebt */
.new {
    font-weight: 700;
    font-style: normal;
    background-color: rgb(125, 11, 12);
    font-variant: small-caps;
    font-size: 18pt;
    letter-spacing: 1px;
    position: absolute;
    display: block;
    color: white;
    left: -10px;
    top: -30px;
    height: 11px;
    width: 55px;
    padding: 17px;
    border-radius: 20px;
    line-height: 30%;
}

/*TEST HIER DRUNTER DER SCROLLBOX */

#languagescrolllist {
    width: 100%;
    height: 180px;
    padding: 20px 35px 40px 40px;
    overflow-y: scroll;
    margin: 5px auto 15px auto;
    text-align: left;
    font-size: 1em;
    box-shadow: 0px -40px 30px -40px rgb(179, 159, 128) inset;
    -webkit-box-shadow: 0px -40px 30px -40px rgb(179, 159, 128) inset;
    -moz-box-shadow: 0px -40px 30px -40px rgb(179, 159, 128) inset;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

#charsetbox {
    width: 100%;
    height: 250px;
    padding: 0;
    overflow-y: scroll;
    margin: 5px auto 15px auto;
    text-align: left;
    font-size: 1em;
    box-shadow: 0px -40px 30px -40px rgb(179, 159, 128) inset;
    -webkit-box-shadow: 0px -40px 30px -40px rgb(179, 159, 128) inset;
    -moz-box-shadow: 0px -40px 30px -40px rgb(179, 159, 128) inset;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
.charmapimg {
    width: 100%;
    border: none;
}

/* Das Charset icons mit der zusätzlichen Fontdatei Vkik in WP angelegt */
.icons {
    font-family: 'Vkik';
    background-color: rgb(125, 11, 12);
    border-radius: 25px;
    text-decoration: none;
    border: none;
    outline: none;
    font-size: 6.5em;
    display: block;
    text-align: center;
    color: rgb(228, 223, 205);
    height: 120px;
    width: 120px;
    line-height: 120px;
    float: left;
    font-weight: 400;
}

/*kleinere Vollkorn-Icons für mobile, größerer paypal button */

@media screen and (max-width:599px) {
	.icons {
	font-size: 4.5em;
		}
}



.wp-block-heading-fat {
	font-family: 'Vollkorn';
	font-weight: 600;
	font-size: 1.8em;
}

.paypal {
	margin: 5px auto 0 auto;
	max-width: 65%;
}

@media screen and (max-width:599px) {
	.paypal {
		margin: 5px auto 0 auto;
		max-width: 90%;
	}
}

.wp-block-heading-fat2 {
	font-family: 'Vollkorn';
	font-weight: 600;
	font-size: 1.8em;
}

@media screen and (max-width:599px) {
	.nebenIcon {
		line-height: 1.4em !important;
		vertical-align:none !important;
	}
	
}

.nebenIcon {
    vertical-align: middle;
    padding: 0 0 0 30px;
    font-size: 1em;
    font-weight: 600;
    line-height: 0.1em;
}

.faqtitle {
	font-size:1.8em;
	line-height:1.4em !important;
}

.showfaq {
    padding: 7px 15px;
    background-color: rgb(179, 159, 128);
    color: rgb(228, 223, 205);
    display: block;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    text-decoration: none;
    border: none;
    outline: none;
    line-height: 25px;
    margin: 10px 0px;
}

.speciallink a {
    text-decoration: none;
    border-bottom: 1px dotted rgb(125, 11, 12);
}

#inusebox {
    text-align: center;
    height: 580px;
    overflow-y: scroll;
    padding: 10px;
    box-shadow: 0px -40px 30px -40px rgb(179, 159, 128) inset;
    -webkit-box-shadow: 0px -40px 30px -40px rgb(179, 159, 128) inset;
    -moz-box-shadow: 0px -40px 30px -40px rgb(179, 159, 128) inset;
}

#inusebox span {
    font-size: 0.5em;
    position: absolute;
    left: 0px;
    width: 95%;
    bottom: 0;
    text-align: left;
    vertical-align: bottom;
    padding: 10px;
    font-weight: 400;
    color: black;
    background-color: rgba(255, 255, 255, 0.6);
}

@media screen and (max-width:599px){
	#inusebox span {
	font-size: 1em !important;
	}
}

#inusebox a {
    display: inline-block;
    position: relative;
    height: 230px;
    width: 230px;
    border: 10px solid white;
    margin: 10px 7px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    overflow: hidden;
}

#inusebox a img {
    position: absolute;
    left: 0;
    height: 100%;
    top: 0%;
}

.kiste {
    width: 100%;
    max-width: 820px !important;
    margin: 0px auto 0px auto;
    padding: 0px 10px 0 10px;
    background-color: rgb(228, 223, 205);
    position: relative;
}

.chornfeld {
	width:auto;
	height:100%;
	position:relative;
	top:0;
	left:-5%;
}

.Yaotao {
	width:105%;
	height:auto;
	top:-5%;
	left:0;
}

.Tress {
	width:100%;
	height:auto;
	top:-20%;
	left:0;
}

.zumjaeger {
	width:105%;
	height:auto;
	top:-5%;
	left:0;
}

.glander {
	height:170%;
	top:-25%;
	left:-93%;
	
}

.redem {
    font-style: italic;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: rgb(125, 11, 12);
}


/* Hiernach kommen die Footer Klassen */

.seitenfuss {
    text-align: center;
    margin: 0px auto;
    font-size: 0.85em;
    color: rgb(126, 127, 129);
    padding: 40px 0 40px 0;
}

.downloadcaption {
    font-size: 1em;
    color: rgb(126, 127, 129);
    font-weight: 400;
}