) */
.bnet_hero2_desk .bnet_hero2_desk_excerpt {
font-size: 12px !important;
line-height: 16px !important;
display: -webkit-box !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 3 !important;
overflow: hidden !important;
height: 48px !important; /* 3 * 16px */
}
/* Normalize inner paragraphs */
.bnet_hero2_desk .bnet_hero2_desk_excerpt p {
font-size: inherit !important;
line-height: inherit !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
display: inline !important;
}
/* --------- TIME / META (feste Höhe) --------- */
.bnet_hero2_desk .bnet_hero2_desk_date {
font-size: 10px !important;
font-weight: 500 !important;
text-transform: uppercase !important;
line-height: 12px !important;
border-bottom: 0 !important;
border-top: 0 !important;
margin-bottom: 8px !important;
height: 25px !important; /* eine Zeile */
overflow: hidden !important;
}
/* --------- IMAGE (immer gleich hoch) --------- */
.bnet_hero2_desk .fusion-post-card-image img,
.bnet_hero2_desk .featured-image img {
width: 100% !important;
height: 100px !important; /* bei Bedarf z.B. 120px */
object-fit: cover !important;
display: block !important;
}
/* --------- Dezente vertikale Divider mit Innenabstand --------- */
.bnet_hero2_desk .post-card {
position: relative;
}
.bnet_hero2_desk .post-card::after {
content: "";
position: absolute;
top: 6px; /* Abstand von oben */
bottom: 6px; /* Abstand von unten */
right: 0;
width: 1px;
background-color: #e2e2e2;
}
.bnet_hero2_desk .post-card:nth-child(3n)::after {
display: none;
}
}
/* ==========================================================================
TOUCH/SWIPE/HOVER
========================================================================== */
/* Basis-Card: dezenter Grundschatten + Setup für Animation */
.bnet_hero2_desk .post-card {
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: 0 1px 2px rgba(0,0,0,0.04); /* ganz zarter Basisschatten */
transform: translateY(0) scale(1);
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27); /* micro-bounce */
}
/* Desktop-Hover – Premium Lift */
@media (min-width: 769px) {
.bnet_hero2_desk .post-card:hover {
background-color: #f5f7f8; /* leichtes Paper-Grau, nicht „dreckig“ */
box-shadow: 0 2px 6px rgba(0,0,0,0.14); /* schärferer, knackigerer Schatten */
transform: translateY(-2px) scale(0.99); /* Micro-Lift + ganz leicht kleiner */
}
}
/* Mobile/JS-Tap – nutzt bn-tap von deinem Script, gleiche Optik wie Hover */
.bnet_hero2_desk .post-card.bn-tap {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
/* Safety: innere Wrapper sollen keinen eigenen Shadow/Background setzen */
.bnet_hero2_desk .post-card .fusion-column-wrapper,
.bnet_hero2_desk .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
HOMEPAGE TABLET HORIZONTAL
HOMEPAGE TABLET HORIZONTAL
HOMEPAGE TABLET HORIZONTAL
HOMEPAGE TABLET HORIZONTAL
Active Post Card Name POSTCARD TOP THEMEN TABLET #2-#5
Builder Postcard New: bnet_hero2_tab
Postcard Library Column New: none
Title New: bnet_hero2_tab_title
Excerpt New: bnet_hero2_tab_excerpt
Date New: bnet_hero2_tab_date
Image New: none
========================================================================== */
/* --------------------------------------------------------------------------
Tablet behaves like Mobile: horizontal scroll + partial next card visible
Viewport width: 769-1023 (handled by Avada visibility, no media queries)
-------------------------------------------------------------------------- */
/* Container (scroll wrapper) */
.bnet_hero2_tab {
display: block !important;
overflow-x: auto !important;
overflow-y: hidden !important;
overscroll-behavior-x: contain !important;
-webkit-overflow-scrolling: touch !important;
scroll-snap-type: x mandatory !important;
padding-top: 0 !important;
padding-right: 12px !important; /* keeps "peek" space on the right */
padding-bottom: 0 !important;
padding-left: 0 !important;
}
/* Kill Avada spacing variables (prevents random gaps on tablet) */
.bnet_hero2_tab {
--awb-row-spacing-small: 0px !important;
--awb-row-spacing-medium: 0px !important;
--awb-row-spacing: 0px !important;
--awb-column-spacing: 0px !important;
}
/* Wrapper/grid: must not impose grid columns */
.bnet_hero2_tab .fusion-post-cards-wrapper,
.bnet_hero2_tab ul.fusion-grid {
display: flex !important;
flex-wrap: nowrap !important;
margin-top: 0 !important;
margin-right: 0 !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
padding-top: 0 !important;
padding-right: 0 !important;
padding-bottom: 0 !important;
padding-left: 0 !important;
border-top: 0 !important;
border-right: 0 !important;
border-bottom: 0 !important;
border-left: 0 !important;
gap: 0 !important;
}
/* Cards: fixed slide width in viewport units => 4 full + peek */
.bnet_hero2_tab .fusion-post-card,
.bnet_hero2_tab li.fusion-post-card,
.bnet_hero2_tab li.post-card {
flex: 0 0 18vw !important;
max-width: 18vw !important;
scroll-snap-align: start !important;
margin-top: 0 !important;
margin-right: 12px !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
}
/* If Swiper markup exists */
.bnet_hero2_tab .swiper-slide {
width: 18vw !important;
max-width: 18vw !important;
}
/* CATEGORY */
.bnet_hero2_tab .bnet_hero2_tab_cat {
font-size: 8px !important;
font-weight: 500 !important;
line-height: 12px !important;
text-transform: uppercase !important;
letter-spacing: 0.05em !important;
margin-top: 0 !important;
margin-right: 0 !important;
margin-bottom: 4px !important;
margin-left: 0 !important;
opacity: 0.88 !important;
}
/* TITLE (2 lines, ellipsis) */
.bnet_hero2_tab_title {
height: 42px !important;
overflow: hidden !important;
display: block !important;
}
.bnet_hero2_tab_title .fusion-title-heading {
margin-top: 0 !important;
margin-right: 0 !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
font-size: 14px !important;
font-weight: 400 !important;
text-align: left !important;
line-height: 18px !important;
display: -webkit-box !important;
-webkit-line-clamp: 2 !important;
-webkit-box-orient: vertical !important;
overflow: hidden !important;
}
/* EXCERPT (2 lines, ellipsis – TABLET) */
.bnet_hero2_tab_excerpt {
height: 26px !important; /* 2 × 13px */
overflow: hidden !important;
font-size: 11px !important;
line-height: 13px !important;
text-align: left !important;
display: -webkit-box !important;
-webkit-line-clamp: 2 !important;
-webkit-box-orient: vertical !important;
}
/* Safety: Absatz innen darf nichts addieren */
.bnet_hero2_tab_excerpt p {
margin-top: 0 !important;
margin-right: 0 !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
}
/* DATE / META (one line) */
.bnet_hero2_tab_date {
height: 25px !important;
overflow: hidden !important;
font-size: 10px !important;
line-height: 25px !important;
text-transform: uppercase !important;
font-weight: 500 !important;
color: #666666 !important;
text-align: left !important;
display: flex !important;
align-items: center !important;
border-top: 0 !important;
border-right: 0 !important;
border-bottom: 0 !important;
border-left: 0 !important;
margin-top: 0 !important;
margin-right: 0 !important;
margin-bottom: 3px !important;
margin-left: 0 !important;
padding-top: 0 !important;
padding-right: 0 !important;
padding-bottom: 0 !important;
padding-left: 0 !important;
}
/* Image (if present) */
.bnet_hero2_tab .fusion-post-card-image {
height: 120px !important;
overflow: hidden !important;
margin-top: 0 !important;
margin-right: 0 !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
display: block !important;
}
.bnet_hero2_tab .fusion-post-card-image img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
display: block !important;
}
/* ==========================================================================
TOUCH / TAP STATE (TABLET COMPONENT)
========================================================================== */
/* Base card */
.bnet_hero2_tab .post-card,
.bnet_hero2_tab .fusion-post-card {
border-radius: 6px !important;
background-color: #f5f7f8 !important;
box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
transform: translateY(0) scale(1) !important;
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27);
}
/* Tap state (JS adds bn-tap) + no-JS fallback */
.bnet_hero2_tab .post-card.bn-tap,
.bnet_hero2_tab .fusion-post-card.bn-tap,
.bnet_hero2_tab .post-card:active,
.bnet_hero2_tab .fusion-post-card:active {
background-color: #f5f7f8 !important;
box-shadow: 0 2px 6px rgba(0,0,0,0.14) !important;
transform: translateY(-2px) scale(0.99) !important;
}
/* Safety */
.bnet_hero2_tab .post-card .fusion-column-wrapper,
.bnet_hero2_tab .post-card .fusion-column-inner-bg,
.bnet_hero2_tab .fusion-post-card .fusion-column-wrapper,
.bnet_hero2_tab .fusion-post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
HOMEPAGE MOBILE HORIZONTAL
HOMEPAGE MOBILE HORIZONTAL
HOMEPAGE MOBILE HORIZONTAL
HOMEPAGE MOBILE HORIZONTAL
Active Post Card Name HOMEPAGE MOBILE HORIZONTAL
Builder Postcard New: bnet_hero2_mob
Postcard Library Column New: none
Title New: bnet_hero2_mob_title
Excerpt | New: bnet_hero2_mob_excerpt
Date | New: bnet_hero2_mob_date
Image | New: none
=========================================================================== */
/* ==========================================================================
POSTCARD TOP THEMEN MOBILE #2–#5 (bnet_hero2_mob)
Eigenständige Version – identisch zur VERY SEXY, nur andere Klassen
========================================================================== */
@media (max-width: 767px) {
/* Container (Swiper-Wrapper) */
.bnet_hero2_mob {
display: block !important;
overflow: hidden !important;
}
/* CATEGORY */
.bnet_hero2_mob .bnet_hero2_mob_cat {
font-size: 8px !important;
font-weight: 600 !important;
line-height: 1.25 !important;
text-transform: uppercase !important;
letter-spacing: 0.05em !important;
margin-bottom: 3px !important;
opacity: 0.85 !important;
}
/* TITEL (2 Zeilen, mit ...) */
.bnet_hero2_mob_title {
height: 38px !important;
overflow: hidden !important;
display: block !important;
}
.bnet_hero2_mob_title .fusion-title-heading {
margin: 0 !important;
font-size: 14px !important;
font-weight: 400 !important;
text-align: left !important;
line-height: 1.2 !important;
/* Multi-Line-Truncate */
display: -webkit-box !important;
-webkit-line-clamp: 2 !important;
-webkit-box-orient: vertical !important;
overflow: hidden !important;
}
/* EXCERPT (3–4 Zeilen, mit ...) */
.bnet_hero2_mob_excerpt {
height: 70px !important;
overflow: hidden !important;
font-size: 12px !important;
line-height: 1.4 !important;
display: block !important;
text-align: left !important;
/* Multi-Line-Truncate */
display: -webkit-box !important;
-webkit-line-clamp: 4 !important; /* ggf. 5 wie bei bnet_sexy_mob */
-webkit-box-orient: vertical !important;
overflow: hidden !important;
}
.bnet_hero2_mob_excerpt p {
margin: 0 !important;
}
/* DATE / META (eine Zeile) */
.bnet_hero2_mob_date {
height: 30px !important;
overflow: hidden !important;
text-transform: uppercase !important;
font-size: 10px !important;
font-weight: 700 !important;
color: #666 !important;
text-align: left !important;
display: flex !important;
border-bottom: 0 !important;
border-top: 0 !important;
align-items: center !important;
margin: 0 !important;
padding: 0 !important;
}
/* Bild – 100px Höhe (falls du den Block hier brauchst) */
.bnet_hero2_mob .fusion-post-card-image {
height: 90px !important;
overflow: hidden !important;
margin-top: 0 !important;
display: block !important;
}
.bnet_hero2_mob .fusion-post-card-image img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
display: block !important;
}
}
/* Breite der Slides (3. Card linst rein) */
@media (max-width: 768px) {
.bnet_hero2_mob .swiper-slide {
width: 38vw !important;
max-width: 38vw !important;
}
}
/* ==========================================================================
HERO 2 MOB – FIX: erste Card rutscht links aus dem Viewport
Ursache: linker Wrapper-/Grid-Gutter (Avada/Swiper)
========================================================================== */
@media (max-width: 1024px) {
/* Scroll-Container */
.bnet_hero2_mob{
overflow-x: auto !important;
overscroll-behavior-x: contain !important;
-webkit-overflow-scrolling: touch !important;
scroll-snap-type: x mandatory !important;
padding-top: 0px !important;
padding-right: 10px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* Alle inneren Avada/Swiper Wrapper links/rechts neutralisieren */
.bnet_hero2_mob .fusion-post-cards-wrapper,
.bnet_hero2_mob .fusion-grid,
.bnet_hero2_mob .swiper,
.bnet_hero2_mob .swiper-wrapper{
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
border-top: 0 !important;
border-bottom: 0 !important;
gap: 0 !important;
}
/* Cards */
.bnet_hero2_mob .fusion-post-card{
flex: 0 0 auto !important;
scroll-snap-align: start !important;
margin-top: 0px !important;
margin-right: 10px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
}
.bnet_hero2_mob .fusion-post-card:last-child{
margin-right: 0px !important;
}
}
/* ==========================================================================
TOUCH/SWIPE/HOVER
========================================================================== */
/* Basis-Card: dezenter Grundschatten + Setup für Animation */
.bnet_hero2_mob .post-card {
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: 0 1px 2px rgba(0,0,0,0.04);
transform: translateY(0) scale(1);
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27);
}
/* Desktop-Hover – Premium Lift */
@media (min-width: 769px) {
.bnet_hero2_mob .post-card:hover {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
}
/* Mobile/JS-Tap – nutzt bn-tap von deinem Script, gleiche Optik wie Hover */
.bnet_hero2_mob .post-card.bn-tap {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
/* Safety: innere Wrapper sollen keinen eigenen Shadow/Background setzen */
.bnet_hero2_mob .post-card .fusion-column-wrapper,
.bnet_hero2_mob .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
CATEGORY DESKTOP HERO CHILDS
Builder Postcard Element: bnet_herochilds_desk
Title: bnet_herochilds_desk_title
Excerpt: bnet_herochilds_desk_excerpt
Date/Meta: bnet_herochilds_desk_date
Image: bnet_herochilds_desk_img
Grid: 3 columns (Divider only after col 1 + 2)
========================================================================== */
@media (min-width: 769px) {
/* --------- TITLE (2 lines, fixed height) --------- */
.bnet_herochilds_desk .bnet_herochilds_desk_title,
.bnet_herochilds_desk .bnet_herochilds_desk_title a{
font-size: 16px !important;
line-height: 21px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 8px !important;
margin-left: 0px !important;
display: -webkit-box !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 2 !important;
height: 42px !important; /* 2 * 21px */
min-height: 42px !important;
max-height: 42px !important;
overflow: hidden !important;
text-transform: none !important;
}
/* ==========================================================================
EXCERPT
3 lines truncate, FIXED HEIGHT, robust (Avada-safe)
========================================================================== */
.bnet_herochilds_desk .bnet_herochilds_desk_excerpt{
font-size: 12px !important;
line-height: 16px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 5px !important;
margin-left: 0px !important;
display: -webkit-box !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 3 !important;
height: 48px !important; /* 3 * 16px = EXAKT */
min-height: 48px !important;
max-height: 48px !important;
overflow: hidden !important;
}
/* Avada-Absätze neutralisieren */
.bnet_herochilds_desk .bnet_herochilds_desk_excerpt p{
font-size: inherit !important;
line-height: inherit !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
display: inline !important;
}
/* Verhindert künstliche „4. Zeile“ durch
*/
.bnet_herochilds_desk .bnet_herochilds_desk_excerpt br{
display: none !important;
}
/* --------- DATE / META (1 line, fixed height) --------- */
.bnet_herochilds_desk .bnet_herochilds_desk_date{
font-size: 10px !important;
font-weight: 500 !important;
text-transform: uppercase !important;
line-height: 12px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 8px !important;
margin-left: 0px !important;
border-bottom: 0 !important;
border-top: 0 !important;
height: 25px !important;
min-height: 25px !important;
max-height: 25px !important;
overflow: hidden !important;
}
/* --------- IMAGE (fixed height) --------- */
.bnet_herochilds_desk .bnet_herochilds_desk_img img{
width: 100% !important;
height: 100px !important;
object-fit: cover !important;
display: block !important;
}
/* --------- VERTICAL DIVIDER (ONLY after col 1 + 2 in a 3-col grid) --------- */
.bnet_herochilds_desk .post-card{
position: relative;
}
.bnet_herochilds_desk .post-card::after{
content: "";
position: absolute;
top: 6px;
bottom: 6px;
right: 0px;
width: 1px;
background-color: #e2e2e2;
}
/* Kill divider on every 3rd card (end of row) */
.bnet_herochilds_desk .post-card:nth-child(3n)::after{
display: none !important;
}
}
/* ==========================================================================
TOUCH/SWIPE/HOVER (SCOPED)
========================================================================== */
.bnet_herochilds_desk .post-card{
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: 0 1px 2px rgba(0,0,0,0.04);
transform: translateY(0) scale(1);
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27);
}
@media (min-width: 769px){
.bnet_herochilds_desk .post-card:hover{
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
}
.bnet_herochilds_desk .post-card.bn-tap{
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
.bnet_herochilds_desk .post-card .fusion-column-wrapper,
.bnet_herochilds_desk .post-card .fusion-column-inner-bg{
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
HOMEPAGE DESKTOP PUSH
HOMEPAGE DESKTOP PUSH
HOMEPAGE DESKTOP PUSH
HOMEPAGE DESKTOP PUSH
Builder Postcard Element: bnet_push_desk
Title: bnet_push_desk_title
Excerpt: bnet_push_desk_excerpt
Date/Meta: bnet_push_desk_date
Image: bnet_push_desk_img
========================================================================== */
@media (min-width: 769px) {
/* --------- TITLE (2 lines, fixed height) --------- */
.bnet_push_desk .bnet_push_desk_title,
.bnet_push_desk .bnet_push_desk_title a {
font-size: 16px !important;
line-height: 21px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 8px !important;
margin-left: 0px !important;
display: -webkit-box !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 2 !important;
height: 42px !important; /* 2 * 21px */
min-height: 42px !important;
max-height: 42px !important;
overflow: hidden !important;
text-transform: none !important;
}
/* ==========================================================================
PUSH DESK – EXCERPT
3 lines truncate, FIXED HEIGHT, robust (Avada-safe)
========================================================================== */
.bnet_push_desk .bnet_push_desk_excerpt {
font-size: 12px !important;
line-height: 16px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 5px !important;
margin-left: 0px !important;
display: -webkit-box !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 3 !important;
height: 48px !important; /* 3 * 16px = EXAKT */
min-height: 48px !important;
max-height: 48px !important;
overflow: hidden !important;
}
/* Avada-Absätze neutralisieren */
.bnet_push_desk .bnet_push_desk_excerpt p {
font-size: inherit !important;
line-height: inherit !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
display: inline !important;
}
/* Verhindert künstliche „4. Zeile“ durch
*/
.bnet_push_desk .bnet_push_desk_excerpt br {
display: none !important;
}
/* --------- DATE / META (1 line, fixed height) --------- */
.bnet_push_desk .bnet_push_desk_date {
font-size: 10px !important;
font-weight: 500 !important;
text-transform: uppercase !important;
line-height: 12px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 8px !important;
margin-left: 0px !important;
border-bottom: 0 !important;
border-top: 0 !important;
height: 25px !important;
min-height: 25px !important;
max-height: 25px !important;
overflow: hidden !important;
}
/* --------- IMAGE (fixed height) --------- */
.bnet_push_desk .bnet_push_desk_img img {
width: 100% !important;
height: 100px !important;
object-fit: cover !important;
display: block !important;
}
/* --------- Divider (scoped) --------- */
.bnet_push_desk .post-card {
position: relative;
}
.bnet_push_desk .post-card::after {
content: "";
position: absolute;
top: 6px;
bottom: 6px;
right: 0px;
width: 1px;
background-color: #e2e2e2;
}
.bnet_push_desk .post-card:nth-child(4n)::after {
display: none;
}
}
/* ==========================================================================
TOUCH/SWIPE/HOVER (SCOPED)
========================================================================== */
.bnet_push_desk .post-card {
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: 0 1px 2px rgba(0,0,0,0.04);
transform: translateY(0) scale(1);
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27);
}
@media (min-width: 769px) {
.bnet_push_desk .post-card:hover {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
}
.bnet_push_desk .post-card.bn-tap {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
.bnet_push_desk .post-card .fusion-column-wrapper,
.bnet_push_desk .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
HOMEPAGE TABLET PUSH
HOMEPAGE TABLET PUSH
HOMEPAGE TABLET PUSH
HOMEPAGE TABLET PUSH
Builder Postcard: bnet_sexy_tab
Title: bnet_sexy_tab_title
Excerpt: bnet_sexy_tab_excerpt
Date: bnet_sexy_tab_date
Image: bnet_sexy_tab_img
========================================================================== */
/* Container (scroll wrapper) */
.bnet_sexy_tab {
display: block !important;
overflow-x: auto !important;
overflow-y: hidden !important;
overscroll-behavior-x: contain !important;
-webkit-overflow-scrolling: touch !important;
scroll-snap-type: x mandatory !important;
padding-top: 0px !important;
padding-right: 12px !important; /* keeps "peek" space on the right */
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* Kill Avada spacing variables (prevents random gaps on tablet) */
.bnet_sexy_tab {
--awb-row-spacing-small: 0px !important;
--awb-row-spacing-medium: 0px !important;
--awb-row-spacing: 0px !important;
--awb-column-spacing: 0px !important;
}
/* Wrapper/grid: must not impose grid columns */
.bnet_sexy_tab .fusion-post-cards-wrapper,
.bnet_sexy_tab ul.fusion-grid {
display: flex !important;
flex-wrap: nowrap !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
border-top: 0px !important;
border-right: 0px !important;
border-bottom: 0px !important;
border-left: 0px !important;
gap: 0px !important;
}
/* Cards: fixed slide width in viewport units => 4 full + peek */
.bnet_sexy_tab .fusion-post-card,
.bnet_sexy_tab li.fusion-post-card,
.bnet_sexy_tab li.post-card {
flex: 0 0 18vw !important;
max-width: 18vw !important;
scroll-snap-align: start !important;
margin-top: 0px !important;
margin-right: 12px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
}
/* If Swiper markup exists */
.bnet_sexy_tab .swiper-slide {
width: 18vw !important;
max-width: 18vw !important;
}
/* TITLE (2 lines, ellipsis) */
.bnet_sexy_tab_title {
height: 42px !important;
overflow: hidden !important;
display: block !important;
}
.bnet_sexy_tab_title .fusion-title-heading {
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
font-size: 14px !important;
font-weight: 400 !important;
text-align: left !important;
line-height: 18px !important;
display: -webkit-box !important;
-webkit-line-clamp: 2 !important;
-webkit-box-orient: vertical !important;
overflow: hidden !important;
}
/* ==========================================================================
HOMEPAGE TABLET PUSH – EXCERPT FIX
3 lines + ellipsis (Avada safe)
========================================================================== */
/* Excerpt wrapper neutralisieren */
.bnet_sexy_tab_excerpt {
height: 42px !important;
overflow: hidden !important;
font-size: 11px !important;
line-height: 13px !important;
text-align: left !important;
display: block !important;
}
/* Avada Zwischenlayer killen */
.bnet_sexy_tab_excerpt .fusion-text,
.bnet_sexy_tab_excerpt .fusion-text p {
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
max-height: none !important;
}
/* Clamp MUSS auf das
*/
.bnet_sexy_tab_excerpt p {
display: -webkit-box !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 3 !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
font-size: 11px !important;
line-height: 13px !important;
max-height: 42px !important; /* 3 × 13px = harte Notbremse */
}
/* DATE / META (one line) */
.bnet_sexy_tab_date {
height: 20px !important;
overflow: hidden !important;
font-size: 10px !important;
line-height: 14px !important;
text-transform: uppercase !important;
font-weight: 500 !important;
color: #666666 !important;
text-align: left !important;
display: flex !important;
align-items: center !important;
border-top: 0px !important;
border-right: 0px !important;
border-bottom: 0px !important;
border-left: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 3px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* Image (if present) */
.bnet_sexy_tab .fusion-post-card-image,
.bnet_sexy_tab .bnet_sexy_tab_img {
height: 120px !important;
overflow: hidden !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
display: block !important;
}
.bnet_sexy_tab .fusion-post-card-image img,
.bnet_sexy_tab .bnet_sexy_tab_img img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
display: block !important;
}
/* ==========================================================================
TOUCH / TAP STATE (TABLET COMPONENT)
========================================================================== */
/* Base card */
.bnet_sexy_tab .post-card,
.bnet_sexy_tab .fusion-post-card {
border-radius: 6px !important;
background-color: #f5f7f8 !important;
box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
transform: translateY(0) scale(1) !important;
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27);
}
/* Tap state (JS adds bn-tap) + no-JS fallback */
.bnet_sexy_tab .post-card.bn-tap,
.bnet_sexy_tab .fusion-post-card.bn-tap,
.bnet_sexy_tab .post-card:active,
.bnet_sexy_tab .fusion-post-card:active {
background-color: #f5f7f8 !important;
box-shadow: 0 2px 6px rgba(0,0,0,0.14) !important;
transform: translateY(-2px) scale(0.99) !important;
}
/* Safety */
.bnet_sexy_tab .post-card .fusion-column-wrapper,
.bnet_sexy_tab .post-card .fusion-column-inner-bg,
.bnet_sexy_tab .fusion-post-card .fusion-column-wrapper,
.bnet_sexy_tab .fusion-post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
TOUCH/SWIPE/HOVER (SCOPED)
========================================================================== */
.bnet_sexy_tab .post-card {
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: 0 1px 2px rgba(0,0,0,0.04);
transform: translateY(0) scale(1);
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27);
}
@media (min-width: 769px) {
.bnet_sexy_tab .post-card:hover {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
}
.bnet_sexy_tab .post-card.bn-tap {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
.bnet_sexy_tab .post-card .fusion-column-wrapper,
.bnet_sexy_tab .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
HOMEPAGE MOBILE PUSH
HOMEPAGE MOBILE PUSH
HOMEPAGE MOBILE PUSH
HOMEPAGE MOBILE PUSH
Active Post Card Name HOMEPAGE MOBILE PUSH
Builder Postcard old: bn-snap-carousel | New: bnet_sexy_mob
Postcard Library Column old: none | New: none
Title old : bn_pc_title | New: bnet_sexy_mob_title
Excerpt old : bn_pc_excerpt | New: bnet_sexy_mob_excerpt
Date old : bn_pc_time | New: bnet_sexy_mob_date
Image old : none | New: none
========================================================================== */
@media (max-width: 768px) {
.bnet_sexy_mob {
display: block !important;
overflow: hidden !important;
}
/* TITEL */
.bnet_sexy_mob_title {
height: 35px !important;
overflow: hidden !important;
display: block !important;
}
.bnet_sexy_mob_title .fusion-title-heading {
margin: 0 !important;
font-size: 14px !important;
font-weight: 400 !important;
text-align: left !important;
line-height: 1.2 !important;
}
/* EXCERPT */
.bnet_sexy_mob_excerpt {
height: 70px !important;
overflow: hidden !important;
font-size: 12px !important;
line-height: 1.4 !important;
display: -webkit-box !important;
-webkit-line-clamp: 5 !important; /* Anzahl der Zeilen */
-webkit-box-orient: vertical !important;
text-align: left !important;
}
.bnet_sexy_mob_excerpt p {
margin: 0 !important;
}
/* DATE / META */
.bnet_sexy_mob_date {
height: 28px !important;
overflow: hidden !important;
font-size: 10px !important;
line-height: 28px !important;
font-weight: 700 !important;
color: #666 !important;
text-align: left !important;
display: flex !important;
border-bottom: 0 !important;
border-top: 0 !important;
align-items: center !important;
margin: 0 !important;
padding: 0 !important;
}
/* BILD – 100px */
.bnet_sexy_mob .fusion-post-card-image {
height: 100px !important;
overflow: hidden !important;
margin-top: 0 !important;
display: block !important;
}
.bnet_sexy_mob .fusion-post-card-image img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
display: block !important;
}
/* Border zwischen Cards */
.fusion-post-cards .swiper-slide .fusion-column-wrapper {
border-right: 1px solid #ddd !important;
padding-right: 5px !important;
}
.fusion-post-cards .swiper-slide:last-child .fusion-column-wrapper {
border-right: none !important;
}
}
@media (max-width: 768px) {
.bnet_sexy_mob .swiper-slide {
width: 38vw !important;
max-width: 38vw !important;
}
}
/* ==========================================================================
TOUCH/SWIPE/HOVER
========================================================================== */
/* Basis-Card: dezenter Grundschatten + Setup für Animation */
.bnet_sexy_mob .post-card {
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: 0 1px 2px rgba(0,0,0,0.04);
transform: translateY(0) scale(1);
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27);
}
/* Desktop-Hover – Premium Lift */
@media (min-width: 769px) {
.bnet_sexy_mob .post-card:hover {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
}
/* Mobile/JS-Tap – nutzt bn-tap von deinem Script, gleiche Optik wie Hover */
.bnet_sexy_mob .post-card.bn-tap {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
/* Safety: innere Wrapper sollen keinen eigenen Shadow/Background setzen */
.bnet_sexy_mob .post-card .fusion-column-wrapper,
.bnet_sexy_mob .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
Scrollraum begrenzen (SEXY)
========================================================================== */
@media (max-width: 1024px) {
/* Scroll-Container */
.bnet_sexy_mob {
overflow-x: auto !important;
overscroll-behavior-x: contain !important;
-webkit-overflow-scrolling: touch !important;
scroll-snap-type: x mandatory !important;
padding-right: 10px !important;
}
/* Innerer Track (Grid/Wrappers: kein Extra-Rand rechts) */
.bnet_sexy_mob .fusion-post-cards-wrapper,
.bnet_sexy_mob .fusion-grid {
padding-right: 0 !important;
margin-right: 0 !important;
border-bottom: 0 !important;
border-top: 0 !important;
gap: 0 !important; /* Avada Gap killen */
}
/* Einzelne Cards */
.bnet_sexy_mob .fusion-post-card {
flex: 0 0 auto !important;
scroll-snap-align: start !important;
margin-right: 10px !important;
}
/* letzte Card */
.bnet_sexy_mob .fusion-post-card:last-child {
margin-right: 0 !important;
}
}
/* Border zwischen Cards – nur Sexy Mob */
.bnet_sexy_mob .fusion-post-cards .swiper-slide .fusion-column-wrapper {
border-right: 1px solid #ddd !important;
padding-right: 5px !important;
}
.bnet_sexy_mob .fusion-post-cards .swiper-slide:last-child .fusion-column-wrapper {
border-right: none !important;
}
/* ==========================================================================
SCHNAPPSCHUSS - DESKTOP
SCHNAPPSCHUSS - DESKTOP
SCHNAPPSCHUSS - DESKTOP
SCHNAPPSCHUSS - DESKTOP
========================================================================== */
/* ==========================================================================
Snapshot Postcards (Desktop) - 6er Grid mit Divider
MIGRATION A: .bn-snapshot -> .bnet_snap_desk
========================================================================= */
@media (min-width: 769px) {
/* Card Basis */
.bnet_snap_desk .post-card {
position: relative !important;
transition: transform 0.25s ease !important,
box-shadow 0.25s ease !important;
}
/* Vertikaler Divider genau in der Mitte des Gaps
nutzt den echten Spaltenabstand aus --awb-column-spacing */
.bnet_snap_desk .post-card::after {
content: "" !important;
position: absolute !important;
top: 6px !important;
bottom: 6px !important;
right: calc(var(--awb-column-spacing, 15px) / -2 - 1px) !important;
width: 1px !important;
background-color: #dddddd !important;
}
/* Jede 6. Karte ohne Linie rechts */
.bnet_snap_desk .post-card:nth-child(6n)::after {
display: none !important;
}
/* Bilder: gleiche "Kachelhoehe" wie kleine Postcards oben */
.bnet_snap_desk .fusion-post-card-image img,
.bnet_snap_desk .featured-image img {
width: 100% !important;
height: 100px !important; /* anpassen falls oben anderer Wert */
object-fit: cover !important;
display: block !important;
}
}
@media (min-width: 769px) {
.bnet_snap_desk .fusion-post-card-image img,
.bnet_snap_desk .featured-image img {
width: calc(100% - 1px) !important; /* 1–2px testen */
margin: 0 auto !important; /* zentriert im Card */
}
}
/* ==========================================================================
TOUCH / HOVER – SCHNAPPSCHUSS (DESK)
Ultra-minimal Feedback, kein Scale, kein Shadow
========================================================================== */
/* Basis: absolut stabil */
.bnet_snap_desk .post-card {
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: none !important;
transform: translateY(0);
transition:
transform 0.12s ease-out,
background-color 0.12s ease-out;
}
/* Desktop: minimales „ich lebe“-Signal */
@media (min-width: 769px) {
.bnet_snap_desk .post-card:hover {
background-color: #f5f7f8;
box-shadow: none !important;
transform: translateY(-1px);
}
}
/* Mobile / JS-Tap (bn-tap): identisch */
.bnet_snap_desk .post-card.bn-tap {
background-color: #f5f7f8;
box-shadow: none !important;
transform: translateY(-1px);
}
/* Safety: innen darf NICHTS gegenarbeiten */
.bnet_snap_desk .post-card .fusion-column-wrapper,
.bnet_snap_desk .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
transform: none !important;
}
/* ==========================================================================
SCHNAPPSCHUSS – TABLET (CLEAN + FIXED MQ + MINIMAL HOVER)
- Fix: Tablet MQ sauber begrenzt (769–1023), damit nichts doppelt greift
- Hover/Tap wie Desk: kein Shadow, kein Scale, nur translateY(-1px)
- Bestehende Tablet-spezifische Bild/Divider-Logik bleibt erhalten
========================================================================== */
@media (min-width: 769px) and (max-width: 1023px) {
/* ------------------------------------------------------------------------
Snapshot Postcards (Tablet) – Basis / Layout (aus deinem Block)
------------------------------------------------------------------------ */
.bnet_snap_tab .post-card {
position: relative !important;
}
/* Vertikaler Divider genau in der Mitte des Gaps
nutzt den echten Spaltenabstand aus --awb-column-spacing */
.bnet_snap_tab .post-card::after {
content: "" !important;
position: absolute !important;
top: 6px !important;
bottom: 6px !important;
right: calc(var(--awb-column-spacing, 15px) / -2 - 1px) !important;
width: 1px !important;
background-color: #dddddd !important;
}
/* Jede 6. Karte ohne Linie rechts */
.bnet_snap_tab .post-card:nth-child(6n)::after {
display: none !important;
}
/* Bilder: gleiche "Kachelhoehe" */
.bnet_snap_tab .fusion-post-card-image img,
.bnet_snap_tab .featured-image img {
width: 100% !important;
height: 100px !important;
object-fit: cover !important;
display: block !important;
}
/* Optionaler 1px-Ausgleich (dein bisheriger Fix) */
.bnet_snap_tab .fusion-post-card-image img,
.bnet_snap_tab .featured-image img {
width: calc(100% - 1px) !important;
margin: 0 auto !important;
}
/* ------------------------------------------------------------------------
TOUCH / HOVER – Tablet: ultra-minimal, wie Desk
------------------------------------------------------------------------ */
.bnet_snap_tab .post-card {
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: none !important;
transform: translateY(0);
transition:
transform 0.12s ease-out,
background-color 0.12s ease-out;
}
.bnet_snap_tab .post-card:hover {
background-color: #f5f7f8;
box-shadow: none !important;
transform: translateY(-1px);
}
.bnet_snap_tab .post-card.bn-tap {
background-color: #f5f7f8;
box-shadow: none !important;
transform: translateY(-1px);
}
/* Safety: innere Wrapper sollen keinen eigenen Shadow/Background setzen */
.bnet_snap_tab .post-card .fusion-column-wrapper,
.bnet_snap_tab .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
transform: none !important;
}
}
/* ==========================================================================
SCHNAPPSCHUSS - MOBILE
SCHNAPPSCHUSS - MOBILE
SCHNAPPSCHUSS - MOBILE
SCHNAPPSCHUSS - MOBILE
========================================================================== */
/* ==========================================================================
SNAP SCHNAPPSCHUSS MOBILE (bnet_snap_mob)
Swiper-safe: KEIN overflow-x auto, KEIN scroll-snap (verursacht Jump/Shift)
========================================================================== */
@media (max-width: 768px) {
.bnet_snap_mob {
display: block !important;
overflow: hidden !important; /* wichtig: Swiper Container nicht als Overflow-Scroller behandeln */
padding-right: 10px !important; /* optional für "Peek" rechts */
}
/* BILD – 100px */
.bnet_snap_mob .fusion-post-card-image {
height: 100px !important;
overflow: hidden !important;
margin-top: 0 !important;
display: block !important;
}
.bnet_snap_mob .fusion-post-card-image img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
display: block !important;
}
/* Slide-Breite (2 Cards + Peek) */
.bnet_snap_mob .swiper-slide {
width: 38vw !important;
max-width: 38vw !important;
}
/* Wrapper/Track: keine Extra-Ränder/Gaps */
.bnet_snap_mob .fusion-post-cards-wrapper,
.bnet_snap_mob .fusion-grid {
padding-right: 0 !important;
margin-right: 0 !important;
border-bottom: 0 !important;
border-top: 0 !important;
gap: 0 !important;
}
/* Cards: Abstand rechts (statt scroll-snap) */
.bnet_snap_mob .fusion-post-card {
margin-right: 10px !important;
}
.bnet_snap_mob .fusion-post-card:last-child {
margin-right: 0 !important;
}
/* Border zwischen Cards – scoped */
.bnet_snap_mob .fusion-post-cards .swiper-slide .fusion-column-wrapper {
border-right: 1px solid #ddd !important;
padding-right: 5px !important;
}
.bnet_snap_mob .fusion-post-cards .swiper-slide:last-child .fusion-column-wrapper {
border-right: none !important;
}
}
/* ==========================================================================
TOUCH/SWIPE/HOVER
========================================================================== */
/* Basis-Card: dezenter Grundschatten + Setup für Animation */
.bnet_snap_mob .post-card {
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: 0 1px 2px rgba(0,0,0,0.04);
transform: translateY(0) scale(1);
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27);
}
/* Desktop-Hover – Premium Lift */
@media (min-width: 769px) {
.bnet_snap_mob .post-card:hover {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
}
/* Mobile/JS-Tap – nutzt bn-tap von deinem Script, gleiche Optik wie Hover */
.bnet_snap_mob .post-card.bn-tap {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
/* Safety: innere Wrapper sollen keinen eigenen Shadow/Background setzen */
.bnet_snap_mob .post-card .fusion-column-wrapper,
.bnet_snap_mob .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
MINI TEXT ONLY DESKTOP
MINI TEXT ONLY DESKTOP
MINI TEXT ONLY DESKTOP
MINI TEXT ONLY DESKTOP
Active Post Card : MINI TXT CARDS DESKTOP
Title bnet_mini_desk_title
Date bnet_mini_desk_date
=========================================================================== */
@media (min-width: 769px) {
/* Container – Grundlayout */
.bnet_mini_desk .fusion-column-wrapper {
display: flex !important;
flex-direction: column !important;
justify-content: flex-start !important;
padding: 0 !important;
}
/* ==========================================================================
Mini Text Cards – Titel: 1 Zeile + Ellipsis
========================================================================== */
.bnet_mini_desk_title {
display: block;
max-width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
/* Titel + alle Kindelemente */
.bnet_mini_desk_title,
.bnet_mini_desk_title * {
font-size: 11px !important;
font-weight: 500 !important;
text-transform: uppercase;
line-height: 1.1 !important;
margin: 0 !important;
padding: 0 !important;
/* wichtig */
white-space: nowrap !important;
}
/* Datum */
.bnet_mini_desk_date,
.bnet_mini_desk_date * {
font-size: 10px !important;
font-weight: 500 !important;
line-height: 1.1 !important;
margin: 0 0px 0 0x !important;
padding: 0 !important;
}
/* Titel in 1 Zeile mit … */
.bnet_mini_desk_title h3,
.bnet_mini_desk_title h3 * {
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
display: block !important;
}
}
/* ==========================================================================
TOUCH/SWIPE/HOVER
========================================================================== */
/* Basis-Card: dezenter Grundschatten + Setup für Animation */
.bnet_mini_desk .post-card {
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: 0 1px 2px rgba(0,0,0,0.04);
transform: translateY(0) scale(1);
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27);
}
/* Desktop-Hover – Premium Lift */
@media (min-width: 769px) {
.bnet_mini_desk .post-card:hover {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
}
/* Mobile/JS-Tap – nutzt bn-tap von deinem Script, gleiche Optik wie Hover */
.bnet_mini_desk .post-card.bn-tap {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
/* Safety: innere Wrapper sollen keinen eigenen Shadow/Background setzen */
.bnet_mini_desk .post-card .fusion-column-wrapper,
.bnet_mini_desk .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
MINI TEXT ONLY MOBILE
MINI TEXT ONLY MOBILE
MINI TEXT ONLY MOBILE
MINI TEXT ONLY MOBILE
Active Post Card : MINI TXT CARDS MOBILE
Title bnet_mini_mob
Date bnet_mini_mob
=========================================================================== */
@media (max-width: 1023px) {
/* äusserer Wrapper der Card */
.bnet_mini_mob,
.bnet_mini_mob::before,
.bnet_mini_mob::after {
border: 0 !important;
box-shadow: none !important;
background: transparent !important;
}
/* Column-Wrapper der Card */
.bnet_mini_mob .fusion-column-wrapper,
.bnet_mini_mob .fusion-column-wrapper::before,
.bnet_mini_mob .fusion-column-wrapper::after {
border: 0 !important;
box-shadow: none !important;
background: transparent !important;
}
/* Titel */
.bnet_mini_mob_title,
.bnet_mini_mob_title * {
font-size: 10px !important;
font-weight: 500 !important;
text-transform: uppercase;
line-height: 1.1 !important;
margin: 2px 0 0 0 !important;
border-bottom: 0 !important;
padding: 0 !important;
}
/* Datum */
.bnet_mini_mob_date,
.bnet_mini_mob_date * {
font-size: 9px !important;
font-weight: 400 !important;
border-bottom: 0 !important;
border-top: 0 !important;
line-height: 1.1 !important;
margin: 0 !important;
padding: 0 !important;
}
}
@media (max-width: 768px) {
.bnet_mini_mob_title h3,
.bnet_mini_mob_title h3 * {
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
display: block !important;
}
}
/* ==========================================================================
TOUCH/SWIPE/HOVER
========================================================================== */
/* Basis-Card: dezenter Grundschatten + Setup für Animation */
.bnet_mini_mob .post-card {
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: 0 1px 2px rgba(0,0,0,0.04);
transform: translateY(0) scale(1);
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27);
}
/* Desktop-Hover – Premium Lift */
@media (min-width: 769px) {
.bnet_mini_mob .post-card:hover {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
}
/* Mobile/JS-Tap – nutzt bn-tap von deinem Script, gleiche Optik wie Hover */
.bnet_mini_mob .post-card.bn-tap {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
/* Safety: innere Wrapper sollen keinen eigenen Shadow/Background setzen */
.bnet_mini_mob .post-card .fusion-column-wrapper,
.bnet_mini_mob .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
MINI TEXT ONLY TABLET
MINI TEXT ONLY TABLET
MINI TEXT ONLY TABLET
MINI TEXT ONLY TABLET
Active Post Card : MINI TEXT ONLY TABLET
Title : bnet_mini_tab_title
Date : bnet_mini_tab_date
========================================================================== */
/* --------------------------------------------------------------------------
KILLER: Reset Avada spacing (wrapper/grid/title spacers/meta)
-------------------------------------------------------------------------- */
.bnet_mini_tab {
margin-top: 0 !important;
margin-right: 0 !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
padding-top: 0 !important;
padding-right: 0 !important;
padding-bottom: 0 !important;
padding-left: 0 !important;
}
.bnet_mini_tab ul.fusion-grid {
margin-top: 0 !important;
margin-right: 0 !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
padding-top: 0 !important;
padding-right: 0 !important;
padding-bottom: 0 !important;
padding-left: 0 !important;
gap: 0 !important;
}
.bnet_mini_tab .fusion-layout-column {
margin-top: 0 !important;
margin-right: 0 !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
padding-top: 0 !important;
padding-right: 0 !important;
padding-bottom: 0 !important;
padding-left: 0 !important;
}
.bnet_mini_tab .fusion-column-wrapper {
margin-top: 0 !important;
margin-right: 0 !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
padding-top: 0 !important;
padding-right: 0 !important;
padding-bottom: 0 !important;
padding-left: 0 !important;
}
.bnet_mini_tab .title-sep-container,
.bnet_mini_tab .awb-title-spacer {
display: none !important;
height: 0 !important;
margin-top: 0 !important;
margin-right: 0 !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
padding-top: 0 !important;
padding-right: 0 !important;
padding-bottom: 0 !important;
padding-left: 0 !important;
}
.bnet_mini_tab .fusion-title {
margin-top: 0 !important;
margin-right: 0 !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
padding-top: 0 !important;
padding-right: 0 !important;
padding-bottom: 0 !important;
padding-left: 0 !important;
}
.bnet_mini_tab .fusion-title-heading {
margin-top: 0 !important;
margin-right: 0 !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
padding-top: 0 !important;
padding-right: 0 !important;
padding-bottom: 0 !important;
padding-left: 0 !important;
}
.bnet_mini_tab .fusion-meta-tb {
margin-top: 0 !important;
margin-right: 0 !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
padding-top: 0 !important;
padding-right: 0 !important;
padding-bottom: 0 !important;
padding-left: 0 !important;
}
/* --------------------------------------------------------------------------
Outer wrapper (post card)
-------------------------------------------------------------------------- */
.bnet_mini_tab,
.bnet_mini_tab::before,
.bnet_mini_tab::after {
border: 0 !important;
box-shadow: none !important;
background-color: transparent !important;
}
/* --------------------------------------------------------------------------
Column wrapper
-------------------------------------------------------------------------- */
.bnet_mini_tab .fusion-column-wrapper,
.bnet_mini_tab .fusion-column-wrapper::before,
.bnet_mini_tab .fusion-column-wrapper::after {
border: 0 !important;
box-shadow: none !important;
background-color: transparent !important;
}
/* --------------------------------------------------------------------------
Title
-------------------------------------------------------------------------- */
.bnet_mini_tab .bnet_mini_tab_title,
.bnet_mini_tab .bnet_mini_tab_title * {
font-size: 11px !important;
font-weight: 500 !important;
text-transform: uppercase !important;
color: #000000 !important;
line-height: 13px !important;
margin-top: 2px !important;
margin-right: 0 !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
padding-top: 0 !important;
padding-right: 0 !important;
padding-bottom: 0 !important;
padding-left: 0 !important;
border-bottom: 0 !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
display: block !important;
}
/* --------------------------------------------------------------------------
Date / Meta
-------------------------------------------------------------------------- */
.bnet_mini_tab .bnet_mini_tab_date,
.bnet_mini_tab .bnet_mini_tab_date * {
font-size: 10px !important;
font-weight: 400 !important;
color: #555555 !important;
line-height: 12px !important;
margin-top: 0 !important;
margin-right: 0 !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
padding-top: 0 !important;
padding-right: 0 !important;
padding-bottom: 0 !important;
padding-left: 0 !important;
border-top: 0 !important;
border-bottom: 0 !important;
}
/* ==========================================================================
TOUCH / TAP STATE (Tablet)
========================================================================== */
/* Base card */
.bnet_mini_tab .post-card {
border-radius: 6px !important;
background-color: #f5f7f8 !important;
box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
transform: translateY(0) scale(1) !important;
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27);
}
/* Tap state (JS adds bn-tap) */
.bnet_mini_tab .post-card.bn-tap {
background-color: #f5f7f8 !important;
box-shadow: 0 2px 6px rgba(0,0,0,0.14) !important;
transform: translateY(-2px) scale(0.99) !important;
}
/* Safety: inner wrappers must not add visuals */
.bnet_mini_tab .post-card .fusion-column-wrapper,
.bnet_mini_tab .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
TOP HERO #1 TABLET + DESKTOP - TITLE | IMAGE
TOP HERO #1 TABLET + DESKTOP - TITLE | IMAGE
TOP HERO #1 TABLET + DESKTOP - TITLE | IMAGE
TOP HERO #1 TABLET + DESKTOP - TITLE | IMAGE
Active Post Card : bnet_tophero_tab
Title bnet_tophero_tab_title
Category bnet_tophero_tab_cat
Excerpt bnet_tophero_tab_excerpt
Date bnet_tophero_tab_date
Image bnet_tophero_tab_img
========================================================================== */
/* === WRAPPER === */
.bnet_tophero_tab {
position: relative !important;
overflow: hidden !important;
}
/* === IMAGE ===*/
.bnet_tophero_tab_img {
width: 100% !important;
object-fit: cover !important;
display: block !important;
}
/* === DATE (unten) === */
.bnet_tophero_tab_date {
margin: 0 !important;
font-size: 10px !important;
height: 20px !important;
text-transform: uppercase !important;
font-weight: 600 !important;
opacity: 0.9 !important;
border: none !important;
}
/* === EXCERPT (zwischen Titel & Datum) === */
.bnet_tophero_tab_excerpt {
bottom: 38px !important; /* sitzt über Date */
font-size: 12px !important;
line-height: 14px !important;
max-height: 36px !important; /* ~ 2 Zeilen */
overflow: hidden !important;
display: -webkit-box !important;
-webkit-line-clamp: 2 !important;
-webkit-box-orient: vertical !important;
opacity: 0.95 !important;
}
/* paragraphs inside excerpt */
.bnet_tophero_tab_excerpt p {
margin: 0 !important;
}
/* === TITLE (über Excerpt) ===
.bnet_tophero_tab_title,
.bnet_tophero_tab_title * {
margin: 0 !important;
line-height: 1 !important;
font-size: 10px !important;
font-weight: 400 !important;
}*/
/* === CATEGORY (ganz oben) === */
.bnet_tophero_tab_cat {
font-family: var(--awb-typography-h5-font-family) !important;
font-size: 11px !important;
text-transform: uppercase !important;
font-weight: 600 !important;
border: none !important;
margin: 0 !important;
}
/* ==========================================================================
TOUCH/SWIPE/HOVER (scoped to bnet_tophero)
========================================================================== */
/* Basis-Card: dezenter Grundschatten + Setup für Animation */
.bnet_tophero_tab .post-card {
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: 0 1px 2px rgba(0,0,0,0.04);
transform: translateY(0) scale(1);
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27);
}
/* Mobile/JS-Tap – nutzt bn-tap von deinem Script, gleiche Optik wie Hover */
.bnet_tophero_tab .post-card.bn-tap {
transform: translateY(-2px) scale(0.99);
}
/* Safety: innere Wrapper sollen keinen eigenen Shadow/Background setzen */
.bnet_tophero_tab .post-card .fusion-column-wrapper,
.bnet_tophero_tab .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
TOP HERO #1 POSTCARD
TOP HERO #1 POSTCARD
TOP HERO #1 POSTCARD
TOP HERO #1 POSTCARD
Active Post Card : bnet_tophero
Title bnet_tophero_title
Category bnet_tophero_cat
Excerpt bnet_tophero_excerpt
Date bnet_tophero_date
Image bnet_tophero_img
========================================================================== */
/* === WRAPPER === */
.bnet_tophero {
position: relative !important;
overflow: hidden !important;
}
/* === IMAGE ===*/
.bnet_tophero_img {
width: 100% !important;
margin: 0 !important;
object-fit: cover !important;
display: block !important;
}
/* === DATE === */
.bnet_tophero_date {
margin: 0 !important;
font-size: 10px !important;
height: 28px !important;
line-height: 28px !important;
text-transform: uppercase !important;
font-weight: 500 !important;
opacity: 0.9 !important;
border: none !important;
}
/* === EXCERPT (zwischen Titel & Datum) === */
.bnet_tophero_excerpt {
bottom: 38px !important; /* sitzt über Date */
font-size: 12px !important;
line-height: 1.35 !important;
max-height: 36px !important; /* ~ 2 Zeilen */
overflow: hidden !important;
display: -webkit-box !important;
-webkit-line-clamp: 2 !important;
-webkit-box-orient: vertical !important;
opacity: 0.95 !important;
}
/* paragraphs inside excerpt */
.bnet_tophero_excerpt p {
margin: 0 !important;
}
/* === TITLE (über Excerpt) ===
.bnet_tophero_title,
.bnet_tophero_title * {
margin: 0 !important;
height: auto !important;
line-height: 1 !important;
}*/
/* === CATEGORY (ganz oben) === */
.bnet_tophero_cat {
font-family: var(--awb-typography-h5-font-family) !important;
font-size: 11px !important;
text-transform: uppercase !important;
font-weight: 500 !important;
border: none !important;
margin: 0 !important;
}
/* ==========================================================================
TOUCH/SWIPE/HOVER (scoped to bnet_tophero)
========================================================================== */
/* Basis-Card: dezenter Grundschatten + Setup für Animation */
.bnet_tophero .post-card {
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: 0 1px 2px rgba(0,0,0,0.04);
transform: translateY(0) scale(1);
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27);
}
/* Mobile/JS-Tap – nutzt bn-tap von deinem Script, gleiche Optik wie Hover */
.bnet_tophero .post-card.bn-tap {
transform: translateY(-2px) scale(0.99);
}
/* Safety: innere Wrapper sollen keinen eigenen Shadow/Background setzen */
.bnet_tophero .post-card .fusion-column-wrapper,
.bnet_tophero .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
Rounded Corners for entire card
========================================================================== */
.bnet_tophero .fusion-image-wrapper {
border-radius: 6px !important;
overflow: hidden !important;
}
.bnet_tophero .fusion-image-wrapper img {
border-radius: 0 !important;
}
.bnet_tophero.post-card,
.bnet_tophero.post-card .fusion-column-wrapper,
.bnet_tophero.post-card .fusion-post-card-image,
.bnet_tophero.post-card .fusion-image-wrapper,
.bnet_tophero.post-card img,
.bnet_tophero.post-card::after {
border-radius: 6px !important;
overflow: hidden !important;
}
/* ==========================================================================
BANNER POSTCARD (SCOPED)
Active Post Card : bnet_banner
Title : bnet_banner_title
Category : bnet_banner_cat
Excerpt : bnet_banner_excerpt
Date : bnet_banner_date
Image : bnet_banner_img
========================================================================== */
/* === WRAPPER === */
.bnet_banner {
position: relative !important;
overflow: hidden !important;
}
/* === IMAGE === */
.bnet_banner .bnet_banner_img {
width: 100% !important;
object-fit: cover !important;
display: block !important;
}
/* === TITLE === */
.bnet_banner .bnet_banner_title,
.bnet_banner .bnet_banner_title * {
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
font-size: 18px !important;
line-height: 24px !important;
font-weight: 500 !important;
color: #ffffff !important;
/* Lesbarkeit auf hellen Bildern */
text-shadow:
0px 1px 2px rgba(0,0,0,0.35),
0px 2px 6px rgba(0,0,0,0.25) !important;
}
/* === DATE (unten) === */
.bnet_banner .bnet_banner_date {
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
opacity: 0.9 !important;
border: none !important;
}
/* ==========================================================================
BANNER CARD – DATE (DESK / TAB / MOB)
Only: font-size, font-weight, height
========================================================================== */
/* === DESKTOP (>= 1024px) === */
@media (min-width: 1024px) {
.bnet_banner .bnet_banner_date {
font-size: 11px !important;
font-weight: 500 !important;
height: 23px !important;
}
}
/* === TABLET (769px – 1023px) === */
@media (min-width: 769px) and (max-width: 1023px) {
.bnet_banner .bnet_banner_date {
font-size: 11px !important;
font-weight: 500 !important;
height: 23px !important;
}
}
/* === MOBILE (<= 768px) === */
@media (max-width: 768px) {
.bnet_banner .bnet_banner_date {
font-size: 12px !important;
font-weight: 500 !important;
height: 20px !important;
}
}
/* === EXCERPT (zwischen Titel & Datum) === */
.bnet_banner .bnet_banner_excerpt {
bottom: 38px !important; /* sitzt ueber Date */
font-size: 12px !important;
line-height: 1.35 !important;
max-height: 36px !important; /* ~ 2 Zeilen */
overflow: hidden !important;
display: -webkit-box !important;
-webkit-line-clamp: 2 !important;
-webkit-box-orient: vertical !important;
opacity: 0.95 !important;
}
/* paragraphs inside excerpt */
.bnet_banner .bnet_banner_excerpt p {
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
}
/* ==========================================================================
BANNER POSTCARD – DISABLE AWB FILTER (ROOT)
========================================================================== */
.bnet_banner{
--awb-filter: none !important;
--awb-filter-hover: none !important;
}
/* Sicherheitsnetz: falls Avada direkt filter setzt */
.bnet_banner .fusion-column-inner-bg,
.bnet_banner .fusion-column-inner-bg-image{
filter: none !important;
}
/* ==========================================================================
BN – CATEGORY BADGE (text-width only, Epic-style)
========================================================================== */
.bnet_banner .bnet_banner_cat {
display: inline-flex !important;
align-items: center !important;
width: auto !important;
max-width: max-content !important;
padding-top: 3px !important;
padding-right: 5px !important;
padding-bottom: 3px !important;
padding-left: 5px !important;
border-radius: 3px !important;
opacity: 0.85 !important;
background: #ffffff !important;
font-size: 10px !important;
font-weight: 500 !important;
text-transform: uppercase !important;
letter-spacing: 0.02em !important;
line-height: 1.1 !important;
}
/* Safety: falls Avada einen Block-Wrapper drumlegt */
.bnet_banner .bnet_banner_cat * {
width: auto !important;
}
/* ==========================================================================
BN – BANNER POSTCARD
Fix rounded corners for COLUMN BACKGROUND image
========================================================================== */
/* Die eigentliche Column mit Background-Image */
.bnet_banner .fusion-layout-column {
border-radius: 6px !important;
overflow: hidden !important;
background-clip: padding-box !important;
}
/* Avada inner wrapper (zwingend!) */
.bnet_banner .fusion-column-wrapper {
border-radius: 6px !important;
overflow: hidden !important;
background-clip: padding-box !important;
}
/* Falls Avada ein Overlay / BG-Layer nutzt */
.bnet_banner .fusion-column-inner-bg {
border-radius: 6px !important;
overflow: hidden !important;
}
/* ==========================================================================
TOUCH / SWIPE / HOVER (scoped to bnet_banner)
========================================================================== */
/* Basis-Card: Grundschatten + Setup fuer Animation */
.bnet_banner .post-card {
border-radius: 6px !important;
overflow: hidden !important;
}
/* Mobile/JS-Tap – nutzt bn-tap von deinem Script */
.bnet_banner .post-card.bn-tap {
transform: translateY(-2px) scale(0.99) !important;
}
/* Safety: innere Wrapper sollen keinen eigenen Shadow/Background setzen */
.bnet_banner .post-card .fusion-column-wrapper,
.bnet_banner .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
Rounded Corners (sauber scoped)
========================================================================== */
.bnet_banner .post-card,
.bnet_banner .post-card .fusion-column-wrapper,
.bnet_banner .post-card .fusion-post-card-image,
.bnet_banner .post-card .fusion-image-wrapper,
.bnet_banner .post-card img,
.bnet_banner .post-card::after {
border-radius: 6px !important;
overflow: hidden !important;
}
/* Optional: falls Avada am Image-Wrapper noch was "aufbiegt" */
.bnet_banner .fusion-image-wrapper img {
border-radius: 0px !important;
}
/* ==========================================================================
BN – BANNER CAROUSEL (MOBILE PEEK FIX, Avada/Swiper robust)
========================================================================== */
@media (max-width: 768px) {
/* 1) UNCLIP: irgendwas schneidet dir den Peek ab */
.bnet_banner,
.bnet_banner .fusion-layout-column,
.bnet_banner .fusion-column-wrapper,
.bnet_banner .fusion-builder-row,
.bnet_banner .fusion-row,
.bnet_banner .fusion-post-cards,
.bnet_banner .fusion-post-cards-wrapper,
.bnet_banner .fusion-post-cards-carousel,
.bnet_banner .fusion-carousel,
.bnet_banner .swiper,
.bnet_banner .swiper-container,
.bnet_banner .swiper-viewport {
overflow: visible !important;
}
/* 2) Track: bisschen Luft rechts, damit Peek optisch sauber ist */
.bnet_banner .swiper-wrapper {
padding-top: 0px !important;
padding-right: 18px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* 3) THE TRICK: Slide schmaler als Viewport => Peek rechts */
.bnet_banner .swiper-slide,
.bnet_banner .fusion-post-card,
.bnet_banner .post-card {
width: calc(100% - 52px) !important; /* Peek-Staerke: groesserer Wert = mehr Peek */
flex: 0 0 auto !important;
max-width: none !important;
margin-top: 0px !important;
margin-right: 12px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
}
}
/* ==========================================================================
BN – BANNER CAROUSEL (TABLET PEEK FIX, 3 Columns + Peek)
Range: 769–1023px
========================================================================== */
@media (min-width: 769px) and (max-width: 1023px) {
/* 1) UNCLIP – identisch zu Mobile */
.bnet_banner,
.bnet_banner .fusion-layout-column,
.bnet_banner .fusion-column-wrapper,
.bnet_banner .fusion-builder-row,
.bnet_banner .fusion-row,
.bnet_banner .fusion-post-cards,
.bnet_banner .fusion-post-cards-wrapper,
.bnet_banner .fusion-post-cards-carousel,
.bnet_banner .fusion-carousel,
.bnet_banner .swiper,
.bnet_banner .swiper-container,
.bnet_banner .swiper-viewport {
overflow: visible !important;
}
/* 2) Track: etwas mehr Luft für sauberen Peek */
.bnet_banner .swiper-wrapper {
padding-top: 0px !important;
padding-right: 26px !important; /* Peek-Luft Tablet */
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* 3) Slides: 3 Columns + Peek von #4 */
.bnet_banner .swiper-slide,
.bnet_banner .fusion-post-card,
.bnet_banner .post-card {
width: calc(33.333% - 22px) !important;
flex: 0 0 auto !important;
max-width: none !important;
margin-top: 0px !important;
margin-right: 14px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
}
}
/* ==========================================================================
BNET QUICKCARD - CATEGORY / TITLE / DATE / IMAGE / TAP-HOVER (UNIVERSAL)
Active Post Card: QUICKCARD CATEGORY - TITLE - COMMENT INDICATOR
Wrapper class: bnet_quick
Category class: bnet_quick_cat
Title class: bnet_quick_title
Date class: bnet_quick_date
Image class: bnet_quick_img
========================================================================== */
/* --------------------------------------------------------------------------
BASE CARD BOX (spacing / reset)
-------------------------------------------------------------------------- */
.bnet_quick .fusion-post-card.post-card {
position: relative !important;
padding-top: 2px !important;
padding-right: 0px !important;
padding-bottom: 4px !important;
padding-left: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
box-shadow: none !important;
border-top: 0px !important;
border-right: 0px !important;
border-bottom: 0px !important;
border-left: 0px !important;
}
/* Avada default spacing inside nested columns remove */
.bnet_quick .fusion-post-card .fusion-builder-row-inner,
.bnet_quick .fusion-post-card .fusion-builder-row-inner .fusion-layout-column {
margin-bottom: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* Neutralize possible column background spans */
.bnet_quick .fusion-column-inner-bg-image {
display: none !important;
height: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* --------------------------------------------------------------------------
CATEGORY
-------------------------------------------------------------------------- */
.bnet_quick .bnet_quick_cat {
font-size: 10px !important;
font-weight: 400 !important;
line-height: 12px !important;
height: 15px !important;
text-transform: uppercase !important;
letter-spacing: 0.06em !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 3px !important;
margin-left: 0px !important;
opacity: 0.85 !important;
}
/* --------------------------------------------------------------------------
TITLE
-------------------------------------------------------------------------- */
.bnet_quick .bnet_quick_title,
.bnet_quick .bnet_quick_title a {
font-size: 12px !important;
font-weight: 500 !important;
line-height: 13px !important;
max-height: 40px !important;
text-transform: none !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 3px !important;
margin-left: 0px !important;
}
/* --------------------------------------------------------------------------
DATE / META
-------------------------------------------------------------------------- */
.bnet_quick .bnet_quick_date {
font-size: 10px !important;
line-height: 14px !important;
text-transform: uppercase !important;
height: 15px !important;
overflow: hidden !important;
border-top: 0px !important;
border-right: 0px !important;
border-bottom: 0px !important;
border-left: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
}
/* --------------------------------------------------------------------------
IMAGE
-------------------------------------------------------------------------- */
.bnet_quick .fusion-post-card-image,
.bnet_quick .featured-image,
.bnet_quick .bnet_quick_img {
height: auto !important;
}
.bnet_quick .fusion-post-card-image img,
.bnet_quick .featured-image img,
.bnet_quick .bnet_quick_img img {
width: 100% !important;
display: block !important;
object-fit: cover !important;
border-radius:3px !important;
}
/* ==========================================================================
BNET QUICKCARD – MOBILE
Wrapper class: bnet_quick_mob
========================================================================== */
/* --------------------------------------------------------------------------
CATEGORY
-------------------------------------------------------------------------- */
.bnet_quick_mob .bnet_quick_mob_cat {
display: block !important;
font-size: 8px !important;
font-weight: 400 !important;
line-height: 10px !important;
height: auto !important;
text-transform: uppercase !important;
letter-spacing: 0.05em !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 2px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
opacity: 0.85 !important;
}
/* --------------------------------------------------------------------------
TITLE (up to 3 lines, controlled by fixed height)
-------------------------------------------------------------------------- */
.bnet_quick_mob .bnet_quick_mob_title,
.bnet_quick_mob .bnet_quick_mob_title a {
display: block !important;
font-size: 12px !important;
line-height: 14px !important;
height: 42px !important; /* 3 lines x 17px */
overflow: hidden !important;
text-transform: none !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 2px !important;
margin-left: 0px !important;
padding-top: 0px !important;
}
/* --------------------------------------------------------------------------
DATE / META (optional slot)
-------------------------------------------------------------------------- */
.bnet_quick_mob .bnet_quick_mob_date {
font-size: 9px !important;
font-weight: 500 !important;
line-height: 13px !important;
height: 13px !important;
overflow: hidden !important;
text-transform: uppercase !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
}
/* --------------------------------------------------------------------------
IMAGE
-------------------------------------------------------------------------- */
.bnet_quick_mob .fusion-post-card-image,
.bnet_quick_mob .featured-image,
.bnet_quick_mob .bnet_quick_mob_img {
height: auto !important;
}
.bnet_quick_mob .fusion-post-card-image img,
.bnet_quick_mob .featured-image img,
.bnet_quick_mob .bnet_quick_mob_img img {
width: 100% !important;
display: block !important;
object-fit: cover !important;
border-radius: 3px !important;
}
/* ==========================================================================
BNET QUICKCARD – MOBILE – COMMENT INDICATOR ALIGN (CLEAN)
Assumes same classes from shortcode:
wrapper: .bnet_comment_ind (fusion-text block)
inner: .bnet_comment_indicator
link: .bnet_comment_indicator_link
svg: .bnet_comment_indicator_svg
========================================================================== */
/* Tight meta line */
.bnet_quick_mob .bnet_comment_ind {
display: block !important;
height: 14px !important;
line-height: 14px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* Center the indicator content */
.bnet_quick_mob .bnet_comment_indicator {
display: inline-flex !important;
align-items: center !important;
height: 14px !important;
line-height: 14px !important;
}
/* Kill SVG baseline drop */
.bnet_quick_mob .bnet_comment_indicator_svg {
display: block !important;
width: 12px !important;
height: 12px !important;
}
/* Link should not add extra line-height */
.bnet_quick_mob .bnet_comment_indicator_link {
display: inline-flex !important;
align-items: center !important;
height: 14px !important;
line-height: 14px !important;
}
/* ==========================================================================
BNET QUICKCARD – TABLET
Wrapper class: bnet_quick_tab
========================================================================== */
/* --------------------------------------------------------------------------
CATEGORY
-------------------------------------------------------------------------- */
.bnet_quick_tab .bnet_quick_tab_cat {
display: block !important;
font-size: 10px !important;
font-weight: 400 !important;
line-height: 10px !important;
height: auto !important;
text-transform: uppercase !important;
letter-spacing: 0.06em !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 4px !important;
margin-left: 0px !important;
opacity: 0.85 !important;
}
/* --------------------------------------------------------------------------
TITLE
-------------------------------------------------------------------------- */
.bnet_quick_tab .bnet_quick_tab_title,
.bnet_quick_tab .bnet_quick_tab_title a {
display: block !important;
font-size: 14px !important;
line-height: 16px !important;
font-weight: 400 !important;
height: auto !important;
overflow: hidden !important;
text-transform: none !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: -2px !important;
margin-left: 0px !important;
}
/* --------------------------------------------------------------------------
DATE / META
-------------------------------------------------------------------------- */
.bnet_quick_tab .bnet_quick_tab_date {
font-size: 10px !important;
font-weight: 500 !important;
line-height: 14px !important;
height: 15px !important;
overflow: hidden !important;
text-transform: uppercase !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
}
/* --------------------------------------------------------------------------
IMAGE
-------------------------------------------------------------------------- */
.bnet_quick_tab .fusion-post-card-image,
.bnet_quick_tab .featured-image,
.bnet_quick_tab .bnet_quick_tab_img {
height: auto !important;
}
.bnet_quick_tab .fusion-post-card-image img,
.bnet_quick_tab .featured-image img,
.bnet_quick_tab .bnet_quick_tab_img img {
width: 100% !important;
display: block !important;
object-fit: cover !important;
border-radius: 4px !important;
}
/* ==========================================================================
BNET QUICKCARD – TABLET – COMMENT INDICATOR ALIGN (CLEAN)
Scopes: .bnet_quick_tab + existing bnet_comment_ind/bnet_comment_indicator
========================================================================== */
/* 1) Ensure the indicator row behaves like a tight meta line */
.bnet_quick_tab .bnet_comment_ind {
display: block !important;
height: 15px !important;
line-height: 15px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* 2) Inline-flex on the actual indicator wrapper for perfect vertical centering */
.bnet_quick_tab .bnet_comment_indicator {
display: inline-flex !important;
align-items: center !important;
height: 15px !important;
line-height: 15px !important;
}
/* 3) Prevent inline SVG baseline drop (this is the "sluck water" effect) */
.bnet_quick_tab .bnet_comment_indicator_svg {
display: block !important;
width: 12px !important;
height: 12px !important;
}
/* 4) Link should not introduce extra line-height quirks */
.bnet_quick_tab .bnet_comment_indicator_link {
display: inline-flex !important;
align-items: center !important;
height: 15px !important;
line-height: 15px !important;
}
/* ==========================================================================
TOUCH/SWIPE/HOVER (scoped to Quick Cards only)
Cloned from bnet_tophero, scoped to:
- bnet_quick
- bnet_quick_tab
- bnet_quick_mob
Adds effect only. Does not modify card layout/typography.
========================================================================== */
/* Base card: subtle shadow + animation setup */
.bnet_quick .post-card,
.bnet_quick_tab .post-card,
.bnet_quick_mob .post-card {
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: 0 1px 2px rgba(0,0,0,0.04);
transform: translateY(0) scale(1);
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27);
}
/* Mobile/JS-Tap – uses bn-tap from your script */
.bnet_quick .post-card.bn-tap,
.bnet_quick_tab .post-card.bn-tap,
.bnet_quick_mob .post-card.bn-tap {
transform: translateY(-2px) scale(0.99);
}
/* Safety: inner wrappers should not set own shadow/background */
.bnet_quick .post-card .fusion-column-wrapper,
.bnet_quick .post-card .fusion-column-inner-bg,
.bnet_quick_tab .post-card .fusion-column-wrapper,
.bnet_quick_tab .post-card .fusion-column-inner-bg,
.bnet_quick_mob .post-card .fusion-column-wrapper,
.bnet_quick_mob .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
CATEGORY TOPS HORIZONTAL DESKTOP
CATEGORY TOPS HORIZONTAL DESKTOP
CATEGORY TOPS HORIZONTAL DESKTOP
CATEGORY TOPS HORIZONTAL DESKTOP
Active Post Card Name TOP THEMA CATEGORY DESKTOP #2-#X
Builder Postcard New: bnet_hero2_cat_desk
Postcard Library Column New: none
Title New: bnet_hero2_desk_cat_title
Excerpt | New: bnet_hero2_cat_desk_excerpt
Date | New: bnet_hero2_cat_desk_date
Image | New: none
=========================================================================== */
@media (min-width: 1024px) {
/* --------- TITLE (1-zeilig, Truncate) --------- */
.bnet_hero2_cat_desk .bnet_hero2_cat_desk_title,
.bnet_hero2_cat_desk .bnet_hero2_cat_desk_title a {
font-size: 16px !important;
line-height: 1.25 !important;
margin-bottom: 8px !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
height: 20px !important;
display: block !important;
-webkit-line-clamp: unset !important;
-webkit-box-orient: unset !important;
}
/* --------- CATEGORY --------- */
.bnet_hero2_cat_desk .bnet_hero2_cat_desk_cat {
font-size: 10px !important;
font-weight: 500 !important;
line-height: 1.3 !important;
text-transform: uppercase !important;
letter-spacing: 0.06em !important;
margin-bottom: 4px !important;
opacity: 0.85 !important;
}
/* --------- EXCERPT (feste Höhe) --------- */
.bnet_hero2_cat_desk .bnet_hero2_cat_desk_excerpt p {
font-size: 12px !important;
line-height: 15px !important;
margin-bottom: 10px !important;
display: -webkit-box !important;
-webkit-box-orient: vertical !important;
-webkit-line-clamp: 3 !important;
height: 44px !important; /* 3 Zeilen fix */
overflow: hidden !important;
}
/* --------- TIME / META (feste Höhe) --------- */
.bnet_hero2_cat_desk .bnet_hero2_cat_desk_date {
font-size: 10px !important;
font-weight: 500 !important;
text-transform: uppercase !important;
line-height: 12px !important;
border-bottom: 0 !important;
border-top: 0 !important;
margin-bottom: 0px !important;
height: 26px !important; /* eine Zeile */
overflow: hidden !important;
}
/* --------- IMAGE (immer gleich hoch) --------- */
.bnet_hero2_cat_desk .fusion-post-card-image img,
.bnet_hero2_cat_desk .featured-image img {
width: 100% !important;
height: 100px !important; /* bei Bedarf z.B. 120px */
object-fit: cover !important;
display: block !important;
}
/* --------- Dezente vertikale Divider mit Innenabstand --------- */
.bnet_hero2_cat_desk .post-card {
position: relative;
}
.bnet_hero2_cat_desk .post-card::after {
content: "";
position: absolute;
top: 6px; /* Abstand von oben */
bottom: 6px; /* Abstand von unten */
right: 0;
width: 1px;
background-color: #e2e2e2;
}
.bnet_hero2_cat_desk .post-card:nth-child(6n)::after {
display: none;
}
}
@media (min-width: 1024px) {
/* 1) Give the GRID-COLUMNS a tiny inner gutter so borders never sit on the hard edge */
.bnet_hero2_cat_desk li.fusion-post-cards-grid-column,
.bnet_hero2_cat_desk .fusion-post-cards-grid-column {
padding-left: 10px !important;
padding-right: 12px !important;
box-sizing: border-box !important;
}
/* 2) Keep the visual card flush inside that gutter (optional but usually helps) */
.bnet_hero2_cat_desk .post-card {
margin-top: 0 !important;
margin-right: 0 !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
}
/* 3) Move the divider 1px inward (the real “pixel rounding” killer) */
.bnet_hero2_cat_desk .post-card::after {
right: 1px !important;
}
}
/* ==========================================================================
TOUCH/SWIPE/HOVER
========================================================================== */
/* Basis-Card: dezenter Grundschatten + Setup für Animation */
.bnet_hero2_cat_desk .post-card {
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: 0 1px 2px rgba(0,0,0,0.04); /* ganz zarter Basisschatten */
transform: translateY(0) scale(1);
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27); /* micro-bounce */
}
/* Desktop-Hover – Premium Lift */
@media (min-width: 769px) {
.bnet_hero2_cat_desk .post-card:hover {
background-color: #f5f7f8; /* leichtes Paper-Grau, nicht „dreckig“ */
box-shadow: 0 2px 6px rgba(0,0,0,0.14); /* schärferer, knackigerer Schatten */
transform: translateY(-2px) scale(0.99); /* Micro-Lift + ganz leicht kleiner */
}
}
/* Mobile/JS-Tap – nutzt bn-tap von deinem Script, gleiche Optik wie Hover */
.bnet_hero2_cat_desk .post-card.bn-tap {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
/* Safety: innere Wrapper sollen keinen eigenen Shadow/Background setzen */
.bnet_hero2_cat_desk .post-card .fusion-column-wrapper,
.bnet_hero2_cat_desk .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
DIRTY HORIZONTAL NESTED COLUMNS DESKTOP
DIRTY HORIZONTAL NESTED COLUMNS DESKTOP
DIRTY HORIZONTAL NESTED COLUMNS DESKTOP
DIRTY HORIZONTAL NESTED COLUMNS DESKTOP
Active Post Card : DIRTY HORIZONTAL NESTED COLUMNS DESKTOP
Title bnet_standard_desk_title
Excerpt bnet_standard_desk_excerpt
Date bnet_standard_desk_date
Image none
=========================================================================== */
@media (min-width: 769px) {
/* --- Basic card spacing fix (Height) --- */
.bnet_standard_desk .fusion-post-card.post-card {
position: relative;
padding: 2px 0 4px 0 !important; /* wenig vertical padding */
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
box-shadow: none !important;
border: 0 !important;
}
/* Avada default spacing inside nested columns entfernen */
.bnet_standard_desk .fusion-post-card .fusion-builder-row-inner,
.bnet_standard_desk .fusion-post-card .fusion-builder-row-inner .fusion-layout-column {
margin-bottom: 0 !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
}
/* Eventuelle column background spans neutralisieren */
.bnet_standard_desk .fusion-column-inner-bg-image {
display: none !important;
height: 0 !important;
padding: 0 !important;
}
/* --------- CATEGORY --------- */
.bnet_standard_desk .bnet_standard_desk_cat {
font-size: 10px !important;
height: 14px !important;
font-weight: 500 !important;
line-height: 1.3 !important;
text-transform: uppercase !important;
letter-spacing: 0.06em !important;
margin-bottom: 3px !important;
opacity: 0.85 !important;
}
/* --- TITEL (BASIS, OHNE TRUNCATE / CLAMP / ELLIPSIS) --- */
.bnet_standard_desk_title,
.bnet_standard_desk_title a {
font-size: 16px !important;
font-weight: 600 !important;
line-height: 1.25 !important;
margin-bottom: 3px !important;
height: 19px !important;
overflow: hidden !important;
text-transform: none !important;
}
/* --- EXCERPT --- */
.bnet_standard_desk_excerpt p {
font-size: 13px !important;
line-height: 1.4 !important;
margin-bottom: 0px !important;
height: 38px !important; /* 2–3 Zeilen */
overflow: hidden !important;
}
/* --- TIME / META --- */
.bnet_standard_desk_date {
font-size: 10px !important;
line-height: 14px !important;
text-transform: uppercase !important;
margin-bottom: 0px !important;
font-weight: 500 !important;
border-bottom: 0 !important;
border-top: 0 !important;
height: 11px !important;
overflow: hidden !important;
}
/* --- IMAGE (linke Spalte, normales Postcard Image) --- */
.bnet_standard_desk .fusion-post-card-image,
.bnet_standard_desk .featured-image {
height: 90px !important;
}
.bnet_standard_desk .fusion-post-card-image img,
.bnet_standard_desk .featured-image img {
width: 100% !important;
display: block !important;
object-fit: cover !important;
border-radius: 6px;
}
/* --- VERTIKALER DIVIDER NUR IN DER MITTE --- */
.bnet_standard_desk .post-card {
position: relative;
}
/* Linie rechts an jeder linken Karte (1,3,5,...) */
.bnet_standard_desk .post-card::after {
content: "";
position: absolute;
top: 6px;
bottom: 6px;
right: 0;
width: 1px;
background-color: #e2e2e2;
}
/* rechte Karten (2,4,6,...) bekommen keinen Divider */
.bnet_standard_desk .post-card:nth-child(2n)::after {
display: none;
}
/* --- HORIZONTALER DIVIDER zwischen Zeile 1 und 2 --- */
.bnet_standard_desk .post-card {
padding-bottom: 10px;
margin-bottom: 10px;
}
/* Linie nur unter Karte 1 und 2 */
.bnet_standard_desk .post-card:nth-child(-n+3) {
border-bottom: 1px solid #e2e2e2;
}
}
/* ==========================================================================
TOUCH/SWIPE/HOVER
========================================================================== */
/* Basis-Card: dezenter Grundschatten + Setup für Animation */
.bnet_standard_desk .post-card {
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: 0 1px 2px rgba(0,0,0,0.04);
transform: translateY(0) scale(1);
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27);
}
/* Desktop-Hover – Premium Lift */
@media (min-width: 769px) {
.bnet_standard_desk .post-card:hover {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
}
/* Mobile/JS-Tap – nutzt bn-tap von deinem Script, gleiche Optik wie Hover */
.bnet_standard_desk .post-card.bn-tap {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
/* Safety: innere Wrapper sollen keinen eigenen Shadow/Background setzen */
.bnet_standard_desk .post-card .fusion-column-wrapper,
.bnet_standard_desk .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
VERY DIRTY HORIZONTAL NESTED COLUMNS MOBILE
VERY DIRTY HORIZONTAL NESTED COLUMNS MOBILE
VERY DIRTY HORIZONTAL NESTED COLUMNS MOBILE
VERY DIRTY HORIZONTAL NESTED COLUMNS MOBILE
Active Post Card : VERY DIRTY HORIZONTAL NESTED COLUMNS MOBILE
Title bnet_standard_mob_title
Excerpt bnet_standard_mob_excerpt
Date bnet_standard_mob_date
Image bnet_standard_mob_img
=========================================================================== */
@media (max-width: 1023px) {
/* --- Basic card spacing fix (Height) --- */
.bnet_standard_mob .fusion-post-card.post-card {
position: relative;
padding: 8px 0 12px 0 !important; /* wenig vertical padding */
margin: 0 !important; /* keine extra margins */
box-shadow: none !important;
border: 0 !important;
}
/* Avada default spacing inside nested columns entfernen */
.bnet_standard_mob .fusion-post-card .fusion-builder-row-inner,
.bnet_standard_mob .fusion-post-card .fusion-builder-row-inner .fusion-layout-column {
margin-bottom: 0 !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
}
/* Eventuelle column background spans neutralisieren */
.bnet_standard_mob .fusion-column-inner-bg-image {
display: none !important;
height: 0 !important;
padding: 0 !important;
}
/* --------- CATEGORY --------- */
.bnet_standard_mob .bnet_standard_mob_cat {
font-size: 10px !important;
font-weight: 500 !important;
height: 10px !important;
line-height: 10px !important;
text-transform: uppercase !important;
letter-spacing: 0.06em !important;
margin-bottom: 2px !important;
margin-top: 3px !important;
opacity: 0.85 !important;
}
/* --- TITEL (MOBILE) --- */
.bnet_standard_mob .bnet_standard_mob_title {
height: 14px !important;
font-weight: 600 !important;
overflow: hidden !important;
margin-bottom: 2px !important;
}
.bnet_standard_mob .bnet_standard_mob_title .fusion-title-heading,
.bnet_standard_mob .bnet_standard_mob_title .fusion-title-heading a {
font-size: 14px !important;
line-height: 14px !important;
text-transform: none !important;
}
/* --- EXCERPT --- */
.bnet_standard_mob .bnet_standard_mob_excerpt p {
font-size: 11px !important;
line-height: 13px !important;
margin-bottom: 2px !important;
height: 26px !important; /* 2–3 Zeilen */
overflow: hidden !important;
}
/* --- TIME / META --- */
.bnet_standard_mob .bnet_standard_mob_date {
font-size: 9px !important;
line-height: 9px !important;
margin-bottom: 0px !important;
border-bottom: 0 !important;
border-top: 0 !important;
height: 9px !important;
overflow: hidden !important;
}
/* --- IMAGE (linke Spalte, normales Postcard Image) --- */
.bnet_standard_mob .fusion-post-card-image,
.bnet_standard_mob .featured-image {
height: 90px !important;
}
.bnet_standard_mob .fusion-post-card-image img,
.bnet_standard_mob .featured-image img {
width: 100% !important;
display: block !important;
object-fit: cover !important;
border-radius: 6px;
}
}
/* ==========================================================================
TOUCH/SWIPE/HOVER
========================================================================== */
/* Basis-Card: dezenter Grundschatten + Setup für Animation */
.bnet_standard_mob .post-card {
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: 0 1px 2px rgba(0,0,0,0.04);
transform: translateY(0) scale(1);
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27);
}
/* Desktop-Hover – Premium Lift */
@media (min-width: 769px) {
.bnet_standard_mob .post-card:hover {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
}
/* Mobile/JS-Tap – nutzt bn-tap von deinem Script, gleiche Optik wie Hover */
.bnet_standard_mob .post-card.bn-tap {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
/* Safety: innere Wrapper sollen keinen eigenen Shadow/Background setzen */
.bnet_standard_mob .post-card .fusion-column-wrapper,
.bnet_standard_mob .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
Bornheim.Net – Horizontal Mobile Cards: Row-Spacing killen
(hier nichts umbenannt – wirkt weiter global)
========================================================================== */
@media (max-width: 1023px) {
/* Nur innerhalb deiner bn_pcHM-Section/Row – historischer Kommentar :) */
.fusion-post-cards .fusion-grid > .fusion-grid-column {
padding-top: 0 !important;
padding-bottom: 0 !important;
margin-top: 0 !important;
margin-bottom: 0 !important;
}
}
@media (max-width: 1023px) {
.fusion-post-cards {
--awb-row-spacing-small: 0px !important; /* vertikaler Abstand = 0 */
}
/* dazu weiterhin das Padding auf den Grid-Columns weg */
.fusion-grid > .fusion-grid-column {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
}
/* ==========================================================================
VERY DIRTY HORIZONTAL NESTED COLUMNS TABLET
Active Post Card : VERY DIRTY HORIZONTAL NESTED COLUMNS TABLET
Class: bnet_standard_tab
Title : bnet_standard_tab_title
Excerpt: bnet_standard_tab_excerpt
Date : bnet_standard_tab_date
Image : bnet_standard_tab_img
========================================================================== */
@media (min-width: 769px) and (max-width: 1023px) {
/* --- Basic card spacing fix (Height) --- */
.bnet_standard_tab .fusion-post-card.post-card {
position: relative;
padding-top: 8px !important;
padding-right: 0 !important;
padding-bottom: 12px !important;
padding-left: 0 !important;
margin: 0 !important;
box-shadow: none !important;
border: 0 !important;
}
/* Avada default spacing inside nested columns entfernen */
.bnet_standard_tab .fusion-post-card .fusion-builder-row-inner,
.bnet_standard_tab .fusion-post-card .fusion-builder-row-inner .fusion-layout-column {
margin-bottom: 0 !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
}
/* Eventuelle column background spans neutralisieren */
.bnet_standard_tab .fusion-column-inner-bg-image {
display: none !important;
height: 0 !important;
padding: 0 !important;
}
/* --------- CATEGORY --------- */
.bnet_standard_tab .bnet_standard_tab_cat {
font-size: 9px !important;
font-weight: 500 !important;
height: 10px !important;
line-height: 14px !important;
text-transform: uppercase !important;
letter-spacing: 0.06em !important;
margin-bottom: 2px !important;
margin-top: 0px !important;
opacity: 0.85 !important;
}
/* --- TITEL (TABLET) --- */
.bnet_standard_tab .bnet_standard_tab_title {
font-size: 14px !important;
font-weight: 400 !important;
line-height: 17px !important;
overflow: hidden !important;
margin-bottom: 5px !important;
}
.bnet_standard_tab .bnet_standard_tab_title .fusion-title-heading,
.bnet_standard_tab .bnet_standard_tab_title .fusion-title-heading a {
font-size: 14px !important;
font-weight: 400 !important;
line-height: 17px !important;
text-transform: none !important;
}
/* --- EXCERPT --- */
.bnet_standard_tab .bnet_standard_tab_excerpt p {
font-size: 11px !important;
line-height: 13px !important;
margin-bottom: 2px !important;
height: 28px !important;
overflow: hidden !important;
}
/* --- TIME / META --- */
.bnet_standard_tab .bnet_standard_tab_date {
font-size: 9px !important;
line-height: 9px !important;
margin-bottom: 0 !important;
border: 0 !important;
height: 9px !important;
overflow: hidden !important;
}
/* --- IMAGE --- */
.bnet_standard_tab .fusion-post-card-image,
.bnet_standard_tab .featured-image {
height: 90px !important;
}
.bnet_standard_tab .fusion-post-card-image img,
.bnet_standard_tab .featured-image img {
width: 100% !important;
display: block !important;
object-fit: cover !important;
border-radius: 6px;
}
}
/* ==========================================================================
TOUCH / TAP (TABLET)
========================================================================== */
.bnet_standard_tab .post-card {
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: 0 1px 2px rgba(0,0,0,0.04);
transform: translateY(0) scale(1);
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27);
}
@media (min-width: 769px) and (max-width: 1023px) {
.bnet_standard_tab .post-card:hover,
.bnet_standard_tab .post-card.bn-tap {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
}
/* Safety */
.bnet_standard_tab .post-card .fusion-column-wrapper,
.bnet_standard_tab .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
Row / Grid Spacing kill (TABLET ONLY, scoped)
========================================================================== */
@media (min-width: 769px) and (max-width: 1023px) {
.bnet_standard_tab .fusion-post-cards .fusion-grid > .fusion-grid-column {
padding-top: 0 !important;
padding-bottom: 0 !important;
margin-top: 0 !important;
margin-bottom: 0 !important;
}
.bnet_standard_tab .fusion-post-cards {
--awb-row-spacing-small: 0px !important;
}
.bnet_standard_tab .fusion-grid > .fusion-grid-column {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
}
/* ==========================================================================
BN TABLET - Freeze postcard image size
Scope: .bnet_standard_tab + viewport 769-1023
Target: .bnet_standard_tab_img (image wrapper) + descendants
========================================================================== */
@media (min-width: 769px) and (max-width: 1023px) {
/* 1) The image WRAPPER: fixed box */
.bnet_standard_tab .bnet_standard_tab_img,
.bnet_standard_tab .bnet_standard_tab_img .fusion-post-card-image,
.bnet_standard_tab .bnet_standard_tab_img .featured-image {
width: 120px !important;
max-width: 120px !important;
height: 80px !important;
max-height: 80px !important;
overflow: hidden !important;
}
/* 2) The image itself: fixed to box */
.bnet_standard_tab .bnet_standard_tab_img img,
.bnet_standard_tab .bnet_standard_tab_img .fusion-post-card-image img,
.bnet_standard_tab .bnet_standard_tab_img .featured-image img {
width: 120px !important;
max-width: 120px !important;
height: 80px !important;
max-height: 80px !important;
display: block !important;
object-fit: cover !important;
border-radius: 6px !important;
}
/* 3) Safety: kill any responsive "auto height" coming from theme */
.bnet_standard_tab .bnet_standard_tab_img picture,
.bnet_standard_tab .bnet_standard_tab_img source {
max-width: 120px !important;
}
}
/* ==========================================================================
BN TABLET - Fixed gap between nested columns
Goal: constant gap, right column expands with viewport
Scope: .bnet_standard_tab + viewport 769-1023
Anchor: .bnet_standard_tab_img (left image column)
========================================================================== */
@media (min-width: 769px) and (max-width: 1023px) {
/* 1) Turn the INNER postcard row into a flex row (2 columns) */
.bnet_standard_tab .bnet_standard_tab_img
.fusion-builder-row-inner {
display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
align-items: flex-start !important;
column-gap: 12px !important; /* <-- constant gap */
}
/* 2) Left column: fixed width (must match your image width) */
.bnet_standard_tab .bnet_standard_tab_img
.fusion-builder-row-inner > .fusion-layout-column:first-child {
flex-grow: 0 !important;
flex-shrink: 0 !important;
flex-basis: 120px !important;
width: 120px !important;
max-width: 120px !important;
}
/* 3) Right column: expands */
.bnet_standard_tab .bnet_standard_tab_img
.fusion-builder-row-inner > .fusion-layout-column:last-child {
flex-grow: 1 !important;
flex-shrink: 1 !important;
flex-basis: auto !important;
min-width: 0 !important; /* prevents overflow pushing layout */
}
/* 4) Kill paddings that create "elastic" spacing */
.bnet_standard_tab .bnet_standard_tab_img
.fusion-builder-row-inner,
.bnet_standard_tab .bnet_standard_tab_img
.fusion-builder-row-inner .fusion-layout-column,
.bnet_standard_tab .bnet_standard_tab_img
.fusion-builder-row-inner .fusion-column-wrapper {
padding-top: 0 !important;
padding-right: 0 !important;
padding-bottom: 0 !important;
padding-left: 0 !important;
margin-top: 0 !important;
margin-right: 0 !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
}
}
/* ==========================================================================
BN TABLET - Kill elastic Avada column gutters inside postcard
Goal: ONLY the fixed column-gap remains constant
Scope: .bnet_standard_tab + viewport 769-1023
========================================================================== */
@media (min-width: 769px) and (max-width: 1023px) {
/* Remove left/right gutters on the two nested columns */
.bnet_standard_tab .fusion-post-cards li.post-card .fusion-builder-row-inner > .fusion-layout-column {
padding-left: 0 !important;
padding-right: 0 !important;
}
/* Also remove padding on the inner wrapper that often carries the gutter */
.bnet_standard_tab .fusion-post-cards li.post-card .fusion-builder-row-inner > .fusion-layout-column > .fusion-column-wrapper {
padding-left: 0 !important;
padding-right: 0 !important;
}
/* If Avada uses a first/last column special padding, kill that too */
.bnet_standard_tab .fusion-post-cards li.post-card .fusion-builder-row-inner > .fusion-layout-column:first-child,
.bnet_standard_tab .fusion-post-cards li.post-card .fusion-builder-row-inner > .fusion-layout-column:last-child {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
/* ==========================================================================
ESSENTIAL GRID
ESSENTIAL GRID
ESSENTIAL GRID
ESSENTIAL GRID
========================================================================== */
/* Styles for devices without hover (touchscreens) */
@media (hover: none) {
/* Target your grid items and make content visible */
.esg-grid .eg-invisiblebutton .overlay-content {
opacity: 1 !important;
visibility: visible !important;
}
/* Hide hover-specific icons if they appear */
.esg-grid .eg-invisiblebutton .hover-icon {
display: none !important;
}
}
/* Or, apply hover effects only when hover is possible */
@media (hover: hover) {
.esg-grid:hover .overlay-content {
/* Your usual hover reveal styles */
}
}
/* ==========================================================================
EPIC NEWS PLUGIN
EPIC NEWS PLUGIN
EPIC NEWS PLUGIN
EPIC NEWS PLUGIN
========================================================================== */
/* ==========================================================================
Get rid of Epic Ressort bottom margin
========================================================================== */
.jeg_postblock .jeg_pl_md_box {
margin-bottom: 0px !important;
}
/* Avada Responsive Typography in allen Epic / JEG Bereichen neutralisieren */
.jeg_wrapper .fusion-responsive-typography-calculated,
.jeg_heroblock .fusion-responsive-typography-calculated,
.jeg_post .fusion-responsive-typography-calculated,
.jeg_block_container .fusion-responsive-typography-calculated {
font-size: inherit !important;
line-height: inherit !important;
letter-spacing: inherit !important;
}
/* ==========================================================================
EPIC BLOCK 19 - RESSORT PIC 1+2
=========================================================================== */
.jeg_postblock_content > .jeg_post_category > span {
display: inline-block !important;
font-size: 10px !important;
font-weight: 500 !important;
line-height: 1.2 !important;
letter-spacing: 0.06em !important;
text-transform: uppercase !important;
color: #638994 !important;
opacity: 0.85 !important;
background: #f5f7f8 !important;
padding: 3px 5px !important;
border-radius: 3px !important;
}
/* Auskommentiert zwecks Konfliktlösung*/
/*.bn_epicD_block19 .jeg_post_excerpt {
font-size: 12px !important;
line-height: 1.3 !important;
margin-top: 0px !important;
} */
.jeg_post_excerpt {
font-size: 13px !important;
line-height: 1.4 !important;
margin-top: 0px !important;
margin-bottom: 5px !important;
}
.jeg_post .fusion-responsive-typography-calculated,
.jeg_block_container .fusion-responsive-typography-calculated {
font-size: 17px !important;
line-height: 1.35 !important;
letter-spacing: 0 !important;
}
.jeg_pl_sm .jeg_post_title {
font-size: 17px !important;
font-weight: 400 !important;
}
/* Uhr-Symbol im Block 19 ausblenden */
.bn_epicD_block19 .jeg_post_meta i {
display: none !important;
}
.jeg_block_heading_6 {
border-bottom: 1px solid #dddddd !important;
}
.jeg_block_heading_6::after {
content: '';
width: 30px;
height: 1px !important;
background: #005A94 !important;
display: block;
position: relative;
bottom: 1px !important;
}
.jeg_block_heading {
position: relative;
margin-top: 5px !important;
margin-bottom: 15px !important;
}
.jeg_subcat_list li a.current {
color: #005A94 !important;
}
.jeg_subcat_list li a:hover, .jeg_subcat_list li button:hover {
color: #005A94 !important;
}
.jeg_subcat_list > li > a {
color: #000000 !important;
display: block;
height: 14px !important;
line-height: 14px !important;
font-size: 11px !important;
font-weight: 500;
text-transform: uppercase;
padding: 0 7px;
-webkit-transition: .25s all ease;
-o-transition: .25s all ease;
transition: .25s all ease;
}
.jeg_postblock .jeg_pl_md_box {
margin-bottom: 15px !important;
}
@media (max-width: 768px) {
.jeg_subcat_list > li > a {
font-size: 11px !important;
font-weight: 400 !important;
}
}
/* ==========================================================================
EPIC – COMMENT INDICATOR (WHITE ONLY)
Scoped, minimal, no layout side effects
========================================================================== */
/* Indicator white */
.bnet_comment_ind_white {
color: #ffffff !important;
display: inline-flex !important;
align-items: center !important;
gap: 4px !important;
}
/* SVG white + larger */
.bnet_comment_ind_white svg {
width: 16px !important;
height: 16px !important;
fill: #ffffff !important;
stroke: #ffffff !important;
}
/* Count white */
.bnet_comment_ind_white .bnet_comment_count {
color: #ffffff !important;
}
/* ==========================================================================
Epic News – Mobile Subcat "..." Dropdown Fix (Bornheim)
========================================================================== */
.jeg_subcat.okayNav ul{
padding-inline-start:0 !important;
padding-left:0 !important; /* Fallback für Browser ohne inline-start Support */
}
/* ==========================================================================
EPIC Module 6 – Subcategory bar height fix (Axel & Egon approved)
========================================================================== */
.jeg_block_heading_6,
.jeg_block_heading_6 .jeg_subcat,
.jeg_block_heading_6 .jeg_subcat_list {
height: 20px;
min-height: 20px;
}
.jeg_block_heading_6 .jeg_subcat_list li a {
height: 20px;
line-height: 20px;
padding-top: 0;
padding-bottom: 0;
}
.jeg_block_heading_6 {
padding-top: 0;
padding-bottom: 0;
}
/* ==========================================================================
EPIC Module 6 – Subcat bar height: mobile safe base
========================================================================== */
@media (max-width: 768px) {
.jeg_block_heading_6,
.jeg_block_heading_6 .jeg_subcat,
.jeg_block_heading_6 .jeg_subcat_list {
height: 20px;
min-height: 20px;
}
.jeg_block_heading_6 .jeg_subcat_list li a {
height: 20px;
line-height: 20px;
/* vertikal killen, horizontal behalten */
padding-top: 0;
padding-bottom: 0;
padding-left: 5px;
padding-right: 5px;
}
.jeg_block_heading_6::after {
content: '';
width: 30px;
height: 1px !important;
background: #005A94 !important;
display: block;
position: relative;
bottom: 1px !important;
}
}
.okayNav__menu-toggle {
height: 15px !important;
line-height: 15px !important;
margin-bottom: 5px !important;
padding-bottom: 5px !important;
}
.jeg_subcat.okayNav ul {
margin-block-start: 0;
margin-block-end: 0;
list-style: none;
}
/* ==========================================================================
Epic News Elements – Subcat List Tablet Override (769–1023)
========================================================================== */
@media only screen and (min-width: 769px) and (max-width: 1023px) {
/* more specific than: .jeg_subcat_list > li > a */
body .jeg_subcat_list > li > a {
height: auto !important;
line-height: normal !important;
}
}
/* ==========================================================================
Bornheim.Net – Home Stack: Epic + bn_pcHM Cards kompakt
Wrapper: .bn_homeStack_tight
========================================================================== */
@media (max-width: 769px) {
/* 1) Global: innerhalb des Wrappers alles enger rücken */
.bn_homeStack_tight .fusion-post-cards {
--awb-row-spacing: 0px !important; /* kein Zeilen-Abstand */
margin-top: 0 !important;
margin-bottom: 0 !important;
}
.bn_homeStack_tight .fusion-post-cards .fusion-grid > .fusion-grid-column {
padding-top: 0 !important;
padding-bottom: 4px !important; /* kleiner Abstand zwischen Cards */
}
.bn_homeStack_tight .fusion-post-cards .fusion-grid > .fusion-grid-column:last-child {
padding-bottom: 0 !important; /* letztes Element bündig */
}
/* 2) Epic-Block oben im gleichen Wrapper – Bottom-Gap reduzieren */
.bn_homeStack_tight .jeg_postblocks,
.bn_homeStack_tight .jeg_postblocks_wrapper,
.bn_homeStack_tight .jeg_posts {
margin-bottom: 6px !important; /* statt 20–40px Standard */
}
/* 3) Sicherheit: keine extra top margins auf dem ersten Postcard-Block */
.bn_homeStack_tight .fusion-post-cards:first-of-type {
margin-top: 0 !important;
}
}
@media (max-width: 769px) {
/* Alle Epic-News-Container innerhalb des Home-Stacks enger machen */
.bn_homeStack_tight .jeg_postblocks,
.bn_homeStack_tight .jeg_postblocks_wrapper,
.bn_homeStack_tight .jeg_posts,
.bn_homeStack_tight .jeg_postsmall,
.bn_homeStack_tight .jeg_block_container {
margin-top: 0 !important;
margin-bottom: 2px !important; /* ggf. auf 0 setzen, wenn du es ganz bündig willst */
padding-bottom: 0 !important;
}
/* Falls da noch ein letzter innerer Wrapper hängt */
.bn_homeStack_tight [class*="jeg_"]:last-child {
margin-bottom: 2px !important; /* oder 0, wenn wirklich gar kein Gap sein soll */
}
}
/* ==========================================================================
Fatal Mobile Bug Epic Hero Solution - Important when using Epic News Heroes
=========================================================================== */
.jeg_heroblock .post {
margin-bottom: unset !important;
}
/* ==========================================================================
TEXT AND OTHER STYLES FOR AXELS ORIGINAL INCLUDE ME FILES
TEXT AND OTHER STYLES FOR AXELS ORIGINAL INCLUDE ME FILES
TEXT AND OTHER STYLES FOR AXELS ORIGINAL INCLUDE ME FILES
TEXT AND OTHER STYLES FOR AXELS ORIGINAL INCLUDE ME FILES
========================================================================== */
/* ==========================================================================
Ads Info Links above Homepage Sidebar Ads + Top Margin Control Devices
========================================================================== */
.infoanzeige {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400;
color: #999999 !important;
font-size: 8px;
text-align: center !important;
margin-top: 0px !important;
margin-bottom: 0px !important;
}
@media (max-width: 1023px) {
.infoanzeige {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400;
color: #999999 !important;
font-size: 8px;
text-align: center !important;
margin-top: 0px !important;
margin-bottom: 0px !important;
}
}
.infohaftung {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400;
color: #999999 !important;
font-size: 8px;
text-align: center !important;
margin-top: 0px !important;
margin-bottom: 0px !important;
}
@media (max-width: 1023px) {
.infohaftung {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400;
color: #999999 !important;
font-size: 8px;
text-align: center !important;
margin-top: 0px !important;
margin-bottom: 0px !important;
}
}
/* ==========================================================================
Ads Info Links above Homepage Sidebar Ads + Top Margin Control Devices
========================================================================== */
.ohnegewaehr {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400;
color: #999999 !important;
font-size: 8px;
text-align: right !important;
margin-top: 0px !important;
margin-bottom: 0px !important;
}
@media (max-width: 1023px) {
.ohnegewaehr {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400;
color: #999999 !important;
font-size: 8px;
text-align: center !important;
margin-top: 0px !important;
margin-bottom: 0px !important;
}
}
/* ==========================================================================
Ads Info Links above Homepage Sidebar Ads + Top Margin Control Devices
========================================================================== */
.bomopoadsheader {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400;
color: #999999 !important;
font-size: 8px;
text-align: right !important;
margin-top: 0px !important;
margin-bottom: 0px !important;
}
.bomopoadsheaderleft {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400;
color: #999999 !important;
font-size: 8px;
text-align: left !important;
margin-top: 0px !important;
margin-bottom: 0px !important;
}
.kiwarning {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400;
color: #999999 !important;
font-size: 8px;
line-height: 10px;
text-align: left !important;
margin-top: 0px !important;
margin-bottom: 0px !important;
}
@media (max-width: 760px) {
.bomopoadsheader {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400;
color: #AAAAAA !important;
font-size: 10px;
}
}
@media (max-width: 501px) {
.bomopoadsheader {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400;
text-align: left !important;
color: #AAAAAA !important;
font-size: 10px;
margin-top: 0px !important;
}
}
/* ==========================================================================
Ads Info Links Top Margin Control on Category & Single Post Pages
========================================================================== */
.pageadsheader {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400;
color: #999999 !important;
font-size: 10px;
text-align: right !important;
margin-top: 10px !important;
margin-bottom: 2px !important;
}
@media (max-width: 760px) {
.pageadsheader {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400;
color: #AAAAAA !important;
font-size: 10px;
}
}
@media (max-width: 501px) {
.pageadsheader {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400;
color: #AAAAAA !important;
font-size: 10px;
margin-top: 0px !important;
}
}
/* ==========================================================================
Participate & Category Links below Sidebar Ads Homepage
========================================================================== */
@media only screen and (max-width: 500px) {
.bomopointeract {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400;
color: #222222 !important;
font-size: 10px;
line-height: 14px !important;
text-align: center !important;
margin-top: 7px !important;
margin-bottom: 4px !important;
}
}
@media only screen and (min-width: 501px) {
.bomopointeract {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400;
color: #222222 !important;
font-size: 10px;
line-height: 14px !important;
text-align: right !important;
margin-top: 7px !important;
margin-bottom: 4px !important;
}
}
/* ==========================================================================
Sponsor Links below Sidebar Ads Homepage
========================================================================== */
@media only screen and (max-width: 500px) {
.sponsors {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400;
color: #999999 !important;
font-size: 10px;
line-height: 14px !important;
text-align: center !important;
margin-top: 7px !important;
margin-bottom: 4px !important;
}
}
@media only screen and (min-width: 501px) {
.sponsors {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400;
color: #999999 !important;
font-size: 10px;
line-height: 14px !important;
text-align: right !important;
margin-top: 7px !important;
margin-bottom: 4px !important;
}
}
/* ==========================================================================
Category Links below Homepage Sidebars
========================================================================== */
.bomopogotocategory {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 600;
color: #999999 !important;
font-size: 12px;
line-height: 14px !important;
text-align: center !important;
margin-top: 0px !important;
margin-bottom: 10px !important;
}
@media only screen and (max-width: 500px) {
#hideonmobile {
display: none !important;
}
}
@media only screen and (max-width:500px) {
.jeg_pl_sm
{
margin-bottom: 10px !important;
}
}
/* ==========================================================================
Homepage Participate Teaser Links below Category Name right alligned
========================================================================== */
.participate {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400;
color: #999999 !important;
font-size: 10px;
text-align: right !important;
margin-top: 0px !important;
margin-bottom: 0px !important;
}
/* ==========================================================================
Styling for Dreamweaver Include horizontal Lines
========================================================================== */
hr.topbottomadinfo {
width: 100% !important;
display: block;
align: center !important;
height: 1px;
border: 0;
border-top-width: 0px;
border-top-style: none;
border-top-color: currentcolor;
border-top: 1px solid #eee;
margin: 0 0 !important;
margin-top: 0px !important;
margin-bottom: 0px !important;
padding: 0;
}
/* ==========================================================================
Styling for Dreamweaver Bottom Ads Table
========================================================================== */
.bottomadstable {
width: 100% !important;
align: center !important;
margin-left: auto !important;
margin-right: auto !important;
}
/* ==========================================================================
Hide Top Ads below Hero depending on screen size
========================================================================== */
.topadfirst {
margin-top: 15px !important;
margin-bottom: 15px !important;
margin-right: 10px !important;
}
.topadsecond {
margin-top: 15px !important;
margin-bottom: 15px !important;
margin-left: 20px !important;
}
.topadthird {
margin-top: 15px !important;
margin-bottom: 15px !important;
margin-left: 20px !important;
}
@media only screen and (max-width: 764px){
.topadsecond {
display: none !important;
}
}
@media only screen and (max-width: 1224px){
.topadthird {
display: none !important;
}
}
/* ==========================================================================
Breaking News Text Styling
========================================================================== */
.breaking {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 400 !important;
text-align: center !important;
color: #ffffff;
font-size: 12px !important;
-webkit-transition: color .2s;
-o-transition: color .2s;
transition: color .2s;
}
.breaking a {
font-family: "Raleway Thin Local", Arial, Helvetica, sans-serif;
font-weight: 600 !important;
color: #212121;
font-size: 12px !important;
-webkit-transition: color .2s;
-o-transition: color .2s;
transition: color .2s;
}
/* ==========================================================================
OLD JNEWS THEME STYLES - POTENTIALLY NOT IN USE ANYMORE
OLD JNEWS THEME STYLES - POTENTIALLY NOT IN USE ANYMORE
OLD JNEWS THEME STYLES - POTENTIALLY NOT IN USE ANYMORE
OLD JNEWS THEME STYLES - POTENTIALLY NOT IN USE ANYMORE
========================================================================== */
/* ==========================================================================
show category post meta in mobile device
========================================================================== */
@media only screen and (max-width: 568px){
.entry-header .jeg_post_meta div.jeg_meta_category {
display: block !important;
margin-left: 41px;
}
}
/* ==========================================================================
Homepage Excerpt Text Style
========================================================================== */
.myexcerpt {
font-family: Raleway, Arial, Helvetica, sans-serif;
font-weight: 400;
color: #999999 !important;
font-size: 11px;
line-height: 15px !important;
text-align: left !important;
margin-top: 0px !important;
margin-bottom: 0px !important;
}
/* ==========================================================================
Touch action avoid vertical page scrolling
========================================================================== */
.bnetscroll {
touch-action: pan-x !important;
height: 300px !important;
}
/* ==========================================================================
WP ULIKE
WP ULIKE
WP ULIKE
WP ULIKE
========================================================================== */
.ulp-share-btn {
height: 24px !important; /* Höhe der Buttons anpassen */
width: 24px !important; /* Breite der Buttons anpassen */
padding: 0 !important; /* Padding entfernen */
margin: 0 !important; /* Padding entfernen */
line-height: 24px !important;/* Für zentrierte Icons */
}
.ulp-share-btn-icon i {
font-size: 16px !important; /* Größe der Icons anpassen */
height: 16px !important; /* Höhe der Buttons anpassen */
width: 16px !important; /* Breite der Buttons anpassen */
}
.wpulike-heart .wp_ulike_general_class {
box-shadow: 0 0 0 0px #bdbdbd inset !important;
border-radius: .25em;
padding: 2px !important;
}
.wpulike-heart .count-box {
font-size: 11px !important;
font-family: "Inter Local", Arial, Helvetica, sans-serif !important;
text-decoration: none !important;
line-height: 20px !important;
display: inline-block !important;
color: #616161 !important;
text-align: center !important;
font-weight: 500 !important;
vertical-align: middle !important;
padding: 0 0px !important;
}
.wpulike {
display: block !important;
position: relative !important;
line-height: normal !important;
margin: 0 !important;
padding: 0px 0 !important;
}
.wpulike-heart .wp_ulike_put_image.wp_ulike_btn_is_active::after {
filter:
invert(34%) sepia(72%) saturate(1800%) hue-rotate(188deg) brightness(80%) contrast(97%)
drop-shadow(1px 0 0 rgba(0,0,0,0.6))
drop-shadow(-1px 0 0 rgba(0,0,0,0.6))
drop-shadow(0 1px 0 rgba(0,0,0,0.6))
drop-shadow(0 -1px 0 rgba(0,0,0,0.6)) !important;
}
/* ==========================================================================
MOBILE SCROLLABLE SUBMENU
MOBILE SCROLLABLE SUBMENU
MOBILE SCROLLABLE SUBMENU
MOBILE SCROLLABLE SUBMENU
========================================================================== */
/* ==========================================================================
Bornheim.Net – Mobile Swipe Submenu (Avada Menu Element)
========================================================================== */
/* ==========================================================================
Bornheim.Net – Mobile Swipe Submenu (Avada Menu Element) – FINAL
========================================================================== */
.bnet-mobile-submenu {
display: none !important;
}
@media (max-width: 768px) {
/* ----------------------------------------------------------
SHOW ON MOBILE
---------------------------------------------------------- */
nav.bnet-mobile-submenu {
display: flex !important;
align-items: center;
margin: 0 !important;
padding: 0 !important;
border-bottom: 1px solid rgba(0,0,0,0.08);
/* wichtig für blend-mode */
isolation: isolate;
/* Avada min-height Kill */
--awb-min-height: 0px !important;
}
/* ----------------------------------------------------------
HORIZONTAL SCROLL
---------------------------------------------------------- */
nav.bnet-mobile-submenu ul,
nav.bnet-mobile-submenu .awb-menu__main-ul {
display: flex;
flex-wrap: nowrap;
gap: 14px;
margin: 0 !important;
padding: 7px 10px !important;
list-style: none;
overflow-x: auto !important;
overflow-y: hidden !important;
-webkit-overflow-scrolling: touch;
white-space: nowrap;
scrollbar-width: none;
min-height: 0 !important;
height: auto !important;
}
nav.bnet-mobile-submenu ul::-webkit-scrollbar {
display: none;
}
nav.bnet-mobile-submenu li {
flex: 0 0 auto;
margin: 0 !important;
padding: 0 !important;
}
/* ----------------------------------------------------------
TAP MICRO FEEDBACK (OPTIONAL)
---------------------------------------------------------- */
@media (hover: none) and (pointer: coarse) {
nav.bnet-mobile-submenu a {
transform: translateZ(0);
transition: transform 120ms ease, opacity 120ms ease;
}
nav.bnet-mobile-submenu a:active {
transform: scale(0.97);
opacity: 0.85;
}
}
}
/* ==========================================================================
SINGLE POST – CLEAN RESET (Meta minimal)
Kept ONLY:
- Social Share (mobile top)
- WP ULike
- Category meta (bnet_singlepost_cat)
========================================================================== */
/* ==========================================================================
Single Post – CATEGORY Line Break Fix (Desktop + Tablet)
Forces each category link onto its own line and hides the comma text node
Scoped to .bnet_singlepost_cat only
========================================================================== */
/* Desktop */
.bnet_singlepost_cat .fusion-tb-categories {
display: flex !important;
flex-direction: column !important;
align-items: flex-start !important;
/* Hide the comma text node between elements */
font-size: 0px !important;
line-height: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
.bnet_singlepost_cat .fusion-tb-categories a {
display: block !important;
/* Restore typography */
font-family: "Bebas Local", Arial, Helvetica, sans-serif !important;
font-size: 18px !important;
font-weight: 400 !important;
letter-spacing: 0.06em !important;
text-transform: uppercase !important;
line-height: 1.1 !important;
color: inherit !important;
text-decoration: none !important;
border-bottom: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* Tablet: 768–1023 */
@media (max-width: 1023px) and (min-width: 768px) {
.bnet_singlepost_cat .fusion-tb-categories a {
font-size: 14px !important;
}
}
/* ==========================================================================
Single Post – CATEGORY (Bebas Local) | MOBILE
Forces font-size on real text nodes
Breakpoint: ≤767
========================================================================== */
@media (max-width: 767px){
.bnet_singlepost_cat,
.bnet_singlepost_cat span,
.bnet_singlepost_cat a{
font-family: "Bebas Local", Arial, Helvetica, sans-serif !important;
font-size: 12px !important;
font-weight: 400 !important;
letter-spacing: 0.05em !important;
text-transform: uppercase !important;
line-height: 1.1 !important;
}
.bnet_singlepost_cat{
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
@media (max-width: 767px){
body.single-post .bnet_singlepost_cat span,
body.single-post .bnet_singlepost_cat a{
font-size: 12px !important;
}
}
/* ==========================================================================
SINGLE POST – Editorial Meta: AUTHOR
========================================================================== */
.bnet_singlepost_aut{
display: block !important;
text-align: right !important;
font-family: "Bebas Local", Arial, Helvetica, sans-serif !important;
font-size: 10px !important;
font-weight: 400 !important;
line-height: 12px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* Author links inherit cleanly */
.bnet_singlepost_aut a{
color: inherit !important;
text-decoration: none !important;
border-bottom: 0px !important;
}
/* ==========================================================================
Single Post – SOCIAL SHARE (Mobile top, right aligned)
========================================================================== */
@media (max-width: 640px){
body.single-post .bnet_singlepost_social_mob_top{
display: flex !important;
justify-content: flex-end !important;
width: 100% !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
}
body.single-post
.bnet_singlepost_social_mob_top
.fusion-social-networks.sharingbox-shortcode-icon-wrapper{
display: flex !important;
justify-content: flex-end !important;
align-items: center !important;
flex-wrap: wrap !important;
width: 100% !important;
text-align: right !important;
}
body.single-post
.bnet_singlepost_social_mob_top
.fusion-social-networks.sharingbox-shortcode-icon-wrapper > span{
display: inline-flex !important;
justify-content: center !important;
align-items: center !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 6px !important;
}
/* Kill floats */
body.single-post
.bnet_singlepost_social_mob_top
.fusion-social-networks.sharingbox-shortcode-icon-wrapper,
body.single-post
.bnet_singlepost_social_mob_top
.fusion-social-networks.sharingbox-shortcode-icon-wrapper *{
float: none !important;
}
}
/* ==========================================================================
WP ULike – keep neutral (no visual styling here)
========================================================================== */
.wp_ulike_btn,
.wp_ulike_general_class{
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
}
/* ==========================================================================
BN DEBUG: Lightbox Click wieder erlauben (Single + Schnappschuss)
========================================================================== */
/* Single: Featured Image */
.single .post-featured-image a,
.single .post-featured-image a img,
.single .fusion-post-featured-image a,
.single .fusion-post-featured-image a img {
pointer-events: auto !important;
touch-action: auto !important;
}
/* Schnappschuss: alle Bildlinks im Content/Archive */
.category-schnappschuss a[href$=".jpg"],
.category-schnappschuss a[href$=".jpeg"],
.category-schnappschuss a[href$=".png"],
.category-schnappschuss a[href$=".webp"],
.category-schnappschuss a[href$=".avif"] {
pointer-events: auto !important;
touch-action: auto !important;
}
/* ==========================================================================
Postcard TITEL –
sofort unsichtbar, ausser Top Hero
========================================================================== */
.fusion-post-card-title br,
.bnet_mini_desk_title br,
.bnet_mini_tab_title br,
.bnet_mini_mob_title br {
display: none !important;
}
.bnet_tophero_title br {
display: inline !important;
}
/* ==========================================================================
Bornheim.Net – Single Post: Text-only klebt links (Template Builder: .fusion-content-tb)
- setzt echten Editorial-Gutter fuer den TB-Content
- ohne Double-Counting bei Fullwidth/Media
========================================================================== */
/* 1) Grund-Gutter fuer TB-Text */
body.single-post .fusion-content-tb{
padding-left: 16px !important;
padding-right: 16px !important;
box-sizing: border-box !important;
}
@media (min-width: 768px){
body.single-post .fusion-content-tb{
padding-left: 20px !important;
padding-right: 20px !important;
}
}
@media (min-width: 1025px){
body.single-post .fusion-content-tb{
padding-left: 30px !important;
padding-right: 30px !important;
}
}
/* 2) Reset: falls innerhalb TB ein Fullwidth/Video/Gallery-Block sitzt, der schon eigene Ränder hat */
body.single-post .fusion-content-tb .fusion-fullwidth,
body.single-post .fusion-content-tb .nonhundred-percent-fullwidth,
body.single-post .fusion-content-tb figure.wp-block-video,
body.single-post .fusion-content-tb .wp-video,
body.single-post .fusion-content-tb .wp-video-shortcode,
body.single-post .fusion-content-tb .rl-gallery-container{
padding-left: 0 !important;
padding-right: 0 !important;
}
/* ==========================================================================
Bornheim.Net – Single Post: Bottom Ad (IncludeMe) wirklich zentrieren
- scoped: nur single posts
- funktioniert auch mit Gutter/Padding (fusion-content-tb)
- zentriert blockige Ad-Wrapper, Bilder, iFrames, Ad-INS etc.
========================================================================== */
body.single-post .bn-include{
text-align: center !important;
}
/* Falls das Include einen Block-Wrapper ausgibt (typisch) */
body.single-post .bn-include > div,
body.single-post .bn-include > section,
body.single-post .bn-include > article,
body.single-post .bn-include > figure,
body.single-post .bn-include > p{
margin-left: auto !important;
margin-right: auto !important;
}
/* Medien/Ads, die oft blockig/festbreit sind */
body.single-post .bn-include img,
body.single-post .bn-include iframe,
body.single-post .bn-include embed,
body.single-post .bn-include object,
body.single-post .bn-include ins{
display: inline-block !important;
margin-left: auto !important;
margin-right: auto !important;
}
/* Wenn der Ad-Code selbst left aligned erzwingt */
body.single-post .bn-include *{
text-align: center !important;
}
/* Optional: falls du in TB-Content eine "left alignment" Variable hast */
body.single-post .fusion-content-tb .bn-include{
text-align: center !important;
}
/* ==========================================================================
AVADA SOCIAL SHARE & LINKS
AVADA SOCIAL SHARE & LINKS
AVADA SOCIAL SHARE & LINKS
AVADA SOCIAL SHARE & LINKS
========================================================================== */
/* ==========================================================================
SINGLE POST DESKTOP
========================================================================== */
.fusion-sharing-box .fusion-social-networks .fusion-social-network-icon {
margin-top: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
margin-right: 8px !important;
text-decoration: none;
}
.fusion-sharing-box {
min-height: 20px !important;
}
/* ==========================================================================
SINGLE POST MOBILE BOTTOM Class: bnet_singlepost_social_mob_bottom
========================================================================== */
@media (max-width: 640px){
/* Wrapper als Flex-Row mittig */
body.single-post
.bnet_singlepost_social_mob_bottom
.fusion-social-networks.sharingbox-shortcode-icon-wrapper{
display: flex !important;
justify-content: center !important;
align-items: center !important;
flex-wrap: wrap !important;
width: 100% !important;
text-align: center !important;
margin-left: auto !important;
margin-right: auto !important;
}
/* Spans als Flex-Items, keine komischen Inline-Abstaende */
body.single-post
.bnet_singlepost_social_mob_bottom
.fusion-social-networks.sharingbox-shortcode-icon-wrapper > span{
display: inline-flex !important;
justify-content: center !important;
align-items: center !important;
margin-top: 0px !important;
margin-right: 4px !important;
margin-bottom: 6px !important;
margin-left: 4px !important;
}
/* Falls Avada irgendwo floats setzt */
body.single-post
.bnet_singlepost_social_mob_bottom
.fusion-social-networks.sharingbox-shortcode-icon-wrapper,
body.single-post
.bnet_singlepost_social_mob_bottom
.fusion-social-networks.sharingbox-shortcode-icon-wrapper *{
float: none !important;
}
body.single-post
.bnet_singlepost_social_mob_bottom{
display: flex !important;
justify-content: center !important;
margin-top: 0px !important;
margin-right: auto !important;
margin-bottom: 0px !important;
margin-left: auto !important;
}
}
/* ==========================================================================
RELATED POSTS DESKTOP (scoped)
Builder Postcard: bnet_related_desk
Title: bnet_related_desk_title
Date: bnet_related_desk_date
Image: bnet_related_desk_img
========================================================================== */
@media (min-width: 769px) {
/* --------- TITLE (2-zeilig, feste Höhe) --------- */
.bnet_related_desk .bnet_related_desk_title,
.bnet_related_desk .bnet_related_desk_title a{
font-size: 16px !important;
line-height: 1.25 !important;
margin-bottom: 5px !important;
height: 20px !important;
overflow: hidden !important;
display: -webkit-box !important;
-webkit-line-clamp: 2 !important;
-webkit-box-orient: vertical !important;
text-transform: none !important;
}
/* --------- TIME / META (feste Höhe) --------- */
.bnet_related_desk .bnet_related_desk_date{
font-size: 12px !important;
line-height: 24px !important;
margin-bottom: 12px !important;
border-bottom: 0 !important;
border-top: 0 !important;
height: 24px !important;
overflow: hidden !important;
}
/* --------- IMAGE (immer gleich hoch) --------- */
.bnet_related_desk .fusion-post-card-image img,
.bnet_related_desk .featured-image img{
width: 100% !important;
height: 100px !important;
object-fit: cover !important;
display: block !important;
}
/* --------- Dezente vertikale Divider mit Innenabstand --------- */
.bnet_related_desk .post-card{
position: relative;
}
.bnet_related_desk .post-card::after{
content: "";
position: absolute;
top: 6px;
bottom: 6px;
right: 0;
width: 1px;
background-color: #e2e2e2;
}
.bnet_related_desk .post-card:nth-child(4n)::after{
display: none;
}
}
/* ==========================================================================
TOUCH/SWIPE/HOVER (scoped)
========================================================================== */
/* Basis-Card: dezenter Grundschatten + Setup für Animation */
.bnet_related_desk .post-card{
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: 0 1px 2px rgba(0,0,0,0.04);
transform: translateY(0) scale(1);
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27);
}
/* Desktop-Hover – Premium Lift */
@media (min-width: 769px) {
.bnet_related_desk .post-card:hover{
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
}
/* Mobile/JS-Tap – nutzt bn-tap von deinem Script, gleiche Optik wie Hover */
.bnet_related_desk .post-card.bn-tap{
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
/* Safety: innere Wrapper sollen keinen eigenen Shadow/Background setzen */
.bnet_related_desk .post-card .fusion-column-wrapper,
.bnet_related_desk .post-card .fusion-column-inner-bg{
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
RELATED POSTS MOBILE
Builder Postcard: bnet_related_mob
Title: bnet_related_mob_title
Date: bnet_related_mob_date
Image: bnet_related_mob_img
========================================================================== */
@media (max-width: 768px) {
.bnet_related_mob {
display: block !important;
overflow: hidden !important;
}
/* TITEL */
.bnet_related_mob_title {
height: 12px !important;
overflow: hidden !important;
display: block !important;
}
.bnet_related_mob_title .fusion-title-heading {
margin: 0 !important;
font-size: 11px !important;
height: 16px !important;
font-weight: 500 !important;
text-align: left !important;
line-height: 1.2 !important;
}
/* DATE / META */
.bnet_related_mob_date {
height: 10px !important;
overflow: hidden !important;
font-size: 9px !important;
font-weight: 600 !important;
color: #666 !important;
text-align: left !important;
display: flex !important;
border-bottom: 0 !important;
border-top: 0 !important;
align-items: center !important;
margin: 0 !important;
padding: 0 !important;
}
/* BILD – 100px */
.bnet_related_mob .fusion-post-card-image {
overflow: hidden !important;
margin-top: 0 !important;
display: block !important;
}
.bnet_related_mob .fusion-post-card-image img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
display: block !important;
}
/* Border zwischen Cards (scoped) */
.bnet_related_mob .fusion-post-cards .swiper-slide .fusion-column-wrapper {
border-right: 1px solid #ddd !important;
padding-right: 5px !important;
}
.bnet_related_mob .fusion-post-cards .swiper-slide:last-child .fusion-column-wrapper {
border-right: none !important;
}
}
@media (max-width: 768px) {
.bnet_related_mob .swiper-slide {
width: 38vw !important;
max-width: 38vw !important;
}
}
/* ==========================================================================
TOUCH/SWIPE/HOVER (scoped)
========================================================================== */
/* Basis-Card: dezenter Grundschatten + Setup für Animation */
.bnet_related_mob .post-card {
border-radius: 6px;
background-color: #f5f7f8;
box-shadow: 0 1px 2px rgba(0,0,0,0.04);
transform: translateY(0) scale(1);
transition:
background-color 0.18s ease-out,
box-shadow 0.22s ease-out,
transform 0.16s cubic-bezier(0.17, 0.89, 0.32, 1.27);
}
/* Desktop-Hover – Premium Lift */
@media (min-width: 769px) {
.bnet_related_mob .post-card:hover {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
}
/* Mobile/JS-Tap – nutzt bn-tap von deinem Script, gleiche Optik wie Hover */
.bnet_related_mob .post-card.bn-tap {
background-color: #f5f7f8;
box-shadow: 0 2px 6px rgba(0,0,0,0.14);
transform: translateY(-2px) scale(0.99);
}
/* Safety: innere Wrapper sollen keinen eigenen Shadow/Background setzen */
.bnet_related_mob .post-card .fusion-column-wrapper,
.bnet_related_mob .post-card .fusion-column-inner-bg {
background-color: transparent !important;
box-shadow: none !important;
}
/* ==========================================================================
Scrollraum begrenzen (RELATED)
========================================================================== */
@media (max-width: 1024px) {
/* Scroll-Container */
.bnet_related_mob {
overflow-x: auto !important;
overscroll-behavior-x: contain !important;
-webkit-overflow-scrolling: touch !important;
scroll-snap-type: x mandatory !important;
padding-right: 10px !important;
}
/* Innerer Track (Grid/Wrappers: kein Extra-Rand rechts) */
.bnet_related_mob .fusion-post-cards-wrapper,
.bnet_related_mob .fusion-grid {
padding-right: 0 !important;
margin-right: 0 !important;
border-bottom: 0 !important;
border-top: 0 !important;
gap: 0 !important;
}
/* Einzelne Cards */
.bnet_related_mob .fusion-post-card {
flex: 0 0 auto !important;
scroll-snap-align: start !important;
margin-right: 10px !important;
}
/* letzte Card */
.bnet_related_mob .fusion-post-card:last-child {
margin-right: 0 !important;
}
}
/* Border zwischen Cards – nur Related Mob */
.bnet_related_mob .fusion-post-cards .swiper-slide .fusion-column-wrapper {
border-right: 1px solid #ddd !important;
padding-right: 5px !important;
}
.bnet_related_mob .fusion-post-cards .swiper-slide:last-child .fusion-column-wrapper {
border-right: none !important;
}
/* ==========================================================================
PLYR VIDEO PLAYER
PLYR VIDEO PLAYER
PLYR VIDEO PLAYER
PLYR VIDEO PLAYER
PLYR VIDEO PLAYER
========================================================================== */
/* ==========================================================================
Plyr – zentraler Play Button Farbe
========================================================================== */
.plyr {
--plyr-color-main: #717171 !important;
}
/* ==========================================================================
Plyr – Guardian Style Badge (Play + Duration, top-right)
========================================================================== */
.bnet-plyr-wrap {
position: relative;
}
/* Badge container */
.bnet-plyr-badge {
position: absolute;
top: 12px;
right: 12px;
display: inline-flex;
align-items: center;
gap: 6px;
background: rgba(0,0,0,0.70);
color: #ffffff;
font-size: 12px;
font-weight: 500;
line-height: 1;
padding-top: 6px;
padding-right: 8px;
padding-bottom: 6px;
padding-left: 8px;
border-radius: 999px;
pointer-events: none;
z-index: 3;
}
/* Mini play icon (CSS triangle) */
.bnet-plyr-badge-ico {
width: 0;
height: 0;
border-top: 5px solid transparent;
border-bottom: 5px solid transparent;
border-left: 8px solid #ffffff;
display: inline-block;
}
/* ==========================================================================
Plyr – Guardian Style: Bottom Controls only when playing
- hides bottom control bar until playback starts
- keeps big center play button available
========================================================================== */
/* Default: hide bottom bar */
.bnet-plyr-wrap .plyr__controls {
opacity: 0;
visibility: hidden;
pointer-events: none;
transition-property: opacity, visibility;
transition-duration: 180ms, 0ms;
transition-timing-function: ease, linear;
transition-delay: 0ms, 180ms;
}
/* Show bottom bar while playing */
.bnet-plyr-wrap .plyr.plyr--playing .plyr__controls {
opacity: 1;
visibility: visible;
pointer-events: auto;
transition-delay: 0ms, 0ms;
}
/* Also show if user is seeking (nice UX) */
.bnet-plyr-wrap .plyr.plyr--seeking .plyr__controls {
opacity: 1;
visibility: visible;
pointer-events: auto;
transition-delay: 0ms, 0ms;
}
/* Optional: show controls on hover/focus while playing */
.bnet-plyr-wrap .plyr.plyr--playing:hover .plyr__controls,
.bnet-plyr-wrap .plyr.plyr--playing:focus-within .plyr__controls {
opacity: 1;
visibility: visible;
pointer-events: auto;
transition-delay: 0ms, 0ms;
}
/* ==========================================================================
Comment Indicator – MINIMAL (no layout, no wrappers)
Only size & typography
========================================================================== */
/* SVG icon */
.bnet_comment_indicator_svg {
width: 12px;
height: 12px;
display: inline-block;
vertical-align: middle;
}
/* Count */
.bnet_comment_indicator_count {
font-family: "Inter", sans-serif;
font-size: 10px;
font-weight: 500;
line-height: 1;
vertical-align: middle;
}
/* Link wrapper (quiet meta look) */
.bnet_comment_indicator_link {
display: inline-flex;
align-items: center;
gap: 4px;
color: inherit;
opacity: 0.8;
text-decoration: none;
}
/* ==========================================================================
Remove Avada meta separator after date (only where indicator is used)
========================================================================== */
.bnet_comment_ind .fusion-meta-tb-sep{
display: none !important;
}
/* ==========================================================================
COMMENT INDICATOR – GLOBAL SETTINGS
Wrapper class on the Indicator element/column: bnet_comment_ind
Inner classes come from shortcode:
.bnet_comment_indicator_svg, .bnet_comment_indicator_count, .bnet_comment_indicator_link
========================================================================== */
/* Base */
.bnet_comment_ind .bnet_comment_indicator_link{
opacity: 0.80;
}
.bnet_comment_ind .bnet_comment_indicator_svg{
display: inline-block;
vertical-align: middle;
}
.bnet_comment_ind .bnet_comment_indicator_count{
font-family: "Inter Normal Local", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
line-height: 1;
vertical-align: middle;
}
/* Position: left or right (choose per postcard by adding ONE extra class) */
.bnet_comment_ind.bnet_ind_left{
text-align: left;
}
.bnet_comment_ind.bnet_ind_right{
text-align: right;
}
/* Desktop */
@media (min-width: 1024px){
.bnet_comment_ind{
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
}
.bnet_comment_ind .bnet_comment_indicator_svg{
width: 12px;
height: 12px;
}
.bnet_comment_ind .bnet_comment_indicator_count{
font-size: 9px;
font-weight: 500;
}
}
/* Tablet */
@media (min-width: 769px) and (max-width: 1023px){
.bnet_comment_ind{
margin-top: 0px;
margin-right: 0px;
margin-bottom: 2px !important;
margin-left: 10px !important;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
}
.bnet_comment_ind .bnet_comment_indicator_svg{
width: 12px;
height: 12px;
}
.bnet_comment_ind .bnet_comment_indicator_count{
font-size: 9px;
font-weight: 500;
}
}
/* Mobile */
@media (max-width: 768px){
.bnet_comment_ind{
margin-top: 3px !important;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 4px !important;
padding-top: 0px !important;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px !important;
}
.bnet_comment_ind .bnet_comment_indicator_svg{
width: 12px;
height: 12px;
}
.bnet_comment_ind .bnet_comment_indicator_count{
font-size: 9px;
font-weight: 500;
}
}
/* ==========================================================================
BNET COMMENT INDICATOR – WHITE VARIANT
Class: bnet_comment_ind_white
========================================================================== */
.bnet_comment_ind_white {
color: #ffffff !important;
opacity: 1 !important;
}
/* Text / Count */
.bnet_comment_ind_white,
.bnet_comment_ind_white span,
.bnet_comment_ind_white a {
color: #ffffff !important;
}
/* SVG Icons */
.bnet_comment_ind_white svg {
fill: #ffffff !important;
stroke: #ffffff !important;
}
/* Font Icons */
.bnet_comment_ind_white i,
.bnet_comment_ind_white i::before {
color: #ffffff !important;
}
/* === DESKTOP === */
@media (min-width: 1024px) {
.bnet_comment_ind_white svg {
width: 14px !important;
height: 14px !important;
}
}
/* === TABLET === */
@media (min-width: 769px) and (max-width: 1023px) {
.bnet_comment_ind_white svg {
width: 14px !important;
height: 14px !important;
}
}
/* === MOBILE === */
@media (max-width: 768px) {
.bnet_comment_ind_white svg {
width: 13px !important;
height: 13px !important;
}
}
/* ==========================================================================
MOBILE: Vertical separators for Postcards (ONLY outer card column)
Prevents borders inside nested columns (meta row Date | Indicator etc.)
========================================================================== */
@media (max-width: 768px) {
/* Apply separator ONLY to the OUTER postcard column wrapper */
.fusion-post-cards .swiper-slide .fusion_builder_column:not(.fusion_builder_column_inner) > .fusion-column-wrapper {
border-right: 1px solid #dddddd !important;
padding-right: 5px !important;
}
/* Safety: NEVER draw separators on nested columns */
.fusion-post-cards .swiper-slide .fusion_builder_column_inner > .fusion-column-wrapper {
border-right: 0px !important;
padding-right: 0px !important;
}
}
/* ==========================================================================
WORDPRESS COMMENTS
WORDPRESS COMMENTS
WORDPRESS COMMENTS
WORDPRESS COMMENTS
========================================================================== */
.single .comments-container {
margin-top: 0 !important;
}
/* ==========================================================================
Bornheim.Net – Comments COLUMN (Mobile)
Breakpoint: ≤768
========================================================================== */
@media (max-width: 768px){
.bnet_comments_container,
.bnet_comments_container .fusion-column-wrapper{
border-left: none !important;
border-right: none !important;
}
}
/* ==========================================================================
Bornheim.Net – Comments COLUMN (Mobile + Tablet)
Aufgabe: Top Margin + Top Padding auf 0 erzwingen
Breakpoint: ≤1023
========================================================================== */
@media (max-width: 1023px){
.bnet_comments_container,
.bnet_comments_container .fusion-column-wrapper{
margin-top: 0 !important;
padding-top: 0 !important;
}
#wpdcom {
height: auto;
padding: 0px 0px 0px 0px !important;
margin: 0px 0px 0px 0px !important;
}
}
/* ==========================================================================
SEARCH – FORCE Relevanssi term highlight inside custom Postcards
========================================================================== */
.search .relevanssi-query-term,
.search .relevanssi-highlight,
.search mark {
display: inline !important;
background: #ffea00 !important;
color: #111111 !important;
box-shadow: 0 0 0 2px #ffea00 !important;
padding-top: 0px !important;
padding-right: 2px !important;
padding-bottom: 0px !important;
padding-left: 2px !important;
border-radius: 2px !important;
text-decoration: none !important;
}
/* ==========================================================================
HEADER – Prevent Mobile/Tablet height FOUC (reserve final height)
Scope: Avada header wrappers + your menu wrappers
Breakpoints: ≤1023
========================================================================== */
@media (max-width: 1023px){
/* 1) Reserve header height early (prevents shrink-jump) */
.fusion-header-wrapper,
.fusion-header{
min-height: 88px !important; /* START: try 88, then 84/92 */
}
/* 2) Kill vertical surprises from rows/containers inside header */
.fusion-header .fusion-row,
.fusion-header .fusion-builder-row,
.fusion-header .fusion-layout-column{
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* 3) Stabilize menu line box (your menu wrappers) */
.bnet_header_menu_mob .menu-text,
.bnet_header_menu_desk .menu-text,
.bnet_submenu_mob .menu-text,
.bnet_submenu_tab .menu-text{
line-height: 1.1 !important;
}
/* 4) Prevent image-driven layout shift (logo) */
.fusion-logo img,
.fusion-logo a img{
height: 52px !important; /* START: match your real mobile logo height */
width: auto !important;
max-height: 52px !important;
}
}
/* ==========================================================================
HEADER – Mobile only: prevent menu "drop-in" (layout shift)
Reserve space for main menu + submenu early
Breakpoint: ≤767
========================================================================== */
@media (max-width: 767px){
/* MAIN RESSORT MENU slot */
.bnet_header_menu_mob{
min-height: 30px !important; /* adjust to your final main menu height */
display: block !important;
}
/* SUBMENU slot */
.bnet_submenu_mob{
min-height: 30px !important; /* adjust to your final submenu height */
display: block !important;
}
}
/* ==========================================================================
HEADER MENUS – Mobile only: stable layout rules immediately
No wrap + stable line boxes
Breakpoint: ≤767
========================================================================== */
@media (max-width: 767px){
.bnet_header_menu_mob ul.awb-menu__main-ul,
.bnet_submenu_mob ul.awb-menu__main-ul{
white-space: nowrap !important;
}
.bnet_header_menu_mob li.awb-menu__main-li,
.bnet_submenu_mob li.awb-menu__main-li{
flex: 0 0 auto !important;
}
.bnet_header_menu_mob .menu-text,
.bnet_submenu_mob .menu-text{
line-height: 1.1 !important;
}
}
/* ==========================================================================
HEADER – Mobile only: HARD lock layout (containers + menus)
Prevents menu drop-in / reflow
Breakpoint: ≤767
========================================================================== */
@media (max-width: 767px){
/* --------------------------------------------------
HEADER CONTAINERS (lock vertical space early)
-------------------------------------------------- */
.fusion-header,
.fusion-header-wrapper{
min-height: 132px !important; /* header total height */
}
/* Header rows / columns that contain menus */
.fusion-header .fusion-builder-row,
.fusion-header .fusion-layout-column{
min-height: 120px !important;
}
/* --------------------------------------------------
MAIN RESSORT MENU SLOT
-------------------------------------------------- */
.bnet_header_menu_mob{
height: 35px !important;
min-height: 35px !important;
max-height: 35px !important;
}
/* --------------------------------------------------
SUBMENU SLOT
-------------------------------------------------- */
.bnet_submenu_mob{
height: 28px !important;
min-height: 28px !important;
max-height: 28px !important;
}
/* --------------------------------------------------
STABILITY RULES (no wrap, no flex reflow)
-------------------------------------------------- */
.bnet_header_menu_mob ul.awb-menu__main-ul,
.bnet_submenu_mob ul.awb-menu__main-ul{
white-space: nowrap !important;
}
.bnet_header_menu_mob li.awb-menu__main-li,
.bnet_submenu_mob li.awb-menu__main-li{
flex: 0 0 auto !important;
}
.bnet_header_menu_mob .menu-text,
.bnet_submenu_mob .menu-text{
line-height: 1.1 !important;
}
}
/* ==========================================================================
BORNHEIM.NET – POSTCARDS
Mobile: Scrollbar nur visuell ausblenden
(Hero2 + Sexy)
========================================================================== */
@media (max-width: 767px){
.bnet_hero2_mob::-webkit-scrollbar,
.bnet_sexy_mob::-webkit-scrollbar{
display: none !important;
}
.bnet_hero2_mob,
.bnet_sexy_mob{
scrollbar-width: none !important; /* Firefox */
-ms-overflow-style: none !important; /* Edge / IE */
}
}
/* ==========================================================================
WPDISCUZ
WPDISCUZ
WPDISCUZ
========================================================================== */
#wpdcom .wpd-thread-head .wpd-thread-info{
font-family: "Lato Local", "Lato", Arial, sans-serif !important;
color: #555555;
padding-top: 5px;
padding-right: 15px;
padding-bottom: 3px;
padding-left: 5px;
font-weight: 600;
margin-bottom: -2px;
font-size: 14px;
letter-spacing: 1px;
text-transform: uppercase;
text-align: left;
line-height: 24px;
}
#comments #wpdcom span, #wpdcom span {
font-family: "Lato Regular Local", "Lato", Arial, sans-serif !important;
display: inline;
letter-spacing: inherit;
text-transform: none;
font-size: 1em;
}
#wpdcom .wpd-auth .wpd-login {
font-family: "Lato Regular Local", "Lato", Arial, sans-serif !important;
font-size: 12px !important;
line-height: 20px;
}
#wpdcom .wpd-blog-post_author .wpd-comment-author a {
color: #212934 !important;
font-family: "Lato Regular Local", "Lato", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 600 !important;
line-height: 18px !important;
}
#wpdcom .wpd-blog-post_author .wpd-comment-label {
color: #ffffff;
background-color: #1a1f87 !important;
border: none;
}
#wpdcom .wpd-blog-post_author .wpd-comment-label {
color: #ffffff;
font-family: "Lato Regular Local", "Lato", Arial, sans-serif !important;
font-size: 11px !important;
font-weight: 500 !important;
text-transform: uppercase !important;
}
#wpdcom .wpd-comment-header {
font-family: "Lato Regular Local", "Lato", Arial, sans-serif !important;
font-size: 13px !important;
color: #999999 !important;
}
/* ==========================================================================
SCHNAPPSCHUSS 2.0 ENHANCED FEATURES
SCHNAPPSCHUSS 2.0 ENHANCED FEATURES
SCHNAPPSCHUSS 2.0 ENHANCED FEATURES
Desktop Titel: bnet_schnappschuss_title_desk
Tablet Titel: bnet_schnappschuss_title_tab
Mobile Titel: bnet_schnappschuss_title_mob
Desktop Credit: bnet_schnappschuss_credit_desk
Tablet Credit: bnet_schnappschuss_credit_tab
Mobile Credit: bnet_schnappschuss_credit_mob
========================================================================== */
/* ======================================================================
DESKTOP (>=1025px)
====================================================================== */
@media (min-width: 1025px){
.bnet_schnappschuss_title_desk{
font-family: "Bebas Local", sans-serif !important;
font-size: 13px !important;
line-height: 13px !important;
font-weight: 400 !important;
color: #212934 !important;
letter-spacing: 1px !important;
text-transform: none !important;
margin-top: 2px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
.bnet_schnappschuss_credit_desk{
font-family: "Inter Local", sans-serif !important;
font-size: 9px !important;
line-height: 9px !important;
font-weight: 400 !important;
color: #212934 !important;
letter-spacing: 0px !important;
text-transform: none !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
/* ======================================================================
TABLET (768px–1024px)
====================================================================== */
@media (min-width: 768px) and (max-width: 1024px){
.bnet_schnappschuss_title_tab{
font-family: "Bebas Local", sans-serif !important;
font-size: 12px !important;
line-height: 12px !important;
font-weight: 400 !important;
color: #212934 !important;
letter-spacing: 0px !important;
text-transform: none !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
.bnet_schnappschuss_credit_tab{
font-family: "Inter Local", sans-serif !important;
font-size: 9px !important;
line-height: 9px !important;
font-weight: 400 !important;
color: #212934 !important;
letter-spacing: 0px !important;
text-transform: none !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
/* ======================================================================
MOBILE (<=767px)
====================================================================== */
@media (max-width: 767px){
.bnet_schnappschuss_title_mob{
font-family: "Bebas Local", sans-serif !important;
font-size: 12px !important;
line-height: 12px !important;
font-weight: 400 !important;
color: #212934 !important;
letter-spacing: 0px !important;
text-transform: none !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
.bnet_schnappschuss_credit_mob{
font-family: "Inter Local", sans-serif !important;
font-size: 9px !important;
line-height: 9px !important;
font-weight: 400 !important;
color: #212934 !important;
letter-spacing: 0px !important;
text-transform: none !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
/* ==========================================================================
GRAVITY FORMS
GRAVITY FORMS
GRAVITY FORMS
========================================================================== */
/* ==========================================================================
Contact Form Font Styles
========================================================================== */
.bnet_formulare_header{
font-family: "Inter Local", sans-serif !important;
font-size: 18px !important;
line-height: 26px !important;
font-weight: 400 !important;
color: #212934 !important;
letter-spacing: 0px !important;
text-transform: uppercase !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
@media (max-width: 767px){
.bnet_formulare_header{
font-family: "Inter Local", sans-serif !important;
font-size: 15px !important;
line-height: 18px !important;
font-weight: 400 !important;
color: #212934 !important;
letter-spacing: 0px !important;
text-transform: uppercase !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
.bnet_formulare_sub{
font-family: "Lato Regular Local", sans-serif !important;
font-size: 12px !important;
line-height: 12px !important;
font-weight: 400 !important;
color: #212934 !important;
letter-spacing: 0px !important;
text-transform: none !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
.gform_wrapper.bnet-required_wrapper {
--gf-form-gap-y: 1.25em;
}
.gform-theme.gform-theme--framework.gform_wrapper .button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper .gform-theme-button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper :where(:not(.mce-splitbtn)) > button:not([id*="mceu_"]):not(.mce-open):where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper button.button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper input:is([type="submit"], [type="button"], [type="reset"]).button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper input:is([type="submit"], [type="button"], [type="reset"]):where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper input[type="submit"].button.gform_button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)) {
--gf-local-bg-color: #212934 !important;
}
.gform_wrapper .gfield_description {
font-size: 10px !important;
text-transform: uppercase !important;
}
/* ==========================================================================
GF – FORM HEADER / SUBHEADER
Kill ALL spacing (margin, padding, line-height, baseline quirks)
========================================================================== */
/* ==========================================================================
GF – FORM HEADER / SUBHEADER (spacing deterministic)
========================================================================== */
.bnet_formulare_header{
display: block !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
line-height: 26px !important; /* passend zu deiner Header-size */
}
.bnet_formulare_sub{
display: block !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
line-height: 12px !important; /* oder z.B. 14px, wenn Sub kleiner ist */
}
/*
Luft killen */
.bnet_formulare_header + br,
.bnet_formulare_sub + br{
display: none !important;
}
/* ==========================================================================
Contact Form Error Styles
========================================================================== */
.gform_wrapper div.validation_error {
color: #B20000 !important;
font-size: 12px !important;
font-weight: normal !important;
margin-bottom: 0px !important;
margin-top: 0px !important;
text-align: left !important;
border: 0px solid #B20000 !important;
padding: 5px 5px 5px 5px !important;
background-color: rgba(255, 255, 255, 0) !important;
}
.gform_wrapper .gfield_error .gfield_label,
.gform_wrapper .validation_message {
color: #B20000 !important;
font-weight: normal !important;
margin-top: 10px !important;
border: 0px solid #B20000 !important;
}
.gform_wrapper .gform_validation_errors {
position: relative;
padding: 0px !important;
border-radius: 5px !important;
margin-bottom: 15px !important;
text-shadow: none;
border: 0px solid #B20000 !important;
autofocus: none !important;
}
body .gform_wrapper .gform_validation_errors {
background: #FFFFFF !important;
border: 0px solid #65a9cb !important;
}
/* Changing background and border of error div under field */
body .gform_wrapper .gfield_validation_message,
body .gform_wrapper .validation_message {
font-size: 11px !important;
font-weight: 500 !important;
background: #E2E2E2 !important;
border: 1px solid #9c0000 !important;
padding: 5px 5px 5px 5px !important;
}
form#gform_1 input#gform_submit_button_1 {
background: #638994 !important;
}
form#gform_12 input#gform_submit_button_12 {
background: #124a31 !important;
}
#gform_wrapper_1.gform-theme.gform-theme--orbital {
--gf-ctrl-border-color: #124a31 !important;
--gf-ctrl-border-color-focus: #000000 !important; /* beim Fokussieren */
}
#gform_wrapper_12.gform-theme.gform-theme--orbital {
--gf-ctrl-border-color: #124a31 !important;
}
/* ==========================================================================
Contact Form ONFOCUS BORDERS
========================================================================== */
.gform_wrapper .gform_body input[type=text]:focus {
outline: 2px solid #1a1f87;
outline-offset: -2px;
}
.gform_wrapper .gform_body input[type=email]:focus {
outline: 2px solid #1a1f87;
outline-offset: -2px;
}
.gform_wrapper .gform_body input[type=tel]:focus {
outline: 2px solid #1a1f87;
outline-offset: -2px;
}
.gform_wrapper .gform_body input[type=radio]:focus {
outline: 2px solid #1a1f87;
outline-offset: -2px;
}
.gform_wrapper .gform_body input[type=checkbox]:focus {
outline: 2px solid #1a1f87;
outline-offset: -2px;
}
.gform_wrapper .gform_body input[type=url]:focus {
outline: 2px solid #1a1f87;
outline-offset: -2px;
}
/* Radio & Checkbox aktiv einfärben */
#gform_wrapper_1 input[type="radio"]:checked,
#gform_wrapper_1 input[type="checkbox"]:checked {
border-color: #1a1f87 !important;
background-color: #e0eaec !important; /* ersetzt das hässliche Blau */
}
#gform_wrapper_1.gform-theme.gform-theme--orbital {
/* Text- und Placeholder-Farben */
--gf-ctrl-text-color: #181715 !important; /* normaler Eingabetext */
--gf-ctrl-placeholder-color: #82979C !important; /* Platzhalter leicht grau */
}
/* Eingabetext dunkler */
.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper textarea,
.gform_wrapper select {
color: #181715 !important;
}
/* Placeholder etwas heller */
.gform_wrapper ::placeholder {
color: #82979C !important;
opacity: 1;
}
/* ==== GK Fix – URL field text dark + 2px border ==== */
.gform_wrapper.gform-theme--orbital input[type="url"],
.gform_wrapper.gform-theme--orbital input[type="url"]:focus,
.gform_wrapper.gform-theme--orbital input[type="url"]:active {
color: #1a1f87 !important;
-webkit-text-fill-color: #1a1f87 !important;
caret-color: #1a1f87 !important;
background-color: #ffffff !important;
border: 2px solid #638994 !important; /* dauerhafte GK-Border */
border-radius: 6px !important;
outline: none !important;
box-shadow: none !important; /* kein Autofill-Schimmer */
transition: border-color 0.2s ease;
}
/* Hover etwas heller, Fokus leicht betont */
.gform_wrapper.gform-theme--orbital input[type="url"]:hover {
border-color: #1a1f87 !important;
}
.gform_wrapper.gform-theme--orbital input[type="url"]:focus {
border-color: #1a1f87 !important;
box-shadow: 0 0 0 2px rgba(99,137,148,0.25) !important;
}
/* Placeholder sichtbar */
.gform_wrapper.gform-theme--orbital input[type="url"]::placeholder {
color: #82979C !important;
opacity: 1 !important;
}
/* Chrome/Edge Autofill Fix */
.gform_wrapper.gform-theme--orbital input[type="url"]:-webkit-autofill,
.gform_wrapper.gform-theme--orbital input[type="url"]:-webkit-autofill:focus {
-webkit-text-fill-color: #1a1f87 !important;
box-shadow: 0 0 0px 1000px #ffffff inset !important;
background-color: #ffffff !important;
transition: background-color 5000s ease-in-out 0s !important;
}
/* ==== GK Fix – URL field: normal clean, 2px border on focus ==== */
.gform_wrapper.gform-theme--orbital input[type="url"] {
color: #1a1f87 !important;
-webkit-text-fill-color: #1a1f87 !important;
caret-color: #1a1f87 !important;
background-color: #ffffff !important;
/* Normalzustand: feine Linie */
border: 1px solid #E0EAEC !important;
border-radius: 6px !important;
outline: none !important;
box-shadow: none !important;
transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
/* Hover: leicht absetzen */
.gform_wrapper.gform-theme--orbital input[type="url"]:hover {
border-color: #1a1f87 !important;
}
/* Fokus: kräftige 2px GK-Border + sanfter Glow */
.gform_wrapper.gform-theme--orbital input[type="url"]:focus {
border: 2px solid #1a1f87 !important;
box-shadow: 0 0 0 2px rgba(99,137,148,0.25) !important;
}
/* Placeholder */
.gform_wrapper.gform-theme--orbital input[type="url"]::placeholder {
color: #82979C !important;
opacity: 1 !important;
}
/* Chrome/Edge Autofill Fix */
.gform_wrapper.gform-theme--orbital input[type="url"]:-webkit-autofill,
.gform_wrapper.gform-theme--orbital input[type="url"]:-webkit-autofill:focus {
-webkit-text-fill-color: #1a1f87 !important;
box-shadow: 0 0 0px 1000px #ffffff inset !important;
background-color: #ffffff !important;
transition: background-color 5000s ease-in-out 0s !important;
}
/* ===== GK Pflichtfeld-Asterisk Fix (alle Varianten) ===== */
/* A) Orbital Variable */
.gform_wrapper.gform-theme--orbital {
--gf-required-indicator-color: #B20000 !important;
}
/* B) Alle möglichen Asterisk-Selektoren */
.gform_wrapper .gfield_required,
.gform_wrapper .gfield_label .gfield_required,
.gform_wrapper .gfield_required_asterisk,
.gform_wrapper .gfield_label .gfield_required_asterisk,
.gform_wrapper abbr[title="required"] {
color: #B20000 !important;
opacity: 1 !important;
text-decoration: none !important;
font-weight: 700 !important;
font-size: 22px !important;
line-height: 1 !important;
}
/* C) Fallback – Stern erzwingen, falls GF ihn gar nicht rendert */
.gform_wrapper .gfield--required .gfield_label::after {
content: " *";
color: #B20000 !important;
font-weight: 700 !important;
font-size: 22px !important;
line-height: 1 !important;
margin-left: 0px;
}
.gform_required_legend {
display: none !important;
}
/* ===== GK Formular-Kopf mit Dotted Line ===== */
.gk-formhead {
position: relative;
display: block;
width: 100%;
margin: 0 0 14px; /* Abstand zum nächsten Feld */
padding-bottom: 10px; /* Platz für Linie */
}
/* Linie am unteren Rand */
.gk-formhead::after {
content: "";
display: block;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
border-bottom: 1px dotted #000000; /* deine GK-Farbe */
}
.gform_ajax_spinner {
position: absolute !important;
padding-left: 150px !important;
}
.gform_wrapper.gk-contact_wrapper {
--gf-form-gap-y: 1.25em;
}
/* ==========================================================================
GRAVITY FORMS – FONT OVERRIDE (Labels + Inputs)
- Ziel: Labels + Eingabefelder bekommen eine feste Schrift
- Buttons bleiben unberuehrt
- Orbital/GF Token-System: wir zwingen "inherit" fuer Stabilitaet
========================================================================== */
.gform_wrapper{
font-family: "Lato Regular Local", system-ui, sans-serif !important;
}
/* Labels + Hilfe/Descriptions + Validation */
.gform_wrapper .gfield_label,
.gform_wrapper .gform-field-label,
.gform_wrapper .gfield_description,
.gform_wrapper .gform_description,
.gform_wrapper .validation_message,
.gform_wrapper .gfield_validation_message,
.gform_wrapper .gform_validation_errors,
.gform_wrapper div.validation_error{
font-family: inherit !important;
}
/* Inputs (Text, Email, Tel, URL, Select, Textarea, usw.) */
.gform_wrapper input,
.gform_wrapper select,
.gform_wrapper textarea{
font-family: inherit !important;
}
/* Checkbox/Radio Labels (die ziehen gern eigene Fonts) */
.gform_wrapper .gfield_checkbox label,
.gform_wrapper .gfield_radio label,
.gform_wrapper .gchoice label{
font-family: inherit !important;
}
/* Placeholder ebenfalls auf gleiche Schrift */
.gform_wrapper ::placeholder{
font-family: inherit !important;
}
/* ==========================================================================
Bornheim.Net – Multilang Tabs: Font Sizes by Viewport
Class: bnet_mulitilang_tabs
========================================================================== */
/* Mobile */
@media (max-width: 767px){
.bnet_mulitilang_tabs.fusion-tabs .nav-tabs li .fusion-tab-heading{
font-size: 12px;
}
}
/* Tablet */
@media (min-width: 768px) and (max-width: 1024px){
.bnet_mulitilang_tabs.fusion-tabs .nav-tabs li .fusion-tab-heading{
font-size: 16px;
}
}
/* Desktop */
@media (min-width: 1025px){
.bnet_mulitilang_tabs.fusion-tabs .nav-tabs li .fusion-tab-heading{
font-size: 20px;
}
}
/* ==========================================================================
UTILITY PAGES
UTILITY PAGES
UTILITY PAGES
========================================================================== */
/* ==========================================================================
Font Styles
========================================================================== */
.bnet_utility_header{
font-family: "Inter Local", sans-serif !important;
font-size: 22px !important;
line-height: 28px !important;
font-weight: 400 !important;
color: #212934 !important;
letter-spacing: 0px !important;
text-transform: uppercase !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
@media (max-width: 767px){
.bnet_utility_header{
font-family: "Inter Local", sans-serif !important;
font-size: 20px !important;
line-height: 24px !important;
font-weight: 400 !important;
color: #212934 !important;
letter-spacing: 0px !important;
text-transform: uppercase !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
.bnet_utility_sub{
font-family: "Lato Regular Local", sans-serif !important;
font-size: 16px !important;
line-height: 24px !important;
font-weight: 400 !important;
color: #212934 !important;
letter-spacing: 0px !important;
text-transform: none !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
.bnet_utility_txt{
font-family: "Lato Regular Local", sans-serif !important;
font-size: 14px !important;
line-height: 18px !important;
font-weight: 400 !important;
color: #212934 !important;
letter-spacing: 0px !important;
text-transform: none !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* ==========================================================================
BORNHEIM.NET – DIREKT & UMFRAGE BADGES (HTML + CSS)
LARGE (scoped to .bnet_badge_slot_large only)
========================================================================== */
/* -------------------------------- */
/* BADGE BASE */
/* -------------------------------- */
.bnet_badge_slot_large .bnet_badge{
display: inline-flex !important;
flex-direction: row !important;
align-items: center !important;
justify-content: center !important;
font-family: "Bebas Local", "Bebas Neue", Arial, sans-serif !important;
font-weight: 800 !important;
text-transform: uppercase !important;
white-space: nowrap !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
border-top-width: 0px !important;
border-right-width: 0px !important;
border-bottom-width: 0px !important;
border-left-width: 0px !important;
}
/* -------------------------------- */
/* SIZE: LARGE (MAX – ehemals SMALL) */
/* -------------------------------- */
.bnet_badge_slot_large .bnet_badge_large{
height: 16px !important;
min-height: 16px !important;
padding-top: 0px !important;
padding-right: 7px !important;
padding-bottom: 0px !important;
padding-left: 7px !important;
border-radius: 3px !important;
font-size: 9px !important;
letter-spacing: 0.8px !important;
}
/* -------------------------------- */
/* TYPES / COLORS */
/* -------------------------------- */
.bnet_badge_slot_large .bnet_badge_direkt{
background-color: #8a2834 !important;
color: #ffffff !important;
}
.bnet_badge_slot_large .bnet_badge_umfrage{
background-color: #1a1f87 !important;
color: #ffffff !important;
}
/* -------------------------------- */
/* SLOT FIX (nebeneinander, stabil) */
/* -------------------------------- */
.bnet_badge_slot_large{
display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
align-items: center !important;
justify-content: flex-start !important;
gap: 6px !important;
height: 16px !important;
min-height: 16px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 6px !important;
margin-left: 0px !important;
}
/* -------------------------------- */
/* AVADA / WP ABSICHERUNG */
/* -------------------------------- */
.bnet_badge_slot_large p{
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
}
.bnet_badge_slot_large br{
display: none !important;
}
/* -------------------------------- */
/* BADGE SPACING HACK */
/* -------------------------------- */
.bnet_badge_slot_large .bnet_badge{
margin-right: 6px !important;
}
.bnet_badge_slot_large > .bnet_badge:last-child{
margin-right: 0px !important;
}
/* -------------------------------- */
/* FONT RESPONSIVE */
/* -------------------------------- */
/* Desktop & Tablet: Inter */
@media (min-width: 769px){
.bnet_badge_slot_large .bnet_badge{
font-family: "Inter Local", Inter, Arial, sans-serif !important;
letter-spacing: 0.6px !important;
font-weight: 700 !important;
}
}
/* Mobile: Bebas */
@media (max-width: 768px){
.bnet_badge_slot_large .bnet_badge{
font-family: "Bebas Local", "Bebas Neue", Arial, sans-serif !important;
letter-spacing: 1.2px !important;
font-weight: 400 !important;
}
}
/* ==========================================================================
BORNHEIM.NET – DIREKT & UMFRAGE BADGES (HTML + CSS)
SMALL (scoped to .bnet_badge_slot_small only)
========================================================================== */
/* -------------------------------- */
/* BADGE BASE */
/* -------------------------------- */
.bnet_badge_slot_small .bnet_badge{
display: inline-flex !important;
flex-direction: row !important;
align-items: center !important;
justify-content: center !important;
font-family: "Bebas Local", "Bebas Neue", Arial, sans-serif !important;
font-weight: 800 !important;
text-transform: uppercase !important;
white-space: nowrap !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
border-top-width: 0px !important;
border-right-width: 0px !important;
border-bottom-width: 0px !important;
border-left-width: 0px !important;
}
/* -------------------------------- */
/* SIZE: SMALL */
/* -------------------------------- */
.bnet_badge_slot_small .bnet_badge_small{
height: 16px !important;
min-height: 16px !important;
padding-top: 0px !important;
padding-right: 7px !important;
padding-bottom: 0px !important;
padding-left: 7px !important;
border-radius: 3px !important;
font-size: 8px !important;
letter-spacing: 0.8px !important;
}
/* -------------------------------- */
/* TYPES / COLORS */
/* -------------------------------- */
.bnet_badge_slot_small .bnet_badge_direkt{
background-color: #8a2834 !important;
color: #ffffff !important;
}
.bnet_badge_slot_small .bnet_badge_umfrage{
background-color: #1a1f87 !important;
color: #ffffff !important;
}
/* -------------------------------- */
/* SLOT FIX (nebeneinander, stabil) */
/* -------------------------------- */
.bnet_badge_slot_small{
display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
align-items: center !important;
justify-content: flex-start !important;
gap: 6px !important;
height: 16px !important;
min-height: 16px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 6px !important;
margin-left: 0px !important;
}
/* -------------------------------- */
/* AVADA / WP ABSICHERUNG */
/* -------------------------------- */
.bnet_badge_slot_small p{
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
}
.bnet_badge_slot_small br{
display: none !important;
}
/* -------------------------------- */
/* BADGE SPACING HACK */
/* -------------------------------- */
.bnet_badge_slot_small .bnet_badge{
margin-right: 6px !important;
}
.bnet_badge_slot_small > .bnet_badge:last-child{
margin-right: 0px !important;
}
/* -------------------------------- */
/* FONT RESPONSIVE */
/* -------------------------------- */
/* Desktop & Tablet: Inter */
@media (min-width: 769px){
.bnet_badge_slot_small .bnet_badge{
font-family: "Inter Local", Inter, Arial, sans-serif !important;
font-size: 10px !important;
letter-spacing: 0.6px !important;
font-weight: 700 !important;
}
}
/* Mobile: Bebas */
@media (max-width: 768px){
.bnet_badge_slot_small .bnet_badge{
font-family: "Bebas Local", "Bebas Neue", Arial, sans-serif !important;
font-size: 8px !important;
letter-spacing: 1.2px !important;
font-weight: 400 !important;
}
}
/* ==========================================================================
BORNHEIM.NET – CATEGORY BADGE (SMALL) = LOOKS LIKE NORMAL META CATEGORY
Scope: .bnet_badge_slot_small
Nur Kategorie-Badge neutralisieren – Direkt/Poll bleibt unberührt
========================================================================== */
.bnet_badge_slot_small .bnet_badge_kat.bnet_badge_small{
/* wie normale Meta-Typo */
font-family: inherit !important;
font-size: 10px !important;
font-weight: inherit !important;
letter-spacing: inherit !important;
text-transform: inherit !important;
line-height: inherit !important;
/* keine Badge-Optik */
background-color: transparent !important;
color: inherit !important;
padding-top: 0px !important;
padding-right: px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
margin-top: 0px !important;
margin-right: 5px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
border-top-width: 0px !important;
border-right-width: 0px !important;
border-bottom-width: 0px !important;
border-left-width: 0px !important;
border-top-left-radius: 0px !important;
border-top-right-radius: 0px !important;
border-bottom-right-radius: 0px !important;
border-bottom-left-radius: 0px !important;
box-shadow: none !important;
/* sicherstellen, dass es wie Text wirkt */
display: inline !important;
}
@media (max-width: 768px){
.bnet_badge_slot_small .bnet_badge_kat.bnet_badge_small{
font-size: 8px !important;
}
}
/* ==========================================================================
DER BORNHEIMER - PhotoSwipe / Responsive Lightbox above Avada Header
========================================================================== */
.pswp {
z-index: 30000 !important;
}
.pswp__bg,
.pswp__scroll-wrap,
.pswp__ui {
z-index: 30000 !important;
}
/* ==========================================================================
Service Pages Font Styles
========================================================================== */
.bnet_service_header{
font-family: "Inter Local", sans-serif !important;
font-size: 20px !important;
line-height: 26px !important;
font-weight: 500 !important;
color: #212934 !important;
letter-spacing: 0px !important;
text-transform: uppercase !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
@media (max-width: 767px){
.bnet_service_header{
font-family: "Inter Local", sans-serif !important;
font-size: 18px !important;
line-height: 24px !important;
font-weight: 500 !important;
color: #212934 !important;
letter-spacing: 0px !important;
text-transform: uppercase !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
.bnet_service_intermediate{
font-family: "Inter Local", sans-serif !important;
font-size: 16px !important;
line-height: 20px !important;
font-weight: 400 !important;
color: #212934 !important;
letter-spacing: 0px !important;
text-transform: uppercase !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
@media (max-width: 767px){
.bnet_service_intermediate{
font-family: "Inter Local", sans-serif !important;
font-size: 14px !important;
line-height: 18px !important;
font-weight: 400 !important;
color: #212934 !important;
letter-spacing: 0px !important;
text-transform: uppercase !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
.bnet_service_sub{
font-family: "Lato Regular Local", sans-serif !important;
font-size: 16px !important;
line-height: 16px !important;
font-weight: 500 !important;
color: #212934 !important;
letter-spacing: 0px !important;
text-transform: none !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
.bnet_service_mini{
font-family: "Lato Regular Local", sans-serif !important;
font-size: 11px !important;
line-height: 11px !important;
font-weight: 400 !important;
color: #212934 !important;
letter-spacing: 0px !important;
text-transform: none !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* ==========================================================================
BNET – Utility Divider Arrow (Start ▼ / End ▲) – OUTLINE (sichtbar, nicht gefüllt)
For Avada Divider
Line Color: #1a1a1a
Page Background: #f5f7f8
========================================================================== */
.bnet_content_start,
.bnet_content_end{
position: relative;
overflow: visible;
}
/* Linie */
.bnet_content_start .fusion-separator-border,
.bnet_content_end .fusion-separator-border{
height: 1px;
background-color: #1a1a1a;
position: relative;
z-index: 1;
}
/* =========================
START ▼ (Outline)
========================= */
/* Outer triangle (line color) */
.bnet_content_start::after{
content: "";
position: absolute;
left: 50%;
top: 0px;
transform: translateX(-50%);
width: 0;
height: 0;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 6px solid #1a1a1a;
z-index: 3;
pointer-events: none;
}
/* Inner triangle (page bg) -> makes it "hollow/outline" */
.bnet_content_start::before{
content: "";
position: absolute;
left: 50%;
top: 1px;
transform: translateX(-50%);
width: 0;
height: 0;
border-left: 4px solid transparent;
border-right: 4px solid transparent;
border-top: 4px solid #f5f7f8;
z-index: 4;
pointer-events: none;
}
/* =========================
END ▲ (Outline)
========================= */
/* Outer triangle (line color) */
.bnet_content_end::after{
content: "";
position: absolute;
left: 50%;
bottom: 0px;
transform: translateX(-50%);
width: 0;
height: 0;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-bottom: 6px solid #1a1a1a;
z-index: 3;
pointer-events: none;
}
/* Inner triangle (page bg) */
.bnet_content_end::before{
content: "";
position: absolute;
left: 50%;
bottom: 1px;
transform: translateX(-50%);
width: 0;
height: 0;
border-left: 4px solid transparent;
border-right: 4px solid transparent;
border-bottom: 4px solid #f5f7f8;
z-index: 4;
pointer-events: none;
}
.bnet_square{
vertical-align: top !important;
}
.bnet_square img{
margin-top: 6px !important; /* Feintuning */
}
/* ==========================================================================
START SUBMENU
START SUBMENU
START SUBMENU
START SUBMENU
========================================================================== */
/* --------------------------------------------------------------------------
BASE – reset + typography (all devices)
-------------------------------------------------------------------------- */
.bnet_submenu_desk,
.bnet_submenu_tab,
.bnet_submenu_mob{
width: 100% !important;
}
.bnet_submenu_desk nav.awb-menu,
.bnet_submenu_tab nav.awb-menu,
.bnet_submenu_mob nav.awb-menu{
--awb-items-padding-top: 0px !important;
--awb-items-padding-bottom: 0px !important;
}
.bnet_submenu_desk ul.awb-menu__main-ul,
.bnet_submenu_tab ul.awb-menu__main-ul,
.bnet_submenu_mob ul.awb-menu__main-ul{
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
list-style: none !important;
}
.bnet_submenu_desk li.awb-menu__main-li,
.bnet_submenu_tab li.awb-menu__main-li,
.bnet_submenu_mob li.awb-menu__main-li{
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* Links (BASE: only horizontal padding; vertical is set per breakpoint) */
.bnet_submenu_desk a.awb-menu__main-a,
.bnet_submenu_tab a.awb-menu__main-a,
.bnet_submenu_mob a.awb-menu__main-a{
display: inline-block !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 10px !important;
padding-bottom: 0px !important;
padding-left: 10px !important;
text-decoration: none !important;
}
/* Font (Lato Local) + default color */
.bnet_submenu_desk .menu-text,
.bnet_submenu_tab .menu-text,
.bnet_submenu_mob .menu-text{
font-family: "Lato Regular Local", Arial, Helvetica, sans-serif !important;
font-weight: 400 !important;
letter-spacing: 0px !important;
text-transform: none !important;
color: #212934 !important;
}
/* No motion */
.bnet_submenu_desk *,
.bnet_submenu_tab *,
.bnet_submenu_mob *{
transition: none !important;
animation: none !important;
}
/* --------------------------------------------------------------------------
DESKTOP (≥1024px) – static, RIGHT aligned
-------------------------------------------------------------------------- */
@media (min-width: 1024px){
.bnet_submenu_desk ul.awb-menu__main-ul{
display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
justify-content: flex-end !important;
align-items: center !important;
white-space: nowrap !important;
column-gap: 0px !important;
}
.bnet_submenu_desk li.awb-menu__main-li{
display: inline-flex !important;
align-items: center !important;
}
.bnet_submenu_desk .menu-text{
font-size: 12px !important;
line-height: 12px !important;
}
.bnet_submenu_desk a.awb-menu__main-a{
padding-top: 0px !important;
padding-right: 10px !important;
padding-bottom: 0px !important;
padding-left: 10px !important;
}
}
/* --------------------------------------------------------------------------
TABLET (768–1023px) – static, RIGHT aligned
-------------------------------------------------------------------------- */
@media (min-width: 768px) and (max-width: 1023px){
.bnet_submenu_tab ul.awb-menu__main-ul{
display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
justify-content: flex-end !important;
align-items: center !important;
white-space: nowrap !important;
column-gap: 0px !important;
}
.bnet_submenu_tab li.awb-menu__main-li{
display: inline-flex !important;
align-items: center !important;
}
.bnet_submenu_tab .menu-text{
font-size: 12px !important;
line-height: 12px !important;
}
.bnet_submenu_tab a.awb-menu__main-a{
padding-top: 0px !important;
padding-right: 10px !important;
padding-bottom: 0px !important;
padding-left: 10px !important;
}
}
/* --------------------------------------------------------------------------
MOBILE (≤767px) – horizontal scroll rail (no separators)
-------------------------------------------------------------------------- */
@media (max-width: 767px){
.bnet_submenu_mob ul.awb-menu__main-ul{
display: block !important;
overflow-x: auto !important;
overflow-y: hidden !important;
white-space: nowrap !important;
-webkit-overflow-scrolling: touch !important;
padding-top: 0px !important;
padding-right: 12px !important;
padding-bottom: 0px !important;
padding-left: 12px !important;
}
.bnet_submenu_mob li.awb-menu__main-li{
display: inline-flex !important;
align-items: center !important;
vertical-align: middle !important;
}
.bnet_submenu_mob .menu-text{
font-size: 10px !important;
line-height: 10px !important;
}
.bnet_submenu_mob a.awb-menu__main-a{
padding-top: 8px !important;
padding-right: 11px !important;
padding-bottom: 8px !important;
padding-left: 5px !important;
}
.bnet_submenu_mob ul.awb-menu__main-ul::-webkit-scrollbar{
height: 0px !important;
}
}
/* --------------------------------------------------------------------------
HOVER + CURRENT – Lato rules (NO underline)
-------------------------------------------------------------------------- */
/* Base links */
.bnet_submenu_desk a.awb-menu__main-a,
.bnet_submenu_tab a.awb-menu__main-a,
.bnet_submenu_mob a.awb-menu__main-a{
color: inherit !important;
}
/* Not-current: lighter default (only menu text) */
.bnet_submenu_desk li:not(.current-menu-item):not(.current-menu-ancestor):not(.current_page_item):not(.current_page_ancestor) > a.awb-menu__main-a .menu-text,
.bnet_submenu_tab li:not(.current-menu-item):not(.current-menu-ancestor):not(.current_page_item):not(.current_page_ancestor) > a.awb-menu__main-a .menu-text,
.bnet_submenu_mob li:not(.current-menu-item):not(.current-menu-ancestor):not(.current_page_item):not(.current_page_ancestor) > a.awb-menu__main-a .menu-text{
color: #6b7280 !important;
font-family: "Lato Regular Local", Arial, Helvetica, sans-serif !important;
font-weight: 400 !important;
}
/* Hover: darker (color only, NO weight change) */
.bnet_submenu_desk a.awb-menu__main-a:hover .menu-text,
.bnet_submenu_tab a.awb-menu__main-a:hover .menu-text,
.bnet_submenu_mob a.awb-menu__main-a:hover .menu-text{
color: #212934 !important;
font-family: "Lato Regular Local", Arial, Helvetica, sans-serif !important;
font-weight: 400 !important;
}
/* Kill Avada green tap highlight on touch devices */
.bnet_submenu_tab a.awb-menu__main-a,
.bnet_submenu_mob a.awb-menu__main-a{
-webkit-tap-highlight-color: rgba(0,0,0,0) !important;
}
/* Tap/Press feedback (Tablet + Mobile): subtle press, no color change */
@media (hover: none){
.bnet_submenu_tab a.awb-menu__main-a:active .menu-text,
.bnet_submenu_mob a.awb-menu__main-a:active .menu-text{
background-color: rgba(0,0,0,0.06) !important;
transform: translateY(1px) !important;
color: inherit !important;
}
.bnet_submenu_tab a.awb-menu__main-a .menu-text,
.bnet_submenu_mob a.awb-menu__main-a .menu-text{
transition-property: background-color, transform !important;
transition-duration: 120ms !important;
transition-timing-function: ease-out !important;
border-top-left-radius: 3px !important;
border-top-right-radius: 3px !important;
border-bottom-right-radius: 3px !important;
border-bottom-left-radius: 3px !important;
padding-top: 0px !important;
padding-right: 2px !important;
padding-bottom: 0px !important;
padding-left: 2px !important;
}
}
/* Current (Black, Lato Bold Local) */
.bnet_submenu_desk li.current-menu-item > a.awb-menu__main-a .menu-text,
.bnet_submenu_desk li.current-menu-ancestor > a.awb-menu__main-a .menu-text,
.bnet_submenu_desk li.current_page_item > a.awb-menu__main-a .menu-text,
.bnet_submenu_desk li.current_page_ancestor > a.awb-menu__main-a .menu-text,
.bnet_submenu_tab li.current-menu-item > a.awb-menu__main-a .menu-text,
.bnet_submenu_tab li.current-menu-ancestor > a.awb-menu__main-a .menu-text,
.bnet_submenu_tab li.current_page_item > a.awb-menu__main-a .menu-text,
.bnet_submenu_tab li.current_page_ancestor > a.awb-menu__main-a .menu-text,
.bnet_submenu_mob li.current-menu-item > a.awb-menu__main-a .menu-text,
.bnet_submenu_mob li.current-menu-ancestor > a.awb-menu__main-a .menu-text,
.bnet_submenu_mob li.current_page_item > a.awb-menu__main-a .menu-text,
.bnet_submenu_mob li.current_page_ancestor > a.awb-menu__main-a .menu-text{
color: #000000 !important;
font-family: "Lato Bold Local", Arial, Helvetica, sans-serif !important;
font-weight: 700 !important;
background-color: transparent !important;
transform: none !important;
}
/* Safety: ensure no leftover underline pseudo-elements show up */
.bnet_submenu_desk .menu-text::after,
.bnet_submenu_tab .menu-text::after,
.bnet_submenu_mob .menu-text::after{
content: none !important;
}
/* ==========================================================================
SUBMENU – Mobile + Tablet
Hide horizontal scrollbar while keeping touch swipe
========================================================================== */
@media (max-width: 1023px){
.bnet_submenu_mob ul.awb-menu__main-ul,
.bnet_submenu_tab ul.awb-menu__main-ul{
scrollbar-width: none !important;
-ms-overflow-style: none !important;
}
.bnet_submenu_mob ul.awb-menu__main-ul::-webkit-scrollbar,
.bnet_submenu_tab ul.awb-menu__main-ul::-webkit-scrollbar{
height: 0px !important;
display: none !important;
}
}
/* ==========================================================================
SUBMENU – HARD RESET against global .awb-menu min-height (4em) culprit
Scope: ONLY submenu wrappers (.bnet_submenu_*)
Goal: force flat height on Desktop/Tablet, keep mobile rail intact
========================================================================== */
/* 1) Kill the variable on ANY awb-menu node inside submenu wrappers */
.bnet_submenu_desk .awb-menu,
.bnet_submenu_tab .awb-menu,
.bnet_submenu_mob .awb-menu,
.bnet_submenu_desk nav.awb-menu,
.bnet_submenu_tab nav.awb-menu,
.bnet_submenu_mob nav.awb-menu{
--awb-min-height: 0px !important;
}
/* 2) Kill any computed min-height that Avada may apply downstream */
.bnet_submenu_desk .awb-menu__main-ul,
.bnet_submenu_tab .awb-menu__main-ul,
.bnet_submenu_mob .awb-menu__main-ul,
.bnet_submenu_desk .awb-menu__main-li,
.bnet_submenu_tab .awb-menu__main-li,
.bnet_submenu_mob .awb-menu__main-li,
.bnet_submenu_desk a.awb-menu__main-a,
.bnet_submenu_tab a.awb-menu__main-a,
.bnet_submenu_mob a.awb-menu__main-a{
min-height: 0px !important;
height: auto !important;
}
/* 3) Desktop + Tablet: enforce “flat” row (no vertical padding/margins) */
@media (min-width: 768px){
.bnet_submenu_desk ul.awb-menu__main-ul,
.bnet_submenu_tab ul.awb-menu__main-ul{
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
.bnet_submenu_desk li.awb-menu__main-li,
.bnet_submenu_tab li.awb-menu__main-li{
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
.bnet_submenu_desk a.awb-menu__main-a,
.bnet_submenu_tab a.awb-menu__main-a{
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 10px !important;
padding-bottom: 0px !important;
padding-left: 10px !important;
}
.bnet_submenu_desk .menu-text,
.bnet_submenu_tab .menu-text{
line-height: 12px !important;
}
}
/* ==========================================================================
END SUBMENU
END SUBMENU
END SUBMENU
END SUBMENU
========================================================================== */
/* ==========================================================================
SUBMENU – FORCE "SHOP" CURRENT STATE ON WOOCOMMERCE PAGES
Reason: Woo pages/archives often do not apply current-menu-item to Shop link
Scope: submenu wrappers only
Target: links pointing to /shop/
========================================================================== */
/* Woo contexts where "Shop" should look current */
body.post-type-archive-product .bnet_submenu_desk a.awb-menu__main-a[href^="/shop"],
body.post-type-archive-product .bnet_submenu_tab a.awb-menu__main-a[href^="/shop"],
body.post-type-archive-product .bnet_submenu_mob a.awb-menu__main-a[href^="/shop"],
body.tax-product_cat .bnet_submenu_desk a.awb-menu__main-a[href^="/shop"],
body.tax-product_cat .bnet_submenu_tab a.awb-menu__main-a[href^="/shop"],
body.tax-product_cat .bnet_submenu_mob a.awb-menu__main-a[href^="/shop"],
body.tax-product_tag .bnet_submenu_desk a.awb-menu__main-a[href^="/shop"],
body.tax-product_tag .bnet_submenu_tab a.awb-menu__main-a[href^="/shop"],
body.tax-product_tag .bnet_submenu_mob a.awb-menu__main-a[href^="/shop"],
body.single-product .bnet_submenu_desk a.awb-menu__main-a[href^="/shop"],
body.single-product .bnet_submenu_tab a.awb-menu__main-a[href^="/shop"],
body.single-product .bnet_submenu_mob a.awb-menu__main-a[href^="/shop"],
body.woocommerce-cart .bnet_submenu_desk a.awb-menu__main-a[href^="/shop"],
body.woocommerce-cart .bnet_submenu_tab a.awb-menu__main-a[href^="/shop"],
body.woocommerce-cart .bnet_submenu_mob a.awb-menu__main-a[href^="/shop"],
body.woocommerce-checkout .bnet_submenu_desk a.awb-menu__main-a[href^="/shop"],
body.woocommerce-checkout .bnet_submenu_tab a.awb-menu__main-a[href^="/shop"],
body.woocommerce-checkout .bnet_submenu_mob a.awb-menu__main-a[href^="/shop"],
body.woocommerce-account .bnet_submenu_desk a.awb-menu__main-a[href^="/shop"],
body.woocommerce-account .bnet_submenu_tab a.awb-menu__main-a[href^="/shop"],
body.woocommerce-account .bnet_submenu_mob a.awb-menu__main-a[href^="/shop"],
body.woocommerce-order-received .bnet_submenu_desk a.awb-menu__main-a[href^="/shop"],
body.woocommerce-order-received .bnet_submenu_tab a.awb-menu__main-a[href^="/shop"],
body.woocommerce-order-received .bnet_submenu_mob a.awb-menu__main-a[href^="/shop"]{
color: inherit !important;
}
/* Apply your "Current" look to the Shop item */
body.post-type-archive-product .bnet_submenu_desk a.awb-menu__main-a[href^="/shop"] .menu-text,
body.post-type-archive-product .bnet_submenu_tab a.awb-menu__main-a[href^="/shop"] .menu-text,
body.post-type-archive-product .bnet_submenu_mob a.awb-menu__main-a[href^="/shop"] .menu-text,
body.tax-product_cat .bnet_submenu_desk a.awb-menu__main-a[href^="/shop"] .menu-text,
body.tax-product_cat .bnet_submenu_tab a.awb-menu__main-a[href^="/shop"] .menu-text,
body.tax-product_cat .bnet_submenu_mob a.awb-menu__main-a[href^="/shop"] .menu-text,
body.tax-product_tag .bnet_submenu_desk a.awb-menu__main-a[href^="/shop"] .menu-text,
body.tax-product_tag .bnet_submenu_tab a.awb-menu__main-a[href^="/shop"] .menu-text,
body.tax-product_tag .bnet_submenu_mob a.awb-menu__main-a[href^="/shop"] .menu-text,
body.single-product .bnet_submenu_desk a.awb-menu__main-a[href^="/shop"] .menu-text,
body.single-product .bnet_submenu_tab a.awb-menu__main-a[href^="/shop"] .menu-text,
body.single-product .bnet_submenu_mob a.awb-menu__main-a[href^="/shop"] .menu-text,
body.woocommerce-cart .bnet_submenu_desk a.awb-menu__main-a[href^="/shop"] .menu-text,
body.woocommerce-cart .bnet_submenu_tab a.awb-menu__main-a[href^="/shop"] .menu-text,
body.woocommerce-cart .bnet_submenu_mob a.awb-menu__main-a[href^="/shop"] .menu-text,
body.woocommerce-checkout .bnet_submenu_desk a.awb-menu__main-a[href^="/shop"] .menu-text,
body.woocommerce-checkout .bnet_submenu_tab a.awb-menu__main-a[href^="/shop"] .menu-text,
body.woocommerce-checkout .bnet_submenu_mob a.awb-menu__main-a[href^="/shop"] .menu-text,
body.woocommerce-account .bnet_submenu_desk a.awb-menu__main-a[href^="/shop"] .menu-text,
body.woocommerce-account .bnet_submenu_tab a.awb-menu__main-a[href^="/shop"] .menu-text,
body.woocommerce-account .bnet_submenu_mob a.awb-menu__main-a[href^="/shop"] .menu-text,
body.woocommerce-order-received .bnet_submenu_desk a.awb-menu__main-a[href^="/shop"] .menu-text,
body.woocommerce-order-received .bnet_submenu_tab a.awb-menu__main-a[href^="/shop"] .menu-text,
body.woocommerce-order-received .bnet_submenu_mob a.awb-menu__main-a[href^="/shop"] .menu-text{
color: #000000 !important;
font-family: "Lato Bold Local", Arial, Helvetica, sans-serif !important;
font-weight: 700 !important;
background-color: transparent !important;
transform: none !important;
}
/* ==========================================================================
START HEADER MENU
START HEADER MENU
START HEADER MENU
START HEADER MENU
========================================================================== */
/* ==========================================================================
Clone of Footer Menu: bnet_footer_menu_desk → bnet_header_menu_desk
Kill ONLY vertical spacing on
========================================================================== */
@media (min-width: 768px){
.bnet_header_menu_desk a.awb-menu__main-a{
margin-top: 0px !important;
margin-bottom: 0px !important;
padding-top: 0px !important;
padding-bottom: 0px !important;
line-height: 1.0 !important;
}
}
/* ==========================================================================
Bornheim.Net – Header Menu UL/LI (DESK + TAB)
Kill ONLY vertical spacing that can add height/gaps
========================================================================== */
@media (min-width: 768px){
.bnet_header_menu_desk ul.awb-menu__main-ul{
margin-top: 0px !important;
margin-bottom: 0px !important;
padding-top: 0px !important;
padding-bottom: 0px !important;
line-height: 1.0 !important;
}
.bnet_header_menu_desk li.awb-menu__main-li{
margin-top: 0px !important;
margin-bottom: 0px !important;
padding-top: 0px !important;
padding-bottom: 0px !important;
line-height: 1.0 !important;
}
}
/* ==========================================================================
Bornheim.Net – Header Menu
Kill Avada item vertical padding (DESK + TAB)
Footer clone: nav.awb-menu.bnet_footer_menu → nav.awb-menu.bnet_header_menu_mob
========================================================================== */
@media (min-width: 768px){
nav.awb-menu.bnet_header_menu_mob{
--awb-items-padding-top: 0px !important;
--awb-items-padding-bottom: 0px !important;
}
}
/* ==========================================================================
Bornheim.Net – Header Menu: reduce hover/click hitbox height (DESK + TAB)
========================================================================== */
@media (min-width: 768px){
nav.awb-menu.bnet_header_menu_mob{
--awb-items-padding-top: 2px !important;
--awb-items-padding-bottom: 2px !important;
}
.bnet_header_menu_desk.awb-menu,
nav.awb-menu.bnet_header_menu_mob{
--awb-font-size: 16px !important;
--awb-margin-top: 0px !important;
--awb-margin-bottom: 0px !important;
--awb-transition-time: 300 !important;
--awb-min-height: 16px !important;
}
}
/* ==========================================================================
Bornheim.Net – Header Menu: space for underline without big hitbox
FIX: max-width 767px (NOT 768px) to avoid overlap with tablet min-width 768px
========================================================================== */
@media (max-width: 767px){
nav.awb-menu.bnet_header_menu_mob{
--awb-items-padding-top: 2px !important;
--awb-items-padding-bottom: 2px !important;
}
.bnet_header_menu_desk.awb-menu,
nav.awb-menu.bnet_header_menu_mob{
--awb-font-size: 16px !important;
--awb-margin-top: 0px !important;
--awb-margin-bottom: 0px !important;
--awb-transition-time: 300 !important;
--awb-min-height: 16px !important;
}
}
/* ==========================================================================
HEADER MENU – TYPO BASE (ALL VIEWPORTS)
Force Bebas Local everywhere, sizes handled by media queries below
========================================================================== */
.bnet_header_menu_mob .menu-text,
.bnet_header_menu_desk .menu-text{
font-family: "Bebas Local", Arial, Helvetica, sans-serif !important;
font-weight: 400 !important;
text-transform: uppercase !important;
}
/* --------------------------------------------------------------------------
HEADER MENU – DESKTOP (≥1024px)
-------------------------------------------------------------------------- */
@media (min-width: 1024px){
.bnet_header_menu_mob .menu-text,
.bnet_header_menu_desk .menu-text{
font-size: 22px !important;
letter-spacing: 1px !important;
line-height: 1.1 !important;
}
.bnet_header_menu_mob a.awb-menu__main-a,
.bnet_header_menu_desk a.awb-menu__main-a{
padding-top: 0px !important;
padding-right: 10px !important;
padding-bottom: 9px !important;
padding-left: 10px !important;
}
}
/* --------------------------------------------------------------------------
HEADER MENU – TABLET (768px – 1023px)
-------------------------------------------------------------------------- */
@media (min-width: 768px) and (max-width: 1023px){
.bnet_header_menu_mob .menu-text,
.bnet_header_menu_desk .menu-text{
font-size: 20px !important;
letter-spacing: 1px !important;
line-height: 1.1 !important;
}
.bnet_header_menu_mob a.awb-menu__main-a,
.bnet_header_menu_desk a.awb-menu__main-a{
padding-top: 0px !important;
padding-right: 8px !important;
padding-bottom: 9px !important;
padding-left: 8px !important;
}
}
/* --------------------------------------------------------------------------
HEADER MENU – MOBILE BASE (≤767px)
-------------------------------------------------------------------------- */
@media (max-width: 767px){
.bnet_header_menu_mob .menu-text,
.bnet_header_menu_desk .menu-text{
font-size: 18px !important;
letter-spacing: 1px !important;
line-height: 1.1 !important;
}
.bnet_header_menu_mob a.awb-menu__main-a,
.bnet_header_menu_desk a.awb-menu__main-a{
padding-top: 0px !important;
padding-right: 6px !important;
padding-bottom: 8px !important;
padding-left: 6px !important;
}
}
/* --------------------------------------------------------------------------
HEADER MENU – MOBILE MICRO BREAKPOINTS
-------------------------------------------------------------------------- */
@media (max-width: 420px){
.bnet_header_menu_mob .menu-text,
.bnet_header_menu_desk .menu-text{
font-size: 17px !important;
letter-spacing: 0.8px !important;
}
}
@media (max-width: 380px){
.bnet_header_menu_mob .menu-text,
.bnet_header_menu_desk .menu-text{
font-size: 17px !important;
letter-spacing: 0.7px !important;
}
.bnet_header_menu_mob a.awb-menu__main-a,
.bnet_header_menu_desk a.awb-menu__main-a{
padding-top: 0px !important;
padding-right: 5px !important;
padding-bottom: 8px !important;
padding-left: 5px !important;
}
}
@media (max-width: 360px){
.bnet_header_menu_mob .menu-text,
.bnet_header_menu_desk .menu-text{
font-size: 17px !important;
letter-spacing: 0.6px !important;
}
.bnet_header_menu_mob a.awb-menu__main-a,
.bnet_header_menu_desk a.awb-menu__main-a{
padding-top: 0px !important;
padding-right: 4px !important;
padding-bottom: 8px !important;
padding-left: 4px !important;
}
}
@media (max-width: 320px){
.bnet_header_menu_mob .menu-text,
.bnet_header_menu_desk .menu-text{
font-size: 16px !important;
letter-spacing: 0.5px !important;
}
.bnet_header_menu_mob a.awb-menu__main-a,
.bnet_header_menu_desk a.awb-menu__main-a{
padding-top: 0px !important;
padding-right: 3px !important;
padding-bottom: 8px !important;
padding-left: 3px !important;
}
}
/* ==========================================================================
Bornheim.Net – Header Menu Ressort Underline (ROBUST)
Clone of Footer underline system
Works on Desktop/Tablet/Mobile
========================================================================== */
/* --- 1) Define ressort colors via href (mobile-proof) --- */
/* BERNEM – Äppler Gold */
.bnet_header_menu_mob a.awb-menu__main-a[href^="/bernem/"],
.bnet_header_menu_desk a.awb-menu__main-a[href^="/bernem/"]{
--bn-ressort: #c8a84a !important;
}
/* LEGGER – Chili Red */
.bnet_header_menu_mob a.awb-menu__main-a[href^="/legger/"],
.bnet_header_menu_desk a.awb-menu__main-a[href^="/legger/"]{
--bn-ressort: #a30425 !important;
}
/* SPORT – Dark Royal Blue */
.bnet_header_menu_mob a.awb-menu__main-a[href^="/sport/"],
.bnet_header_menu_desk a.awb-menu__main-a[href^="/sport/"]{
--bn-ressort: #1a1f87 !important;
}
/* FREIZEIT – Sattes Grün */
.bnet_header_menu_mob a.awb-menu__main-a[href^="/freizeit/"],
.bnet_header_menu_desk a.awb-menu__main-a[href^="/freizeit/"]{
--bn-ressort: #0c6810 !important;
}
/* PANORAMA – Violett */
.bnet_header_menu_mob a.awb-menu__main-a[href^="/panorama/"],
.bnet_header_menu_desk a.awb-menu__main-a[href^="/panorama/"]{
--bn-ressort: #830070 !important;
}
/* --- 2) Underline anchor: menu text --- */
.bnet_header_menu_mob .awb-menu__main-a .menu-text,
.bnet_header_menu_desk .awb-menu__main-a .menu-text{
position: relative !important;
display: inline-block !important;
z-index: 2 !important;
}
/* --- 3) The underline itself (hidden by default) --- */
.bnet_header_menu_mob .awb-menu__main-a .menu-text::after,
.bnet_header_menu_desk .awb-menu__main-a .menu-text::after{
content: "" !important;
position: absolute !important;
left: 0px !important;
right: -10px !important;
bottom: -5px !important;
height: 4px !important;
background-color: transparent !important;
transform-origin: left bottom !important;
transform: scaleY(0) !important;
transition-property: transform, background-color !important;
transition-duration: 180ms !important;
transition-timing-function: ease-out !important;
z-index: 3 !important;
}
/* --- 4) Hover: show underline in SOFT ressort color (desktop only) --- */
@media (hover: hover){
.bnet_header_menu_mob li:hover > a.awb-menu__main-a .menu-text::after,
.bnet_header_menu_desk li:hover > a.awb-menu__main-a .menu-text::after{
background-color: color-mix(in srgb, var(--bn-ressort, #4a5563) 85%, transparent) !important;
transform: scaleY(1) !important;
}
}
/* --- 5) Current: show underline in SOLID ressort color (all devices) --- */
.bnet_header_menu_mob li.current-menu-item > a.awb-menu__main-a .menu-text::after,
.bnet_header_menu_mob li.current-menu-ancestor > a.awb-menu__main-a .menu-text::after,
.bnet_header_menu_mob li.current-menu-parent > a.awb-menu__main-a .menu-text::after,
.bnet_header_menu_mob li.current_page_item > a.awb-menu__main-a .menu-text::after,
.bnet_header_menu_mob li.current_page_ancestor > a.awb-menu__main-a .menu-text::after,
.bnet_header_menu_mob li.current_page_parent > a.awb-menu__main-a .menu-text::after,
.bnet_header_menu_desk li.current-menu-item > a.awb-menu__main-a .menu-text::after,
.bnet_header_menu_desk li.current-menu-ancestor > a.awb-menu__main-a .menu-text::after,
.bnet_header_menu_desk li.current-menu-parent > a.awb-menu__main-a .menu-text::after,
.bnet_header_menu_desk li.current_page_item > a.awb-menu__main-a .menu-text::after,
.bnet_header_menu_desk li.current_page_ancestor > a.awb-menu__main-a .menu-text::after,
.bnet_header_menu_desk li.current_page_parent > a.awb-menu__main-a .menu-text::after{
background-color: color-mix(in srgb, var(--bn-ressort, #4a5563) 100%, transparent) !important;
transform: scaleY(1) !important;
}
/* ==========================================================================
Bornheim.Net – HEADER MENU Text States
ONLY text color (no underline, no font-weight changes)
========================================================================== */
.bnet_header_menu_desk a.awb-menu__main-a .menu-text,
.bnet_header_menu_mob a.awb-menu__main-a .menu-text{
color: #8a919e !important;
}
@media (hover: hover){
.bnet_header_menu_desk a.awb-menu__main-a:hover .menu-text{
color: #1f2933 !important;
}
}
.bnet_header_menu_mob a.awb-menu__main-a:active .menu-text{
color: #1f2933 !important;
}
.bnet_header_menu_desk li.current-menu-item > a.awb-menu__main-a .menu-text,
.bnet_header_menu_desk li.current-menu-ancestor > a.awb-menu__main-a .menu-text,
.bnet_header_menu_desk li.current_page_item > a.awb-menu__main-a .menu-text,
.bnet_header_menu_desk li.current_page_ancestor > a.awb-menu__main-a .menu-text,
.bnet_header_menu_mob li.current-menu-item > a.awb-menu__main-a .menu-text,
.bnet_header_menu_mob li.current-menu-ancestor > a.awb-menu__main-a .menu-text,
.bnet_header_menu_mob li.current_page_item > a.awb-menu__main-a .menu-text,
.bnet_header_menu_mob li.current_page_ancestor > a.awb-menu__main-a .menu-text{
color: #000000 !important;
}
/* ==========================================================================
END HEADER MENU
END HEADER MENU
END HEADER MENU
END HEADER MENU
========================================================================== */
/* ==========================================================================
START FOOTER MENU
START FOOTER MENU
START FOOTER MENU
START FOOTER MENU
========================================================================== */
/* ==========================================================================
Bornheim.Net – Footer
Full-width background with site-width content (Avada Layouts)
========================================================================== */
.bnet_footer{
position: relative !important;
overflow: visible !important;
}
/* Full-width background layer */
.bnet_footer:before{
content: "" !important;
position: absolute !important;
top: 0px !important;
right: 50% !important;
bottom: 0px !important;
left: 50% !important;
width: 100vw !important;
margin-top: 0px !important;
margin-right: -50vw !important;
margin-bottom: 0px !important;
margin-left: -50vw !important;
background-color: #f5f7f8 !important;
border-top-width: 3px !important;
border-top-style: solid !important;
border-top-color: #dddddd !important;
z-index: 0 !important;
}
/* Content above background */
.bnet_footer > *{
position: relative !important;
z-index: 1 !important;
}
/* ==========================================================================
Bornheim.Net – Header
Full-width background with site-width content (Avada Layouts)
========================================================================== */
.bnet_header{
position: relative !important;
overflow: visible !important;
}
/* Full-width background layer */
.bnet_header:before{
content: "" !important;
position: absolute !important;
top: 0px !important;
right: 50% !important;
bottom: 0px !important;
left: 50% !important;
width: 100vw !important;
margin-top: 0px !important;
margin-right: -50vw !important;
margin-bottom: 0px !important;
margin-left: -50vw !important;
background-color: #f5f7f8 !important;
border-bottom-width: 2px !important;
border-bottom-style: solid !important;
border-bottom-color: #dddddd !important;
z-index: 0 !important;
}
/* Content above background */
.bnet_header > *{
position: relative !important;
z-index: 1 !important;
}
/* ==========================================================================
Bornheim.Net – Footer Subheadline
========================================================================== */
.bnet_footer_subheadline{
font-family: "Bebas Local", Arial, Helvetica, sans-serif !important;
font-size: 14px !important;
line-height: 1.3 !important;
color: #192024 !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
.bnet_footer_subheadline:hover{
color: #3a4656 !important;
}
/* ==========================================================================
Bornheim.Net – Footer Sub
========================================================================== */
.bnet_footer_sub{
font-family: "Inter Normal Local", Arial, Helvetica, sans-serif !important;
font-size: 11px !important;
font-weight: 400 !important;
line-height: 18px !important;
color: #192024 !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
.bnet_footer_sub:hover{
color: rgba(0,90,156,0.6) !important;
}
/* ==========================================================================
Bornheim.Net – Footer Menu Items (DESK + TAB)
Kill ONLY vertical spacing on
========================================================================== */
@media (min-width: 768px){
.bnet_footer_menu_desk a.awb-menu__main-a{
margin-top: 0px !important;
margin-bottom: 0px !important;
padding-top: 0px !important;
padding-bottom: 0px !important;
line-height: 1.0 !important;
}
}
/* ==========================================================================
Bornheim.Net – Footer Menu UL/LI (DESK + TAB)
Kill ONLY vertical spacing that can add height/gaps
========================================================================== */
@media (min-width: 768px){
.bnet_footer_menu_desk ul.awb-menu__main-ul{
margin-top: 0px !important;
margin-bottom: 0px !important;
padding-top: 0px !important;
padding-bottom: 0px !important;
line-height: 1.0 !important;
}
.bnet_footer_menu_desk li.awb-menu__main-li{
margin-top: 0px !important;
margin-bottom: 0px !important;
padding-top: 0px !important;
padding-bottom: 0px !important;
line-height: 1.0 !important;
}
}
/* ==========================================================================
Bornheim.Net – Footer Menu
Kill Avada item vertical padding (DESK + TAB)
========================================================================== */
@media (min-width: 768px){
nav.awb-menu.bnet_footer_menu{
--awb-items-padding-top: 0px !important;
--awb-items-padding-bottom: 0px !important;
}
}
/* ==========================================================================
Bornheim.Net – Footer Menu: reduce hover/click hitbox height (DESK + TAB)
FIX: no global .awb-menu, variables scoped to footer menu only
========================================================================== */
@media (min-width: 768px){
nav.awb-menu.bnet_footer_menu{
--awb-items-padding-top: 2px !important;
--awb-items-padding-bottom: 2px !important;
--awb-font-size: 16px !important;
--awb-margin-top: 0px !important;
--awb-margin-bottom: 0px !important;
--awb-transition-time: 300 !important;
--awb-min-height: 16px !important;
}
}
/* ==========================================================================
Bornheim.Net – Footer Menu: space for underline without big hitbox
FIX: max-width 767px (NOT 768px) to avoid overlap with tablet min-width 768px
========================================================================== */
@media (max-width: 767px){
nav.awb-menu.bnet_footer_menu{
--awb-items-padding-top: 2px !important;
--awb-items-padding-bottom: 2px !important;
--awb-font-size: 16px !important;
--awb-margin-top: 0px !important;
--awb-margin-bottom: 0px !important;
--awb-transition-time: 300 !important;
--awb-min-height: 16px !important;
}
}
/* ==========================================================================
FOOTER MENU – TYPO BASE (ALL VIEWPORTS)
Force Bebas Local everywhere, sizes handled by media queries below
========================================================================== */
.bnet_footer_menu .menu-text,
.bnet_footer_menu_desk .menu-text{
font-family: "Bebas Local", Arial, Helvetica, sans-serif !important;
font-weight: 400 !important;
text-transform: uppercase !important;
}
/* --------------------------------------------------------------------------
FOOTER MENU – DESKTOP (≥1024px)
-------------------------------------------------------------------------- */
@media (min-width: 1024px){
.bnet_footer_menu .menu-text,
.bnet_footer_menu_desk .menu-text{
font-size: 22px !important;
letter-spacing: 1px !important;
line-height: 1.1 !important;
}
.bnet_footer_menu a.awb-menu__main-a,
.bnet_footer_menu_desk a.awb-menu__main-a{
padding-top: 0px !important;
padding-right: 10px !important;
padding-bottom: 9px !important;
padding-left: 10px !important;
}
}
/* --------------------------------------------------------------------------
FOOTER MENU – TABLET (768px – 1023px)
-------------------------------------------------------------------------- */
@media (min-width: 768px) and (max-width: 1023px){
.bnet_footer_menu .menu-text,
.bnet_footer_menu_desk .menu-text{
font-size: 20px !important;
letter-spacing: 1px !important;
line-height: 1.1 !important;
}
.bnet_footer_menu a.awb-menu__main-a,
.bnet_footer_menu_desk a.awb-menu__main-a{
padding-top: 0px !important;
padding-right: 8px !important;
padding-bottom: 9px !important;
padding-left: 8px !important;
}
}
/* --------------------------------------------------------------------------
FOOTER MENU – MOBILE BASE (≤767px)
-------------------------------------------------------------------------- */
@media (max-width: 767px){
.bnet_footer_menu .menu-text,
.bnet_footer_menu_desk .menu-text{
font-size: 16px !important;
letter-spacing: 1px !important;
line-height: 1.1 !important;
}
.bnet_footer_menu a.awb-menu__main-a,
.bnet_footer_menu_desk a.awb-menu__main-a{
padding-top: 0px !important;
padding-right: 7px !important;
padding-bottom: 8px !important;
padding-left: 7px !important;
}
}
/* --------------------------------------------------------------------------
FOOTER MENU – MOBILE MICRO BREAKPOINTS
-------------------------------------------------------------------------- */
@media (max-width: 420px){
.bnet_footer_menu .menu-text,
.bnet_footer_menu_desk .menu-text{
font-size: 15px !important;
letter-spacing: 0.8px !important;
}
}
@media (max-width: 380px){
.bnet_footer_menu .menu-text,
.bnet_footer_menu_desk .menu-text{
font-size: 15px !important;
letter-spacing: 0.7px !important;
}
.bnet_footer_menu a.awb-menu__main-a,
.bnet_footer_menu_desk a.awb-menu__main-a{
padding-top: 0px !important;
padding-right: 5px !important;
padding-bottom: 8px !important;
padding-left: 5px !important;
}
}
@media (max-width: 360px){
.bnet_footer_menu .menu-text,
.bnet_footer_menu_desk .menu-text{
font-size: 14px !important;
letter-spacing: 0.6px !important;
}
.bnet_footer_menu a.awb-menu__main-a,
.bnet_footer_menu_desk a.awb-menu__main-a{
padding-top: 0px !important;
padding-right: 4px !important;
padding-bottom: 8px !important;
padding-left: 4px !important;
}
}
@media (max-width: 320px){
.bnet_footer_menu .menu-text,
.bnet_footer_menu_desk .menu-text{
font-size: 13px !important;
letter-spacing: 0.5px !important;
}
.bnet_footer_menu a.awb-menu__main-a,
.bnet_footer_menu_desk a.awb-menu__main-a{
padding-top: 0px !important;
padding-right: 3px !important;
padding-bottom: 8px !important;
padding-left: 3px !important;
}
}
/* ==========================================================================
Bornheim.Net – Footer Menu Ressort Underline (ROBUST)
Works on Desktop/Tablet/Mobile
Uses CSS variable per menu item, then 1 underline renderer.
========================================================================== */
/* --- 1) Define ressort colors via href (mobile-proof) --- */
/* BERNEM – Äppler Gold*/
.bnet_footer_menu a.awb-menu__main-a[href^="/bernem/"],
.bnet_footer_menu_desk a.awb-menu__main-a[href^="/bernem/"]{
--bn-ressort: #c8a84a !important;
}
/* LEGGER – Chili Red */
.bnet_footer_menu a.awb-menu__main-a[href^="/legger/"],
.bnet_footer_menu_desk a.awb-menu__main-a[href^="/legger/"]{
--bn-ressort: #a30425 !important;
}
/* SPORT – Dark Royal Blue */
.bnet_footer_menu a.awb-menu__main-a[href^="/sport/"],
.bnet_footer_menu_desk a.awb-menu__main-a[href^="/sport/"]{
--bn-ressort: #1a1f87 !important;
}
/* FREIZEIT – Sattes Grün */
.bnet_footer_menu a.awb-menu__main-a[href^="/freizeit/"],
.bnet_footer_menu_desk a.awb-menu__main-a[href^="/freizeit/"]{
--bn-ressort: #0c6810 !important;
}
/* PANORAMA – Violett */
.bnet_footer_menu a.awb-menu__main-a[href^="/panorama/"],
.bnet_footer_menu_desk a.awb-menu__main-a[href^="/panorama/"]{
--bn-ressort: #830070 !important;
}
/* --- 2) Underline anchor: menu text --- */
.bnet_footer_menu .awb-menu__main-a .menu-text,
.bnet_footer_menu_desk .awb-menu__main-a .menu-text{
position: relative !important;
display: inline-block !important;
z-index: 2 !important;
}
/* --- 3) The underline itself (hidden by default) --- */
.bnet_footer_menu .awb-menu__main-a .menu-text::after,
.bnet_footer_menu_desk .awb-menu__main-a .menu-text::after{
content: "" !important;
position: absolute !important;
left: 0px !important;
right: -10px !important;
bottom: -5px !important;
height: 4px !important;
background-color: transparent !important;
transform-origin: left bottom !important;
transform: scaleY(0) !important;
transition-property: transform, background-color !important;
transition-duration: 180ms !important;
transition-timing-function: ease-out !important;
z-index: 3 !important;
}
/* --- 4) Hover: show underline in SOFT ressort color (desktop only) --- */
@media (hover: hover){
.bnet_footer_menu li:hover > a.awb-menu__main-a .menu-text::after,
.bnet_footer_menu_desk li:hover > a.awb-menu__main-a .menu-text::after{
background-color: color-mix(in srgb, var(--bn-ressort, #4a5563) 75%, transparent) !important;
transform: scaleY(1) !important;
}
}
/* --- 5) Current: show underline in SOLID ressort color (all devices) --- */
.bnet_footer_menu li.current-menu-item > a.awb-menu__main-a .menu-text::after,
.bnet_footer_menu li.current-menu-ancestor > a.awb-menu__main-a .menu-text::after,
.bnet_footer_menu li.current-menu-parent > a.awb-menu__main-a .menu-text::after,
.bnet_footer_menu li.current_page_item > a.awb-menu__main-a .menu-text::after,
.bnet_footer_menu li.current_page_ancestor > a.awb-menu__main-a .menu-text::after,
.bnet_footer_menu li.current_page_parent > a.awb-menu__main-a .menu-text::after,
.bnet_footer_menu_desk li.current-menu-item > a.awb-menu__main-a .menu-text::after,
.bnet_footer_menu_desk li.current-menu-ancestor > a.awb-menu__main-a .menu-text::after,
.bnet_footer_menu_desk li.current-menu-parent > a.awb-menu__main-a .menu-text::after,
.bnet_footer_menu_desk li.current_page_item > a.awb-menu__main-a .menu-text::after,
.bnet_footer_menu_desk li.current_page_ancestor > a.awb-menu__main-a .menu-text::after,
.bnet_footer_menu_desk li.current_page_parent > a.awb-menu__main-a .menu-text::after{
background-color: color-mix(in srgb, var(--bn-ressort, #4a5563) 100%, transparent) !important;
transform: scaleY(1) !important;
}
/* ==========================================================================
Bornheim.Net – FOOTER MENU: Text Colors (Inactive / Hover-Tap / Current)
========================================================================== */
.bnet_footer_menu a.awb-menu__main-a .menu-text,
.bnet_footer_menu_desk a.awb-menu__main-a .menu-text{
color: #8a919e !important;
}
@media (hover: hover){
.bnet_footer_menu li:hover > a.awb-menu__main-a .menu-text,
.bnet_footer_menu_desk li:hover > a.awb-menu__main-a .menu-text{
color: #192024 !important;
}
}
.bnet_footer_menu a.awb-menu__main-a:active .menu-text,
.bnet_footer_menu a.awb-menu__main-a:focus .menu-text,
.bnet_footer_menu a.awb-menu__main-a:focus-visible .menu-text,
.bnet_footer_menu_desk a.awb-menu__main-a:active .menu-text,
.bnet_footer_menu_desk a.awb-menu__main-a:focus .menu-text,
.bnet_footer_menu_desk a.awb-menu__main-a:focus-visible .menu-text{
color: #192024 !important;
outline: none !important;
}
.bnet_footer_menu li.current-menu-item > a.awb-menu__main-a .menu-text,
.bnet_footer_menu li.current-menu-ancestor > a.awb-menu__main-a .menu-text,
.bnet_footer_menu li.current-menu-parent > a.awb-menu__main-a .menu-text,
.bnet_footer_menu li.current_page_item > a.awb-menu__main-a .menu-text,
.bnet_footer_menu li.current_page_ancestor > a.awb-menu__main-a .menu-text,
.bnet_footer_menu li.current_page_parent > a.awb-menu__main-a .menu-text,
.bnet_footer_menu_desk li.current-menu-item > a.awb-menu__main-a .menu-text,
.bnet_footer_menu_desk li.current-menu-ancestor > a.awb-menu__main-a .menu-text,
.bnet_footer_menu_desk li.current-menu-parent > a.awb-menu__main-a .menu-text,
.bnet_footer_menu_desk li.current_page_item > a.awb-menu__main-a .menu-text,
.bnet_footer_menu_desk li.current_page_ancestor > a.awb-menu__main-a .menu-text,
.bnet_footer_menu_desk li.current_page_parent > a.awb-menu__main-a .menu-text{
color: #000000 !important;
}
/* ==========================================================================
END FOOTER MENU
END FOOTER MENU
END FOOTER MENU
END FOOTER MENU
========================================================================== */
/* ==========================================================================
START HEADER + FOOTER MENU CSS
START HEADER + FOOTER MENU CSS
START HEADER + FOOTER MENU CSS
START HEADER + FOOTER MENU CSS
========================================================================== */
/* ==========================================================================
MENU – Mobile/Tablet: STRONG press feedback (tap)
Header + Footer, fully scoped
Works even if wrapper transitions were killed
Breakpoint: ≤1023
========================================================================== */
@media (max-width: 1023px){
/* 1) Underline / pseudo elements stay dead */
.bnet_header_menu_mob .awb-menu__main-a .menu-text::after,
.bnet_header_menu_desk .awb-menu__main-a .menu-text::after,
.bnet_footer_menu .awb-menu__main-a .menu-text::after,
.bnet_footer_menu_desk .awb-menu__main-a .menu-text::after{
transition: none !important;
}
/* 2) Wrapper: no animations (but DO NOT kill transforms on links) */
.bnet_header_menu_mob,
.bnet_header_menu_desk,
.bnet_footer_menu,
.bnet_footer_menu_desk{
animation: none !important;
}
/* 3) Enable press feedback ONLY on actual menu links */
.bnet_header_menu_mob .awb-menu__main-a,
.bnet_header_menu_desk .awb-menu__main-a,
.bnet_footer_menu .awb-menu__main-a,
.bnet_footer_menu_desk .awb-menu__main-a{
transform: translateY(0px) scale(1);
transition-property: transform !important;
transition-duration: 0.11s !important;
transition-timing-function: cubic-bezier(0.2, 0.8, 0.3, 1) !important;
}
/* 4) PRESS (tap / JS-tap) */
.bnet_header_menu_mob .awb-menu__main-a:active,
.bnet_header_menu_desk .awb-menu__main-a:active,
.bnet_footer_menu .awb-menu__main-a:active,
.bnet_footer_menu_desk .awb-menu__main-a:active,
.bnet_header_menu_mob .awb-menu__main-a.bn-tap,
.bnet_header_menu_desk .awb-menu__main-a.bn-tap,
.bnet_footer_menu .awb-menu__main-a.bn-tap,
.bnet_footer_menu_desk .awb-menu__main-a.bn-tap{
transform: translateY(2px) scale(0.95);
}
}
/* ==========================================================================
Bornheim.Net – Header Menu Wrapper Spacing (OPTIONAL)
Only if Header needs different spacing than Footer
(Leave out if you want true 1:1 clone)
========================================================================== */
@media (min-width: 1024px){
.bnet_header_menu_desk{
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
@media (min-width: 768px) and (max-width: 1023px){
.bnet_header_menu_desk{
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
@media (max-width: 767px){
.bnet_header_menu_mob{
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
/* ==========================================================================
MENU – FOUC KILL (Underline alignment jump)
Header + Footer, Mobile/Tablet
Fix: force underline to be sized by its text container, not by viewport/parent
Breakpoint: ≤1023
========================================================================== */
@media (max-width: 1023px){
/* 1) Prevent any overflow flash outside menu containers */
.bnet_header_menu_mob,
.bnet_header_menu_desk,
.bnet_footer_menu,
.bnet_footer_menu_desk{
overflow-x: hidden !important;
}
/* 2) Make sure the underline anchor box is stable */
.bnet_header_menu_mob .awb-menu__main-a,
.bnet_header_menu_desk .awb-menu__main-a,
.bnet_footer_menu .awb-menu__main-a,
.bnet_footer_menu_desk .awb-menu__main-a{
position: relative !important;
overflow: hidden !important;
}
/* 3) CRITICAL: menu-text must be the sizing parent (inline-block) */
.bnet_header_menu_mob .awb-menu__main-a .menu-text,
.bnet_header_menu_desk .awb-menu__main-a .menu-text,
.bnet_footer_menu .awb-menu__main-a .menu-text,
.bnet_footer_menu_desk .awb-menu__main-a .menu-text{
position: relative !important;
display: inline-block !important;
max-width: 100% !important;
}
/* 4) Force underline to be bounded to menu-text box (no vw surprises) */
.bnet_header_menu_mob .awb-menu__main-a .menu-text::after,
.bnet_header_menu_desk .awb-menu__main-a .menu-text::after,
.bnet_footer_menu .awb-menu__main-a .menu-text::after,
.bnet_footer_menu_desk .awb-menu__main-a .menu-text::after{
left: 0px !important;
right: 0px !important;
width: auto !important;
max-width: 100% !important;
transform: none !important;
will-change: auto !important;
}
}
/* ==========================================================================
END HEADER + FOOTER MENU CSS
END HEADER + FOOTER MENU CSS
END HEADER + FOOTER MENU CSS
END HEADER + FOOTER MENU CSS
========================================================================== */
/* ==========================================================================
WOO COMMERCE
WOO COMMERCE
WOO COMMERCE
WOO COMMERCE
========================================================================== */
/* ==========================================================================
DER BORNHEIMER – SHOP BREADCRUMBS
Class: .bnet_shop_breadcrumbs
Font: Lato Regular Local, Uppercase, 12px
Margins: 0px (individual)
========================================================================== */
/* Base */
.bnet_shop_breadcrumbs{
font-family: "Lato", "Lato Local", Arial, sans-serif !important;
font-weight: 400 !important;
font-size: 12px !important;
text-transform: uppercase !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* Make sure inner breadcrumb wrapper doesn’t add spacing */
.bnet_shop_breadcrumbs .fusion-breadcrumbs,
.bnet_shop_breadcrumbs .fusion-breadcrumbs p,
.bnet_shop_breadcrumbs nav{
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* Links */
.bnet_shop_breadcrumbs a{
font-family: "Lato", "Lato Local", Arial, sans-serif !important;
font-weight: 400 !important;
font-size: 12px !important;
text-transform: uppercase !important;
text-decoration: none !important;
}
/* Separators (Avada varies by markup; this is safe) */
.bnet_shop_breadcrumbs .fusion-breadcrumb-sep,
.bnet_shop_breadcrumbs .breadcrumb-sep,
.bnet_shop_breadcrumbs .separator{
font-size: 12px !important;
}
/* ==========================================================================
MEDIA QUERIES
Desktop >= 1024px, Tablet 768–1023px, Mobile <= 767px
========================================================================== */
@media (min-width: 1024px){
.bnet_shop_breadcrumbs{
font-size: 12px !important;
}
.bnet_shop_breadcrumbs a{
font-size: 12px !important;
}
}
@media (min-width: 768px) and (max-width: 1023px){
.bnet_shop_breadcrumbs{
font-size: 12px !important;
}
.bnet_shop_breadcrumbs a{
font-size: 12px !important;
}
}
@media (max-width: 767px){
.bnet_shop_breadcrumbs{
font-size: 12px !important;
}
.bnet_shop_breadcrumbs a{
font-size: 12px !important;
}
}
/* ==========================================================================
DER BORNHEIMER – SHOP CART ICON + COUNT
Markup: .bnet_cart_link > .bnet_cart_icon + .bnet_cart_count
========================================================================== */
.bnet_cart_link{
display: inline-flex !important;
align-items: center !important;
gap: 6px !important;
text-decoration: none !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
.bnet_cart_icon{
font-size: 16px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
}
.bnet_cart_count{
font-family: "Lato", "Lato Local", Arial, sans-serif !important;
font-weight: 700 !important;
font-size: 12px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* ==========================================================================
MEDIA QUERIES
Desktop >= 1024px, Tablet 768–1023px, Mobile <= 767px
========================================================================== */
@media (min-width: 1024px){
.bnet_cart_icon{ font-size: 13px !important; }
.bnet_cart_count{ font-size: 11px !important; }
}
@media (min-width: 768px) and (max-width: 1023px){
.bnet_cart_icon{ font-size: 12px !important; }
.bnet_cart_count{ font-size: 11px !important; }
}
@media (max-width: 767px){
.bnet_cart_icon{ font-size: 12px !important; }
.bnet_cart_count{ font-size: 11px !important; }
}
/* ==========================================================================
DER BORNHEIMER – SHOP CART COLOR FIX
Color: #212934
========================================================================== */
.bnet_cart_link{
color: #212934 !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
}
.bnet_cart_link:hover{
color: #212934 !important;
}
.bnet_cart_icon{
color: #212934 !important;
}
.bnet_cart_count{
color: #212934 !important;
}
/* ==========================================================================
EVENTON
EVENTON
EVENTON
EVENTON
========================================================================== */
/* ==========================================================================
MONTHS SWITCH
MONTHS SWITCH
========================================================================== */
.ajde_evcal_calendar .calendar_header p.evo_month_title{
font-family: "Bebas Local", "Bebas Neue", sans-serif !important;
font-weight: 400 !important;
}
/* Desktop */
@media (min-width: 1024px){
.ajde_evcal_calendar .calendar_header p.evo_month_title{
font-size: 42px !important;
line-height: 42px !important;
margin-top: 0px !important;
margin-right: 20px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
/* Tablet */
@media (min-width: 768px) and (max-width: 1023px){
.ajde_evcal_calendar .calendar_header p.evo_month_title{
font-size: 32px !important;
line-height: 36px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
/* Mobile */
@media (max-width: 767px){
.ajde_evcal_calendar .calendar_header p.evo_month_title{
font-size: 28px !important;
line-height: 32px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
/* ==========================================================================
COLOR DOT
COLOR DOT
========================================================================== */
/* Desktop */
@media (min-width: 1024px){
.evosv_grid .row .evosv_items .evosv_clr{
width: 15px !important;
height: 15px !important;
margin-top: 4px !important;
margin-right: 15px !important;
margin-bottom: auto !important;
margin-left: 0px !important;
border-radius: 20px !important;
flex: none !important;
}
}
/* Tablet */
@media (min-width: 768px) and (max-width: 1023px){
.evosv_grid .row .evosv_items .evosv_clr{
width: 14px !important;
height: 14px !important;
margin-top: 4px !important;
margin-right: 12px !important;
margin-bottom: auto !important;
margin-left: 0px !important;
border-radius: 18px !important;
flex: none !important;
}
}
/* Mobile */
@media (max-width: 767px){
.evosv_grid .row .evosv_items .evosv_clr{
width: 11px !important;
height: 11px !important;
margin-top: 3px !important;
margin-right: 5px !important;
margin-bottom: auto !important;
margin-left: 0px !important;
border-radius: 14px !important;
flex: none !important;
}
}
/* ==========================================================================
HIDE AKTUELLER MONAT
========================================================================== */
.calendar_header button.cal_head_btn.vis, .calendar_header button.cal_head_btn.vis.evo-gototoday-btn {
display: none !important;
}
/* ==========================================================================
EVENT FONT + SIZE
EVENT FONT + SIZE
========================================================================== */
/* Desktop */
@media (min-width: 1024px){
.evoff_2{
font-family: "Inter Local", "Inter", sans-serif !important;
}
.evosv_grid .row{
font-size: 14px !important;
}
}
/* Tablet */
@media (min-width: 768px) and (max-width: 1023px){
.evoff_2{
font-family: "Inter Local", "Inter", sans-serif !important;
}
.evosv_grid .row{
font-size: 13px !important;
}
}
/* Mobile */
@media (max-width: 767px){
.evoff_2{
font-family: "Inter Local", "Inter", sans-serif !important;
}
.evosv_grid .row{
font-size: 12px !important;
}
}
/* ==========================================================================
DATE
DATE
========================================================================== */
/* Desktop */
@media (min-width: 1024px){
.evosv_grid .row .evosv_date{
font-family: "Bebas Local", "Bebas Neue", sans-serif !important;
font-size: 14px !important;
margin-top: 0px !important;
margin-bottom: 0px !important;
}
}
/* Tablet */
@media (min-width: 768px) and (max-width: 1023px){
.evosv_grid .row .evosv_date{
font-family: "Bebas Local", "Bebas Neue", sans-serif !important;
font-size: 13px !important;
margin-top: 0px !important;
margin-bottom: 0px !important;
}
}
/* Mobile */
@media (max-width: 767px){
.evosv_grid .row .evosv_date{
font-family: "Bebas Local", "Bebas Neue", sans-serif !important;
font-size: 14px !important;
margin-top: 0px !important;
margin-bottom: 0px !important;
}
}
/* ==========================================================================
TIME WIDTH MOBILE
TIME WIDTH MOBILE
========================================================================== */
@media (max-width: 767px){
.evosv_grid .row .evosv_items .evosv_time{
width: 70px !important;
flex: none !important;
}
}
/* ==========================================================================
EVENT WIDTH
EVENT WIDTH
========================================================================== */
.evosv_grid .row .evosv_items .evosv_event {
width: auto !important;
}
/* ==========================================================================
HOVER FIX
HOVER FIX
========================================================================== */
/* ==========================================================================
DER BORNHEIMER – EVENTON SCHEDULE: DISABLE HOVER (DESK+TAB)
Keeps indent layout intact, avoids overflow bug
========================================================================== */
@media (min-width: 768px){
.evosv_grid .row:hover .evosv_items{
background-color: transparent !important;
}
}
/* ==========================================================================
AUTOMATED CONTENT
AUTOMATED CONTENT
AUTOMATED CONTENT
AUTOMATED CONTENT
========================================================================== */
/* ==========================================================================
BORNHEIMER DATENBLOCK – WETTER (BASELINE) – CLEAN (FINAL / CLEANED)
- Desktop: Forecast = 4 statische Tiles (kein Scroll)
- Mobile: Forecast = horizontal scroll, floating cards, wrapper border removed
- Tablet: später separat (hier bewusst nur Baseline, keine Tablet-Overrides)
- Global: border-color + radius via CSS variables
========================================================================== */
/* --------------------------------------------------------------------------
1) WRAPPERS (shared + variables)
-------------------------------------------------------------------------- */
.bdb_weather,
.bdb_weather_forecast{
--bdb-border-color: #e6e9eb;
--bdb-radius: 3px;
background-color: #f5f7f8 !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 10px !important;
padding-right: 15px !important;
padding-bottom: 15px !important;
padding-left: 10px !important;
border-top-width: 1px !important;
border-right-width: 1px !important;
border-bottom-width: 1px !important;
border-left-width: 1px !important;
border-top-style: solid !important;
border-right-style: solid !important;
border-bottom-style: solid !important;
border-left-style: solid !important;
border-top-color: var(--bdb-border-color) !important;
border-right-color: var(--bdb-border-color) !important;
border-bottom-color: var(--bdb-border-color) !important;
border-left-color: var(--bdb-border-color) !important;
border-top-left-radius: var(--bdb-radius) !important;
border-top-right-radius: var(--bdb-radius) !important;
border-bottom-right-radius: var(--bdb-radius) !important;
border-bottom-left-radius: var(--bdb-radius) !important;
overflow: hidden !important;
}
/* --------------------------------------------------------------------------
2) HEADER (shared)
-------------------------------------------------------------------------- */
.bdb_weather .bdb__header,
.bdb_weather_forecast .bdb__header{
display: grid !important;
grid-template-columns: 1fr auto 1fr !important;
align-items: end !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 14px !important;
margin-left: 0px !important;
}
.bdb_weather .bdb__meta,
.bdb_weather_forecast .bdb__meta{
font-size: 12px !important;
line-height: 16px !important;
opacity: 0.70 !important;
}
.bdb_weather .bdb__meta_left,
.bdb_weather_forecast .bdb__meta_left{
text-align: left !important;
}
.bdb_weather .bdb__meta_right,
.bdb_weather_forecast .bdb__meta_right{
text-align: right !important;
}
.bdb_weather .bdb__title,
.bdb_weather_forecast .bdb__title{
text-align: center !important;
letter-spacing: 0.06em !important;
text-transform: uppercase !important;
font-size: 16px !important;
line-height: 20px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
}
/* --------------------------------------------------------------------------
3) CURRENT WEATHER
-------------------------------------------------------------------------- */
.bdb_weather .bdb__main{
display: grid !important;
grid-template-columns: 1fr 1fr !important;
align-items: center !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 10px !important;
margin-left: 0px !important;
}
.bdb_weather .bdb__main_left{
display: flex !important;
justify-content: flex-end !important;
align-items: center !important;
padding-top: 0px !important;
padding-right: 12px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
.bdb_weather .bdb__main_right{
display: flex !important;
justify-content: flex-start !important;
align-items: center !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 12px !important;
}
.bdb_weather .bdb__temp{
font-size: 86px !important;
line-height: 86px !important;
font-weight: 700 !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
font-family: "Bebas Local", sans-serif !important;
letter-spacing: 0.02em !important;
}
.bdb_weather .bdb__temp::after{
content: "°";
font-size: 42px !important;
line-height: 42px !important;
vertical-align: top !important;
margin-left: 4px !important;
}
.bdb_weather .bdb__icon{
width: 140px !important;
height: 140px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
}
.bdb_weather .bdb__icon svg.bdb_weather_svg{
width: 140px !important;
height: 140px !important;
display: block !important;
}
/* Summary (CENTERED) */
.bdb_weather .bdb__summary{
width: 100% !important;
text-align: center !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 10px !important;
margin-left: 0px !important;
}
.bdb_weather .bdb__summary_line{
width: 100% !important;
text-align: center !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 4px !important;
margin-left: 0px !important;
}
/* Details (CENTERED) */
.bdb_weather .bdb__details{
display: grid !important;
grid-template-columns: 1fr 1fr !important;
column-gap: 18px !important;
text-align: center !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
}
.bdb_weather .bdb__row{
display: block !important;
text-align: center !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 6px !important;
margin-left: 0px !important;
}
.bdb_weather .bdb__label{
opacity: 0.70 !important;
}
/* --------------------------------------------------------------------------
4) FORECAST BASELINE (shared)
-------------------------------------------------------------------------- */
.bdb_weather_forecast .bdb__forecast_item{
border-top-width: 0px !important;
border-right-width: 0px !important;
border-bottom-width: 0px !important;
border-left-width: 0px !important;
border-top-left-radius: var(--bdb-radius) !important;
border-top-right-radius: var(--bdb-radius) !important;
border-bottom-right-radius: var(--bdb-radius) !important;
border-bottom-left-radius: var(--bdb-radius) !important;
overflow: hidden !important;
padding-top: 10px !important;
padding-right: 10px !important;
padding-bottom: 10px !important;
padding-left: 10px !important;
text-align: center !important;
}
/* --------------------------------------------------------------------------
5) FORECAST ICON (single source of truth, all viewports)
IMPORTANT:
- If icons still look off after this, the SVG viewBox/whitespace is asymmetric.
- CSS can center the *box*, not the *drawing inside* an uneven viewBox.
-------------------------------------------------------------------------- */
.bdb_weather_forecast .bdb__forecast_icon{
width: 100% !important;
display: flex !important;
justify-content: center !important;
align-items: center !important;
text-align: center !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
.bdb_weather_forecast .bdb__forecast_icon svg.bdb_weather_svg{
width: 44px !important;
height: 44px !important;
display: block !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
max-width: none !important;
max-height: none !important;
transform: none !important;
}
/* --------------------------------------------------------------------------
6) FORECAST LAYOUT MODES
-------------------------------------------------------------------------- */
/* Desktop */
@media (min-width: 1025px){
.bdb_weather_forecast .bdb__forecast_scroller{
display: grid !important;
grid-template-columns: repeat(4, minmax(0px, 1fr)) !important;
column-gap: 0px !important;
row-gap: 0px !important;
overflow-x: hidden !important;
overflow-y: hidden !important;
width: 100% !important;
padding-top: 8px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
}
/* Desktop: ensure ONLY 4 tiles even if API returns 5 */
.bdb_weather_forecast .bdb__forecast_scroller > .bdb__forecast_item:nth-child(n+5){
display: none !important;
}
}
/* Mobile */
@media (max-width: 767px){
/* CURRENT – center pair (temp + icon) */
.bdb_weather .bdb__main{
display: grid !important;
grid-template-columns: auto auto !important;
justify-content: center !important;
align-items: center !important;
column-gap: 18px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 8px !important;
margin-left: 0px !important;
}
.bdb_weather .bdb__main_left,
.bdb_weather .bdb__main_right{
display: flex !important;
justify-content: center !important;
align-items: center !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
.bdb_weather .bdb__icon{
display: flex !important;
justify-content: center !important;
align-items: center !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
}
/* Keep this ONLY if your big icons look visually off due to SVG whitespace */
.bdb_weather .bdb__icon svg.bdb_weather_svg{
transform: translateX(-6px) !important;
}
/* FORECAST – floating cards + wrapper invisible */
.bdb_weather_forecast{
border-top-width: 0px !important;
border-right-width: 0px !important;
border-bottom-width: 0px !important;
border-left-width: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
background-color: transparent !important;
}
.bdb_weather_forecast .bdb__forecast_scroller{
display: flex !important;
overflow-x: auto !important;
overflow-y: hidden !important;
gap: 14px !important;
padding-top: 0px !important;
padding-right: 12px !important;
padding-bottom: 2px !important;
padding-left: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
-webkit-overflow-scrolling: touch !important;
}
/* 3 visible + 4th peeks (5 exists, user scrolls) */
.bdb_weather_forecast .bdb__forecast_item{
flex: 0 0 calc(31% - 10px) !important;
background-color: #ffffff !important;
border-top-width: 1px !important;
border-right-width: 1px !important;
border-bottom-width: 1px !important;
border-left-width: 1px !important;
border-top-style: solid !important;
border-right-style: solid !important;
border-bottom-style: solid !important;
border-left-style: solid !important;
border-top-color: #dddddd !important;
border-right-color: #dddddd !important;
border-bottom-color: #dddddd !important;
border-left-color: #dddddd !important;
border-top-left-radius: 8px !important;
border-top-right-radius: 8px !important;
border-bottom-right-radius: 8px !important;
border-bottom-left-radius: 8px !important;
overflow: hidden !important;
}
.bdb_weather_forecast .bdb__forecast_scroller{
scrollbar-width: none !important; /* Firefox */
-ms-overflow-style: none !important; /* IE / Edge legacy */
}
.bdb_weather_forecast .bdb__forecast_scroller::-webkit-scrollbar{
display: none !important; /* Chrome / Safari */
}
}
/* Tablet – intentionally empty for now (we do later) */
@media (min-width: 768px) and (max-width: 1024px){
}
/* ==========================================================================
BDB WEATHER – Icon contrast boost on light background
ZUSÄTZLICH
========================================================================== */
.bdb_weather svg.bdb_weather_svg,
.bdb_weather_forecast svg.bdb_weather_svg{
filter: drop-shadow(0px 1px 0px rgba(0,0,0,0.14)) drop-shadow(0px 0px 10px rgba(0,0,0,0.12)) !important;
}
/* A tiny outline illusion for light strokes (safe for most SVGs) */
.bdb_weather svg.bdb_weather_svg *,
.bdb_weather_forecast svg.bdb_weather_svg *{
filter: drop-shadow(0px 0px 0px rgba(0,0,0,0.00)) !important;
}
/* ==========================================================================
MINI ICONS
MINI ICONS
MINI ICONS
MINI ICONS
========================================================================== */
.bdb_weather_svg_mini{
width: 16px !important;
height: 16px !important;
margin-top: 0px !important;
margin-right: 6px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
vertical-align: middle !important;
display: inline-block !important;
}
.bdb_weather_forecast .bdb__forecast_rain{
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 6px !important;
}
/* ==========================================================================
DATA BLOCK HEALTH, FINANZEN, ASTRO
DATA BLOCK HEALTH, FINANZEN, ASTRO
DATA BLOCK HEALTH, FINANZEN, ASTRO
DATA BLOCK HEALTH, FINANZEN, ASTRO
========================================================================== */
/* ==========================================================================
DESKTOP
========================================================================== */
@media (min-width: 1025px){
.bdb_data_block .bdb_table4{
width: 100% !important;
border-collapse: collapse !important;
}
.bdb_data_block .bdb_table4 th,
.bdb_data_block .bdb_table4 td{
padding-top: 4px !important;
padding-right: 6px !important;
padding-bottom: 4px !important;
padding-left: 6px !important;
font-size: 15px !important;
line-height: 20px !important;
text-align: left !important;
vertical-align: middle !important;
}
.bdb_data_block .bdb_table4 th{
font-weight: 400 !important;
opacity: 0.75 !important;
width: 25% !important;
}
.bdb_data_block .bdb_table4 td{
font-weight: 500 !important;
width: 25% !important;
}
}
/* ==========================================================================
TABLET
========================================================================== */
@media (min-width: 768px) and (max-width: 1024px){
.bdb_data_block .bdb_table4{
width: 100% !important;
border-collapse: collapse !important;
}
.bdb_data_block .bdb_table4 th,
.bdb_data_block .bdb_table4 td{
padding-top: 3px !important;
padding-right: 4px !important;
padding-bottom: 3px !important;
padding-left: 4px !important;
font-size: 14px !important;
line-height: 18px !important;
text-align: left !important;
vertical-align: middle !important;
}
.bdb_data_block .bdb_table4 th{
opacity: 0.75 !important;
}
}
/* ==========================================================================
MOBILE
========================================================================== */
@media (max-width: 767px){
.bdb_data_block .bdb_table4{
width: 100% !important;
border-collapse: collapse !important;
}
.bdb_data_block .bdb_table4 th,
.bdb_data_block .bdb_table4 td{
padding-top: 3px !important;
padding-right: 4px !important;
padding-bottom: 3px !important;
padding-left: 4px !important;
font-size: 13px !important;
line-height: 17px !important;
text-align: left !important;
vertical-align: middle !important;
}
.bdb_data_block .bdb_table4 th{
opacity: 0.75 !important;
}
}
/* ==========================================================================
TYPO AUTOMATED DATA ELEMENTS
TYPO AUTOMATED DATA ELEMENTS
TYPO AUTOMATED DATA ELEMENTS
TYPO AUTOMATED DATA ELEMENTS
========================================================================== */
/* ==========================================================================
++++ WEATHER CURRENT ++++
++++ WEATHER CURRENT ++++
++++ WEATHER CURRENT ++++
========================================================================== */
/* ==========================================================================
DESKTOP
========================================================================== */
@media (min-width: 1025px){
/* META (ZEIT / DATUM) */
.bdb_weather .bdb__meta{
font-family: "Inter Local", sans-serif !important;
font-weight: 400 !important;
font-size: 11px !important;
line-height: 16px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* TEMPERATUR (GROSS) */
.bdb_weather .bdb__temp{
font-family: "Bebas Local", sans-serif !important;
font-weight: 700 !important;
font-size: 86px !important;
line-height: 86px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* GRADZEICHEN */
.bdb_weather .bdb__temp::after{
font-family: "Bebas Local", sans-serif !important;
font-weight: 700 !important;
font-size: 42px !important;
line-height: 42px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* SUMMARY LINES (GEFUEHLT / BESCHREIBUNG / TAG MIN MAX) */
.bdb_weather .bdb__summary_line{
font-family: "Inter Local", sans-serif !important;
font-weight: 400 !important;
font-size: 11px !important;
line-height: 20px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* DETAILS ROWS (WIND / REGEN) */
.bdb_weather .bdb__row{
font-family: "Inter Local", sans-serif !important;
font-weight: 400 !important;
font-size: 11px !important;
line-height: 18px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* LABELS (GEFUEHLT / TAG / MIN / MAX / WIND / REGEN) */
.bdb_weather .bdb__label{
font-family: "Inter Local", sans-serif !important;
font-weight: 400 !important;
font-size: 11px !important;
line-height: 18px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 5px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
/* ==========================================================================
TABLET
========================================================================== */
@media (min-width: 768px) and (max-width: 1024px){
/* META (ZEIT / DATUM) */
.bdb_weather .bdb__meta{
font-family: "Inter Local", sans-serif !important;
font-weight: 400 !important;
font-size: 11px !important;
line-height: 16px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* TEMPERATUR (GROSS) */
.bdb_weather .bdb__temp{
font-family: "Bebas Local", sans-serif !important;
font-weight: 700 !important;
font-size: 86px !important;
line-height: 86px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* GRADZEICHEN */
.bdb_weather .bdb__temp::after{
font-family: "Bebas Local", sans-serif !important;
font-weight: 700 !important;
font-size: 42px !important;
line-height: 42px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* SUMMARY LINES (GEFUEHLT / BESCHREIBUNG / TAG MIN MAX) */
.bdb_weather .bdb__summary_line{
font-family: "Inter Local", sans-serif !important;
font-weight: 400 !important;
font-size: 11px !important;
line-height: 20px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* DETAILS ROWS (WIND / REGEN) */
.bdb_weather .bdb__row{
font-family: "Inter Local", sans-serif !important;
font-weight: 400 !important;
font-size: 11px !important;
line-height: 18px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* LABELS (GEFUEHLT / TAG / MIN / MAX / WIND / REGEN) */
.bdb_weather .bdb__label{
font-family: "Inter Local", sans-serif !important;
font-weight: 400 !important;
font-size: 11px !important;
line-height: 18px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 5px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
/* ==========================================================================
MOBILE
========================================================================== */
@media (max-width: 767px){
/* META (ZEIT / DATUM) */
.bdb_weather .bdb__meta{
font-family: "Inter Local", sans-serif !important;
font-weight: 400 !important;
font-size: 11px !important;
line-height: 16px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* TEMPERATUR (GROSS) */
.bdb_weather .bdb__temp{
font-family: "Bebas Local", sans-serif !important;
font-weight: 700 !important;
font-size: 86px !important;
line-height: 86px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* GRADZEICHEN */
.bdb_weather .bdb__temp::after{
font-family: "Bebas Local", sans-serif !important;
font-weight: 700 !important;
font-size: 42px !important;
line-height: 42px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* SUMMARY LINES (GEFUEHLT / BESCHREIBUNG / TAG MIN MAX) */
.bdb_weather .bdb__summary_line{
font-family: "Inter Local", sans-serif !important;
font-weight: 400 !important;
font-size: 11px !important;
line-height: 20px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* DETAILS ROWS (WIND / REGEN) */
.bdb_weather .bdb__row{
font-family: "Inter Local", sans-serif !important;
font-weight: 400 !important;
font-size: 11px !important;
line-height: 18px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* LABELS (GEFUEHLT / TAG / MIN / MAX / WIND / REGEN) */
.bdb_weather .bdb__label{
font-family: "Inter Local", sans-serif !important;
font-weight: 400 !important;
font-size: 11px !important;
line-height: 18px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 5px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
/* ==========================================================================
++++ WEATHER FORECAST ++++
++++ WEATHER FORECAST ++++
++++ WEATHER FORECAST ++++
========================================================================== */
/* ==========================================================================
DESKTOP
========================================================================== */
@media (min-width: 1025px){
/* TAGE (HEUTE, MORGEN...) */
.bdb_weather_forecast .bdb__forecast_day{
font-family: "Inter Local", sans-serif !important;
font-weight: 500 !important;
font-size: 10px !important;
line-height: 12px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* TEMPERATUR */
.bdb_weather_forecast .bdb__forecast_temps{
font-family: "Inter Local", sans-serif !important;
font-weight: 600 !important;
font-size: 10px !important;
line-height: 15px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* REGENWAHRSCHEINLICHKEIT */
.bdb_weather_forecast .bdb__forecast_rain{
font-family: "Inter Local", sans-serif !important;
font-weight: 400 !important;
font-size: 10px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
/* ==========================================================================
TABLET
========================================================================== */
@media (min-width: 768px) and (max-width: 1024px){
/* TAGE (HEUTE, MORGEN...) */
.bdb_weather_forecast .bdb__forecast_day{
font-family: "Inter Local", sans-serif !important;
font-weight: 500 !important;
font-size: 10px !important;
line-height: 12px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* TEMPERATUR */
.bdb_weather_forecast .bdb__forecast_temps{
font-family: "Inter Local", sans-serif !important;
font-weight: 600 !important;
font-size: 9px !important;
line-height: 15px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* REGENWAHRSCHEINLICHKEIT */
.bdb_weather_forecast .bdb__forecast_rain{
font-family: "Inter Local", sans-serif !important;
font-weight: 400 !important;
font-size: 9px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
/* ==========================================================================
MOBILE
========================================================================== */
@media (max-width: 767px){
/* TAGE (HEUTE, MORGEN...) */
.bdb_weather_forecast .bdb__forecast_day{
font-family: "Inter Local", sans-serif !important;
font-weight: 500 !important;
font-size: 10px !important;
line-height: 12px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* TEMPERATUR */
.bdb_weather_forecast .bdb__forecast_temps{
font-family: "Inter Local", sans-serif !important;
font-weight: 600 !important;
font-size: 9px !important;
line-height: 15px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* REGENWAHRSCHEINLICHKEIT */
.bdb_weather_forecast .bdb__forecast_rain{
font-family: "Inter Local", sans-serif !important;
font-weight: 400 !important;
font-size: 9px !important;
letter-spacing: 0px !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
}
/* ==========================================================================
++++ TYPO HEALTH, GESUNDHEIT ALLERGIEN, FINANZEN, ASTRO++++
++++ TYPO HEALTH, GESUNDHEIT ALLERGIEN, FINANZEN, ASTRO++++
++++ TYPO HEALTH, GESUNDHEIT ALLERGIEN, FINANZEN, ASTRO++++
========================================================================== */
/* ==========================================================================
DESKTOP
========================================================================== */
@media (min-width: 1025px){
.bdb_data_block .bdb_table4 th,
.bdb_data_block .bdb_table4 td{
font-family: "Inter Local", sans-serif !important;
font-size: 11px !important;
line-height: 14px !important;
font-weight: 400 !important;
letter-spacing: 0px !important;
}
.bdb_data_block .bdb_table4 td{
font-weight: 500 !important;
}
}
/* ==========================================================================
TABLET
========================================================================== */
@media (min-width: 768px) and (max-width: 1024px){
.bdb_data_block .bdb_table4 th,
.bdb_data_block .bdb_table4 td{
font-family: "Inter Local", sans-serif !important;
font-size: 11px !important;
line-height: 14px !important;
font-weight: 400 !important;
letter-spacing: 0px !important;
}
.bdb_data_block .bdb_table4 td{
font-weight: 500 !important;
}
}
/* ==========================================================================
MOBILE
========================================================================== */
@media (max-width: 767px){
.bdb_data_block .bdb_table4 th,
.bdb_data_block .bdb_table4 td{
font-family: "Inter Local", sans-serif !important;
font-size: 11px !important;
line-height: 14px !important;
font-weight: 400 !important;
letter-spacing: 0px !important;
}
.bdb_data_block .bdb_table4 td{
font-weight: 500 !important;
}
}
/* ==========================================================================
++++ TYPO HEALTH, GESUNDHEIT ALLERGIEN, FINANZEN, ASTRO++++
========================================================================== */
/* ==========================================================================
DESKTOP
========================================================================== */
@media (min-width: 1025px){
.bdb_data_block .bdb_table4 tr:nth-child(even){
background-color: #fafbfc !important;
}
}
/* ==========================================================================
TABLET
========================================================================== */
@media (min-width: 768px) and (max-width: 1024px){
.bdb_data_block .bdb_table4 tr:nth-child(even){
background-color: #fafbfc !important;
}
}
/* ==========================================================================
MOBILE
========================================================================== */
@media (max-width: 767px){
.bdb_data_block .bdb_table4 tr:nth-child(even){
background-color: #fafbfc !important;
}
}
/* ==========================================================================
DATA BLOCK WRAPPER – HEALTH / FINANCE / ASTRO
Same border logic as WEATHER
========================================================================== */
.bdb_data_block{
border-top-width: 1px !important;
border-right-width: 1px !important;
border-bottom-width: 1px !important;
border-left-width: 1px !important;
border-top-style: solid !important;
border-right-style: solid !important;
border-bottom-style: solid !important;
border-left-style: solid !important;
border-top-color: #e6e9eb !important;
border-right-color: #e6e9eb !important;
border-bottom-color: #e6e9eb !important;
border-left-color: #e6e9eb !important;
border-top-left-radius: 3px !important;
border-top-right-radius: 3px !important;
border-bottom-right-radius: 3px !important;
border-bottom-left-radius: 3px !important;
overflow: hidden !important;
}
/* ==========================================================================
DATA BLOCK INNER PADDING – match weather feel
========================================================================== */
.bdb_data_block{
background-color: #f5f7f8 !important;
padding-top: 10px !important;
padding-right: 10px !important;
padding-bottom: 10px !important;
padding-left: 10px !important;
}
/* ==========================================================================
ASTRO – MOON GIMMICK SPACING (scoped)
========================================================================== */
.bdb_home_astro .bdb_moon{
margin-top: 8px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 8px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
border-top-width: 1px !important;
border-right-width: 0px !important;
border-bottom-width: 0px !important;
border-left-width: 0px !important;
border-top-style: solid !important;
border-top-color: #e6e9eb !important;
}
/* ==========================================================================
TABLE4 ROW PADDING – gentle harmonization
========================================================================== */
.bdb_data_block .bdb_table4 th,
.bdb_data_block .bdb_table4 td{
padding-top: 6px !important;
padding-right: 8px !important;
padding-bottom: 6px !important;
padding-left: 8px !important;
}
/* ==========================================================================
TABLE4 – FIXED GEOMETRY (WIDE LABELS)
Left side = 20% | 30%
Right side = 20% | 30%
Total = 100%
- Values (col 2 + col 4) right-aligned
========================================================================== */
.bdb_data_block .bdb_table4{
width: 100% !important;
table-layout: fixed !important;
border-collapse: collapse !important;
}
.bdb_data_block .bdb_table4 th,
.bdb_data_block .bdb_table4 td{
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
}
/* Left pair */
.bdb_data_block .bdb_table4 th:nth-child(1){
width: 30% !important;
text-align: left !important;
}
.bdb_data_block .bdb_table4 td:nth-child(2){
width: 20% !important;
text-align: right !important;
}
/* Right pair */
.bdb_data_block .bdb_table4 th:nth-child(3){
width: 30% !important;
text-align: left !important;
}
.bdb_data_block .bdb_table4 td:nth-child(4){
width: 20% !important;
text-align: right !important;
}
/* ==========================================================================
BDB TABLE4 ICONS – INLINE SVG
========================================================================== */
.bdb_data_block svg.bdb_i{
width: 8px !important;
height: 8px !important;
margin-top: 0px !important;
margin-right: 4px !important;
margin-bottom: 0px !important;
margin-left: 4px !important;
display: inline-block !important;
vertical-align: -2px !important;
}
.bdb_table4 img.bdb_i{
width: 13px !important;
height: 13px !important;
}
/* ==========================================================================
++++ HOROSKOP ++++
++++ HOROSKOP ++++
++++ HOROSKOP ++++
========================================================================== */
/* ==========================================================================
DESKTOP
========================================================================== */
/* ==========================================================================
TABLET
========================================================================== */
/* ==========================================================================
MOBILE
========================================================================== */
/* ==========================================================================
++++ SCHNAPPSCHUSS BILDERWAND ++++
++++ SCHNAPPSCHUSS BILDERWAND ++++
++++ SCHNAPPSCHUSS BILDERWAND ++++
========================================================================== */
body.page-id-11252 .fusion-filters{
margin-bottom: 10px !important;
margin-top: 0px !important;
display: flex !important;
min-height: 34px !important;
}
/* ==========================================================================
SCHNAPPSCHUESSE - WP ULIKE CENTER (SCOPED)
========================================================================== */
body.page-id-11252 .bnet_snap_desk .wpulike,
body.page-id-11252 .bnet_snap_tab .wpulike,
body.page-id-11252 .bnet_snap_mob .wpulike{
display: flex !important;
justify-content: center !important;
align-items: center !important;
width: 100% !important;
margin-top: 0px !important;
margin-right: 0px !important;
margin-bottom: 0px !important;
margin-left: 0px !important;
padding-top: 0px !important;
padding-right: 0px !important;
padding-bottom: 0px !important;
padding-left: 0px !important;
}
/* inner wrapper */
body.page-id-11252 .bnet_snap_desk .wp_ulike_general_class,
body.page-id-11252 .bnet_snap_tab .wp_ulike_general_class,
body.page-id-11252 .bnet_snap_mob .wp_ulike_general_class{
display: flex !important;
justify-content: center !important;
align-items: center !important;
}
/* optional: Abstand zwischen Herz und Zahl */
body.page-id-11252 .wp_ulike_general_class .count-box{
margin-left: 6px !important;
}
/* ==========================================================================
SCHNAPPSCHUESSE (PAGE 11252) - KILL ALL VERTICAL DIVIDERS
========================================================================== */
/* DESKTOP + TABLET: pseudo divider */
body.page-id-11252 .bnet_snap_desk .post-card::after,
body.page-id-11252 .bnet_snap_tab .post-card::after{
content: none !important;
display: none !important;
width: 0px !important;
background-color: transparent !important;
}
/* MOBILE: border divider inside swiper slides */
body.page-id-11252 .bnet_snap_mob .fusion-post-cards .swiper-slide .fusion-column-wrapper{
border-right: 0px !important;
border-top: 0px !important;
border-bottom: 0px !important;
border-left: 0px !important;
padding-right: 0px !important;
}
/* ==========================================================================
BORNHEIM.NET
SCHNAPPSCHUESSE - SET BODY CLASS WHEN FILTERS ARE READY (ANTI-FOUC)
========================================================================== */
add_action('wp_footer', 'bnet_snap_filters_ready_class', 101);
function bnet_snap_filters_ready_class() {
if ( ! is_page(11252) ) {
return;
}
?>