/* H2O - mobile et paysage (jusqu'a 1024px) - v26 */ @media (max-width: 1024px) { /* --- menu burger ouvert : on masque la barre collante (sinon coincee entre le logo et les entrees du menu, cf. classe posee en JS). --- */ body.h2o-menu-open #h2o-bar { display: none !important; } /* --- formulaire de filtres : empilement pleine largeur --- Les champs REM sont en col-xs-6 (50%) : 3 selects -> 2 + 1 orphelin qui laisse un vide. On empile tout en pleine largeur, comme le champ mot-cle. Scope a la page liste via la classe body h2o-actif. */ .h2o-actif .rem-live-search-property-form .row { margin-left: 0 !important; margin-right: 0 !important; } .h2o-actif .rem-live-search-property-form .col-sm-12.margin-bottom { padding: 0 !important; } .h2o-actif .rem-live-search-property-form .multiselect { width: 100% !important; float: none !important; padding: 0 !important; margin: 0 0 8px !important; } .h2o-actif .rem-live-search-property-form .multiselect .selectBox { width: 100% !important; } .h2o-actif .rem-live-search-property-form .advSrch { padding: 4px 0 2px !important; text-align: left !important; } /* --- header du theme non collant sur la liste d'annonces (mobile) --- Les sections Elementor du header ont "sticky:top" active aussi sur mobile (elementor-sticky--active -> position:fixed au scroll). Sur cette page, le bandeau logo doit repartir au scroll : on annule le collage (retour dans le flux) et on masque le spacer clone qu'Elementor insere pour combler le vide. Scope aux 3 pages de liste (FR/EN/DE) : le sticky reste actif ailleurs. Sur PC (>= 1025px) : non concerne, le header sticky est conserve. */ .page-id-73 .elementor-location-header .elementor-sticky--active, .page-id-19969 .elementor-location-header .elementor-sticky--active, .page-id-20109 .elementor-location-header .elementor-sticky--active { position: static !important; top: auto !important; width: auto !important; transform: none !important; } .page-id-73 .elementor-location-header .elementor-sticky__spacer, .page-id-19969 .elementor-location-header .elementor-sticky__spacer, .page-id-20109 .elementor-location-header .elementor-sticky__spacer { display: none !important; } /* --- bandeau de contact masque sur mobile --- Le numero n'etait pas cliquable (aucun lien tel:) et le selecteur de langue existe deja en pied de page. Le telephone devient un lien d'appel en tete du menu burger, joignable depuis n'importe ou dans la liste. */ .elementor-element-1ab312b1 { display: none !important; } /* --- en-tete resserre --- */ header.elementor-location-header .elementor-section, header.elementor-location-header .elementor-top-section, header.elementor-location-header .elementor-inner-section { padding-top: 0 !important; padding-bottom: 0 !important; min-height: 0 !important; } header.elementor-location-header .elementor-element-populated { padding-top: 3px !important; padding-bottom: 3px !important; } header.elementor-location-header .elementor-widget-wrap { padding-top: 0 !important; padding-bottom: 0 !important; } header.elementor-location-header .elementor-widget { margin-bottom: 0 !important; } header.elementor-location-header .elementor-widget-theme-site-logo { line-height: 0; } .elementor-element-62b3b7d img { max-height: 36px; width: auto; } .elementor-element-6ac24c0 { display: none; } /* bloc d'espacement vide */ .elementor-element-7bbddc3, /* Connexion -> barre ou burger */ .elementor-element-26ac27d { display: none; } /* Ma selection -> barre ou burger */ .page-id-73 .elementor-element-5f22b74, .page-id-19969 .elementor-element-5f22b74, .page-id-20109 .elementor-element-5f22b74 { display: none; } .h2o-ajout > a { font-weight: 600; } .h2o-appel > a { font-weight: 700 !important; color: #294c85 !important; } /* --- panneaux de filtres en surimpression --- */ .multiselect { position: relative; } .multiselect .checkboxes { position: absolute; z-index: 999; background: #fff; border: 1px solid #ddd; max-height: 260px; overflow: auto; left: 0; right: 0; box-shadow: 0 6px 16px rgba(0,0,0,.14); padding: 6px 10px; } /* --- section du formulaire repliee : collapse TOTAL pour coller la barre au header --- Le conteneur Elementor gardait ~20px de haut (fond #eef2f8 = bande vide visible entre le logo et la barre). On force la section repliee a 0 de haut, clippee. A l'ouverture, la classe est retiree (JS) -> hauteur auto revient. */ .h2o-recherche-repliee { height: 0 !important; min-height: 0 !important; overflow: hidden !important; padding-top: 0 !important; padding-bottom: 0 !important; margin: 0 !important; } .h2o-recherche-repliee .elementor-element-populated, .h2o-recherche-repliee .elementor-widget-wrap, .h2o-recherche-repliee .elementor-widget, .h2o-recherche-repliee .elementor-widget-container { padding-top: 0 !important; padding-bottom: 0 !important; margin-top: 0 !important; margin-bottom: 0 !important; } /* --- barre collante --- */ /* margin-top -10px : neutralise le padding-top de 10px de la colonne Elementor de la section grille, pour que la barre colle le bandeau logo (gap 0). */ #h2o-bar { position: sticky; top: 0; z-index: 900; margin-top: -10px; display: flex; align-items: center; gap: 8px; flex-wrap: nowrap; background: #fff; border-top: 1px solid #e5e9f0; border-bottom: 1px solid #e5e9f0; padding: 8px 12px; box-shadow: 0 2px 8px rgba(15,23,42,.07); } #h2o-bar .h2o-count { font-weight: 700; color: #294c85; font-size: 14px; white-space: nowrap; } #h2o-bar .h2o-fav { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 8px; border: 1px solid #d7dde8; color: #294c85; text-decoration: none; flex: 0 0 auto; } #h2o-bar .h2o-fav svg { width: 18px; height: 18px; fill: #294c85; } /* Hors connexion : icone carree (le libelle « Connexion » vit en title/aria-label). */ #h2o-bar .h2o-connexion { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 36px; height: 36px; border-radius: 8px; border: 1px solid #294c85; color: #294c85; background: #fff; text-decoration: none; } #h2o-bar .h2o-connexion svg { width: 18px; height: 18px; fill: #294c85; } #h2o-bar .h2o-filtrer { margin-left: auto; height: 36px; background: #294c85; color: #fff; border: 0; border-radius: 8px; padding: 0 14px; font-size: 14px; font-weight: 600; font-family: inherit; cursor: pointer; } #h2o-bar form { margin: 0; } #h2o-bar .rem-topbar { margin: 0; display: block; } #h2o-bar .rem-topbar > div { padding: 0; width: auto; float: none; } #h2o-bar .rem-topbar .col-xs-8, #h2o-bar .rem-topbar .col-sm-6 { display: none; } /* --- tri : la barre n'affiche que « Trier », le select natif est pose transparent par-dessus la pastille (le menu deroulant natif garde les intitules complets). --- */ #h2o-bar .h2o-tri { position: relative; display: inline-flex; align-items: center; flex: 0 0 auto; height: 36px; padding: 0 11px; border-radius: 8px; border: 1px solid #d7dde8; background: #fff; color: #294c85; font-size: 13.5px; font-weight: 600; white-space: nowrap; } #h2o-bar .h2o-tri .h2o-tri-chevron { width: 13px; height: 13px; fill: #294c85; margin-left: 5px; } /* Le select natif, transparent, est etire sur toute la pastille par ses 4 decalages (les