/*
Theme Name: Gitte's Schönmalerei
Description: Dein individuelles Layout für Deine ganz persönliche Note
Author: Domenic Steffmann
Author URI: https://www.fietz-medien.de
Template: twentytwentyone
Version: 1.0
Text Domain: twentytwentyone-child
*/

@import url("https://use.typekit.net/mxo5lyz.css");

/* Abstract */
/* Abstract / Font-Face / Adore */
@font-face {
  font-family: 'Adore';
  font-style: normal;
  font-weight: 400;
  src: url('/wp-content/themes/twentytwentyoneChild/assets/font/adore/adore.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/wp-content/themes/twentytwentyoneChild/assets/font/adore/adore.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/wp-content/themes/twentytwentyoneChild/assets/font/adore/adore.woff2') format('woff2'), /* Super Modern Browsers */
       url('/wp-content/themes/twentytwentyoneChild/assets/font/adore/adore.woff') format('woff'), /* Modern Browsers */
       url('/wp-content/themes/twentytwentyoneChild/assets/font/adore/adore.ttf') format('truetype'); /* Safari, Android, iOS */
}

/* Abstract / Font-Face / Bodoni-MT */
@font-face {
  font-family: 'Bodoni MT';
  font-style: normal;
  font-weight: 400;
  src: url('/wp-content/themes/twentytwentyoneChild/assets/font/bodoni-mt/bodoni-mt-regular.ttf') format('truetype'); /* Safari, Android, iOS */
}

/* fakedes-outline */
@font-face {
  font-family: 'Fakedes Outline';
  font-style: normal;
  font-weight: 400;
  src: url('/wp-content/themes/twentytwentyoneChild/assets/font/fakedes-outline/FakedesOutline.ttf.eot'); /* IE9 Compat Modes */
  src: url('/wp-content/themes/twentytwentyoneChild/assets/font/fakedes-outline/FakedesOutline.ttf.woff') format('woff'), /* Modern Browsers */
}

:root {
  --primary:       #023C40;
  --accent:        #488a90;
  --body-bg:       #91bbc3;
  --global--color-primary: white;
  --global--color-background: var(--primary);
  --global--line-height-heading: 1.5;
  --heading-1--font-family: gautreaux, var(--global--font-primary);
  --heading-2--font-family: bodoni-urw, var(--global--font-primary);
  --heading-3--font-family: fairwater-open-serif, var(--global--font-primary);
  --heading--font-size-h1:  58px;
  --primary-nav--color-text: var(--global--color-primary);
}

/* Base */
body {
  background-color: var(--body-bg);
  text-shadow: 0 0 4px rgba(0,0,0, .3);
}

/* Base / Grid */
.col {
  flex: 1 0 0%;
}

.row {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(-1 * var(--bs-gutter-y));
  margin-right: calc(-.5 * var(--bs-gutter-x));
  margin-left: calc(-.5 * var(--bs-gutter-x));
}

.row > * {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: calc(var(--bs-gutter-x) * .5);
  padding-left: calc(var(--bs-gutter-x) * .5);
  margin-top: var(--bs-gutter-y);
}

.row-cols-2 > * {
  flex: 0 0 auto;
  width: 50%;
}

/* Base / Typography */
/* Base / Typography / Headline */
h1, .h1 {
  font-family: var(--heading-3--font-family);
}

@media (max-width: 575.98px) {
  h1, .h1 {
    font-size: 1.5rem;
  }
}

@media (max-width: 991.98px) {
  h1, .h1 {
    font-size: 2rem;
  }
}

h2 {
  font-family: var(--heading-2--font-family);
  font-size: 36px;
  margin-top: 30px;
  color: var(--primary);
  text-shadow: none;
  font-weight: 600;
}

@media (max-width: 575.98px) {
  h2 {
    font-size: 28px;
  }
}

@media (max-width: 991.98px) {
  h2 {
    font-size: 32px;
  }
}

/* Base / Utilities */
/* Base / Utilities / Text */
.text-nowrap {
  white-space: nowrap !important;
}

/* Component */
/* Component / Elementor */
/* Component / Elementor / Column */
@media (min-width: 768px) {
  .elementor-column.elementor-col-33,
  .elementor-column[data-col="33"] {
    width: 50%;
  }

  .elementor-column.elementor-col-33:last-of-type,
  .elementor-column[data-col="33"]:last-of-type {
    width: 100%;
  }
}

@media (min-width: 992px) {
  .elementor-column.elementor-col-33,
  .elementor-column[data-col="33"],
  .elementor-column.elementor-col-33:last-of-type,
  .elementor-column[data-col="33"]:last-of-type {
    width: 33.333%;
  }
}

/* Component / Elementor / Section */
/* Component / Elementor / Section / Container */
@media(min-width: 1440px) {
  .elementor-section.elementor-section-boxed > .elementor-container {
    max-width:1400px!important;
  }

  .e-container {
    --container-max-width: 1400px;
  }
}

/* Component / Elementor / Headline */
h1.elementor-size-xxl {
  font-family: var(--heading-1--font-family);
}

@media (min-width: 576px) {
  h1.elementor-size-xxl {
    font-size: 6rem !important;
  }
}

@media (min-width: 992px) {
  h1.elementor-size-xxl {
    font-size: 8rem !important;
  }
}

#index-presentation h2.elementor-size-xxl {
  font-family: var(--heading-3--font-family);
  font-size: 28px !important;
  color: white;
}

#index-presentation h2.elementor-size-xxl span {
  display: block;
  font-family: var(--heading-2--font-family);
  font-size: 44px;
  font-weight: 500;
  color: var(--accent);
  text-transform: uppercase;
  margin-top: 16px;
  margin-bottom: -18px;
}

@media (min-width: 576px) {
  #index-presentation h2.elementor-size-xxl span {
    font-size: 56px;
  }
}

@media (min-width: 768px) {
  #index-presentation h2.elementor-size-xxl {
    font-size: 42px !important;
  }

  #index-presentation h2.elementor-size-xxl span {
    font-size: 48px;
  }
}

@media (min-width: 1200px) {
  #index-presentation h2.elementor-size-xxl span {
    font-size: 72px;
    margin-bottom: -26px;
  }
}

#index-presentation h3.elementor-size-xxl {
  font-family: var(--heading-2--font-family);
  font-weight: 600;
  font-size: 23px !important;
  line-height: 1.35;
  color: var(--primary);
  text-shadow: none;
}

@media (min-width: 768px) {
  #index-presentation h3.elementor-size-xxl {
    font-size: 25px !important;
  }
}

@media (min-width: 1200px) {
  #index-presentation h3.elementor-size-xxl {
    font-size: 37px !important;
  }
}

h4.elementor-size-xxl {
  font-family: var(--heading-3--font-family);
  font-size: 32px !important;
  line-height: 1.25;
}

@media (min-width: 768px) {
  h4.elementor-size-xxl {
    font-size: 46px !important;
  }
}

@media (min-width: 1200px) {
  h4.elementor-size-xxl {
    font-size: 59px !important;
  }

  #index-open-title {
    margin-bottom: -60px;
  }
}

/* Component / Elementor / Icon */
.elementor-view-stacked .elementor-icon {
  background-color: var(--primary);
}

/* Component / Elementor / Icon */
/* Component / Elementor / Icon / Box */
.elementor-widget-icon-box .elementor-icon-box-title {
  margin-bottom: calc(var(--global--spacing-vertical) / 2);
}
.elementor-widget-icon-box.elementor-position-top .elementor-icon-box-wrapper {
  position: relative;
  border: 5px solid white;
  padding: var(--global--spacing-vertical);
  border-radius: 14px;
  text-align: left !important;
}

.elementor-widget-icon-box.elementor-position-top .elementor-icon-box-icon {
  position: absolute;
  top: -30px;
  right: -30px;
  float: right;
}

/* Component / Elementor / Image Gallery */
.elementor-image-gallery .gallery-item {
  overflow: hidden;
}

.elementor-image-gallery .gallery-columns-3 .gallery-item,
.elementor-image-gallery .gallery-columns-4 .gallery-item {
  padding-bottom: 0 !important;
}

@media only screen and (min-width: 482px) {
  .elementor-image-gallery .gallery-columns-3 .gallery-item,
  .elementor-image-gallery .gallery-columns-4 .gallery-item {
    max-height: calc(50vw - 8px);
  }
}

@media only screen and (min-width: 768px) {
  .elementor-image-gallery .gallery-columns-3 .gallery-item {
    max-height: calc(33.3333vw - 8px);
  }

  .elementor-image-gallery .gallery-columns-4 .gallery-item {
    max-height: calc(25vw - 8px);
  }
}

@media only screen and (min-width: 1140px) {
  .elementor-image-gallery .gallery-columns-3 .gallery-item {
    max-height: 455px;
  }

  .elementor-image-gallery .gallery-columns-4 .gallery-item {
    max-height: 276px;
  }
}

/* .elementor-image-gallery .gallery-item img {
  transform: translateY(-14%);
} */

/* Component / Site */
/* Component / Site / Header */
@media only screen and (min-width: 482px) {
  .site-header {
    padding-bottom: calc(var(--global--spacing-vertical) / 2);
  }
}

@media only screen and (min-width: 822px) {
  .site-header {
    padding-top: calc(var(--global--spacing-vertical) / 2);
  }
}

/* Layout */
/* Layout / Header */
#masthead {
  background-color: var(--primary);
}

/* Page */
/* Page / Index */
#index-presentation .elementor-column:nth-of-type(1),
#index-presentation .elementor-column:nth-of-type(3) {
  display: flex;
}

#index-presentation .elementor-column:nth-of-type(1) .elementor-widget-image img,
#index-presentation .elementor-column:nth-of-type(3) .elementor-widget-image img {
  width: 100% !important;
  height: auto !important;
  display: block;
}

@media (max-width: 767.98px) {
  #index-presentation .elementor-column:nth-of-type(1),
  #index-presentation .elementor-column:nth-of-type(3) {
    flex: 1 1 50%;
    max-width: 50%;
    order: 2;
  }

  #index-presentation .elementor-column:nth-of-type(2) {
    order: 1;
  }
}

@media (min-width: 1200px) {
  #index-presentation .elementor-column:nth-of-type(1) .elementor-widget-image img {
    margin-left: 55px;
  }

  #index-presentation .elementor-column:nth-of-type(3) .elementor-widget-image img {
    margin-left: -35px;
  }
}

/* Page / Content / ID-16 */
@media (min-width: 992px) {
  .page-id-10,
  .page-id-12,
  .page-id-16 {
    background-image: url('https://pawtrait4you.de/wp-content/themes/twentytwentyoneChild/assets/image/bg-bailey-half.png');
    background-repeat: no-repeat;
    background-position: right 67px;
    background-size: 25vw auto;
  }
}

@media (min-width: 992px) {
  .page-id-10,
  .page-id-12,
  .page-id-16 {
    background-position: right 80px;
    background-size: 35vw auto;
  }
}

/* Vendor */
/* Vendor / Google ReCAPTCHA */
.grecaptcha-badge {
  display: none;
}

/* Vendor / Contant Form 7 */
.wpcf7-form h4 {
  margin-top: 40px;
}

.wpcf7-form p {
  margin-bottom: 3px;
}

.wpcf7-submit {
  border: 3px solid white !important;
  background-color: var(--primary) !important;
  color: white !important;
  float: right;
  transition: all .15s ease-in-out;
}

.wpcf7-submit:hover {
  border-color: var(--primary) !important;
  background-color: var(--accent) !important;
  color: var(--primary) !important;
}

/* Vendor / TranslatePress */
.trp-ls-language-name {
  font-size: 12px;
}

/****** ADMIN *******/
/* Grid Icons in Elementor Editor */
.elementor-select-preset-list .elementor-preset:not(:hover) path,
.elementor-select-preset-list .elementor-preset:not(:hover) rect {
  fill: white;
}

.wp-caption-text.gallery-caption {
  display: none;
}