/*
 Theme Name:     Mokapi Design Child-Theme
 Theme URI:      http://www.elegantthemes.com
 Description:    Smart. Flexible. Beautiful. Divi is the most powerful theme in our collection.
 Author:         Elegant Themes
 Author URI:     https://divi.world
 Template:       Divi
 Version: 4.18.1
*/
 
/* ------------------------------------------------------ */

/*VARIABLES*/
:root {
    --mokapi_green: #4FC397;
    --mokapi_blue: #8CB3F0;
    --mokapi_text:#251847;
    --mokapi_lavender: #C9C2F8;
    --mokapi_rosa:#FFB2ED;
    --mokapi_pink: #F582DA;
    --mokapi_red: #BC1153;
    --light: #fff;
}

/*FONTS*/
/* poppins-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  src: url('./fonts/poppins-v22-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* poppins-300italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 300;
  src: url('./fonts/poppins-v22-latin-300italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* poppins-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/poppins-v22-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* poppins-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 400;
  src: url('./fonts/poppins-v22-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* poppins-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  src: url('./fonts/poppins-v22-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* poppins-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 700;
  src: url('./fonts/poppins-v22-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* poppins-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 900;
  src: url('./fonts/poppins-v22-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* poppins-900italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 900;
  src: url('./fonts/poppins-v22-latin-900italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/*BASICS*/
body, #main-content {
    font-family: 'Poppins', Helvetica, sans-serif;
    font-weight: 400;
    color: var(--mokapi_text);
}

@media (min-width: 2300px) {
  body {
      width: 2300px;
      margin: 0 auto;
      background-color: var(--light) !important;
      box-shadow: 0px 0px 40px 0px rgba(62, 68, 55, 0.2);
  }
  #main-header {
    max-width: 2300px;
  }
}

h1, h2, h3, h4,
h1 strong, h2 strong, h3 strong, h4 strong {
    font-family: 'Poppins', Helvetica, sans-serif;
    color: var(--mokapi_text) !important;
    font-weight: 900;
} 

#main-content h1,
#main-content h1 strong {
    font-size: clamp(30px, 6vw, 80px);
    line-height: 1em !important;
}

.single-product #main-content h1 {
  font-size: clamp(24px, 4vw, 55px);
}

#main-content h2 {
    font-size: clamp(22px, 2.5vw, 50px);
    line-height: 1.2;
}

#main-content h3 {
    font-size: clamp(20px, 2vw, 24px);
    line-height: 1.2;
}

.et_pb_text {
    margin-bottom: 20px !important;
}

@media only screen and (max-width: 981px) {
    body {
         hyphens: auto;
    }
    p, .et_pb_text {
         font-size: 16px;
         line-height: 1.3 !important;
    }
}

/*BUTTONS*/
.et_pb_button,
.et_pb_button:hover,
.single_add_to_cart_button, 
.single_add_to_cart_button:hover {
  color: var(--mokapi_text) !important;
  font-weight: bold !important;
  background-color: var(--mokapi_lavender) !important;
  border-color: var(--mokapi_lavender) !important;
  border-radius: 0 !important;
  border: 2px solid var(--mokapi_text) !important;
  min-width: 150px;
  text-align: center;
}

.et_pb_button.secondary,
.et_pb_button.secondary:hover {
  color: var(--mokapi_text) !important;
  background-color: var(--mokapi_lavender) !important;
  border-color: var(--mokapi_text) !important;
}

@media (max-width: 981px) {
  .et_pb_button, .et_pb_button:hover {
    font-size: 16px;
    line-height: 1.2 !important;
    padding-bottom: 10px !important;
    padding-top: 10px !important;
  }
}

/*Image Teaser*/
.image-teaser {
  border: 2px solid var(--mokapi_text);
  display: flex;
  justify-content: center;
  align-items: flex-end;
}

.image-teaser .et_pb_button_wrapper {
  position: absolute;
  bottom: -20px;
}

.image-teaser:hover .et_pb_button {
  padding: .3em 2em .3em .7em;
}

.image-teaser:hover .et_pb_promo_button:after {
  opacity: 1;
  margin-left: 0;
}

/*Produkt Uebersicht*/
.et_pb_widget_area .et_pb_widget {
  margin-bottom: 5px !important;
}

.et_pb_module.et_pb_shop {
  overflow: visible;
}

.et_pb_shop .product {
  padding-top: 20px !important;
}

.et_pb_shop .product a {
  border: 2px solid var(--mokapi_text);
  transition: all 300ms ease 0ms;
}

.et_pb_shop .product h2,
.et_pb_shop .product span.price {
  padding: 10px 15px !important;
}

.et_pb_shop .product h2 {
  padding-top: 30px !important;
  padding-bottom: 0 !important;
}

.et_pb_shop .product span.price {
  padding-bottom: 30px !important;
}

.et_pb_module.et_pb_shop.light .product > a {
  background-color: #fff;
}

.et_pb_module.et_pb_shop.light .product-new-badge {
  background-color: var(--mokapi_rosa);
  color: var(--mokapi_text);
}

.woocommerce ul.products li.product a,
.woocommerce-page ul.products li.product a {
  width: 100%;
}
.et_pb_shop .product .et_shop_image {
  display: flex;
  aspect-ratio: 1 / 1;
  justify-content: center;
  align-items: center;
  padding: 0;
  overflow: hidden;
}
.woocommerce ul.products li.product a img, 
.woocommerce-page ul.products li.product a img {
  margin: 0 !important;
}
.et_pb_shop .product a img {
  min-height: 100%;
  min-width: 100%;
  object-fit: cover;
  transition: all 300ms ease 0ms;
}
.et_pb_shop .product a:hover img{
  transform: scale(1.1);
}

.et_pb_widget {
  float: none;
}

.et_pb_widget a .wc-block-product-categories-list-item__name {
  color: var(--mokapi_text);
}

/*
@media (max-width: 981px){
  .woocommerce ul.products {
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
  }
  .woocommerce ul.products li.product, 
  .woocommerce-page ul.products li.product,
  .et_pb_shop ul.products.columns-3 li.product,
  .woocommerce-page ul.products li.product {
    width: 100% !important;
    padding-top: 0 !important;
    margin-bottom: 0 !important;
  }
}

@media (max-width: 768px){
  .woocommerce ul.products {
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
  }
  .woocommerce ul.products li.product, 
  .woocommerce-page ul.products li.product,
  .et_pb_shop ul.products.columns-3 li.product,
  .woocommerce-page ul.products li.product {
    width: 100% !important;
    padding-top: 0 !important;
    margin-bottom: 0 !important;
  }
  .woocommerce .woocommerce-ordering {
    width: 100%;
    display: flex;
  }
  .woocommerce .woocommerce-ordering select {
    width: 100%;
  }
}
  
*/

@media (max-width: 560px){
  .woocommerce ul.products li.product, 
  .woocommerce-page ul.products li.product,
  .et_pb_shop ul.products.columns-3 li.product,
  .woocommerce-page ul.products li.product {
    width: 100% !important;
    padding-top: 0 !important;
    margin: 10px 0 !important;
  }
}

/*Woo Produktsuche*/
.produkt-suche.right{
  display: flex;
  justify-content: flex-end;
  padding-bottom: 30px;
}

.produkt-suche.right .et_pb_widget {
  margin-right: 0;
}

.produkt-suche.right .wp-block-search__input {
  border-radius: 0;
  border-color: black;
}
.produkt-suche.right .et_pb_widget.widget_block {
  /*min-width: 400px;*/
  margin-right: 0 !important;
}

.wc-block-product-categories-list-item.active a .wc-block-product-categories-list-item__name {
  color: var(--mokapi_blue) !important;
  text-decoration: underline;
  font-weight: bold;
}

.wc-block-product-categories-list-item.active .wc-block-product-categories-list-item-count {
  color: var(--mokapi_blue) !important;
}

.orderby, .woocommerce div.product form.cart .variations td select {
  padding: 10px 15px;
}

.variations tr {
  display: flex;
  flex-direction: column;
}
.woocommerce .quantity input.qty, .woocommerce-page .quantity input.qty {
  padding: 10px;
}

.woocommerce-variation-price {
  margin-bottom: 20px;
}

.et_pb_wc_images {
  box-shadow: 0px 0px 40px 0px rgba(62, 68, 55, 0.2);
}

@media (max-width: 981px) {
  .et-db #et-boc .et-l .et_pb_column .et_pb_widget,
  .produkt-suche.right .wp-block-search__input {
    min-width: 100%;
    width: 100%;
    margin: 0;
  }
}

.produkt-suche.right .wp-element-button {
  background-color: var(--mokapi_text);
  color: var(--light);
  font-weight: bold;
  border-radius: 0;
  border: none;
}

.wc-block-product-categories-list-item-count {
  font-style: italic;
}

/*NEU Badge*/
.product-new-badge {
  position: absolute;
  text-transform: uppercase;
  top: 10px;
  left: 10px;
  background: var(--mokapi_pink);
  color: white;
  padding: 2px 10px;
  font-size: 14px;
  font-weight: bold;
  z-index: 10;
}

.product-cat-label {
  font-size: 0.75em;
  font-weight: 300;
  font-style: italic;
  margin-left: 0.2em;
}

.page-numbers,
.page-numbers li,
.page-numbers a {
  border: none !important;
  background-color: transparent !important;
}

.page-numbers li a:not(.prev):not(.next) {
  font-weight: bold !important;
}

.page-numbers .current {
  color: var(--mokapi_text) !important;
}

#main-content h2.woocommerce-loop-product__title {
  font-size: clamp(18px, 1vw, 38px);
}

@media (min-width: 981px) {
  #main-content h2.woocommerce-loop-product__title {
    min-height: 100px;
  }
}

@media (max-width: 601px) { 
  #main-content ul.products.columns-4 li.product {
    width: 100% !important;
    margin-right: 0 !important
  }
}

/*Newsletter*/
#rmOrganism .rmBase__comp--checkbox .vFormCheckbox .vFormCheckbox__label {
  font-size: 16px;
  line-height: 1.5;
  hyphens: auto;
}
#rmOrganism {
  display: flex;
  justify-content: center;
}

/*Shop*/
.single-product .et_pb_wc_images {
  box-shadow: none !important;
}

/*DRINK AND DRAW*/
.page-id-573 #et-main-area:before {
    content: ' ';
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    width: 25px;
    background-image: url('/wp-content/uploads/border_kariert_small.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-color: var(--white);
    z-index: 999;
}
.page-id-573 #main-content .et_pb_section h3, 
.page-id-573 #main-content .et_pb_section h3 strong {
  color: #fff !important ;
}
.page-id-573 #main-content .et_pb_contact_submit.et_pb_button {
  border-radius: 100px !important;
}
@media (min-width: 981px) {
    .page-id-573 #main-content .et_pb_section h1,
    .page-id-573 #main-content .et_pb_section h1 strong {
        font-size: clamp(40px, 4vw, 70px) !important;
        line-height: 1.1;
    }
}

#main-content .et_pb_text .handwritten{
    font-family: 'Reenie Beanie', Arial, Helvetica, sans-serif;
    font-size: clamp(60px, 7vw, 100px);
}

.page-id-573 .price {
    background: #fffcb1;
    color: #251847;
    padding: 0px 10px;
    border-radius: 100px;
    margin: 0 5px;
    font-size: 1.2em;
    display: inline-block;
}

/*HELPER*/
@media (min-width: 981px) {
    .d-flex {
         display: flex;
    }
    .align-center {
         align-items: center;
    }
    .justify-center {
         justify-content: center;
    }
    .flex-columns .et_pb_column {
      display: flex;
    }
}

.flex-dir-row {
  flex-direction: row;
}

.flex-dir-col {
  flex-direction: column;
}

.d-mobile-flex {
  display: flex;
  margin-bottom: 0 !important;
}

@media (max-width: 980px) {
  .order-mobile-1 {
    order: 1;
  }
  .order-mobile-2 {
    order: 2;
  }
  .flex-dir-mobile-col {
    display: flex;
    flex-direction: column;
    margin-bottom: 0 !important;
  }
}
