/*
Theme Name: Recipe Blogs Child
Theme URI: https://www.ovationthemes.com/products/free-recipe-blog-wordpress-theme
Template: recipe-blogs
Author: pewilliams
Author URI: https://www.ovationthemes.com/
Description: Recipe Blogs is a beautifully designed free WordPress theme crafted for culinary enthusiasts, professional chefs, and food lovers. It provides an elegant and modern layout, making it the perfect choice for sharing food recipes, baking recipes, restaurant reviews, cooking tips, hospitality services, catering services, gourmet dishes, homemade meals, vegan cooking, and organic food ideas. The theme is fully responsive, ensuring that your content looks stunning on desktops, tablets, and mobile devices. With Recipe Blogs, you get a feature-rich theme that supports custom widgets, SEO optimization, and WooCommerce compatibility. Whether you're running a food magazine, nutrition blog, personal chef website, gourmet food site, organic food store, meal planning blog, or healthy eating guide, this theme makes it easy to showcase your content professionally. It also includes social media integration, ad management support, customizable colors, and a featured recipe section to engage your audience. The theme comes with a user-friendly interface and fast-loading design, ensuring an exceptional user experience. You can organize your content efficiently with categories, recipe filters, and featured images that highlight your best dishes. Additionally, Recipe Blogs offers customizable fonts, sidebar widgets, and a clean layout to make your website visually appealing. Whether you're an aspiring food blogger, a professional chef, or a restaurant owner, Recipe Blogs provides all the essential features needed to build a successful food and cooking blog, lifestyle food site, culinary portfolio, or meal prep guide.
Tags: blog,portfolio,food-and-drink,one-column,two-columns,custom-colors,custom-menu,custom-logo,sticky-post,threaded-comments,right-sidebar,left-sidebar,grid-layout,custom-background,rtl-language-support,featured-images,wide-blocks,editor-style,full-site-editing,block-patterns,block-styles,style-variations,template-editing,translation-ready
Version: 1.4.1746781496
Updated: 2025-05-09 11:04:56

*/

html, body {
  overflow-x: hidden;
}

@media (min-width: 782px) {
  .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis"] {
    flex-grow: 1 !important;
  }
}

.e-con.e-parent {
  display: flex;
  flex-direction: column;
}

/* Quote */
.item-content-wrapper {
  background-color: #EAE5DF !important;
}



.sidebar-hidden {
  transform: translateX(-100%);
  transition: transform 0.3s ease;
  
}

/* Content breiter machen, wenn Sidebar versteckt */
.sidebar-hidden ~ .home-design {
  margin-left: 0 !important;
  transition: margin-left 0.3s ease;
}

.wp-block-group.scroll-bar {
  width: 18%;
  transition: transform 0.3s ease;
  float: left;
}

.home-design {
  transition: margin-left 0.3s ease;
}

.sidebar-column-hidden {
  flex-basis: 0 !important;
  max-width: 0 !important;
  overflow: hidden;
  padding: 0 !important;
  margin: 0 !important;
  transition: all 0.3s ease;
}

.home-design {
  transition: all 0.3s ease;
}

.sidebar-column-hidden + .home-design {
  margin-left: 0 !important;
}

/* Ganze sidebar versteckien ab tablet */
@media (max-width: 768px) {
  .wp-block-group.scroll-bar,
  .sidebar,
  .sidebar-widget-area,
  .sidebar-column,
   .wp-container-core-group-is-layout-a09eabdf {
    display: none !important;
	}
}
	

@media (min-width: 1025px) {
  .elementor-hidden-desktop {
    display: none !important;
  }
}

.swiper-pagination-bullet {
  width: 28px !important;
  height: 28px !important;
  border-radius: 0 !important;

}

.swiper-pagination-bullet:hover {
  border: 3px solid #70462A; 
  box-sizing: border-box;
}
	
.ha-slick-slide .ha-slick-content {
  top: 10%; /* oben, je nachdem wie nah zum Rand du willst, kannst du hier anpassen */
  left: 50%; /* horizontal Mitte */
  transform: translateX(-50%); /* verschiebt das Element genau nach links, damit es zentriert ist */
  z-index: 10;
  width: 100%; /* falls du willst, dass der Text sich über die ganze Breite zieht */
  text-align: center;
  
}

.ha-slick-slide .ha-slick-content .ha-slick-title {
  padding: 20px;
  background-color: #f1f1f1;
  font-size: 22px !important;
  transition: border 0.3s ease, box-shadow 0.3s ease; /* für smoothen Effekt */
  border: 2px solid transparent; /* Anfangszustand: kein sichtbarer Rahmen */
}

.ha-slick-slide .ha-slick-content .ha-slick-title:hover {
  border: 2px solid #fff;
  background-color: transparent;
	color: #fff;

}

@media (min-width: 1025px) {
  .ha-slick-slide .ha-slick-content .ha-slick-title {
    margin-left: 50px;
	margin-right: 50px;
  }
}

@media (max-width: 768px) {
  .ha-slick-slide .ha-slick-content .ha-slick-title {
    font-size: 16px !important;
  }
}


a {
  font-weight: normal !important;
  font-size: 1rem !important;
}

.wpr-offcanvas-wrap {
    opacity: 1;
    transition: opacity 0.5s ease;
}

.wpr-offcanvas-wrap.is-closing {
    opacity: 0;
}

@media (max-width: 768px) {
  .wpr-offcanvas-wrap.wpr-offcanvas-wrap-active {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 9999 !important;
    display: flex !important;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    overflow-y: auto !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .wpr-offcanvas-content {
    flex: 1 1 auto !important;
    width: 100% !important;
    height: 100% !important;
    overflow-y: auto !important;
    padding: 20px; /* Optional: etwas Abstand zum Rand */
  }


}


/* Footer */
@media (max-width: 768px) {
  /* Padding im äußeren Container komplett entfernen */
  .wp-block-group.alignfull.has-background-color {
    padding: 10px !important;
  }

   .wp-block-group.is-layout-flex p {
    font-size: 0.8rem;
  }

  /* Links rechtsbündig und untereinander */
  .wp-block-group.is-layout-flex p:last-child {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    margin-left: 10px; /* weniger margin links */
  }

  /* Abstand zwischen Links */
  .wp-block-group.is-layout-flex p:last-child span {
    margin-bottom: 6px;
  }

}

.wp-block-navigation__container a.wp-block-navigation-item__content {
  font-size: 1.6rem !important;
  font-weight: normal !important;
}

.wp-block-navigation__container a.wp-block-navigation-item__content:hover {
  text-decoration: underline !important;
}

.wp-block-navigation__container .wp-block-navigation-item--active > a.wp-block-navigation-item__content {
  font-weight: bold !important;
}


ul.wp-block-navigation__submenu-container li a.wp-block-navigation-item__content {
  text-transform: none !important;
   font-size: 1.1rem !important;
}



/* Pfeil durch Plus ersetzen */
.wp-block-navigation__submenu-icon svg path {
  d: path("M6 2v8M2 6h8"); /* Einfaches Pluszeichen */
}

/* Standardmäßig Submenü ausblenden */
.wp-block-navigation__submenu-container {
  display: none;
  transition: all 0.3s ease;
}

/* Wenn 'open' Klasse gesetzt ist, Submenü anzeigen */
.wp-block-navigation-submenu.open > .wp-block-navigation__submenu-container {
  display: block;
}

.submenu-container {
  display: none;
  transition: all 0.3s ease;
}

.submenu-container.open {
  display: block;
}



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


@font-face {
  font-family: 'Playfair Display';
  src: url('/fonts/PlayfairDisplay-Bold.ttf') format('ttf');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

	
	

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


@font-face {
  font-family: 'Lora';
  src: url('/fonts/Lora-Bold.ttf') format('ttf');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

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