/*
 Theme Name:   Mercia Child
 Description:  Mein Child Theme
 Author:       Michael
 Author URI:   https://www.child-theme.de
 Template:     mercia
 Version:      1.0
 Text Domain:  mercia-child
*/

/* Eigene CSS-Eigenschaften ab hier einfügen */

:root {
	--primary-color: #3377bb;
	--secondary-color: #0d5195;
	--tertiary-color: #002b6f;
	--accent-color: #0d9551;
	--highlight-color: #bb3353;
	--light-gray-color: #e5e5e5;
	--gray-color: #858585;
	--dark-gray-color: #353535;
	--text-color: #353535;
	--medium-text-color: rgba(0, 0, 0, 0.45);
	--light-text-color: rgba(0, 0, 0, 0.25);
	--dark-border-color: #353535;
	--medium-border-color: rgba(0, 0, 0, 0.2);
	--light-border-color: rgba(0, 0, 0, 0.1);
	--light-background-color: rgba(0, 0, 0, 0.05);
	--link-color: #548235; /* #3377bb */
	--link-hover-color: #70ad47; /* #353535 */
	--button-color: #548235; /* #3377bb */
	--button-text-color: #fff;
	--button-hover-color: #70ad47; /* #353535 */
	--button-hover-text-color: #fff;
	--page-background-color: #fff;
	--site-title-color: #353535;
	--site-title-hover-color: #3377bb;
	--navi-color: #353535;
	--navi-hover-color: #548235; /* 3377bb */
	--navi-border-color: #515151; /* #353535 */
	--title-color: #548235; /* #353535 */
	--title-hover-color: #70ad47; /* #3377bb */
	--widget-title-color: #353535;
	--footer-text-color: #353535;
	--footer-text-hover-color: #3377bb;
	--footer-border-color: rgba(0, 0, 0, 0.1);
	--text-font: "Roboto", arial, helvetica, sans-serif;
	--title-font: "Open Sans", arial, helvetica, sans-serif;
	--navi-font: "Roboto", arial, helvetica, sans-serif;
	--widget-title-font: "Open Sans", arial, helvetica, sans-serif;
	--title-font-weight: normal; /* bold */
	--navi-font-weight: normal;
	--widget-title-font-weight: bold;
	--title-text-transform: none;
	--navi-text-transform: none;
	--widget-title-text-transform: uppercase;
	--text-line-height: 1.75;
	--title-line-height: 1.4;
}

/* div-Box */

.divbox {
	display: inline-block;
	border: 4px;
	border-style: solid;
	border-color: #e6e6e6;
	background-color: #FFFFFF;
	margin: 0px;
	margin-bottom: 5px;
	padding: 20px;
	width: 100%;
	min-width: 300px;
}

@media only screen and (min-width: 40em) {

.divbox {
	display: inline-block;
	border: 4px;
	border-style: solid;
	border-color: #e6e6e6;
	background-color: #FFFFFF;
	margin: 0px;
	margin-bottom: 5px;
	padding: 20px;
	width: 33%;
	min-width: 350px;
}
}

/* div-Box Widget-Bereich*/

.divboxwidget {
	display: inline-block;
	border: 4px;
	border-style: solid;
	border-color: #e6e6e6;
	background-color: #FFFFFF;
	margin: 0px;
	margin-bottom: 5px;
	padding: 10px;
	width: 100%;
}

/* div-Box Widget Aufzählung */

.divboxwidget ul {
	margin: 0;
	margin-left: 30px;
	padding: 0;
	list-style: none;
}

.divboxwidget ul li,
.divboxwidget ol li {
	padding: 0; /* 0.4em 0; */
	border-top: none; /* 1px solid; */
	border-color: rgba(0, 0, 0, 0.1);
	border-color: var(--light-border-color);
}

.divboxwidget ul > li:last-child {
	border-bottom: none; /* 1px solid; */
	border-color: rgba(0, 0, 0, 0.1);
	border-color: var(--light-border-color);
}

.divboxwidget ul .children,
.divboxwidget ul .sub-menu {
	margin: 0.5em 0 0.5em 1em;
	padding: 0;
}

/* div-Box Widget Link */

.divboxwidget a:link,
.divboxwidget a:visited {
	text-decoration: underline;
}

/* Buttons */

.button1 {
	display:block;
	background:#7f7f7f;
	color:#FFFFFF !important;
	line-height:2.5;
	text-align:center;
	text-decoration:none !important;
}
.button1:hover {
	background:#548235;
	color:#FFFFFF !important;
}

.button2 {
	display:block;
	background:#818181;
	color:#FFFFFF !important;
	line-height:2.5;
	text-align:center;
	text-decoration:none !important;
}
.button2:hover {
	background:#0A3761;
	color:#FFFFFF !important;
}

.button3 {
	display:block;
	background:#818181;
	color:#FFFFFF !important;
	line-height:2.5;
	text-align:center;
	text-decoration:none !important;
}
.button3:hover {
	background:#9E9E9E;
	color:#FFFFFF !important;
}

/* Vertikale Ausrichtung der Bilder */

img {
  vertical-align: middle;
}

/* Vertikale Ausrichtung Text Tabellen */

td {
	vertical-align: top;
}

/* Schriftgrößen */

h2 {
	font-size: 24px; /* 28px */
	font-size: 1.5rem; /* 1,75rem */
}

@media only screen and (min-width: 20em) {
	body,
	button,
	input,
	select,
	textarea {
		font-size: 16px;
		font-size: 1rem;
	}

	.site-title {
		font-size: 36px;
		font-size: 2.25rem;
	}

	.entry-title {
		font-size: 20px;
		font-size: 1.25rem;
	}
}

@media only screen and (min-width: 30em) {
	.entry-title {
		font-size: 22px;
		font-size: 1.375rem;
	}
}

@media only screen and (min-width: 35em) {
	.entry-title {
		font-size: 26px;
		font-size: 1.625rem;
	}
}

@media only screen and (min-width: 40em) {
	body,
	button,
	input,
	select,
	textarea {
		font-size: 18px; /* 20px 17px */
		font-size: 1.125rem; /* 1.25rem 1.0625rem */
	}

	.site-title {
		font-size: 40px;
		font-size: 2.5rem;
	}

	.site-description {
		font-size: 15px;
		font-size: 0.9375rem;
	}

	.entry-title {
		font-size: 28px;
		font-size: 1.75rem;
	}
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
	margin-top: 0.75em;
	margin-bottom: 0.75em;
	line-height: 1.4;
	line-height: var(--title-line-height);
	font-weight: normal; /* ersetzt bold */
}

/* Header Padding */

.header-main {
	padding: 0.5em 0;
}

/* Weiterlesen-Link */

.more-link {
	font-weight: normal; /* bold */
}

/* Widget Link */

.widget a:link,
.widget a:visited {
	color: #515151;
}

.widget a:hover,
.widget a:active {
	color: #70ad47;
	text-decoration: underline;
}

/* YARPP Link */

.yarpp-related a {
    font-weight: normal !important;
}

/* Bilder transparent bei hover */

a:focus img,
a:hover img {
	opacity: 0.85;
}

a:active img,
a:visited img {
	opacity: none;
}