/** * Theme Name: FOR NEW LIVING - Divi Child * Author: Mike Mylenbusch * Template: Divi * Text Domain: for-new-living-divi-child * Description: Smart. Flexible. Beautiful. * Author URI: https://LBM-IT%20GmbH * Version: 1.0 */ /* DIVI Menü Modifikationen */ /* Bestehende Border entfernen und Platz für die Linie schaffen */ .et_pb_menu nav > ul > li:not(:last-child) { border-right: none; /* Alte Linie entfernen */ position: relative; /* Wichtig für die Positionierung der neuen Linie */ } /* Die neue Trennlinie als Pseudo-Element */ .et_pb_menu nav > ul > li:not(:last-child)::after { content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); /* Zentriert die Linie vertikal */ width: 1px; /* Breite der Linie */ height: 20px; /* gewünschte Höhe */ background-color: #cccccc; /* Farbe der Linie */ } /* Erhöhte Priorität für die Abstände */ .et_pb_menu .et-menu-nav > ul > li > a { padding-left: 25px !important; padding-right: 25px !important; } /* vertikale Zentrierung der Linie */ .et_pb_menu .et-menu-nav > ul > li { padding-left: 0 !important; padding-right: 0 !important; } /* Verschiebt die gesamte Navigation (Texte + Linien) nach unten */ .et_pb_menu__menu { margin-top: 65px; } /* Bestehende Border entfernen und Platz für die Linie schaffen */ .et_pb_fullwidth_menu nav > ul > li:not(:last-child) { border-right: none !important; /* Alte Linie entfernen */ position: relative; /* Wichtig für die Positionierung der neuen Linie */ } /* Die neue Trennlinie als Pseudo-Element */ .et_pb_fullwidth_menu nav > ul > li:not(:last-child)::after { content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); /* Zentriert die Linie vertikal */ width: 1px; /* Breite der Linie */ height: 20px; /* gewünschte Höhe */ background-color: #cccccc; /* Farbe der Linie */ } /* Erhöhte Priorität für die Abstände der Links */ .et_pb_fullwidth_menu .fullwidth-menu-nav > ul > li > a { padding-left: 25px !important; padding-right: 25px !important; } /* Entfernen der Standard-Paddings der Listenelemente für die Zentrierung */ .et_pb_fullwidth_menu .fullwidth-menu-nav > ul > li { padding-left: 0 !important; padding-right: 0 !important; } /***********************************************************************************************************************************/ /* Lightbox ACF Galerie */ .agrfuxd-lightbox-close { background: rgba(255, 255, 255, 0.5); } .agrfuxd-lightbox-nav { background: rgba(255, 255, 255, 0.5); } /***********************************************************************************************************************************/ /* Container & Grid */ .immo-meta-container { padding-top: 10px; /* margin-top: 10px; */ } /* Icon Größe */ .immo-item .et-pb-icon { font-family: 'ETmodules' !important; font-size: 20px !important; margin-right: 5px; display: inline-block; vertical-align: middle; line-height: 1; color: #444; } /* Footer Bereich */ .immo-footer { display: flex; justify-content: space-between; align-items: center; background: #f8f8f8; padding: 20px 15px; margin: -10px -10px -20px -20px; border-top: 1px solid #eee; } .immo-price { font-weight: 600; font-size: 17px; color: #127384; padding-left:10px; } /* Button */ .immo-button { position: relative; padding: 6px 26px; font-size: 16px; font-weight: 500; color: #ffffff; /* Hauptfarbe bleibt */ background: linear-gradient(135deg, #127384 0%, #1593a8 100%); border: none; border-radius: 6px; cursor: pointer; overflow: hidden; /* Depth */ box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08), inset 0 1px 0 rgba(255,255,255,0.2); transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.25s cubic-bezier(0.4, 0, 0.2, 1), background 0.4s ease; } /* Hover */ .immo-button:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12), inset 0 1px 0 rgba(255,255,255,0.3); background: linear-gradient(135deg, #127384 0%, #1aa3bb 100%); } /* Click */ .immo-button:active { transform: translateY(1px); box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1), inset 0 2px 4px rgba(0,0,0,0.15); } /* Glanzstreifen */ .immo-button::before { content: ''; position: absolute; top: 0; left: -120%; width: 60%; height: 100%; background: linear-gradient( to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.6) 50%, rgba(255,255,255,0) 100% ); transform: skewX(-25deg); transition: left 0.8s ease; z-index: 2; } .immo-button:hover::before { left: 140%; } /* Subtiler Innen-Glow */ .immo-button::after { content: ''; position: absolute; inset: 0; border-radius: 6px; box-shadow: inset 0 0 0 1px rgba(255,255,255,0.15), inset 0 0 10px rgba(255,255,255,0.1); opacity: 0; transition: opacity 0.3s ease; } .immo-button:hover::after { opacity: 1; } /* Styling für die Immobilien-Adresse Zeile */ .immo-art-line { font-size: 14px; /* text-transform: uppercase;*/ letter-spacing: 1px; line-height: 1.3em; color: #127384; margin-bottom: 12px; font-weight: 600; display: block; border-bottom: 1px solid #ccc; /* Optionale Trennlinie zum Grid */ padding-bottom: 5px; } /* Sicherstellen, dass das Grid genug Abstand hat */ .immo-grid { margin-top: 10px; } /* --- Desktop & Tablet (2-spaltig) --- */ .immo-grid { display: grid; grid-template-columns: repeat(2, 50%); /* Erzeugt 2 gleich große Spalten */ grid-gap: 10px 10px; /* Abstand zwischen den Elementen (oben/unten links/rechts) */ font-size: 14px; color: #555; margin-bottom: 20px; } /* --- Mobilansicht --- */ @media screen and (max-width: 767px) { .immo-grid { /* grid-template-columns: 100% !important; /* Wechselt auf eine einzige Spalte */ font-size: 12px; line-height: 12px; } /* Optional: Falls die Items im Footer (Preis & Button) mobil auch untereinander stehen sollen */ .immo-footer { display: flex; flex-direction: column; grid-gap: 10px; text-align: center; } /* Optional: Steuerung der texte und icons für mobil */ /* Blendet die Labels auf Handys aus .immo-item .immo-label { display: none !important; }*/ /* Blendet die Icons auf Handys aus */ .immo-item .immo-icon { display: none !important; } } /***********************************************************************************************************************************/