/*
Projekt       : Aupairscout
Komponente    : Wordpress
Datei         : style.css
Beschreibung  : Spezielle Anpassungen des Themes "twentytwentythree" für die Website "aupairscout.com"
Author:         Datenwege Informatik
Author URI:     http://Datenwege-Informatik.de
Template:       twentytwentythree
Version:        1.0
Historie
   04.09.23  Gernot Daum  Beginn der Implementierung
*/

/* Fonts */
@font-face {
  font-family: 'Carnas Light';
  font-style: normal;
  src: url('assets/fonts/CarnasLight.woff2') format('woff2'),
       url('assets/fonts/CarnasLight.woff') format('woff'),
       url('assets/fonts/CarnasLight.ttf') format('truetype'),
       url('assets/fonts/CarnasLight.eot') format('embedded-opentype');
}
@font-face {
  font-family: 'fontello';
  font-style: normal;
  src: url('assets/fonts/fontello.woff2') format('woff2'),
       url('assets/fonts/fontello.woff') format('woff'),
       url('assets/fonts/fontello.ttf') format('truetype'),
       url('assets/fonts/fontello.eot') format('embedded-opentype');
}
@font-face {
  font-family: 'FontAwesome Solid';
  font-style: normal;
  src: url('assets/fonts/fa-solid-900.woff2') format('woff2'),
       url('assets/fonts/fa-solid-900.woff') format('woff'),
       url('assets/fonts/fa-solid-900.ttf') format('truetype'),
       url('assets/fonts/fa-solid-900.eot') format('embedded-opentype');
}

/* Eigene Konstanten body */
body {
	/*   Farben */
	--wp--apsc--color--black: #333943;
	--wp--apsc--color--grey: #989ba4;
	--wp--apsc--color--grey-dark: #51505a;
	--wp--apsc--color--grey-light: #f0f0f0;
	--wp--apsc--color--leave-green: #72b659;
	--wp--apsc--color--orange: #ffbd03;
	--wp--apsc--color--yellow: #fff600;
	--wp--apsc--color--turquoise: #37a187;
	--wp--apsc--color--turquoise-dimmed: rgba(127, 217, 187, 0.6);
	--wp--apsc--color--turquoise-light: #7fdabb;
	--wp--apsc--color--leave-green-light: rgba(140, 193, 82, 0.6);
  --wp--apsc--color--red: #db2929;
	--wp--apsc--color--contrast: #222e41;
	--wp--apsc--color--background: var(--wp--apsc--color--contrast);
	--wp--apsc--gradient-aupair1: linear-gradient(135deg, var(--wp--apsc--color--turquoise) 0%,
	                              var(--wp--apsc--color--leave-green) 50%, var(--wp--apsc--color--turquoise) 100%);
	--wp--apsc--gradient-aupair2: linear-gradient(135deg, var(--wp--apsc--color--turquoise-light) 0%,
	                              var(--wp--apsc--color--turquoise) 50%, var(--wp--apsc--color--leave-green) 100%);
	--wp--apsc--gradient-aupair3: linear-gradient(135deg, var(--wp--apsc--color--yellow) 0%,
	                              var(--wp--apsc--color--leave-green) 50%, var(--wp--apsc--color--yellow) 100%);
	--wp--apsc--gradient-aupair4: linear-gradient(135deg, var(--wp--apsc--color--leave-green) 0%,
	                              var(--wp--apsc--color--yellow) 50%, var(--wp--apsc--color--leave-green) 100%);

	/*   Schriften */
	--wp--preset--font-family--system-font: "Arial", -apple-system, BlinkMacSystemFont, sans-serif;
	--apsc--font-size--xx-small: clamp(7pt, 0.7vw, 10pt);
	--apsc--font-size--x-small: clamp(8pt, 0.8vw, 12pt);
	--apsc--font-size--small: clamp(9pt, 1vw, 14pt);
  --apsc--font-size--regular: clamp(12pt, 1.25vw, 16pt);
  --apsc--font-size--medium: clamp(14pt, 1.4vw, 20pt);
  --apsc--font-size--large: clamp(16pt, 1.7vw, 24pt);
  --apsc--font-size--x-large: clamp(24pt, 2.6vw, 40pt);
  --apsc--font-size--huge: clamp(36pt, 4vw, 54pt);

  /*   Breiten und Abstände */
  --global--spacing-unit: 15px;
  --global--spacing-small: var(--global--spacing-unit);
  --global--spacing-regular: calc(2 * var(--global--spacing-unit));
  --global--spacing-horizontal: var(--global--spacing-small);
  --global--spacing-vertical: var(--global--spacing-regular);
  --global--spacing-section: calc(2.5 * var(--global--spacing-vertical));
  --default-outer-margin-mult: 4;
	--default-outer-margin: calc(var(--default-outer-margin-mult) * var(--global--spacing-horizontal));
	--default-outer-spacing: calc(2 * var(--default-outer-margin));
  --global-seam: 6px;

  --street-width: 1440px;
  --responsive--street-width: min(calc(100vw - var(--default-outer-spacing)), var(--street-width));
  --constriction-width: 1200px;
  --responsive--constriction-width: min(calc(100vw - var(--default-outer-spacing)), var(--constriction-width));
  --single-track-width: 800px;
  --responsive--single-track-width: min(calc(100vw - var(--default-outer-spacing)), var(--single-track-width));
  --path-width: 560px;
  --responsive--path-width: min(calc(100vw - var(--default-outer-spacing)), var(--path-width));
  --wp--style--global--wide-size: var(--street-width);
  --wp--style--global--content-size: var(--constriction-width);
  --margin-street: max(var(--default-outer-margin), calc((100vw - var(--street-width)) / 2));
  --margin-constriction: max(var(--default-outer-margin), calc((100vw - var(--constriction-width)) / 2));

  /*   Diverses */
  --wp--custom--spacing--small: max(12pt, 1vw);
  --wp--custom--slick-dot-size: 24px;
  --wp--custom--navigation-icon-size: 36px;
  --apsc-button-border-radius: 10px;
}

/* 		Design "aupair" */
#content .overlay.aupair {
  display: flex;
	flex-direction: column;
  justify-content: center;
  height: 100%
}
.aupair h1.left {transform: translateX(-15%); text-align: left}
.aupair h1.right {transform: translateX(15%); text-align: right}
figure.aupair img {
	border: 2px solid var(--wp--apsc--color--turquoise);
	border-radius: var(--apsc-button-border-radius)
}
.aupair .wp-block-column {
	display: flex;
	flex-direction: column;
  justify-content: center;
}
.aupair .wp-block-buttons {
	--js-column-gap: var(--global--spacing-unit);
	column-gap: var(--js-column-gap)
}
.aupair .wp-block-button {
	width: calc(80% - var(--js-column-gap) / 2);
	max-width: 220px;
  margin: 0 auto
}
.aupair.navigation .wp-block-button, .aupair .wp-block-button.broad {max-width: 240px}
.shortcode-message, .ajax-response {
	width: 100%;
	padding: 2px 6px;
	color: white;
  background: var(--wp--apsc--gradient-aupair1);
  font-size: var(--apsc--font-size--small);
  text-align: center
}
.shortcode-message.error, .ajax-response.error {
	color: var(--wp--apsc--color--contrast);
  background: var(--wp--apsc--color--orange)
}
.aupair .wp-block-button__link, li.aupair a, 
.apsc-action-button, .checkout .wp-element-button {
	width: 100%;
	max-width: 240px;
	padding: 10px 15px 10px 15px;
	color: white;
  background: var(--wp--apsc--gradient-aupair1);
  border-radius: var(--apsc-button-border-radius);
  font-size: var(--apsc--font-size--small);
  text-align: center
}
.checkout .wp-element-button {max-width: 340px}
.apsc-action-button {padding: var(--global-seam); cursor: pointer}
.apsc-action-button.wait {cursor: wait}
.aupair .wp-block-button__link:hover, li.aupair a:hover, 
.apsc-action-button:hover, .checkout .wp-element-button:hover
{background-size: 200% 200%}
.aupair .wp-block-button.highlighted a {background: var(--wp--preset--color--tertiary)}
.aupair .wp-block-button.highlighted a:hover {opacity: 0.5}

.aupair .wp-block-buttons.price {padding:0}
.aupair .wp-block-buttons.price:hover{background: var(--wp--preset--color--tertiary)}
.aupair .price .wp-block-button {width: 100%; max-width: none}
.aupair .price .wp-block-button__link {
  color: var(--wp--preset--color--contrast);
  background: transparent;
  font-size: var(--apsc--font-size--medium)
}
.aupair.um-profile-body {text-align: center }
.aupair.um-profile-body .wp-block-button {max-width: 400px}
.aupair.panel {width: 100%; margin-top: var(--global--spacing-vertical)}
.aupair.panel h4 {margin: 0}
.aupair i.icon {
	margin-right: var(--global-seam);
	font-family: 'fontello';
	font-style: normal;
	color: var(--wp--apsc--color--turquoise)
}
.menu-item.icon a::before {
	margin-right: var(--global-seam);
	font-family: 'fontello';
	font-style: normal;
}
.icon.mail::before {content: '\e818'}
.icon.phone::before {content: '\e8f9'}
.icon.location::before {content: '\e848'}
.icon.login a::before {content: '\e8c3'}
.icon.logout a::before {content: '\e80b'}
.icon.space::before {content: '\a0\a0\a0'}

/*     dunkle Variante */
.aupair.scheme-dark {
	color: white;
	background: var(--wp--apsc--color--background)
}
.aupair.scheme-dark p {color: var(--wp--apsc--color--grey)}
.aupair.scheme-dark ul {
  list-style: none;
  padding-left: var(--global--spacing-horizontal)
}
.aupair.scheme-dark ul li::before {
  display: inline-block;
  content: "\2022";
  color: var(--wp--apsc--color--turquoise);
  width: var(--global--spacing-horizontal);
  margin-left: calc(-1 * var(--global--spacing-horizontal));
}
.aupair.scheme-dark input[type="submit"] {
	color: white;
  background: var(--wp--apsc--gradient-aupair1)
}

/* Theme Reset des äußeren Rahmens */
.wp-site-blocks  {padding-top: 0; padding-bottom: 0}
.entry-content {padding: 0}
.has-global-padding > .alignfull {margin-left:0; margin-right: 0}
main#content .entry-content > *:where(:not(.alignfull):not(.alignleft):not(.alignright):not(.single-track):not(.path)) {
  max-width: var(--responsive--constriction-width);
}
#content .constriction {max-width: var(--responsive--constriction-width)}
#content .single-track {max-width: var(--responsive--single-track-width)}
#content .path {max-width: var(--responsive--path-width)}

/* Allgemein */
body {font-size: var(--apsc--font-size--regular)}
.small1 {display: none}
#content .small1 {display: none}
body .is-layout-flex {gap: var(--default-outer-margin)}
h1, h2, h3, h4, h5, h6, .site-title {font-family:'Carnas Light', sans; ; font-weight: normal}
h1, :root :where(h1) {font-size: var(--apsc--font-size--x-large)}
h2, :root :where(h2) {font-size: var(--apsc--font-size--large)}
h3, :root :where(h3) {font-size: var(--apsc--font-size--medium)}
h6, :root :where(h6) {
	font-size: var(--apsc--font-size--small);
	color: var(--wp--apsc--color--turquoise)
}
a:hover {color: var(--wp--apsc--color--turquoise)}
.listcaption {margin-bottom: 4px}
.listcaption + * {margin-top: 4px; margin-block-start: 4px}
.centred {text-align: center}
.wp-block-buttons.centred {justify-content: center}
#content .no-top, #content .not-top {margin-top:0; padding-top: 0}
.checked li {
  padding: 0 0 0 1.5em;
  list-style: none;
  position: relative;
  line-height: 1.7em;
}
.checked li::before {
	margin-right: 15px;
	font-family: 'fontello';
  content: '\e8ec';
  color: white;
  background: var(--wp--apsc--gradient-aupair1);
  border-radius: var(--apsc-button-border-radius);
}
.apsc-action-param {display: none}

/* Kopf */
header {position: relative;  background: var(--wp--apsc--color--background)}
#masthead .header-navigation {gap: var(--global--spacing-horizontal)}
#menu-benutzernavigation {padding-left: 0}
.header-content {--js-height: 100px; transition: height 0.6s}
#masthead a {color: var(--wp--preset--color--base)}
#masthead a:hover {color: var(--wp--apsc--color--turquoise)}
#masthead .aupair a:hover {color: white}
header .wp-block-site-logo {margin: 0 calc(var(--default-outer-margin) / 2)}
.home .header img {
	height: 600px;
	object-fit: cover
}
.apsc-featured-image img {
  box-sizing: border-box;
  height: auto;
  max-width: 100%;
  vertical-align: bottom;
  width: 100%;
}

/* Fuß */
footer {margin-top: 0}
#footer {
	padding-top: var(--global--spacing-vertical);
	padding-bottom: var(--global--spacing-vertical);
}
#footer .wp-block-column {justify-content: flex-start}
footer .logo {
	display: block;
	max-width: 200px;
	margin: 0 auto
}
footer h2 {font-size: var(--apsc--font-size--regular)}
#footer a {
	color: white;
	text-decoration: none;
}
#footer a:not(.wp-block-button__link):hover {color: var(--wp--apsc--color--turquoise)}
footer > * {font-size: var(--apsc--font-size--small)}
footer .menu {column-gap: var(--global--spacing-unit)}
footer .newsletter {row-gap: var(--global-seam)}
footer .mc4wp-form {width: 100%; margin-top: 0}
footer .mc4wp-form-fields > * {float: left}
#footer input {
	padding: var(--global--spacing-unit);
	margin-left: 0;
	box-sizing: border-box;
	border: none
}
#footer .info-service {max-width: 550px; gap: var(--global--spacing-unit)}
.info-service .wp-block-button {width: 100%; margin-left: 0}
/*
#footer .mc4wp-form input[type="email"] {
	width: calc(70% - var(--global--spacing-unit)) !important;
	max-width: 360px;
	margin-right: var(--global--spacing-unit)
}
#footer .mc4wp-form input[type="submit"] {
	width: 30%;
	max-width: 120px
}
*/

 /* Navigation */
.menu-kopfnavigation-container, .menu-benutzernavigation-container {
	--js-menu-height: 100px;
	height: var(--js-menu-height)
}
#menu-kopfnavigation, #menu-benutzernavigation, #menu-fussnavigation {
	display: flex;
	height: 100%;
	margin: 0;
  list-style: outside none none;
}
#menu-kopfnavigation > li, #menu-benutzernavigation > li, #menu-fussnavigation > li {
	display: flex;
	align-items: center;
	height: 100%
}
#menu-kopfnavigation > li, #menu-benutzernavigation > li {
	margin-right: var(--apsc--font-size--small);
	font-size: var(--apsc--font-size--x-small)
	text-transform: uppercase;
}
#menu-kopfnavigation li.menu-item-has-children > a::after {
	margin-left: var(--global-seam);
  content: '\e828';
  font-family: 'fontello';
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  transform: translateY(-50%)
}
#menu-kopfnavigation a, #menu-benutzernavigation a {text-decoration: none}
#menu-benutzernavigation a {max-width: 120px}
#menu-kopfnavigation .current-menu-item:not(.caption) a, #menu-kopfnavigation .current-menu-ancestor a
{color: var(--wp--apsc--color--turquoise)}
#menu-kopfnavigation .sub-menu {
	display: none;
	position: absolute;
	top:0;
	z-index: 2;
	margin-top: var(--js-menu-height);
	padding: calc(2 * var(--global--spacing-unit));
	background: white;
	list-style: outside none none;
}
#menu-kopfnavigation .sub-menu li {margin-top: var(--global-seam)}
#menu-kopfnavigation .sub-menu a {color: var(--wp--preset--color--contrast)}
#menu-kopfnavigation .sub-menu a:hover, #menu-kopfnavigation .sub-menu .current-menu-item a
{color: var(--wp--apsc--color--turquoise)}
#footer .menu-fussnavigation-container {margin-left: auto}
#menu-fussnavigation li::before {content: ''}
#content .start-navigation {
	margin-top: var(--global--spacing-vertical);
	margin-bottom: var(--global--spacing-vertical)
}

/* 		Hamburger Menü */
#masthead .mnu-button {
  --js-size: 36px;
  position: absolute;
  right: 0;
  align-self: flex-start;
  width: var(--js-size);
  height: var(--js-size);
  margin: var(--global--spacing-vertical) var(--global--spacing-horizontal) 0 0;
  padding: 0;
  z-index: 1
}
#masthead .mnu-button:before {
  content: "\f0c9";
  font-family: "FontAwesome Solid";
  font-size: var(--js-size);
  line-height: 1;
  color: white;
  background: var(--wp--apsc--color--background)
  text-align: right;
  cursor: pointer
}
#masthead .header-content.mnu-opened .mnu-button:before {content: '\f00d'}

/* Inhalte */
.wp-block-post-title, .wp-block-post-excerpt__excerpt,  #pagehead .wp-block-column:nth-child(2) h2 {
	font-size: var(--apsc--font-size--large);
	text-align:center
}
#pagehead {margin-top: var(--global--spacing-vertical)}
#pagehead .wp-block-columns {padding-bottom: var(--global--spacing-vertical)}
#pagehead .wp-block-column:nth-child(2) h2 {padding-top: var(--global--spacing-unit)}
#pagehead .wp-block-column:nth-child(2) p {text-align: center}
#pagehead + .um-register, #pagehead + .insurance {margin-top: 0}
.wp-block-post-excerpt__excerpt {margin: 0}
#content .wp-block-post-title {
	margin: 0;
	max-width: none;
	padding: var(--global--spacing-vertical) var(--global--spacing-horizontal);
	color: white;
	background: var(--wp--apsc--color--turquoise-light);
}
.wp-block-post-title a {
	color: var(--wp--apsc--color--turquoise);
	text-decoration: none;
}
.wp-block-post-title a:hover {
	text-decoration: underline
}
#pagehead .wp-block-columns {
	--js-top: calc(2 * var(--global--spacing-vertical));
	--js-top: 0;
	gap: 0;
	background: var(--wp--apsc--color--grey-light)
}
#pagehead .wp-block-column:nth-child(1) {
	border: 2px solid var(--wp--apsc--color--turquoise);
	border-right: none
}
#pagehead .wp-block-column:nth-child(1), #pagehead .wp-block-column:nth-child(1) img {
	border-radius: var(--apsc-button-border-radius) 0 0 var(--apsc-button-border-radius)
}
#pagehead .wp-block-column:nth-child(2) {
	margin-top: var(--js-top);
	padding: 0 var(--global--spacing-unit);
	border: 2px solid var(--wp--apsc--color--turquoise);
	border-left: none;
	border-radius: 0 var(--apsc-button-border-radius) var(--apsc-button-border-radius) 0
}
.home #pagehead, .no-pagehead {display: none}
#pagehead .wp-block-group {margin-top: calc(var(--global--spacing-section) / 2)}
.entry-content {margin-top: 0}
#Statistik {
  margin-top: 0;
  padding: var(--global-seam) 0;
  text-align: center
}
#Statistik a {color: white; text-decoration: undeline}

/*   Abschnitte */
#content .with-background {
	background: var(--wp--apsc--gradient-aupair2);
	color: white
}
#content .with-background h6 {color: white}
#content .with-background.grey h6 {color: var(--wp--apsc--color--contrast)}
#content .wp-block-group.title {
	padding-top: var(--global--spacing-unit);
	padding-bottom: var(--global--spacing-unit)
}
#content .sub-title {margin-top: var(--global-seam)}
#content section {
	margin-top: var(--global--spacing-section);
	margin-bottom: var(--global--spacing-section);
}
#content section.near {
	margin-top: 0;
	margin-bottom: calc(var(--global--spacing-section) / 2)
}
#content section.accentuated {
	background: var(--wp--apsc--color--grey-light);
	padding: var(--global--spacing-unit)
}
#content section.with-background {
	max-width: none;
	margin: 0 !important;
	padding: var(--global--spacing-vertical) var(--margin-constriction)
	         var(--global--spacing-vertical) var(--margin-constriction);
}
#content .um-profile-body section.with-background {
	margin: 0 auto !important;
	padding: var(--global--spacing-vertical)  var(--global--spacing-horizontal);
}
#content .um-profile-body h4 {text-align: center}
#content .um-profile-body h4 + section {margin-top: 0}
#content section.with-background.alignfull {
	padding-left: var(--global--spacing-horizontal);
	padding-right: var(--global--spacing-horizontal)
}
#content .with-background.grey  {
	background: var(--wp--apsc--color--grey-light);
	color: var(--wp--apsc--color--contrast)
}
#content div.with-background.grey  {
	padding: var(--global--spacing-vertical) var(--global--spacing-horizontal)
}
#content section.small {
	padding-top: calc(var(--global--spacing-section) / 1.5);
	padding-bottom: calc(var(--global--spacing-section) / 1.5);
  background: url(/wp-content/themes/twentytwentythree-aupairscout/assets/images/Back-Small-Children.jpg)
}
#content section.title.with-background + section {
	margin-top: var(--global--spacing-unit) !important;
}
.home-header .introduction {
	margin-top: 0;
	padding: var(--global--spacing-unit)
}
#erlebnis-kinderbetreuung .wp-block-columns {
	column-gap: var(--global--spacing-unit);
	padding: var(--global--spacing-unit) 0
}

/*   Abschnitt mit Neuigkeiten */
.news {
	position: relative;
	margin-top: calc(2*var(--global--spacing-vertical));
	margin-bottom: var(--global--spacing-vertical);
  text-align: center	
}
.news .wp-block-column > * {margin-top: 0}
.news .label {
	position: absolute;
	top: calc(-2 *var(--global--spacing-vertical));
	left: -20%;
	transform: rotate(-7deg);
	padding: var(--global-seam);
	background: var(--wp--preset--color--tertiary)
}

/*   Überlagerungen */
.overlay-anchor {position: relative}

#content .overlay-anchor figure {
	margin-bottom: 0
}
.overlay, #content .overlay {
	position: absolute;
	width: 100%;
	max-width: none;
	top: 0;
	left: 0;
	margin: 0
}

/*   Ultimate Member Seiten + Formulare / Gravity Forms Formulare */
/*     Ultimate Member Styling Resets */
.um-field select {height: 40px; border: 1px solid #ddd}
.checkout .select2-container .select2-selection--single {
	height: auto;
	border-color: var(--wc-form-border-color)
}
.um-page-account #content {display: flow-root}
#content .um-link-alt {
	width: 50%;
	margin-left: auto;
	margin-right: auto;
	padding: var( --global-seam);
	opacity: 0.66;
	color: white !important;
	max-width: 300px
}
#content .um-link-alt:hover {text-decoration: none !important}
#content .um-field-error, #content .um-notice.err {background: var(--wp--apsc--color--orange)}
#content .um-field-arrow {color: var(--wp--apsc--color--orange)}
#content .um-register {color: var(--wp--apsc--color--contrast)}
#content .um input[type="submit"].um-button, #content .um input[type="submit"].um-button:focus, #content .um a.um-button,
#content .um-request-button, #content .um a.um-button.um-disabled:hover, #content .um a.um-button.um-disabled:focus,
#content .um a.um-button.um-disabled:active {
	color: white;
  background: var(--wp--apsc--gradient-aupair1)
}
#content .um strong input[type="submit"].um-button {font-weight: bold !important}
#content .um a.um-button:hover, #content .um-request-button:hover,
#content .um input[type="submit"].um-button:hover, #content .um-link-alt:hover {background: var(--wp--apsc--gradient-aupair2)}
#content .um a.um-link, #content .um-account-side li a.current span.um-account-icon,
#content .um .um-field-radio.active:not(.um-field-radio-state-disabled) i,
#content .um .um-field-checkbox.active:not(.um-field-radio-state-disabled) i,
#content .um-account-name a:hover, #content .um-message-conv-item.active,
#content .um .um-profile-subnav a.active, #content .um-online-status.online i,
#content .um-followers-rc a span
{color: var(--wp--apsc--color--turquoise)}
#content .um-verified, #content .um-profile-status.approved
{color: var(--wp--apsc--color--turquoise) !important}
#content .um .um-profile-nav-item.active a, #content .um-message-send, #content .um-modal-btn,
#content .um-profile-nav-item a:hover, #content p.um-notice.success,
#content .um .um-members-pagi span.current, #content .um .um-members-pagi span:hover
{background: var(--wp--apsc--gradient-aupair1)}
#content .um-message-textarea textarea, #content div.um div.um-form .um-message-textarea textarea {
  border: 2px solid rgba(55, 161, 135, 0.3) !important;
}
.um-profile-body.purchases .wp-block-columns {
	width: 100%;
	column-gap: var(--global--spacing-unit)
}
.um-profile-body.purchases h3 {
	margin:0 0 var(--global--spacing-unit) 0;
	color: var(--wp--apsc--color--leave-green);
	font-size: var(--apsc--font-size--small);
	text-align: center
}
.um-profile-body.purchases h4 {
	font-size: var(--apsc--font-size--x-small);
	text-align: center
}
.um-profile-body.purchases img {
	display: block;
	margin: 0 auto !important;
	max-width: 100px;
	height: auto
}
.um-profile-body.purchases th {text-align: center }
.select-type .gchoice, .select-country .gchoice {float: left; width: 140px}
#content .um-profile.um .um-profile-headericon a:hover, #content .um-profile.um .um-profile-edit-a.active {
  color: var(--wp--apsc--color--turquoise)
}
#content .um-profile.um .um-profile-headericon a.um_delete-item:hover {color: red}

/*     Profile und ..verzeichnisse*/
#content .um-members-pagination-box.before {margin-top: var(--global--spacing-vertical)}
#content .um-members-none {
	padding: var(--global--spacing-unit);
  text-align: left;
  border: 2px solid var(--wp--apsc--color--orange)
}

/*     Gravity Form Formulare */
#content .gform_wrapper {
	color: var(--wp--preset--color--contrast);
	background: var(--wp--apsc--color--grey-light);
	padding: var(--global--spacing-horizontal)
}
#content .gform_button, #content .um-register {
	max-width: var(--constriction-width);
	padding: var(--global--spacing-horizontal);
	color: white;
	background: var(--wp--apsc--color--grey-light)
}
#content .gform_button, #content input[type=submit].um-button, #content .um-do-search, #content .um-link-alt
{background: var(--wp--apsc--gradient-aupair1)}
#content .gform_button:hover, #content input[type=submit].um-button:hover, #content .um-do-search:hover
{background-size: 200% 200%}

.concise-profiles {
	display: flex;
	flex-wrap: wrap;
	gap: var(--global--spacing-unit);
	justify-content: center
}
.concise {border: 1px solid var(--wp--apsc--color--turquoise)}
.concise, .concise:hover  {
	display: block;
	padding: var(--global--spacing-unit);
	color: var(--wp--preset--color--contrast);
	text-decoration: none
}
.concise:hover  {
	color: var(--wp--preset--color--contrast);
	background: var(--wp--apsc--color--turquoise-light);
	text-decoration: none
}
.concise > * {
	display: block;
	margin: 0 auto;
	text-align: center
}
.concise img {
	--js-size: 190px;
  object-fit: cover;
	height: var(--js-size);
	width: var(--js-size)
}
.concise .header {line-height: 1.1}
.concise .country, .concise figcaption {
	font-size: var(--apsc--font-size--x-small)
}

/*   		Datumsauswahl */
.um .picker__box {background: var(--wp--apsc--color--turquoise)}
.um .picker__header, .um .picker--focused .picker__day--highlighted, .um .picker__day--infocus:hover, .um .picker__footer {
  color: var(--wp--apsc--color--contrast);
  background: var(--wp--apsc--color--turquoise-light)
}
#content .um .picker__header {color: var(--wp--apsc--color--contrast)}
#content .um .picker__nav--prev:before {border-right: 0.5em solid var(--wp--apsc--color--contrast)}
#content .um .picker__nav--next:before {border-left: 0.5em solid var(--wp--apsc--color--contrast)}
#content .um .picker__select--year {
	color: white;
  background: var(--wp--apsc--color--turquoise) !important;
}
.um .picker__nav--prev:hover, .um .picker__nav--next:hover {
  background: var(--wp--apsc--color--turquoise);
}
.um .picker__button--today, .um .picker__button--clear {
	color: var(--wp--apsc--color--contrast);
}
.um .picker__day--outfocus:hover {background: var(--wp--apsc--color--turquoise-dimmed)}

/*     Sonstiges */
#content .um .um-field .select2-dropdown .select2-results li.select2-results__option.select2-results__option--highlighted {
  background: var(--wp--apsc--color--turquoise-light)
}
#content .um-directory .um-member-directory-header .um-member-directory-header-row .um-member-directory-search-line {
  width: 100%;
}

/*   Tabellen */
.apsc-table {
	border-collapse: collapse;
	font-size: var(--apsc--font-size--x-small);
	background: white;
	border-spacing: calc(var(--global-seam) / 2)
}
#premium.apsc-table {width: 100%}
.apsc-table thead {color: white; background: var(--wp--apsc--color--turquoise)}
.apsc-table tbody tr {border: 1px solid var(--wp--apsc--color--turquoise)}
.apsc-table th {text-align: left}
.apsc-table td:nth-child(2n+1)
{background: var(--wp--apsc--color--grey-light)}
.apsc-table th, .apsc-table td {padding: var(--global-seam) calc(2 * var(--global-seam))}
.apsc-table .apsc-action-button {font-size: var(--apsc--font-size--x-small)}
.apsc-table .Chat, .apsc-popup #message-text {display: flex; flex-direction: column}
.apsc-popup #message-text {font-size: var(--apsc--font-size--xx-small)}
.apsc-table .chat-entry, .apsc-popup .chat-entry {
	width: 90%;
	margin: var(--global-seam);
	padding: var(--global-seam);
}
.apsc-table .chat-entry.sender, .apsc-popup .chat-entry.sender {
	margin-left: auto;
	background: var(--wp--apsc--color--grey-light)
}
.apsc-table .chat-entry.recipient, .apsc-popup .chat-entry.recipient {
	color: white;
	background: var(--wp--apsc--color--leave-green)
}
.apsc-table .Action .short-content {display: none}

/*   Chat Nachrichten */
.apsc-popup {display: none}
.apsc-popup.activ {display: block}
.apsc-popup .overlay-area {
  position: fixed;
  z-index: 101;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7)
}
#content .apsc-popup .overlay {
  position: fixed;
  z-index: 102;
  left: 50%;
  top: 20%;
  width:80%;
  margin-left: -250px;
  max-width: 500px;
	padding-bottom: var(--global--spacing-vertical);
	font-size: var(--apsc--font-size--x-small);
  background: var(--wp--apsc--color--turquoise);
  border-radius: var(--apsc-button-border-radius);
}
.apsc-popup .header {
	display: flex;
	height: var(--global--spacing-vertical);
	align-items: center;
	justify-content: flex-end;
	color: white;
	background: var(--wp--apsc--color--turquoise);
  border-radius: var(--apsc-button-border-radius);
}
.apsc-popup #close {
	cursor: pointer;
	width: var(--global--spacing-regular);
	font-size: var(--apsc--font-size--regular);
	text-align: center
}
.apsc-popup .content  {
	display: flex;
	flex-direction: column;
  margin-left: var(--global--spacing-regular);
	margin-right: var(--global--spacing-regular);
	background: white
}
.apsc-popup .content > * {margin: var(--global--spacing-small)}
.apsc-popup .submit-area {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	padding: var(--global-seam)
}
.apsc-popup .submit-area .counter {margin-right: var(--global-seam)}
#content .apsc-popup textarea {
	min-width: calc(100% - 2 * var(--global--spacing-small));
	max-width: calc(100% - 2 * var(--global--spacing-small))
}
.apsc-popup .apsc-action-button {
	max-width: calc(10 * var(--global--spacing-unit));
	font-size: var(--apsc--font-size--x-small);
}
.apsc-popup .empty-message {
	opacity: 0.6;
	cursor: not-allowed
}

/*   Getwid */
.wp-block-getwid-accordion {
	background: var(--wp--apsc--color--grey-light);
	padding-bottom: var(--global--spacing-vertical)
}
.wp-block-getwid-accordion .wp-block-getwid-accordion__header-wrapper:first-child {
  border: none
}
#content .wp-block-getwid-accordion__header {padding: 2px 1px}
#content .wp-block-getwid-accordion__content {
  padding: var(--global--spacing-unit) calc(2 *var(--global--spacing-unit))
}
.wp-block-getwid-accordion a {
	max-width: 240px;
	margin-left: var(--global--spacing-unit);
	padding: 5px 10px 5px 10px;
  text-align: center;
	color: white;
  background: var(--wp--apsc--gradient-aupair1);
  border-radius: var(--apsc-button-border-radius)
}
.wp-block-getwid-accordion a:hover, .wp-block-getwid-accordion .ui-accordion-header-active a {
	color: var(--wp--preset--color--contrast);
	background: var(--wp--apsc--gradient-aupair2)
}
.wp-block-getwid-accordion + * {
	margin-top: 0;
	background: var(--wp--apsc--color--grey-light)
}
#content .wp-block-getwid-accordion + .aupair .wp-block-buttons {
  margin-left: var(--global--spacing-unit);
  padding-bottom: var(--global--spacing-vertical)
}
.wp-block-getwid-accordion + .aupair .wp-block-button {
  max-width: 260px;
  margin-left: 0
}
.wp-block-getwid-accordion + .aupair .wp-block-button a {
	color: var(--wp--preset--color--contrast);
  background: var(--wp--apsc--gradient-aupair4)
}
.wp-block-getwid-accordion + .aupair .wp-block-button a:hover {
  background: var(--wp--apsc--gradient-aupair3);
	color: white
}
.faq.wp-block-getwid-accordion a {max-width: none}
.faq .wp-block-getwid-accordion a {padding: 0 10px}
.faq.wp-block-getwid-accordion a, .faq.wp-block-getwid-accordion p,
.faq.wp-block-getwid-accordion ul {width: 90%}
.faq ul, .faq ol {padding-left: 20px}
.testimonials .wp-block-getwid-content-slider-slide > * {
	display: block;
	max-width: var(--responsive--single-track-width);
	margin: 0 auto;
	text-align: center
}
.profile {
	color: var(--wp--preset--color--contrast);
	background: white;
}
#content .profile.wp-block-getwid-content-slider {border-radius: var(--apsc-button-border-radius)}
.profile img {
	max-height: 400px;
  object-fit: cover;
  border-radius: var(--apsc-button-border-radius) !important;
  transform: translateX(5%)
}
.wp-block-getwid-content-slider .slick-prev::before, .wp-block-getwid-content-slider .slick-next::before {
	font-family: 'FontAwesome Solid';
	font-size: 60px;
	color: var(--wp--apsc--color--grey-dark)
}
.wp-block-getwid-content-slider .slick-prev::before {
	margin-left: -60px;
	content: "\f0d9"
}
.wp-block-getwid-content-slider .slick-next::before {
	margin-left: 20px;
	content: "\f0da"
}

/*   Überlagerungen */
.overlay.aupair > * {
	width: 100%;
	color: white;
	text-align: center
}
#content .navigation {
	flex-wrap: wrap !important;
	gap: var(--global-seam);
	justify-content: center;
}
#content .navigation .wp-block-column {min-width: 480px; max-width: 600px}
#content .navigation .wp-block-column img {
	border: 2px solid var(--wp--apsc--color--turquoise);
	border-radius: var(--apsc-button-border-radius)
}
#content .navigation .overlay {
	top: initial;
	bottom: 30px
}

/*   Schritte */
#content .steps {
	--js-tile-size: 480px;
	justify-content: center;
  flex-wrap: wrap !important;
  gap: var(--global--spacing-unit)
}
.steps .wp-block-column {
	flex-basis: 100% !important;
	position: relative;
	color: var(--wp--preset--color--contrast);
  background-color: white;
  border-radius: var(--apsc-button-border-radius);
  max-width: var(--js-tile-size);
	height: calc(0.62 * var(--js-tile-size));
  text-align: center
}
.steps h3::before {
	display: block;
	margin-top: -40px;
  font-family: "fontello";
  font-size: var(--apsc--font-size--x-large);
  color: var(--wp--apsc--color--turquoise)
}
#content .steps h4 {margin-top: var(--global--spacing-vertical); text-decoration: none}
#content .steps h4 a {text-decoration: none}
#content .steps h4 a:hover {text-decoration: underline}
.steps div {margin-top: var(--global--spacing-unit)}
.steps p {margin-top: var(--global-seam)}
.steps .description {
	display: flex;
	flex-direction: column;
	padding: 0 var(--global--spacing-horizontal);
	font-size: 14px;
	height: calc(0.35 * var(--js-tile-size))
}
.steps .wp-block-column > * {
	display: block;
	width: 80%;
	margin-left: auto;
	margin-right: auto
}
.steps .description p:nth-child(2) {
	paddding-top: var(--global--spacing-unit);
	border-top: 1px solid var(--wp--apsc--color--turquoise)
}
.steps .price {
	margin-bottom: var(--global--spacing-vertical);
	padding: var(--global--spacing-unit);
	font-size: var(--apsc--font-size--medium);
	font-weight: bold;
  background: var(--wp--apsc--color--turquoise-dimmed);
  border-radius: var(--apsc-button-border-radius);
}
#content .steps .price p {
	top: 15px;
	line-height: 1.1;
  color: var(--wp--preset--color--contrast);
  text-align: center
}
.steps .price em {
  color: white;
	font-size: var(--apsc--font-size--x-small);
	font-style: normal
}

/*   SEO Suchseiten */
#um-frame .um-directory .um-members-wrapper {height: auto}
#um-frame .um-member-cover {height: 150px !important}
#um-frame .um-member {--js-height: 700px !important}
#um-frame .um-members-edit-btn {max-width: 160px; margin: var(--global-seam) auto}
.hidden-frame {display: none}


/*   Einbindung Versicherung */
.insurance iframe {
	--js-height: 1600px;
	height: var(--js-height);
	width: calc(100% - 2* var(--global--spacing-unit));
	border: var(--global--spacing-unit) solid var(--wp--apsc--color--grey-light)
}
/*   Sonderformatierungen in bestimmten Bereichen */
.insurance .wp-block-buttons {margin-top: var(--global-seam)}
.insurance .aupair .wp-block-button {width: 100%; max-width: none}


/*   Illustrierte Foto Uploader */
.illustrated-uploader {display: flex}
.illustrated-uploader > *:nth-child(1) {width: 55%}
.illustrated-uploader > *:nth-child(2) {width: 25%}
.illustrated-uploader > *:nth-child(3) {width: 20%}
.illustrated-uploader img {
}
.illustrated-uploader .um-field-shortcode div {
	--js-max-size: 80px;
	--js-size: var(--js-max-size);
	--js-symb-size: calc(var(--js-size) / 4);
	--js-symb-dist: calc(1.5 * var(--js-symb-size));
	position: relative;
	float: left;
	width: var(--js-size);
	max-width: var(--js-max-size)
}
.illustrated-uploader .um-field-shortcode div:before {
	position: absolute;
	width: var(--js-symb-size);
	top:  var(--js-symb-dist);
	left: var(--js-symb-dist);
  font-family: "FontAwesome Solid";
  font-size: var(--js-symb-size);
  line-height: 1;
  text-align: center
}
.illustrated-uploader div.is-ok:before {
  content: "\f00c";
  color: var(--wp--apsc--color--leave-green)
}
.illustrated-uploader div.is-not-ok:before {
  content: '\f00d';
  color: var(--wp--apsc--color--red)
}
.illustrated-uploader .um-field-shortcode img {
	width: 100%;
	vertical-align: top
}
.illustrated-uploader .um-field-shortcode, .illustrated-uploader .um-field-label {
	display: flex;
	justify-content: center
}

/*   Strukturen mit Kaufkacheln */
#content .tiles {column-gap: calc(2 * var(--global--spacing-unit)); text-align: center}
#content .tiles > * {
	max-width: 400px;
	margin-left: auto;
	margin-right: auto
}
#content .tiles.text-left {align-items: center !important}
#content .tiles.text-left > :first-child {
	max-width: none;
	text-align: left
}
#content .tiles.text-left > :last-child {
	max-width: 320px;
	max-height: 400px
}
.tiles .wp-block-column {padding: var(--global--spacing-unit)}
.tiles .front p, .tiles .back {font-size: var(--apsc--font-size--x-small)}
.tiles .front p strong {font-size: var(--apsc--font-size--regular)}
.aupair.tiles .wp-block-button {max-width: 250px}
.tiles .grey {color: white; background: #9aa2b0}
.tiles .black {color: white; background: #333943}
.tiles .green {color: white; background: #8cc152}
.tiles .grey .person::before {color: #9aa2b0}
.tiles .black .person::before {color: #333943}
.tiles .green .person::before {color: #8cc152}
.icon.person::before {
	background: white;
	padding: 10px 20px;
	border-radius: 50px;
	font-family: 'FontAwesome Solid';
	font-size: var(--apsc--font-size--x-large);
	content: '\f183';
	font-style: normal;
}


/* Responsive */

/*   Großer Bildschirm */
@media only screen and (max-width: 1600px) {
	#masthead .header-content {column-gap: 0px}
	.header-content ul {padding-left: var(--global--spacing-unit)}
	.home .header img {object-position: 0 -120px}
}

/*   Mittlerer Bildschirm */
@media only screen and (max-width: 1280px) {
  header .wp-block-site-logo {margin: 0 var(--global--spacing-unit)}
	.header-content ul {padding-left: 0}
  .header-navigation {font-size: var(--apsc--font-size--small)}
}

/*   Kleiner Bildschirm */
@media only screen and (max-width: 1120px) {
  #wpadminbar #wp-admin-bar-customize {display: none}
	.home .header img {object-position: 0 0}
}

/*   Tablett Landscape  / großer Umbruch */
@media only screen and (max-width: 960px) {
  body {--path-width: 480px}
  .wide1, #content .wide1 {display: none}
	.small1, #content .small1 {display: initial}
  div.small1, #content div.small1 {display: block}

/*     Kopfaufbau */
  #wpadminbar #wp-admin-bar-site-editor {display: none}
  #masthead .header-content {position: relative; height: var(--js-height)}
  .header-navigation, .wp-block-site-logo {position: absolute}
  #masthead .header-navigation {
  	align-items: flex-start;
  	font-size: var(--apsc--font-size--regular)
  }
  header .wp-block-site-logo {margin: 0}
  header .wp-block-site-logo, header .wp-block-site-logo a {width: 100%}
  .header-content.mnu-closed .menu-kopfnavigation-container,
  .header-content.mnu-closed .menu-benutzernavigation-container
  {display: none}
  .header-navigation, #menu-kopfnavigation, #menu-benutzernavigation
  {flex-direction: column}
  #menu-kopfnavigation, #menu-benutzernavigation {)}
/*       Untermenüs */
  .menu-kopfnavigation-container, .menu-benutzernavigation-container {height: auto}
  .header-navigation, .menu-kopfnavigation-container,
  .menu-benutzernavigation-container, #menu-kopfnavigation .sub-menu  {
  	width: 100%;
  	background: var(--wp--apsc--color--turquoise)
  }
  #menu-kopfnavigation .current-menu-ancestor a, #menu-kopfnavigation a:hover,
  #menu-kopfnavigation .sub-menu .current-menu-item a, #menu-kopfnavigation .sub-menu a:hover {
    color: var(--wp--apsc--color--turquoise-light)
  }
  #menu-kopfnavigation > li, #menu-benutzernavigation > li {
	  flex-direction: column;
	  align-items: flex-start;
	  height: auto;
	  min-height: calc(3 * var(--global--spacing-unit));
	  margin: 0;
	  padding: var(--global--spacing-unit) var(--global-seam) 0 var(--default-outer-margin);
	  border-top: 1px solid var(--wp--apsc--color--turquoise-light)
  }
  #menu-kopfnavigation > li:first-child {border-top: none}
  #menu-kopfnavigation .sub-menu {
	  position: relative;
	  margin-top: 0;
	  padding: var(--global-seam) var(--global--spacing-unit)
  }
  #menu-kopfnavigation .sub-menu li {
 	  min-height: calc(2 * var(--global--spacing-unit));
  }
  #menu-kopfnavigation li.opened .sub-menu {display: block}
  #menu-kopfnavigation .sub-menu a {color: white}
  .current-language-menu-item > a {pointer-events: none}

  .navigation .wp-block-column {max-width: 480px;	margin: 0 auto}
  .navigation.wp-block-columns {flex-direction: column; row-gap: 0}
}

/*   Tablett Portrait */
@media only screen and (max-width: 782px) {
  #wpadminbar .ab-item {width: 45px !important}
  .home .header img {height: 400px}
  .aupair h1.left {transform: translateX(-10%)}
  .aupair h1.right {transform: translateX(10%)}

  /* Inhalte */
  .breadcrumbs {display: flex; flex-direction: column}
  #pagehead .wp-block-column:nth-child(1) {
	  border-right: 2px solid var(--wp--apsc--color--turquoise);
	  border-bottom: none
  }
  #pagehead .wp-block-column:nth-child(1), #pagehead .wp-block-column:nth-child(1) img {
	  border-radius: var(--apsc-button-border-radius) var(--apsc-button-border-radius) 0 0
  }
  #pagehead .wp-block-column:nth-child(2) {
	  border-left: 2px solid var(--wp--apsc--color--turquoise);
	  border-top: none;
	  border-radius: 0 0 var(--apsc-button-border-radius) var(--apsc-button-border-radius)
  }
  .wp-block-getwid-content-slider-slide .wp-block-column {
	  margin-left: var(--default-outer-margin);
	  margin-right: var(--default-outer-margin)
  }
  .wp-block-getwid-content-slider .slick-prev::before {margin-left: 15px}
  .wp-block-getwid-content-slider .slick-next {right: 0}
  .wp-block-getwid-content-slider .slick-next::before {margin-left: 0}
  .profile img {transform: translateX(0)}
  .illustrated-uploader {flex-direction: column}
  #content .illustrated-uploader > * {width: 100%; margin: 0}
}

/*   Smartphone groß */
@media only screen and (max-width: 600px) {
	body {--default-outer-margin-mult: 2}
  .home .header img {object-position: -50px 0}
  .overlay .wp-block-buttons {gap: var(--global--spacing-unit)}
  .aupair h1.left {transform: translateX(-5%)}
  .aupair h1.right {transform: translateX(5%)}
  .aupair .wp-block-buttons {flex-direction: column}
  .aupair .wp-block-button {width: 80%; max-width: 240px}
  #content .navigation .wp-block-column {min-width: 0}
	.concise img {--js-size: 270px}
	#content .apsc-popup .overlay {left: 10%; margin-left: 0}
}

/*   Smartphone */
@media only screen and (max-width: 480px) {
	body {
	  --default-outer-margin-mult: 1;
  }
  .home .header img {object-position: -140px 0}
  .aupair h1.left {transform: translateX(-2%)}
  .aupair h1.right {transform: translateX(2%)}
}

/*   Smartphone klein */
@media only screen and (max-width: 400px) {
  #wpadminbar .ab-item {width: 38px !important}
  .home .header img {object-position: -240px 0}
}


/* Takeouts */
/*
.steps .wp-block-column::before {
	position: absolute;
	top: 10px;
	left: 10px;
	width: 50px;
	height: 50px;
  font-family: "fontello";
  font-size: var(--apsc--font-size--regular);
  line-height: 2;
  color: white;
  background: var(--wp--preset--color--tertiary);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  content: '1'
}
.steps .wp-block-column:nth-child(1):before{content: '1'}
.steps .wp-block-column:nth-child(2):before{content: '2'}
.steps .wp-block-column:nth-child(3):before{content: '3'}
.steps .wp-block-column:nth-child(4):before{content: '4'}
.steps .wp-block-column:nth-child(5):before{content: '5'}

.steps .price::before {
	--js-bubble-size: 90px;
	display: block;
	width: var(--js-bubble-size);
	height: var(--js-bubble-size);
	margin-top: -25px;
	margin-left: auto;
	margin-right: auto;
  font-family: 'FontAwesome Solid';
	content: '\f075';
	font-size: var(--js-bubble-size);
	line-height: 1;
	color: var(--wp--preset--color--tertiary)
}
*/