/*
 Theme Name:   Astra Borko Child
 Description:  Child Theme für Astra
 Author:       borkograph
 Template:     astra
 Version:      1.0.0
*/

/* =========================================================
   Variablen
   ========================================================= */
:root {
  --primary-color: #181f32;
  --secondary-color: #fff;
  --tertiary-color: #efebe5;
  --font-color: #181f32;

  --font-regular: "Poppins";
  --font-extralight: "Poppins";
  --font-light: "Poppins";
  --font-bold: "Poppins";

  --block-margin: 50px;
  --passepartout-size: 100px;
  --passepartout-size-mobile: 80px;
}

/* =========================================================
   Fonts
   ========================================================= */
@font-face {
  font-family: 'Poppins';
  src: url('./assets/fonts/Poppins/Poppins-ExtraLight.ttf') format('truetype');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Poppins';
  src: url('./assets/fonts/Poppins/Poppins-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Poppins';
  src: url('./assets/fonts/Poppins/Poppins-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Poppins';
  src: url('./assets/fonts/Poppins/Poppins-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* =========================================================
   Typografie
   ========================================================= */
body {
  font-family: var(--font-regular), sans-serif;
  font-weight: 400;
}

header,
footer {
  font-family: var(--font-light), sans-serif;
  font-weight: 300;
}

h1,
h2 {
  font-family: var(--font-extralight), sans-serif;
  font-weight: 200 !important;
}

h1 {
  font-size: 45px !important;
}

main a {
  font-family: var(--font-bold), sans-serif !important;
  font-weight: 600;
}

.entry-title {
  margin-bottom: var(--block-margin);
}

.ast-plain-container.ast-no-sidebar #primary {
  margin-top: var(--block-margin);
  margin-bottom: var(--block-margin);
}

/* =========================================================
   Layout / Padding
   ========================================================= */
#masthead .ast-container,
.site-content {
  padding-left: var(--passepartout-size);
  padding-right: var(--passepartout-size);
}

.site-content .ast-container {
  padding-left: 0;
  padding-right: 0;
}

/* =========================================================
   Scroll-Button
   ========================================================= */
#ast-scroll-top {
  height: var(--block-margin);
  width: var(--block-margin);
  display: flex;
  line-height: var(--block-margin);
  font-size: 20px;
  color: var(--primary-color) !important;
  background-color: var(--secondary-color) !important;
  border: 1px solid var(--primary-color);
}

.ast-scroll-to-top-right {
  right: calc(var(--passepartout-size-mobile) / 4);
  bottom: calc(var(--passepartout-size-mobile) / 4);
}

/* Kleinigkeiten */

.wpcf7 form label{
font-family: var(--font-regular), sans-serif;
  font-weight: 400;
  font-size: 16px;
}

.ueber-mich img{
  height: 100%;
  width: 100%;
}

.grecaptcha-badge{
	opacity: 0;
}
/* =========================================================
   Responsive Anpassungen
   ========================================================= */

@media (max-width: 1200px) {
  .ueber-mich-spalte {
    flex-basis: 48% !important;
  }
	.ueber-mich-spalte-bild{
		flex-basis: 50% !important;
	}
	.ueber-mich-container {
    flex-wrap: wrap !important;
	justify-content: center;
  }
}

@media (max-width: 800px) {
  .ueber-mich-spalte, .ueber-mich-spalte-bild {
    flex-basis: 100% !important;
  }
}

@media (max-width: 921.5px) {
  h1 {
    font-size: 35px !important;
  }

  .ast-header-break-point #masthead .ast-mobile-header-wrap .ast-primary-header-bar,
  .site-content,
  .site-below-footer-wrap {
    padding-left: calc(var(--passepartout-size-mobile) / 4);
    padding-right: calc(var(--passepartout-size-mobile) / 4);
  }
}