/*!
Theme Name:    colistic childtheme
Author:        colistic
Author URI:    https://colistic.de
Description:   colistic Theme
Version:       1.0.0
License:       GNU General Public License v3 or later
License URI:   https://www.gnu.org/licenses/gpl-3.0.html
Template:      page-builder-framework
Text Domain:   page-builder-framework-child
*/

/* ############################################# Scrollbar ############################################# */

::selection { background: var(--red); color: var(--white); } 
::-moz-selection { background: var(--red); color: var(--white); } 
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--white); box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.5); border-radius: 5px; }
::-webkit-scrollbar-thumb { background: var(--black); border-radius: 5px;}
::-webkit-scrollbar-thumb:hover { background: var(--red); }

/* General Settings */
:root {
    --black: #000;
    --white: #ffffff;
	--red: #d23b3b;
	--xsmall: 16px;
    --small: 20px;
    --regular: 22px;
    --medium: 27px;
	--medium-large: 60px;
    --large: 70px;
    --xlarge: 90px;
}

/* Mobile First - Sehr kleine Geräte */
@media only screen and (max-width: 480px) {
    :root {
        --small: 14px;    /* Kleinere Schriftgröße für sehr kleine Bildschirme */
        --regular: 16px;  /* Etwa 10% größer als small */
        --medium: 19px;   /* Etwa 23% größer als regular */
        --large: 35px;    /* Etwa 159% größer als medium */
		--medium-large: 55px;
        --xlarge: 63px;   /* Etwa 29% größer als large */
    }
}

/* Mobile Geräte bis max. 767px */
@media only screen and (max-width: 767px) {
    :root {
        --small: 16px;    /* Kleinere Schriftgröße für mobile Geräte */
        --regular: 18px;  /* Etwa 10% größer als small */
        --medium: 21px;   /* Etwa 23% größer als regular */
        --large: 33px;    /* Etwa 159% größer als medium */
		--medium-large: 54px;
        --xlarge: 70px;   /* Etwa 29% größer als large */
    }
}

/* Tablet und kleine Desktops */
@media only screen (min-width: 768px) and (max-width: 1024px) {
    :root {
        --small: 18px;    /* Standardgröße für Fließtext */
        --regular: 20px;  /* Etwa 10% größer als small */
        --medium: 24px;   /* Etwa 23% größer als regular */
        --large: 64px;    /* Etwa 159% größer als medium */
        --xlarge: 77px;   /* Etwa 29% größer als large */
    }
}

/* Große Desktops */
@media only screen and (min-width: 1025px) {
    :root {
        --small: 20px;    /* Standardgröße für Fließtext */
        --regular: 22px;  /* Etwa 10% größer als small */
        --medium: 27px;   /* Etwa 23% größer als regular */
        --large: 70px;    /* Etwa 159% größer als medium */
        --xlarge: 90px;   /* Etwa 29% größer als large */
    }
}

h1, h2, h3, h4, h5, h6{ color: var(--black); }
h1, h2{ font-family: 'pp_migrabold'; font-weight: 800; }
h3, h4, h5, h6{ font-family: 'karla'; font-weight: 600; }
body{ font-family: 'Karla'; font-weight: 400;  color: var(--black); }
span.point { color: var(--red); }

@media only screen and (max-width: 767px) {
 .wpbf-page {
	overflow-x: hidden;
	overflow-y: visible;
}
}

/* ############################################# Navigation ############################################# */

.wpbf-navigation .wpbf-container{
	padding: 20px 0 20px 0;
}

.wpbf-navigation.wpbf-navigation-transparent{
	border-bottom: solid 2px var(--white);
}

.wpbf-navigation.wpbf-navigation-transparent.wpbf-navigation-active{
	border-bottom: solid 2px var(--black);
}

.wpbf-mobile-nav-wrapper.wpbf-container.wpbf-container-center{
	padding: 10px;

}

/* Basisstil Menüpunkt */
.wpbf-menu a {
	font-family: 'pp_migrabold';
	font-weight: 600;
	position: relative;
	display: inline-block;
	color: rgb(0 0 0 / 70%);
	text-transform: lowercase;
}

/* Hover: Text verschieben */
.wpbf-menu .menu-item:not(.wpbf-cta-menu-item, .current-menu-item, .logo-container) a:hover {
	transform: translate(-5px, 0) !important;
	position: relative;
}

/* Punkt hide */
.wpbf-menu a .hide {
	opacity: 0;
	transition: all 0.3s ease;
	color: var(--red);
}

/* Punkt sichtbar machen */
.wpbf-menu a:hover .hide {
	opacity: 1;
}

.wpbf-navigation .wpbf-menu > .menu-item{
	padding: 0px 20px;
}

@media only screen and (max-width: 1px) {
	.wpbf-navigation .wpbf-container{
		padding: 20px 10px !important;
	}
}

.wpbf-menu .current-menu-item: a {
	transform: translateX(-5px);
	color: rgb(0 0 0 / 100%);
}

.wpbf-navigation .wpbf-menu > .current-menu-item > a .hide {
	opacity: 1;
}

/* ############### Navigation ############### */


.wpbf-navigation.wpbf-navigation-transparent:not(.
.wpbf-navigation-active) .wpbf-menu li:not(.cta) a{
	color: var(--white) !important;
}

header .wpbf-navigation:not(.wpbf-navigation-transparent){
	box-shadow: 0px 0px 160px 0px rgba(0, 0, 0, 1);
}

header .wpbf-navigation.wpbf-navigation-active {
        background: rgb(255 255 255 / 0%) !important;
        backdrop-filter: blur(7px);
        -webkit-backdrop-filter: blur(7px);
}

.wpbf-navigation{
	transition: ease-in-out 0.5s;
}

.wpbf-navigation-active-hover{
	background: rgb(255 255 255 / 70%) !important;
	transition: all 1s;
}

header .wpbf-nav-wrapper{
	padding-top: 30px;
}

/* Setzt das Menü als Flexbox */
#menu-main-nav {
    display: flex;
    justify-content: space-between; /* Verteilt die Elemente */
    align-items: center;
}

/* Logo nach links */
#menu-main-nav .logo-container {
    order: 1; /* Sicherstellen, dass das Logo ganz links steht */
    margin-right: auto; /* Abstand zu den mittleren Menüpunkten */
}

/* Erste drei Menüpunkte in der Mitte */
#menu-main-nav > li:nth-child(1),
#menu-main-nav > li:nth-child(2),
#menu-main-nav > li:nth-child(4) {
    order: 2; /* Nach dem Logo */
}

/* Letzter Menüpunkt ganz rechts */
#menu-main-nav > li.cta {
    order: 3; /* Nach den mittleren Menüpunkten */
    margin-left: auto; /* Abstand zur Mitte */
}

/* Optional: zentriert den Text innerhalb der Menüpunkte */
#menu-main-nav > li a {
    text-align: center;
    display: block;
}

header .wpbf-menu li a{
	font-weight: 700;
}

header li:not(.cta){
	padding: 0 30px;
}

header .wpbf-menu li:not(.cta) a{
	padding: 0 !important;
	color: var(--black);
	font-size: var(--xsmall);
}

header .wpbf-menu li.cta a{
	color: var(--black);
}

header .wpbf-menu a:hover{
	color: var(--black);
}

/* Optional: Styling für das CTA-Element */
#menu-main-nav > li.cta a {
	font-weight: 700;
	padding: 0px 15px;
	font-size: var(--xsmall);
}

header .wpbf-menu li.cta a:hover{
	color: var(--black);
}

header .wpbf-navigation .wpbf-menu > .current-menu-item > a{
	color: var(--black) !important;
}

header .cta{
	background: none !important;
}

header .cta:hover{
	color: var(--white) !important;
	background: rgb(0 0 0/ 100%) !important;
}

header .cta:hover a{
	color: var(--white) !important;
}

header .wpbf-navigation .wpbf-menu ul li{
	padding: 0;
}

header .wpbf-navigation .wpbf-menu ul li{
	padding: 0;
}

@media only screen and (min-width: 1025px) and (max-width: 1436px) { 
	
	header .wpbf-navigation .wpbf-1-4 {
    	width: 30%;
}
	header .wpbf-navigation .wpbf-3-4 {
    	width: 70%;
}
	
	header .wpbf-menu li:not(.cta){
		padding: 0 15px;
}
	header .wpbf-menu-right .wpbf-menu li a{
		color: var(--black);
		font-size: 15px !important;
}
	header .wpbf-menu-right .wpbf-menu li.cta a{
		color: var(--black);
		font-size: 13px !important;
}
}

header .wpbf-navigation:not(.wpbf-navigation-active) .wpbf-sub-menu>.menu-item-has-children>.sub-menu{
	top: 100px;
}

header .wpbf-navigation-active .wpbf-sub-menu>.menu-item-has-children>.sub-menu{
	top: 53px;
}

/* Mobile */

.wpbf-mobile-menu-container .wpbf-close{
	color: var(--white);
}

.wpbf-mobile-menu-off-canvas .wpbf-close{
	right: 0;
	left: unset;
}

.wpbf-mobile-menu-off-canvas .wpbf-mobile-menu-container.active {
	background: rgba(0,0,0,0.9);
	width: 100vw;
	height: 100vh; /* das fehlt vermutlich bei dir */
	overflow-y: auto;
	display: block; /* falls noch nicht gesetzt */
	z-index: 9999; /* damit es über anderen Elementen liegt */
}


.wpbf-mobile-menu .menu-item{
	border: 0;
	display: block;
}

.wpbf-mobile-menu .menu-item a{
	color: var(--white);
}

.wpbf-mobile-menu .menu-item-has-children .wpbf-submenu-toggle{
	padding: 30px 15px;
}

.wpbf-mobile-menu .menu-item:not(.menu-item-has-children li):not(li.cta){
	padding: 20px 0;
}

.wpbf-mobile-menu li.cta{
	display: inline-block;
	padding: 0;
	border: 0;
	margin-top: 20px;
}

.wpbf-mobile-menu>.menu-item:last-child{
	border: 0;
}

.wpbf-navigation-active .wpbf-mobile-nav-item{
	color: var(--black);
}

/* ############################################# Seperator ############################################# */

/* Standard-Abstand für Columns mit Separator */
.fl-col.seperator {
    position: relative;
    padding-bottom: 60px;
}

/* Mobile Optimierung */
@media only screen and (max-width: 767px) {
    .fl-col.seperator {
        padding-bottom: 10px;
    }
}

/* Pseudoelement als horizontaler Separator */
.fl-col.seperator::before {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    height: 2px;
    background: var(--white); /* Passe bei Bedarf die Farbe an */
    width: 100%;
    max-width: 1600px;
}


/* ############################################# Infobox ############################################# */

/* Infobox general */

.pp-infobox-title {
	font-size: var(--large);
}

.pp-infobox-title-wrapper .pp-infobox-title{
	margin: 0;
}

.pp-infobox .pp-description-wrap{
	margin-bottom: var(--large);
}

@media only screen and (max-width: 768px) {
	.pp-infobox .pp-description-wrap {
		margin-bottom: var(--medium);
	}
}

.pp-infobox p{
	font-size: var(--small);
	line-height: 1.4;
	font-weight: 600;
}

.pp-infobox a.pp-more-link{
	display: inline-flex;
    align-items: center;
	padding: 0px 20px !important;
	border-color: var(--red) !important;
    border-radius: 100px;
    font-size: var(--xsmall) !important;
    letter-spacing: -.5px;
    text-transform: normal;
    font-weight: 600;
}

.pp-infobox .pp-more-link{
	background: var (--white);
	transition: all .4s ease-out;
	color: var(--red);
	border: solid 2px var(--black) !important;
}

.pp-infobox .pp-more-link:hover{
	background: var(--red);
	transition: all .4s ease-out;
	color: var(--white);
}

.pp-infobox .pp-more-link .pp-button-icon-right{
	margin: 1px 0px 0 15px;
}

.pp-infobox .fa-arrow-right-long:before {
	font-size: 25px;
	font-weight: 100;
}

@media (max-width: 767px) {
.pp-infobox {
    padding: 10px;
}
}

/* Infobox white */
.light .pp-infobox p, .light .pp-infobox-title {
	color: var(--white);
}

.light .pp-infobox a.pp-more-link{
	border-color: var(--white);
	color: var(--white);
}

.light .pp-infobox .pp-more-link{
	background: var (--black);
	color: var(--white);
}

.light .pp-infobox .pp-more-link:hover{
	background: var(--red);
	color: var(--white);
}

.light .pp-infobox .pp-more-link .pp-button-icon-right{
	color: var(--white);
	transition: all .4s ease-out;
}

.light .pp-infobox .pp-more-link:hover .pp-button-icon-right{
	color: var(--white);
	transition: all .4s ease-out;
}

/* ############################################# Startseite ############################################# */

/* Heroshot Video */

.fl-row-bg-video{
	overflow: hidden;
}

/* headline left, text right */

/* Standardgrößen für größere Bildschirme */
.introbox .pp-infobox-title {
    font-size: var(--large);
    line-height: 0.9;
}

.introbox .fl-module-pp-infobox.seperator {
    position: relative; /* Damit das ::before Pseudoelement relativ zu diesem Element positioniert wird */
    padding-bottom: 60px; /* Platz für den Separator, damit die Zeile nicht überschneidet */
}

/* Mobile Optimierung */
@media only screen and (max-width: 767px) {
    .introbox .fl-module-pp-infobox.seperator {
        padding-bottom: 10px; /* Reduziert den Abstand auf mobilen Geräten */
    }
}

.introbox .fl-module-pp-infobox.seperator::before {
    content: "";
    display: block; /* Verwende block statt inline-block, damit der Separator eine neue Zeile einnimmt */
    position: absolute; /* Positioniere den Separator relativ zur Elternebene */
    bottom: 0; /* Platzierung des Separators am unteren Rand des Containers */
    left: 50%; /* Horizontal zentrieren */
    transform: translateX(-50%); /* Zentriert den Separator exakt */
    height: 2px; /* Höhe des Separators */
    background: var(--white); /* Farbe des Separators */
    width: 100%; /* Breite des Separators */
	max-width: 1600px;
}

.introbox:not(.two-columns-text) .pp-infobox {
    display: flex;
    text-align: left;
	align-items: center;
}

.introbox .pp-heading-wrapper {
    flex: 1;
}

.introbox .pp-infobox-description {
    flex: 1;
}

/* Optimierung für mobile Geräte (max-width: 767px) */
@media (max-width: 767px) {
    /* Schriftgröße für Titel verkleinern */
    .introbox .pp-infobox-title {
        line-height: 1.2;          /* Etwas mehr Zeilenhöhe für bessere Lesbarkeit */
    }

    /* Flexbox auf mobile Ansicht anpassen */
    .introbox .pp-infobox {
        flex-direction: column;   /* Elemente untereinander stapeln */
    }

    .introbox .pp-heading-wrapper,
    .introbox .pp-infobox-description {
        flex: unset;              /* Flex-Anpassung zurücknehmen */
    }

    .introbox .pp-infobox-description {
        padding-left: 5px;
        padding-right: 20px;
    }
}

/* headline left, button right */ /* cta-box */

.cta-box .pp-infobox {
    display: flex;
	align-items: flex-start;
	padding: 20px 10px 20px 20px;
}

.cta-box .pp-heading-wrapper {
    flex: 4;
	text-align: left;
	order: 2;
}

.cta-box .pp-infobox-title-wrapper .pp-infobox-title{
	margin-top: 0;
}

.cta-box .pp-infobox-description {
    flex: 1;
	text-align: right;
}

.cta-box .pp-infobox .pp-description-wrap{
	margin-bottom: 0;
	order: 1;
}

.cta-box .pp-infobox a.pp-more-link{
	border: none;
	padding: 0 !important;
}

.cta-box .pp-infobox a.pp-more-link:hover{
	border: none;
	background: none;
	color: var(--black);
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {
    .cta-box .pp-heading-wrapper {
        flex: 3 !important; /* Reduziert den flex-Wert auf 3 für iPad */
    }
}

/* Optimierung für mobile Geräte (max-width: 767px) */
@media (max-width: 767px) {

	.cta-box .pp-infobox {
    	padding: 10px;
	}
	
    /* Schriftgröße für Titel verkleinern */
    .cta-box .pp-infobox-title {
        line-height: 1.2;          /* Etwas mehr Zeilenhöhe für bessere Lesbarkeit */
    }

    /* Flexbox auf mobile Ansicht anpassen */
    .cta-box .pp-infobox {
        flex-direction: column;   /* Elemente untereinander stapeln */
        text-align: center;       /* Textzentrierung auf mobilen Geräten */
    }

    .cta-box .pp-heading-wrapper,
    .cta-box .pp-infobox-description {
        flex: unset;              /* Flex-Anpassung zurücknehmen */
        margin-bottom: 0px;      /* Abstand zwischen den beiden Bereichen */
    }

    .cta-box .pp-infobox-description {
        padding-left: 5px;
        padding-right: 20px;
    }
}

/* Content  Grid Style Projekte und Branchen */

.pp-content-post.pp-grid-style-5 .pp-content-post-data{
	width: 100%;
}

.pp-content-post.pp-grid-style-5 .pp-content-post-data {
	margin-left: 0px;
}

@media (max-width: 767px) {
	.pp-content-post.pp-grid-style-5 .pp-content-post-data {
		margin-left: 10px;
	}
}

.pp-content-post.pp-grid-style-5 .pp-content-post-data h3{
	text-transform: none;
}

.pp-content-post.pp-grid-style-5 .pp-content-post-data .pp-post-meta .pp-content-post-category{
	color: var(--black);
	font-weight: 400;
}

.pp-content-grid-image{
	overflow: hidden;
}

.pp-content-post.pp-grid-style-5 .pp-post-image img {
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.pp-content-post.pp-grid-style-5:hover .pp-post-image img {
    -moz-transform: scale(1.1, 1.1);
    -webkit-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1);
}

/* Sie haben Fragen? */

@media (max-width: 1024px) {
	.pp-infobox-wrap .layout-3 .pp-icon-wrapper{
		margin-right: 0 !important;
	}
	
	.pp-infobox-wrap .layout-3 .pp-infobox-title-wrapper .pp-infobox-title {
		margin-top: 20px !important;
	}
}

/* samariter */

.fl-row.samariter{
	background: var(--black) !important;
}

.fl-col.column-fix{
    position: relative;
    z-index: 999;
    left: 50px;
	margin-top: 100px;
}

.samariter .pp-infobox-button{
	float: right;
}

/* Mobile Anpassung: Deaktivierung der Styles */
@media only screen and (max-width: 800px) {
    .fl-col.column-fix {
        position: static;  /* Deaktiviert die relative Positionierung */
        left: 0;           /* Entfernt den Abstand von der linken Seite */
        margin-top: 0;     /* Setzt den Abstand oben zurück */
    }

    .samariter .pp-infobox-button {
        float: none;       /* Entfernt das float */
    }
}

/* ############################################# Über uns ############################################# */

/* === Desktop-Layout === */
.intro-ueber-uns .fl-col.column-fix {
    position: relative;
    z-index: 999;
    left: 7vw;
}

.intro-ueber-uns .pp-heading-wrapper {
    padding-bottom: 15vh;
    width: 70%;
}

.intro-ueber-uns .pp-infobox-description {
    width: 55%;
    margin-left: 10vw;
    margin-top: 5%;
}

/* === Tablet-Layout (ab 1024px abwärts) === */
@media only screen and (max-width: 1200px) {
    .intro-ueber-uns .fl-col.column-fix {
        left: 4vw;
    }

    .intro-ueber-uns .pp-heading-wrapper {
        width: 85%;
        padding-bottom: 10vh;
    }

    .intro-ueber-uns .pp-infobox-description {
        width: 70%;
        margin-left: 5vw;
        margin-top: 8%;
    }
}

/* === Smartphone-Layout (ab 767px abwärts) === */
@media only screen and (max-width: 767px) {
    .intro-ueber-uns .fl-col.column-fix {
        left: 0;
    }

    .intro-ueber-uns .pp-heading-wrapper {
        width: 100%;
        padding-bottom: 5vh;
    }

    .intro-ueber-uns .pp-infobox-description {
        width: 100%;
        margin-left: 0;
        margin-top: 5vh;
    }
}

.unsere-werte .pp-infobox{
	text-align: left;
	border: none;
}

.unsere-werte .column-text .fl-module:not(:first-child){
	border: solid 2px var(--black);
}

.unsere-werte .column-text .fl-module:nth-child(3){
	background: var(--black);
}

.unsere-werte .pp-infobox .pp-description-wrap{
	margin-bottom: 0;
}

.unsere-werte .pp-infobox-icon-inner span:before, .pp-infobox-icon-inner span.pp-icon{
	font-size: var(--large);
	padding: 50px 0 20px 0;
}

@media only screen and (max-width: 480px) {
.unsere-werte .pp-infobox-icon-inner span:before, .pp-infobox-icon-inner span.pp-icon{
		padding: 0 !important;
	}
}

.unsere-werte .pp-infobox-title-prefix{
	font-size: var(--small);
	font-weight: 700;
}

.column-text .fl-col-content {
    display: flex;
    flex-direction: row;      /* explizit gesetzt */
    flex-wrap: wrap;
    gap: 20px;
}

.column-text .fl-module {
    width: calc(33.33% - 20px);
    box-sizing: border-box;
}

.unsere-werte .column-image .fl-col-content {
    background-position: 50% 38% !important;
}

.column-image .fl-col-content {
    margin: 0 10px 0 0;
}

.column-image .fl-col-content {
    position: relative;
    display: inline-block;
    overflow: hidden;
}

.column-image .fl-col-content::after {
    content: "";
    position: absolute;
    bottom: -1px;
    right: 0;
    width: 100px; /* Größe des Dreiecks */
    height: 100px;
    background: var(--white);
    clip-path: polygon(100% 100%, 0 100%, 100% 0);
    z-index: 2; /* Sicherstellen, dass es über dem Bild liegt */
}

@media only screen and (max-width: 1200px) {
    .column-text .fl-module {
        width: calc(50% - 20px);
    }
}

@media only screen and (max-width: 1024px) {
    .column-text .fl-module {
        width: calc(100% - 10px);
		margin-right: 20px;
    }
	.unsere-werte .pp-infobox-description {
        margin-left: 0px !important;
    }
}

@media only screen and (max-width: 767px) {
    .column-text .fl-col-content {
        flex-direction: column;  /* Jetzt Spalten untereinander */
        gap: 15px;                /* Etwas engerer Abstand mobil */
    }

    .column-text .fl-module {
        width: 100%;
    }

    .column-image .fl-col-content {
        margin: 0;
    }
}

/* ############################################# Projekte ############################################# */

/* Hero Video */ 

.page-id-175 .fl-row-bg-video .fl-bg-video {
    z-index: 1;
    width: 94vw;
    margin: 0 auto;
	bottom: 50px;
}

.page-id-175 .fl-builder-shape-layer.fl-builder-bottom-edge-layer{
	z-index: 0;
}

.page-id-175 .pp-description-wrap{
	display: none;
	margin-bottom: 0;
}

.page-id-175 .pp-post-filters{
	margin: 10vh 0;
}

/* ############################################# Leistungen ############################################# */

.hero-scroll-down .pp-infobox {
	padding: 0;
}

.hero-scroll-down .pp-infobox-title-wrapper {
	text-align: left;
    max-width: 1600px;
    margin: 5vh auto 10vh;
    width: 100%;
}

.hero-scroll-down .fl-row-content,
.fl-row.hero-scroll-down,
.hero-scroll-down .fl-row-content {
	margin: 0 auto !important;
}

.hero-scroll-down .pp-infobox-image img{
	width: 100% !important;
}

.hero-scroll-down .pp-infobox > *:not(.pp-infobox-title-wrapper) {
	max-width: 1400px;
    position: relative;
    text-align: left;
    margin-left: auto;
}

.hero-scroll-down .pp-button-wrap {
    position: absolute;
    bottom: 10vh;
    left: -20px;
}

.hero-scroll-down .pp-infobox-image {
	text-align: right;
}

.hero-scroll-down .pp-infobox-image a {
	pointer-events: none;
}

.hero-scroll-down .pp-infobox .pp-description-wrap {
	display: none;
}

.hero-scroll-down .pp-infobox .pp-more-link .pp-button-icon-right {
    margin-left: 0;
}

.hero-scroll-down .pp-infobox .pp-more-link {
    text-decoration: none;
    text-align: left;
}

.hero-scroll-down .pp-infobox .pp-more-link .pp-button-icon-right{
	margin: 0 !important;
}
	
.hero-scroll-down  .pp-infobox a.pp-more-link {
  display: inline-flex; 
  align-items: center;
  justify-content: center;
  width: 40px;               
  height: 40px;          
  padding: 0 !important;       
  border-radius: 50%;        
  color: var(--white);
  background: var(--black);
  text-decoration: none;     
}

.hero-scroll-down .pp-infobox a.pp-more-link:hover {
	color: var(--black);
	background: var(--white);
}


/* Unser Service */

.two-columns-text .pp-infobox{
	text-align: left;
}

.two-columns-text .pp-infobox-title{
	margin-bottom: 20px !important;
}

@media (min-width: 768px) {
	.two-columns-text .pp-description-wrap{
		display: flex;
	}	

	.two-columns-text .left, .two-columns-text .right{
		flex: 1;
	}
	.two-columns-text .left{
		padding-right: 50px;
	}
}

/* Das Bieten wir Ihnen */ /* Leistungsbeschreibung */

.leistungs-uebersicht-headline .pp-infobox .pp-description-wrap{
	margin-bottom: 0;
}

/* Standard-Abstand für Columns mit Separator */
.two-columns-text .fl-col.seperator {
    position: relative;
    padding-bottom: 0px;
}

/* Mobile Optimierung */
@media only screen and (max-width: 767px) {
    .two-columns-text .fl-col.seperator {
        padding-bottom: 0px;
    }
}

.leistungs-beschreibung .layout-6 {
	display: flex;
	justify-content: space-between;
	text-align: left;
	align-items: flex-start;
	flex-wrap: wrap;
}

.leistungs-beschreibung .layout-6 .pp-infobox-title-prefix {
	flex: 0;
	order: 1;
	margin-right: 20px;
	margin-top: -20px;
	font-weight: 600;
}

.leistungs-beschreibung .layout-6 .pp-infobox-title-wrapper {
	flex: 1;
	order: 2;
}

.leistungs-beschreibung .layout-6 .pp-infobox-title {
	font-size: 2em;
}

.leistungs-beschreibung .layout-6 .pp-icon-wrapper {
	flex: 1;
	order: 4;
}

.leistungs-beschreibung .layout-6 .pp-infobox-image {
	text-align: right;
}

.leistungs-beschreibung .layout-6 .pp-infobox-description {
	flex: 1;
	order: 3;
}

.leistungs-beschreibung .pp-infobox .pp-description-wrap, .leistungs-beschreibung ul {
	margin-bottom: 0;
}

/* Responsiv für kleinere Bildschirme (z.B. Tablets) */
@media (max-width: 768px) {
	.leistungs-beschreibung .layout-6 {
		flex-flow: column wrap;
		justify-content: flex-start;
	}

	.leistungs-beschreibung .layout-6 .pp-infobox-title {
		font-size: 1.5em; /* Kleinere Schriftgröße auf mobilen Geräten */
	}

	.leistungs-beschreibung .layout-6 .pp-infobox-title-prefix,
	.leistungs-beschreibung .layout-6 .pp-infobox-title-wrapper,
	.leistungs-beschreibung .layout-6 .pp-infobox-description,
	.leistungs-beschreibung .layout-6 .pp-icon-wrapper {
		width: 100% !important; /* 2 Spalten auf kleinen Bildschirmen */
		box-sizing: border-box;
	}
	
	.leistungs-beschreibung .layout-6 .pp-infobox-title-prefi{
		order: 1;
	}
	
	.leistungs-beschreibung .layout-6 .pp-icon-wrapper {
		order: 2;
		margin-top: -20px;
	}
	
	.leistungs-beschreibung .layout-6 .pp-infobox-title-wrapper{
		order: 3;
	}
	
	.leistungs-beschreibung .layout-6 .pp-infobox-description{
		order: 4;
	}

	.leistungs-beschreibung .layout-6 .pp-infobox-title {
		font-size: 1.2em;
	}

	.leistungs-beschreibung .layout-6 .pp-infobox-description {
		font-size: 0.9em;
	}
}


/* Ihr Ansprechpartner */

@media (max-width: 1230px) {
	.ihr-ansprechpartner .pp-infobox-wrap .layout-4-wrapper{
		flex-direction: column-reverse;
	}

	.ihr-ansprechpartner .pp-icon-wrapper{
		margin: 0 !important;
	}
}

.ihr-ansprechpartner ul{
	list-style-type: none;
	margin: 0 !important;
}

.ihr-ansprechpartner li.footer-contact-icons{
	margin-left: -40px;
}

.ihr-ansprechpartner li.footer-contact-icons img{
	margin-right: 10px;
}

/* ############################################# Projekte ############################################# */

/* ############################################# Single Post Layout Projekte ############################################# */

.single-post-layout-intro img{
	pointer-events: none;
}

.single-post-layout-intro .pp-heading-wrapper{
	flex: 1;
}

.single-post-layout-intro .pp-infobox-title{
	font-size: 4.2vw !important;
}

.single-post-layout-intro .pp-icon-wrapper{
	margin-left: 0 !important;
	flex: 1;
}

.single-post-layout-intro .pp-infobox .pp-description-wrap{
	margin: 0;
}

.single-post-layout-intro .pp-infobox-description {
    position: absolute;
    left: calc( 50vw - 35px );
}

.single-post-layout-intro .pp-infobox .pp-more-link {
    text-decoration: none;
    text-align: left;
}

.single-post-layout-intro .pp-infobox .pp-more-link .pp-button-icon-right{
	margin: 0 !important;
}

.single-post-layout-intro .pp-infobox a.pp-more-link {
  display: inline-flex; 
  align-items: center;
  justify-content: center;
  width: 60px;               
  height: 60px;          
  padding: 0 !important;       
  border-radius: 50%;        
  color: var(--white);
  background: var(--black);
  text-decoration: none;     
}

.single-post-layout-intro .pp-infobox a.pp-more-link:hover {
	color: var(--black);
	background: var(--white);
}

.single-post-layout-intro .pp-infobox .pp-more-link .pp-button-icon-right{
	margin-left: 0;
}

.facts-row .fl-builder-bottom-edge-layer{
	bottom: -15%;
}

.facts-row .fl-builder-bottom-edge-layer > * {
    width: 100%;
    left: calc(50% - 50%);
    right: auto;
    height: 40%;
    top: auto;
    bottom: 0;
    transform: scaleX(1) scaleY(-1);
}

@media (max-width: 1024px){
  .facts-row .fl-builder-bottom-edge-layer > * {
    height: 20% !important;
  }
	
	.facts-row .fl-builder-bottom-edge-layer{
		bottom: -5%;
	}
}

.infolist-wrapper {
	width: 100%;
}

.infolist-item {
	margin: 0;
	padding: 0;
}

.infolist-row {
	display: flex;
	padding: 30px 0;
	align-items: center;
	border-top: 1px solid var(--black);
}

.infolist-row:last-child {
	border-bottom: 1px solid var(--black); /* Border unten nur bei letzter Zeile */
}

.label {
	flex-basis: 60%;
}

.wert {
	flex-basis: 40%;
	font-weight: 600;
}

.facts-row .pp-infobox-image img{
	width: 100% !important;
}

.facts-module .pp-infobox{
	display:flex;
	flex-direction: column;
}

.facts-module .pp-infobox .pp-infobox-title-wrapper {
	order: 3;
	color: var(--white) !important;
}

.facts-module .pp-infobox .pp-infobox-title {
	color: var(--white) !important;
}

.facts-module .pp-infobox .pp-icon-wrapper {
	order: 2;
}

.facts-module .pp-infobox .pp-infobox-description {
	order: 1;
}

.facts-row .only-image .pp-infobox-title-wrapper, 
.facts-row .only-image .pp-infobox-description, 
.facts-row .only-image .pp-description-wrap { display: none; margin: 0;}

.only-image { margin-top: auto; }

.projektgallery .pp-image-carousel-item{
	padding: 0;
}

@media (min-width: 1024px){
	.projektgallery .pp-image-carousel-item{
		padding: 0 100px;
	}
	
	.projektgallery-description{
		padding-right: 100px;
	}
}

.projektgallery img { width: 100%; }

.projektgallery .swiper-pagination-bullet{
	border: solid 1px var(--black);
	transform: scale(.66);
}


/* ############################################# Karriere ############################################# */

.karriere-kontakt .pp-infobox{
	padding: 0;
}

.karriere-kontakt .pp-infobox .pp-description-wrap{
	margin-bottom: var(--small);
}

.karriere-kontakt .fl-photo{
	z-index: 2;
}

@media only screen and (min-width: 1024px) {
	.karriere-kontakt .fl-photo{
    	top: 15vh;
    	right: 3vw;
	}
}

.karriere-kontakt .fl-col.column-fix{
    position: relative;
    z-index: 1;
    left: 0px;
	margin-top: 0px;
}

.karriere-bei-bauwerk .pp-infobox-button{
	float: right;
}

/* Mobile Anpassung: Deaktivierung der Styles */
@media only screen and (max-width: 800px) {
    .fl-col.column-fix {
        position: static;  /* Deaktiviert die relative Positionierung */
        left: 0;           /* Entfernt den Abstand von der linken Seite */
        margin-top: 0;     /* Setzt den Abstand oben zurück */
    }

    .karriere-bei-bauwerk .pp-infobox-button {
        float: none;       /* Entfernt das float */
    }
}


.sticky-row	.sticky-column {
		position: relative; 
		overflow: visible !important;
	}

@media only screen and (min-width: 1024px) {
	.sticky-column, .sticky {
		position: sticky; 
		position: -webkit-sticky; 
		top: 80px; 
	}
}

/* ############################################# Kontakt ############################################# */

/* Headline Position */

.kontakt .pp-infobox {
	padding: 0;
}

.kontakt .pp-infobox-title-wrapper {
	text-align: right;
    max-width: 1600px;
    margin: 5vh auto 10vh;
    width: 100%;
}

.kontakt .fl-row-content, .fl-row.kontakt, .kontakt .fl-row-content {
	margin-left: 0 !important;
}

.kontakt .pp-infobox >*:not(.pp-infobox-title-wrapper) {
    max-width: 1488px;
	position: relative; 
	margin-right: 50px;
}

.kontakt .pp-button-wrap{
    right: -25px;
    top: -130px;
    max-width: 1600px;
    position: absolute;
}

.kontakt .pp-infobox-image {
	text-align: left;
}

.kontakt .pp-infobox-image a{
	pointer-events: none;
}

.kontakt .pp-infobox .pp-description-wrap{
	display: none;
}

.kontakt .pp-infobox .pp-more-link .pp-button-icon-right {
    margin-left: 0;
}

.kontakt .pp-infobox .pp-more-link {
    text-decoration: none;
    text-align: left;
}

.kontakt .pp-infobox a.pp-more-link {
    padding: 17px 20px !important;
    border-radius: 100px;
	color: var(--white);
	background: var(--black);
}


.kontakt .pp-infobox a.pp-more-link:hover {
	color: var(--black);
	background: var(--white);
}

/* Kontaktinformationen */

.kontaktinformationen .fl-col-content {
	display: flex;
	flex-wrap: wrap;
	gap: 50px 0px; /* Abstand zwischen den Elementen */
}

.kontaktinformationen .fl-module-sidebar {
	flex: 1 1 300px; /* wächst mit, aber mindestens 300px */
	max-height: 80px;
	align-content: flex-end;
}

.kontaktinformationen .fl-module-sidebar p {
	margin-bottom: 0;
}

.kontaktinformationen .fl-module-pp-contact-form-7 {
	flex: 2 1 500px; /* größerer Flex-Basis */
}

/* Breakpoint für kleinere Screens */
@media (max-width: 768px) {
	.kontaktinformationen .fl-col-content {
		flex-direction: column;
	}

	.kontaktinformationen .fl-module-sidebar,
	.kontaktinformationen .fl-module-pp-contact-form-7 {
		flex: 1 1 auto;
		max-height: none;
	}
}

/* Formular */

.wpcf7-form-control-wrap .wpcf7-text:not(.wpcf7-form-control-wrap .wpcf7-email), .wpcf7-form-control-wrap .wpcf7-number{
	margin-right: 50px;
}

.wpcf7-form-control-wrap .wpcf7-email, .pp-cf7-content .wpcf7-text{
	margin-right: 0px;
	margin-top: 0 !important;
}

@media (min-width: 768px) {
	.pp-cf7-content .wpcf7-text:not(.wpcf7-form-control-wrap .wpcf7-email), 
	.pp-cf7-content .wpcf7-number{
		width: calc(50% - 50px) !important;
	}
}

.pp-cf7-content .wpcf7-text .wpcf7-email{
	width: 50%;
}

.pp-cf7-content .wpcf7-textarea{
	width: 100% !important;
}

.pp-cf7-content form p{
	text-align: right !important;
} 

.pp-cf7-content  span.capitalize{
	color: var(--black);
}

.footer-contact-icons a{
	color: var(--black);
	transition: all 0.4s !important;
}

.pp-cf7-content  span.capitalize:hover{
	color: var(--white);
	background: var(--black);
	transition: all 0.4s !important;
}
	

.wpcf7-submit{
	border: solid 1px var(--black);
	border-radius: 100px;
	padding: 8px 12px;
} 

.wpcf7-submit{
	display: inline-flex;
    align-items: center;
	padding: 5px 30px 5px 20px !important;
    border-radius: 100px;
    font-size: var(--regular) !important;
    letter-spacing: -.5px;
    text-transform: normal;
    font-weight: 300;
}

.wpcf7-submit{
	background: var (--white);
	transition: all .4s ease-out;
	color: var(--black);
}

.wpcf7-submit:hover{
	background: var(--black);
	transition: all .4s ease-out;
	color: var(--white);
}

.wpcf7-submit .pp-button-icon-right{
	margin: 1px 0px 0 15px;
}

.wpcf7-submit .fa-arrow-right-long:before {
	font-size: 25px;
	font-weight: 100;
}


/* ############################################# Cases ############################################# */

/* Cases General */

.cases .pp-content-grid-post {
    font-size: 14px;
    overflow: hidden;
	text-align:center;
	background:transparent;
}

.cases .pp-content-post:hover{
	background:transparent;
}

.cases .pp-content-grid-post-image {
    padding: 0;
    position: relative;
    background:#000;
}

.cases .pp-content-grid-post-logo img{
    width:33% !important;
	position:absolute;
	top:50%;
	left:50%;
	-webkit-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
}

/* Ausnahme für BA Logo */
.cases .post-4020 .pp-content-grid-post-logo img{
    width:50% !important;
}

.cases .pp-content-grid-post-image img{
    width:100%;
    transition: all 0.2s ease-in-out 0s;
}

.cases .pp-content-grid-post-text {
    padding: 0 20px;
    width: 100%;
    position: absolute;
    top: 50%;
	-webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 1;
    opacity: 0;
    transition: all 0.3s ease-in-out 0s;
	text-align:center;
	height:100%;
}
.cases .pp-content-grid-post-text * {
    color: #fff !important;
}
.cases .pp-content-grid-post-image:hover .pp-content-grid-post-text {
    opacity: 1;
}
.cases .pp-content-grid-post-image:hover a > img {
    opacity: 0.2;
	-webkit-transform:scale(1.1); 
    transform:scale(1.1);
}
.cases .pp-content-grid-post-title {
	margin: 0;
	padding: 0;
	color: #fff;
	position:absolute;
	bottom:5%;
	left:5%;
}
.cases .pp-content-grid-post-meta {
    margin-top: 10px;
    padding: 0;
    color: #fff;
}
.cases .pp-content-grid-post-meta a {
    text-decoration: none;
}
.cases .pp-content-grid-post-meta,
.cases .pp-content-grid-post-meta a {
    color: #888;
    font-size: 12px;
}
.cases .pp-content-grid-post-meta a:hover {
    color: #000;
}
.cases .pp-content-grid-separator {
    height: 2px;
    width: 60px;
    background: #000;
    margin-top: 10px;
    margin-bottom: 20px;
}

.cases .pp-post-filters-wrapper{
	display:block !important;
	padding-bottom:4%;
}

.cases .pp-post-filters-wrapper{
	background:none;
	color:var(--white);
}

@media only screen and (min-width: 1024px) {
	.cases .pp-post-filters-wrapper:before{
		content:"Filter:";
		display:inline;
		float:left;
		padding:10px 0;
		margin-right:20px;
		font-family: 'karla';
	}
}

.cases ul.pp-post-filters{
	opacity:1;
	margin:unset;
}

.cases ul.pp-post-filters li, .cases ul.pp-post-filters li:hover, .cases ul.pp-post-filters li.pp-filter-active{
	color:var(--white);
	padding:10px 0px;
	margin-right:20px;
	margin-bottom:0;
	opacity:0.5;
}

.cases ul.pp-post-filters li:hover, .cases ul.pp-post-filters li.pp-filter-active{
	opacity:1;
}

.cases ul.pp-post-filters li{
	font-family: 'karla';
}

.cases .pp-post-filters-toggle{
	padding:0;
	font-family: 'karla';
}

.cases .pp-post-filters-toggle:before{
	content:"Filter:";
}

.cases .pp-post-filters-toggle .toggle-text{
	display:none;
}

/* Cases Slider */
body:not(.fl-builder-edit) .slider,
body:not(.fl-builder-edit) .slider div:not(.slider-prev):not(.slider-next):not(.fl-slideshow-nav):not(.fl-slideshow-nav-buttons){
	height:100%
		!important;
}

.fl-slideshow-nav{
	opacity:1 !important;
}

.fl-slideshow-nav-buttons{
	background:unset !important;
	background-image:unset !important;
	background-color:transparent !important;
	width:unset !important;
	height:unset !important;
	top:15px !important;
}

.fl-slideshow-nav-prev,
.fl-slideshow-nav-next,
.fl-slideshow-nav a{
	background-color:var(--black) !important;
	background-image:unset !important;
	border-radius:30px;
	width:30px !important;
	height:30px !important;
}

.fl-slideshow-image-nav-left a{
	background-image:unset !important;
}

.fl-slideshow-nav-prev{
	margin-left:10px;
}

.fl-slideshow-nav-prev:after{
    content: " ";
    border: solid var(--white);
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 4px;
    position: absolute;
    -webkit-transform: rotate(-135deg);
    transform: rotate(135deg);
    left: 12px;
    top: calc(50% - 6px);
    opacity: 1;
}

.fl-slideshow-nav-next{
	margin-right:10px;
}

.fl-slideshow-nav-next:after{
    content: " ";
    border: solid var(--white);
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 4px;
    position: absolute;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    right: 12px;
    top: calc(50% - 6px);
    opacity: 1;
}


.homecases .pp-content-post{
	display:table-cell !important;
	vertical-align:middle !important;
	padding:8%;
	transition: transform .2s;
	width:1000px;
}

.homecases .pp-content-post:hover{
	background:transparent;
  	transform: scale(1.1);

}

.homecases .pp-content-post a{
	color:#fff;
	text-transform:lowercase;
	position:relative;
}

.homecases .pp-content-grid-post-text h3.pp-content-grid-post-title{
	display:none;
}

.homecases .pp-content-posts-inner .owl-item:hover .pp-content-grid-post-text {
    opacity: 1;
}

.homecases .pp-content-posts-inner .owl-item:hover .pp-content-grid-post-image {
    opacity: 0.2;
}

/* Cases Home */

.homecases .pp-content-grid-post {
    font-size: 14px;
    padding:0;
}

.homecases .pp-content-grid-post-image {
    padding: 0px;
    padding-bottom: 0;
}

.homecases .pp-content-grid-post-text {
    padding: 20px;
}

.homecases .pp-content-grid-post-title {
    font-size: 20px;
	line-height: 26px;
	margin: 0;
	padding: 0;
}

.homecases .pp-content-grid-post-meta {
    padding: 0;
}

.homecases .pp-content-grid-post-meta a {
    text-decoration: none;
}

.homecases .pp-content-grid-post-meta,

.homecases .pp-content-grid-post-meta a {
    color: #fff;
    font-size: 12px;
}

.homecases .pp-content-grid-post-meta a:hover {
    color: #fff;
}

.homecases .pp-content-grid-separator {
    min-height: 2px;
    width: 60px;
    background: #000;
    margin-top: 10px;
    margin-bottom: 20px;
}


/* Next Prev Buttons */
.homecases .pp-content-post-carousel .owl-nav button {
	position: absolute;
	top: unset;
	bottom:-50px;
	z-index: 1;
	display: inline-flex;
	color:#000;
	background:none;
	width:60px;
	cursor: pointer;
}

.homecases .pp-content-post-carousel .owl-nav button.owl-prev{
	left:calc(100% - 15% - 60px);
	align-items: left;
	justify-content: left;
} 

.homecases .pp-content-post-carousel .owl-nav button.owl-prev:after{
	content:" ";
	height:2px;
	width:30px;
	background:var(--white);
	position:absolute;
	left:12px;
	top:calc(50% - 1px);
	opacity: 1;
}

.homecases .pp-content-post-carousel .owl-nav button.owl-next{
	left:calc(100% - 15%);
	align-items: right;
	justify-content: right;
} 

.homecases .pp-content-post-carousel .owl-nav button.owl-next:after{
	content:" ";
	height:2px;
	width:30px;
	background:var(--white);
	position:absolute;
	right:12px;
	top:calc(50% - 1px);
	opacity: 1;
}


.single-referenzen .post-links{
	display: none;
}

.border{
	border:5px solid var(--white);
	margin:10px;
}

.border .fl-module-content{
	margin:0;
}

/* ############################################ Time Table ############################################# */

.pp-timeline-content-wrapper .pp-timeline-item .pp-timeline-icon {
    background-color: var(--red) !important;
    border-radius: 100px !important;
}

.pp-timeline-content-wrapper .pp-timeline-icon {
    padding: 5px !important;
}

/* ############################################# Footer ############################################# */

@media (min-width: 600px) and (max-width: 768px) {
	.yannick {
		position: absolute;
		bottom: 266px;
		right: -80px;
		width: 400px;
		z-index: 9;
		overflow: hidden;
	}
}
@media (min-width: 800px) {
	.yannick {
		position: absolute;
		bottom: 200px;
		right: 0px;
		width: 600px;
		z-index: 9;
		overflow: hidden;
	}
}

/* Kontakt aufnehmen CTA */

.footer .footer-cta{
	font-family: 'Manrope';
	font-size: 4vw !important;
	text-transform: lowercase !important;
	letter-spacing: 1.5px;
}

.footer .pp-button .pp-button-icon{
	font-weight: 200;
}

/*
 .pp-button-wrap a.pp-button,  .pp-button-wrap a.pp-button:visited {
    transition-duration: 10s !important;
}

/* Logo + Email */

.footer .pp-infobox-wrap .layout-1 .pp-heading-wrapper,
.footer .pp-infobox-wrap .layout-2 .pp-heading-wrapper {
    display: flex;
    justify-content: flex-start !important;
    max-width: 1200px;
    gap: 150px;
    margin: 0 auto;
}

.footer .pp-infobox-image {
    margin: 10px auto 10px;
    text-align: center;
}
	
.footer .pp-infobox-wrap .layout-1 .pp-infobox-description {
    display: none;
}

.footer .pp-infobox-title, .footer h4{
    font-size: 3.5vw !important;
	transition: all 0.4s !important;
}

.footer .pp-infobox-wrap .layout-1 .pp-infobox-title-wrapper .pp-infobox-title:hover a {
    font-size: 3.5vw;
	background: var(--white);
	color: var(--black) !important;
	transition: all 0.4s !important;
}

.footer .pp-heading-wrapper-inner{
    position: relative;
	padding: 30px 0;
}

.footer .pp-heading-wrapper-inner::before {
    content: "";
    width: 2px;
    height: 100%;
    position: absolute;
    display: block;
    background: var(--white);
    left: -75px;
	bottom: 0;
}

@media (max-width: 1200px) {
	.footer .pp-icon-wrapper{
		padding-left: 20px;
	}
}

@media (max-width: 800px) {
	.footer .pp-icon-wrapper{
		padding-left: 10px;
	}
	.footer .pp-infobox-image img{
		width: 80px !important;
	}
}

@media (max-width: 480px) {
	.footer .pp-infobox-wrap .layout-1 .pp-heading-wrapper,
	.footer .pp-infobox-wrap .layout-2 .pp-heading-wrapper {
    	gap: 50px;
	}
	.footer .pp-heading-wrapper-inner::before {
    	left: -25px;
}
	.footer .pp-infobox-image img{
		width: 50px;
	}
}

/* Info Footer */

.wpbf-widget-footer{
	padding-top: 40px;
}

.wpbf-widget-footer .wpbf-container {
    display: flex;
    max-width: 1240px;
    margin: 0 auto;
	padding: 0 20px !important;
}

.wpbf-inner-widget-footer .wpbf-grid {
    display: flex;
    width: 100%;
    justify-content: flex-start;
	margin-left: 0 !important;
	align-items: flex-end;
}

.wpbf-footer-widget{
	padding: 0 20px 0 0;
}

.wpbf-footer-widget p{
	margin: 0;
}

.footer-contact-icons a{
	color: var(--black);
}

.footer-contact-icons a:hover{
	color: var(--white);
	background: var(--black);
	transition: all 0.4s !important;
}


.light .footer-contact-icons a{
	color: var(--white);
}

.light .footer-contact-icons a:hover{
	color: var(--black);
	background: var(--white);
	transition: all 0.4s !important;
}

.light .footer-contact-icons svg{
	width: 20px;
	height: 20px;
	margin-right: 10px;
	position: relative;
	top: 5px;
	fill: var(--white);
}


.footer-contact-icons a{
	transition: all 0.4s !important;
}

.footer-contact-icons svg{
	width: 20px;
	height: 20px;
	position: relative;
	top: 5px;
}

footer .footer-contact-icons a{
	color: var(--white);
}

footer .footer-contact-icons svg{
	width: 20px;
	height: 20px;
	margin-right: 10px;
	position: relative;
	top: 5px;
	fill: var(--white);
}

footer .footer-contact-icons a:hover{
	color: var(--black);
	background: var(--white);
	transition: all 0.4s !important;
}

.menu-footer-legals-container a{
	transition: all 0.4s !important;
}

.menu-footer-legals-container a:hover{
	color: var(--black);
	background: var(--white);
	transition: all 0.4s !important;
}

/* ############################################# Font Face ############################################# */

/* manrope-200 - 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: 'Manrope';
  font-style: normal;
  font-weight: 200;
  src: url('../colistic-child/fonts/manrope-v19-latin-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* manrope-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: 'Manrope';
  font-style: normal;
  font-weight: 300;
  src: url('../colistic-child/fonts/manrope-v19-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* manrope-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: 'Manrope';
  font-style: normal;
  font-weight: 400;
  src: url('../colistic-child/fonts/manrope-v19-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* manrope-500 - 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: 'Manrope';
  font-style: normal;
  font-weight: 500;
  src: url('../colistic-child/fonts/manrope-v19-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* manrope-600 - 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: 'Manrope';
  font-style: normal;
  font-weight: 600;
  src: url('../colistic-child/fonts/manrope-v19-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* manrope-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: 'Manrope';
  font-style: normal;
  font-weight: 700;
  src: url('../colistic-child/fonts/manrope-v19-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* manrope-800 - 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: 'Manrope';
  font-style: normal;
  font-weight: 800;
  src: url('../colistic-child/fonts/manrope-v19-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* karla-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: 'Karla';
  font-style: normal;
  font-weight: 400;
  src: url('../colistic-child/fonts/karla-v32-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* karla-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: 'Karla';
  font-style: italic;
  font-weight: 400;
  src: url('../colistic-child/fonts/karla-v32-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

@font-face {
    font-family: 'pp_migraitalicregular';
    src: url('../colistic-child/fonts/ppmigra-variableitalics-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'pp_migralight';
    src: url('../colistic-child/fonts/ppmigra-light-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'pp_migrabold';
    src: url('../colistic-child/fonts/ppmigra-bold-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}