/*


			=== DEBUG ===


*/

/*
* {
	outline: 1px solid red;
}
*/



/*


			=== FONTS (LATIN) ===


			ExtraLight 200
			Light 300
			Regular 400
			Medium 500
			SemiBold 600
			Bold 700
			ExtraBold 800
			Black 900


			optical size range: 6..144, step: 0.1, default: 14


*/

@font-face {
  font-family: 'Source Serif 4'; /* Frank Grießhammer */
  font-style: normal;
  font-weight: 200 900;
  src: url(../fonts/source_serif_4__variable__latin.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


@font-face {
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 200 900;
  src: url(../fonts/source_sans_3__variable__latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


@font-face {
  font-family: 'Dancing Script';
  font-style: normal;
  font-weight: 400 700;
  src: url(../fonts/dancing_script__variable__latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


@font-face {
	font-family: 'Lexend Deca';
	font-style: normal;
	font-weight: 100 900;
	src: url(../fonts/lexend_deca__variable__latin.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: 'Oswald';
	font-style: normal;
	font-weight: 200 700;
	src: url(../fonts/oswald__variable__latin.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/*


			=== DEFAULTS / CUSTOM PROPERTIES ===


*/

:root {
	--menu_font: 'Source Sans 3', sans-serif;
	--sep_padding: 0.1em;
	--menu_item_padding_lr: 0.45em;
	--menu_item_padding_tb: 0.35em;
	--shadow_section_color: #D0D0D0;
	--shadow_header_color:  #D0D0D0;
	--shadow_footer_color:  #D0D0D0;
  --shadow_header_footer_margin: 4px;
  --shadow_header_footer_delta: 3px;
  --shadow_header_footer_blur: 6px;
	--header_padding: 1.5em;
	--header_logo_padding: 0.5em;
	--logo_font: 'Oswald', sans-serif;
}


html {
	font-family: 'Source Serif 4', serif;
	font-style: normal;

	font-optical-sizing: auto;
	line-height: 1.40;
}



body {
	max-width: 40em;
	margin: 0.5em auto; /* top + bottom | left + right */
	background: #F6F6EC; /* beige; */
}


html {
  scroll-behavior: smooth;
}



section {
	background: MintCream; /* #FDF9EC; cornsilk; */
	padding-top: 0.5em;
	padding-bottom: 3.5em;
	padding-left: 2.0em;
	padding-right: 1.5em;

	margin-bottom: 1px;
	box-shadow: 1px 1px 3px 0px var(--shadow_section_color);
}


#agb, #datenschutz, #widerruf, #impressum {
	background: #F0F1F0; /* #E8EAE9; #ECECEC; #E4E4E4; Gainsboro; GhostWhite; */

	margin-bottom: 1px;
	box-shadow: 1px 1px 1px 0px #D0D0D0; /* grey; */
}


/*


			=== HEADER / FOOTER ===


*/

.row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}


.column {
	display: flex;
	flex-direction: column;
	flex: 1;
}


header {
	display: flex;
	background: MediumSpringGreen;
	margin-bottom: var(--shadow_header_footer_margin);
	box-shadow:
		var(--shadow_header_footer_delta)
		var(--shadow_header_footer_delta)
		var(--shadow_header_footer_blur)
		0
		var(--shadow_header_color);
}


figure {
	width: 200px; /* 10em; */  /* 100%; */
	margin 0 auto; /* center */
	background: red;
	background: transparent;
}


.draw_line {
	display:block;
	border-bottom: 0.2em solid #48D286; 
	margin-bottom: 0.5em;
}


#header_logo {
	padding: calc( var(--header_padding) - var(--header_logo_padding) );
}


#header_pitch {
	padding: var(--header_padding);
}


#header_menu {
	align-self: end;
	padding-right: var(--header_padding);
	padding-bottom: 0.5em;
}


.logofont_main {
	font-family: var(--logo_font);
	font-size: 1.5em;
	font-weight: 600;
	line-height: 75%;
}


.logo_indent {
	padding-bottom: 1em;
}


.logo_abst {
	padding-bottom: 1em;
}


.logo_indent::before {
  content: ''; /* REQ */
	font-family: var(--logo_font);
	font-size: 1.5em;
	font-weight: 600;
	padding-left: 0.18em;
}


.logofont_sub {
	font-family: var(--logo_font);
	font-size: 0.8em;
	font-weight: 400;
	line-height: 70%;
}


.mx_logo {
	display: block;

	color: #2A3838;
	padding: var(--header_logo_padding);
	text-decoration: none;
}


.mx_logo:hover, .mx_logo:focus {
	background: Azure;
	text-decoration: none;

	border-radius: 0.2em;
/*	box-shadow: inset 0 -2px 0 0 transparent; */
}


header .mx {
	line-height: 2;
	color: #2A3838;
	width: auto;

	text-align: center;
	padding-top: var(--menu_item_padding_tb);
	padding-bottom: var(--menu_item_padding_tb);
	text-decoration: none;

	font-family: var(--menu_font);
	font-size: 1.1em;
	font-weight: 400;
}


footer {
	display: flex;
	flex 0 0 auto;
	min-height: 7rem;
	max-width: 100%;
	align-items: center;
	justify-content: center;
	background: #48D286; /* MediumSeaGreen; */ /* yellow; */
	margin-top: var(--shadow_header_footer_margin);
/*	box-shadow: 1px 1px 3px 0px var(--shadow_footer_color); */
	box-shadow:
		var(--shadow_header_footer_delta)
		var(--shadow_header_footer_delta)
		var(--shadow_header_footer_blur)
		0
		var(--shadow_footer_color);
}


footer .mx {
	line-height: 2;
	color: #2A3838; /* DarkSlateGray; */ /* green; */
	width: auto;

	text-align: center;
	padding-top: var(--menu_item_padding_tb);
	padding-bottom: var(--menu_item_padding_tb);
	text-decoration: none;

	font-family: var(--menu_font);
	font-size: 1.0em;
	font-weight: 400;
}


.sep {
	padding-left: 0.1em;
	padding-right: 0.1em;

	font-family: var(--menu_font);
	font-size: 1.0em;
	font-weight: 500;
}


p {
	color: initial;
	font-size:initial;
	text-align: left;
	margin:  0 0 0 0;
	padding: 0 0 0 0;
	margin-bottom: 0.3em;
}


#indent {
	margin-left: 1.5em;
}


strong {
	font-weight: 600;
	font-variation-settings: 'opsz' 10;
}


.musil {
	font-style: italic;
	font-weight: 600;
/*	font-variation-settings: 'opsz' 10; */
}


#motivation {
	text-align: center;
	font-size: 1em;
	margin-top: 1.5em;
	margin-bottom: 1.5em;
	text-indent: 0em;

	font-weight: 400;
	font-variation-settings: 'opsz' 10;
}


p.indent {
/*	color: red !important; */
	text-indent: 1em;
}


#intro {
	text-align: center;
	margin-bottom: 3em; 
	p {
		text-align: left;
	}
}


.textblock1 {
/*
	text-align: center;
	padding-left: 10%;
	padding-right: 10%;
*/
}


.textblock2 {
/*
	padding-left: 25%;
	padding-right: 5%;
*/
}


.textblock3 {
/*
	padding-left: 3%;
	padding-right: 15%;
*/
}


.textblock4 {
	padding-left: 15%;
	padding-right: 5%;
}


.p2 {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
}


.num {
	display: flex;
	flex: 0 0 1.5em;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: right;
	padding-right: 0.4em;
}


.alpha {
	display: flex;
	flex: 0 0 0.5em;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: left;
	padding-right: 0.2em;
}


h1 {
	text-align: center;
	margin-top: 2.5em;

	font-weight: 600;
	font-variation-settings: 'opsz' 10;
}


h2 {
	font-size: 1.1em;
	text-align: center;
/*
	text-align: left;
	margin-left: -0.5em;
*/
	margin-top: 2.3em;
	margin-bottom: 0.4em;

	font-weight: 600;
	font-variation-settings: 'opsz' 11;
}


h3 {
	font-size: 1.05em;
	text-align: center;
/*
	text-align: left;
*/
	margin-top: 1.6em;
	margin-bottom: 0.2em;

	font-weight: 600;
	font-variation-settings: 'opsz' 11;
}


.mx::before {
	content: ''; /* REQ */
	padding-left: var(--menu_item_padding_lr);
}


.mx::after {
	content: ''; /* REQ */
	padding-right: var(--menu_item_padding_lr);
}


.mx > span {
	color: inherit;
	background: transparent;
	text-decoration: none;
/*
	padding-bottom: 1px;
	box-shadow: inset 0 -2px 0 0 DimGray;
*/
}


.mx:focus, .mx:hover {
	color: black;
	background: Azure;
	text-decoration: none;

	border-radius: 0.2em;
	box-shadow: 0 0 0 0 transparent;

	box-shadow: inset 0 -2px 0 0 transparent;
}


.textlink {
	color: inherit;
	background: transparent;
	text-decoration: none;
	padding-bottom: 1px;
	box-shadow: inset 0 -1px 0 0 red; /* DimGray; red; */
}


.textlink::before {
/*	content:'>'; */
}


.textlink:focus, .textlink:hover {
	background: transparent;
	box-shadow: inset 0 -5px 0 0 springgreen;
}


/*


			=== ABOUT ===


*/


#about p {
	margin-bottom: 0.7em;
}


/*


			=== PREIS ===


*/

.preis :first-child {
	flex: 1;
	text-align: right;
	flex-wrap: nowrap;
	padding-right: 0.5em;
	font-size: 1.1em;
	font-weight: 500;
}


.preis :last-child {
	flex: 1;
	text-align: left;
	flex-wrap: nowrap;
	padding-left: 0.5em;
	font-size: 1.1em;
	font-weight: 500;
}


#rabatt {
	margin-top: 1.5em;
	margin-left: 3.5em;
}

/* === SO FAR === */