/* 
Theme Name: WeBrandCulture-Theme
Description: WeBrandCulture-Theme ist ein leichtgewichtiges Theme für Wordpress
Author: Lars Beck
Author URI: https://larsbeck.io
Template: hello-elementor
Version: 1.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/*  Target Mobile:  body[data-elementor-device-mode=mobile] 
    Target Tablet:  body[data-elementor-device-mode=tablet]
    Target Desktop: body[data-elementor-device-mode=desktop]
*/

/*
 Generate Font-Faces with: https://transfonter.org/
 Settings: TTF, WOFF, EOT, WOFF2
 Font-Display: SWAP
 Fonts-directory: assets/fonts/
*/
@font-face {
    font-family: 'Source Sans 3';
    src: url('assets/fonts/SourceSans3-BlackItalic.woff2') format('woff2'),
        url('assets/fonts/SourceSans3-BlackItalic.woff') format('woff');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('assets/fonts/SourceSans3-ExtraBoldItalic.woff2') format('woff2'),
        url('assets/fonts/SourceSans3-ExtraBoldItalic.woff') format('woff');
    font-weight: 800;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('assets/fonts/SourceSans3-ExtraLightItalic.woff2') format('woff2'),
        url('assets/fonts/SourceSans3-ExtraLightItalic.woff') format('woff');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('assets/fonts/SourceSans3-Black.woff2') format('woff2'),
        url('assets/fonts/SourceSans3-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('assets/fonts/SourceSans3-Bold.woff2') format('woff2'),
        url('assets/fonts/SourceSans3-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('assets/fonts/SourceSans3-MediumItalic.woff2') format('woff2'),
        url('assets/fonts/SourceSans3-MediumItalic.woff') format('woff');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('assets/fonts/SourceSans3-Regular.woff2') format('woff2'),
        url('assets/fonts/SourceSans3-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('assets/fonts/SourceSans3-SemiBoldItalic.woff2') format('woff2'),
        url('assets/fonts/SourceSans3-SemiBoldItalic.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('assets/fonts/SourceSans3-BoldItalic.woff2') format('woff2'),
        url('assets/fonts/SourceSans3-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('assets/fonts/SourceSans3-Light.woff2') format('woff2'),
        url('assets/fonts/SourceSans3-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('assets/fonts/SourceSans3-ExtraBold.woff2') format('woff2'),
        url('assets/fonts/SourceSans3-ExtraBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('assets/fonts/SourceSans3-Medium.woff2') format('woff2'),
        url('assets/fonts/SourceSans3-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('assets/fonts/SourceSans3-Italic.woff2') format('woff2'),
        url('assets/fonts/SourceSans3-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('assets/fonts/SourceSans3-SemiBold.woff2') format('woff2'),
        url('assets/fonts/SourceSans3-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('assets/fonts/SourceSans3-LightItalic.woff2') format('woff2'),
        url('assets/fonts/SourceSans3-LightItalic.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Source Sans 3';
    src: url('assets/fonts/SourceSans3-ExtraLight.woff2') format('woff2'),
        url('assets/fonts/SourceSans3-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}


/* General Settings - Padding */

/* Mobile */
body[data-elementor-device-mode=mobile] footer > .elementor-element[data-element_type="container"]:not(.no-p),
body[data-elementor-device-mode=mobile] header > .elementor-element[data-element_type="container"]:not(.no-p),
body[data-elementor-device-mode=mobile] main div[data-elementor-type="wp-page"] > .elementor-element[data-element_type="container"]:not(.no-p),
body[data-elementor-device-mode=mobile] div[data-elementor-type="single-post"] > .elementor-element[data-element_type="container"]:not(.no-p){
	padding-right: 16px;
	padding-left: 16px;	
}


/* Tablet */
body[data-elementor-device-mode=tablet] footer > .elementor-element[data-element_type="container"]:not(.no-p),
body[data-elementor-device-mode=tablet] header > .elementor-element[data-element_type="container"]:not(.no-p),
body[data-elementor-device-mode=tablet] main div[data-elementor-type="wp-page"] > .elementor-element[data-element_type="container"]:not(.no-p),
body[data-elementor-device-mode=tablet] div[data-elementor-type="single-post"] > .elementor-element[data-element_type="container"]:not(.no-p){
	padding-right: 32px;
	padding-left: 32px;
}

/* Desktop */
body[data-elementor-device-mode=desktop] footer > .elementor-element[data-element_type="container"]:not(.no-p),
body[data-elementor-device-mode=desktop] header > .elementor-element[data-element_type="container"]:not(.no-p),
body[data-elementor-device-mode=desktop] main div[data-elementor-type="wp-page"] > .elementor-element[data-element_type="container"]:not(.no-p),
body[data-elementor-device-mode=desktop] div[data-elementor-type="single-post"] > .elementor-element[data-element_type="container"]:not(.no-p){
	padding-right: 32px;
	padding-left: 32px;
}


/* Menu-Padding on first Page Element */
body main div[data-elementor-type="wp-page"] > .elementor-element[data-element_type="container"]:not(.no-t-p):first-of-type {
	padding-top: 294px;
}

@media all and (max-width: 768px) {
	/* Menu-Padding on first Page Element */
	body main div[data-elementor-type="wp-page"] > .elementor-element[data-element_type="container"]:not(.no-t-p):first-of-type {
		padding-top: 180px;
	}
}

/* Überschriften Umbruch */

h1,h2,h3,h4,h5,h6 {
	-webkit-hyphens: auto;
	    -ms-hyphens: auto;
	        hyphens: auto;
}

@keyframes wabernAnimation {
  0%, 100% {
    transform: translateY(4px);
  }
  50% {
    transform: translateY(-10px); /* Bewegt den Eisberg 10px nach oben */
  }
}

#eisberg {
  animation: wabernAnimation 10s infinite; /* 3 Sekunden für eine komplette Animation */
  animation-timing-function: ease-in-out; /* Weichere Bewegung */
}

body[data-elementor-device-mode="mobile"] .scrollable-container {
  display: flex; /* Flex-Container, um das Kind-Element (das Bild) inline zu halten */
  overflow-x: auto; /* Ermöglicht horizontales Scrollen, wenn der Inhalt breiter als der Container ist */
  -webkit-overflow-scrolling: touch; /* Verbessertes Scrollen auf Touch-Geräten */
}

body[data-elementor-device-mode="mobile"] .scrollable-container .elementor-widget-container {
  width: 100%; /* Stellt sicher, dass der Container die volle Breite hat */
  box-sizing: border-box; /* Damit Padding und Border in die Breite eingerechnet werden */
}

body[data-elementor-device-mode="mobile"] .scrollable-container img {
  display: block; /* Verhindert zusätzliche Leerzeichen um das Bild */
  max-width: none; /* Verhindert, dass das Bild auf die Breite des Containers beschränkt wird */
}

body[data-elementor-device-mode="mobile"] {
  overflow-x: clip; /* Verhindert das horizontale Scrollen auf der gesamten Seite */
}

footer {
	overflow-x: clip;
}

/* Header Fadeout after scroll */

#hide-header.hide {
	top: -152px !important;
}
#hide-header {
	transition: all .4s ease!important;
	top: 0px;
}

#logo-header img {
	transition: all .3s cubic-bezier(0, 0.55, 0.45, 1)!important;
}

header {
	width: 100% !important;
}

/* Image with ‘data’ attribute is hidden */

img[data-lazy-src] {
	/* we set the opacity to 0 */
	opacity: 0;
}

/*Image without ‘data’ attribute is (or becomes) visible */

img.lazyloaded {
	/* prepare the future animation */
	transition: opacity .5s linear 0.2s;

	/* we set the opacity to 1 to do the magic */
	opacity: 1;
}