/* ===== Prosanté.re — modernisation 2026 (Claude, 26/09/2026) ===== Fichier réversible : le supprimer rétablit l'apparence d'origine. Aucune modification de mise en page. */ @import url('https://fonts.googleapis.com/css2?family=Outfit:wght@500;600;700&family=Inter:wght@400;500;600&display=swap'); :root{--ps-vert:#6f9c24;--ps-vert-clair:#8bb633;--ps-bleu:#1f7f8f;--ps-bleu-clair:#2fa4b5;--ps-encre:#1f2d2f;--ps-texte:#3d4a4c;--ps-bord:#e3ecd6;--ps-fond:#f5f8f3;} body{font-family:'Inter','Segoe UI',system-ui,-apple-system,sans-serif;color:var(--ps-texte);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;line-height:1.6;} h1,h2,h3,h4,.page-header h1,.item-title,.contentheading{font-family:'Outfit','Segoe UI',sans-serif;color:var(--ps-encre);letter-spacing:-.01em;line-height:1.25;} a{color:var(--ps-bleu);transition:color .15s ease;} a:hover,a:focus{color:#155d69;} a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(47,164,181,.45);outline-offset:2px;} /* En-tête */ header.header{box-shadow:0 2px 14px rgba(31,45,47,.07);position:relative;z-index:20;} /* Boutons */ .btn,button,input[type=submit],input[type=button]{border-radius:999px!important;font-weight:600;transition:transform .12s ease,box-shadow .15s ease,background-color .15s ease;} .btn-primary,button.btn-primary,input[type=submit]{background:var(--ps-bleu)!important;border-color:var(--ps-bleu)!important;color:#fff!important;box-shadow:0 3px 10px rgba(31,127,143,.22);} .btn-primary:hover,button.btn-primary:hover,input[type=submit]:hover{background:#176a78!important;border-color:#176a78!important;transform:translateY(-1px);} .btn-success{background:var(--ps-vert)!important;border-color:var(--ps-vert)!important;} /* Champs de formulaire */ input[type=text],input[type=email],input[type=password],input[type=tel],input[type=search],input[type=number],select,textarea{border:1px solid #cfdbd9!important;border-radius:10px!important;box-shadow:none!important;transition:border-color .15s ease,box-shadow .15s ease;} input[type=text]:focus,input[type=email]:focus,input[type=password]:focus,input[type=tel]:focus,input[type=search]:focus,select:focus,textarea:focus{border-color:var(--ps-bleu-clair)!important;box-shadow:0 0 0 3px rgba(47,164,181,.18)!important;} .input-prepend .add-on{border-radius:10px 0 0 10px!important;} .input-prepend input{border-radius:0 10px 10px 0!important;} /* Contenus, cartes et images */ .item-page img,.fc_item_image img,.fc-item img,.blog img,.fcitem img{border-radius:12px;} .well,.fc-item,.fcitem,.fclayout .fc_items_block>*,.adsmanager .adsmanager_ads_box{border-radius:14px;} .pagination ul>li>a,.pagination ul>li>span{border-radius:8px;margin:0 2px;} table{border-collapse:collapse;} .table th{background:#eef8fa;color:var(--ps-encre);} /* Menus déroulants */ .dropdown-menu{border-radius:12px;border:1px solid var(--ps-bord);box-shadow:0 10px 30px rgba(31,45,47,.12);padding:6px 0;} .dropdown-menu li>a{padding:8px 16px;} /* Pied de page */ footer.footer a{text-decoration:none;} footer.footer a:hover{text-decoration:underline;} /* Accessibilité mobile : zones tactiles */ @media (max-width:767px){body{font-size:15px;}.btn,button,input[type=submit]{min-height:44px;}input[type=text],input[type=email],input[type=password],select{min-height:44px;font-size:16px;}} @media (prefers-reduced-motion:reduce){*{transition:none!important;}} /* Pages légales accessibles à tous (obligation légale) : pas de fenêtre de connexion forcée */ body.itemid-202 #popup,body.itemid-202 #overlay,body.itemid-203 #popup,body.itemid-203 #overlay,body.itemid-204 #popup,body.itemid-204 #overlay,body.itemid-205 #popup,body.itemid-205 #overlay{display:none!important;} body.itemid-202,body.itemid-203,body.itemid-204,body.itemid-205{overflow:auto!important;} /* Champs : fond clair */ input[type=text],input[type=email],input[type=password],input[type=tel],input[type=search],input[type=number],select,textarea{background-color:#fbfcfb!important;} /* Carrousels d'articles : pas de débordement horizontal sur mobile */ .mod_fc_carousel_mask{overflow:hidden!important;} img{max-width:100%;height:auto;} @media (max-width:767px){html,body{overflow-x:hidden;}} /* ===== Lot 2 (26/09/2026) : listes, annuaires, emploi ===== */ /* Cartes articles / fiches annuaire */ .gridItemInner{background:#fff !important;border:1px solid #e3ecd6;border-radius:14px !important;box-shadow:0 4px 14px rgba(31,45,47,.07) !important;overflow:hidden;transition:transform .2s ease,box-shadow .2s ease} .gridItemInner:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(31,45,47,.13) !important} .gridItemInner .itemInnerTop{background:#fff !important} .gridItemInner .itemInnerBottom{background:#f7faf3 !important;border-top:1px solid #e3ecd6} .articleItemImg img,.gridItemInner .fc_field_image{border-radius:0} .articleItemImg img{aspect-ratio:16/10;object-fit:cover;width:100%;background:#eef3ea} .fcitem_title,.gridItemInner h2,.gridItemInner h3{font-family:'Outfit',sans-serif !important;font-weight:600;color:#1f2d2f} .fcitem_title:hover{color:#1f7f8f} /* Boutons « Détail » / « Voir l'annonce » */ .miniLink{border-radius:999px !important;padding:5px 14px !important;font-family:'Outfit',sans-serif;font-weight:600;transition:background .2s ease,transform .15s ease} .miniLink:hover{transform:translateY(-1px)} /* Panneaux latéraux */ .panelHealth{border-radius:16px !important;overflow:hidden} .panelHealth input[type=text],.panelHealth select{border-radius:10px !important} /* Recherche des annuaires (en-tête) */ #absoluteHeader .panelHealth{background:#fff !important;border:1px solid #d9e2d0;box-shadow:0 6px 18px rgba(31,45,47,.10);padding:10px 12px !important} #absoluteHeader .fc_filter_label{display:none !important} #absoluteHeader .fc_filter_line{margin:0 !important;padding:0 !important} #absoluteHeader .panelHealth{min-height:0 !important} #absoluteHeader fieldset{padding:0 !important} #absoluteHeader .fc_filter_line,#absoluteHeader .fc_filter_html{height:auto !important} #absoluteHeader input[type=text]{margin:0 !important;height:40px} #absoluteHeader input[type=text]{border:1px solid #cfdcc4 !important;border-radius:999px !important;padding-left:16px !important;width:100%} @media (max-width:991px){#absoluteHeader{position:static !important;width:auto !important;margin:0 0 16px}} /* Offres d'emploi */ .adsmanager-grid{border-radius:14px !important;overflow:hidden;background:#fff !important;border:1px solid #e3ecd6;box-shadow:0 4px 14px rgba(31,45,47,.07);transition:box-shadow .2s ease} .adsmanager-grid:hover{box-shadow:0 12px 28px rgba(31,45,47,.13)} .adsmanager-grid .list-image:not(:has(img)){display:none} @media (max-width:767px){.adsmanager-grid .hidden-phone{display:block !important}.adsmanager-grid .healthpipe{display:none}} /* Bandeau texte « Retrouvez votre identité visuelle » (page emploi) */ #before .banneritem > a > div:not(:has(img)){background:linear-gradient(120deg,#17545e,#1f7f8f 55%,#6f9c24) !important;border-radius:18px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;min-height:120px;height:auto !important;padding:20px 24px;width:100% !important;max-width:100% !important;box-sizing:border-box} #before .banneritem:has(> a > div:not(:has(img))),#before .banneritem > a:has(> div:not(:has(img))){display:block;width:100% !important} #before .banneritem > a > div:not(:has(img)) > div{color:#fff !important;font-family:'Outfit',sans-serif !important;font-size:clamp(20px,3.2vw,32px) !important;line-height:1.25 !important;height:auto !important;margin:0 !important;padding:0 !important;text-align:center} /* Mobile : colonnes et boutons des listes dans l'écran */ @media (max-width:767px){#main > div{width:auto !important;max-width:100% !important}.itemInnerTop .miniLink{left:auto !important;float:right;margin:6px 0 10px}.itemInnerTop::after{content:"";display:block;clear:both}} /* ===== DEBUT BLOC CLAUDE 2026-10-01 — supprimer de DEBUT a FIN pour annuler ===== */ /* 1. Mur de connexion : retire uniquement sur la vue article. Accueil, annuaires Kel, emplois et espace prive restent inchanges. */ body.com_flexicontent.view-item #popup, body.com_flexicontent.view-item #dialog.window{display:none !important} body.com_flexicontent.view-item{overflow:auto !important} /* 2. Vignette : remplit la carte, ratio 16/9, plus de fond gris #ddd */ .fc_field_image{width:100% !important;height:auto !important;aspect-ratio:16/9;object-fit:cover;display:block} .fc_item a:has(> .fc_field_image),.fcitem_image,.fc_field_image_container{background:transparent !important;display:block;line-height:0} /* 3. Carte article */ .flexicontent .fc_item{border-radius:10px;overflow:hidden;border:1px solid #e0e5de;background:#fff;transition:box-shadow .18s ease,transform .18s ease} .flexicontent .fc_item:hover{transform:translateY(-2px);box-shadow:0 6px 24px rgba(20,26,22,.10)} .flexicontent .fc_item:focus-within{outline:2px solid #1f7f8f;outline-offset:2px} /* 4. Metadonnees sous l'image au lieu de par-dessus */ .fc_item .fc_meta,.fc_item .fc_subtitles,.fc_item .fc_itemdata{position:static !important;background:transparent !important;color:#7d8a82 !important;padding:10px 14px 0;font-size:12.5px} .fc_item .fc_meta a{color:#7d8a82} /* 5. Menu mobile : les entrees s'empilent au lieu de s'aligner */ .mobile-menu-inner ul.nav{display:block !important} .mobile-menu-inner ul.nav > li{width:100%;float:none} .mobile-menu-inner ul.nav > li > a{display:block;padding:12px 18px} /* 6. Largeur de lecture du corps d'article */ body.view-item .flexicontent .description{max-width:68ch;line-height:1.7} /* ===== FIN BLOC CLAUDE 2026-10-01 ===== */ /* ===== DEBUT BLOC CLAUDE 2026-10-01 B — typographie + tuiles ===== A coller A LA FIN de templates/healthy/css/user.css, sans rien effacer. Pour annuler : supprimer de DEBUT B a FIN B. Rien d'autre a toucher. Teste en direct sur l'accueil le 01/10/2026. ================================================================= */ /* --------------------------------------------------------------- B1. TUILES « NOUVEAUTES » (fournisseurs, prestataires, associations) Mesure : les logos sont des carres d'environ 200 px poses dans une case large sur fond gris #eaeaea. Le logo debordait, le nom grave dans l'image sortait du cadre, et la pastille de categorie, placee en absolu a 148 px du haut, se posait dessus. Ici : fond blanc, logo entier et centre, pastille en haut a droite. --------------------------------------------------------------- */ .mod_flexicontent_standard_wrapper_innerbox .image_standard{ background:#fff; border-bottom:1px solid #e3ecd6; overflow:hidden} .mod_flexicontent_standard_wrapper_innerbox .image_standard > a{ display:block; position:relative; background:#fff; overflow:hidden} .mod_flexicontent_standard_wrapper_innerbox .image_standard img{ width:100%; height:100%; object-fit:contain; padding:10px; box-sizing:border-box; background:#fff} .mod_flexicontent_standard_wrapper_innerbox .field_block.field_categories{ top:8px !important; bottom:auto !important; left:auto !important; right:8px !important; width:auto !important} .mod_flexicontent_standard_wrapper_innerbox .field_block.field_categories .fc_categories{ border-radius:999px; font-size:10.5px; padding:3px 10px; box-shadow:0 2px 6px rgba(31,45,47,.18)} /* --------------------------------------------------------------- B2. TYPOGRAPHIE : de cinq familles de texte a deux Le template appelle heebo, signika, lato et Open Sans sur une trentaine de regles dispersees, dont plusieurs portees par des selecteurs a identifiant (#top, #flexicontent) impossibles a depasser autrement. On pose donc une base unique, puis on rend leur police aux titres et aux icones. Inter (texte) et Outfit (titres) sont deja charges par le haut du fichier : aucune requete supplementaire. Heebo et Signika ne sont plus appelees nulle part, le navigateur cesse de les telecharger. --------------------------------------------------------------- */ /* B2a. Base : tout le texte en Inter */ body, body *{font-family:'Inter','Segoe UI',system-ui,-apple-system,sans-serif !important} /* B2b. Titres, boutons et pastilles en Outfit */ body h1, body h2, body h3, body h4, body h5, body .fcitem_title, .fcitem_title a, body .item-title, body .contentheading, body .homeCarousel, body .miniLink, body .btn{font-family:'Outfit','Segoe UI',sans-serif !important} /* B2c. Les polices d'icones gardent la leur — sans ces trois regles, les pictogrammes se changeraient en carres vides. */ i, .fa, [class*="fa-"], .fa:before, [class*="fa-"]:before{font-family:FontAwesome !important} [class^="icon-"], [class*=" icon-"], [class^="icon-"]:before, [class*=" icon-"]:before, [class*="fcfont"], [class*="fcfont"]:before, [class*="fcfont"]:after{font-family:IcoMoon !important} .glyphicon, .glyphicon:before{font-family:'Glyphicons Halflings' !important} /* ===== FIN BLOC CLAUDE 2026-10-01 B ===== */ /* ===== DEBUT BLOC CLAUDE 2026-10-01 C — refonte ===== A coller A LA FIN de templates/healthy/css/user.css, apres le bloc B. Pour annuler : supprimer de DEBUT C a FIN C. Remplace volontairement la regle « vignette » du bloc A (ratio 16/9 en object-fit cover) : ce rognage coupait les logos. Voir C2. Teste a 390 px et en 1280 px le 01/10/2026. ===================================================== */ /* --------------------------------------------------------------- C1. CONTRASTE — le point bloquant Mesure WCAG de la charte : #8bb633 avec du texte blanc donne 2,38:1. Le minimum legal pour du texte est 4,5:1. Le meme aplat avec le texte encre #1f2d2f donne 5,99:1. On garde donc le vert, on change l'encre. La bordure #e3ecd6 est a 1,22:1 : elle ne peut pas servir d'anneau de focus (minimum 3:1), d'ou le #1f7f8f ci-dessous. --------------------------------------------------------------- */ .miniLink.miniGreen, .miniLink.miniGreenNegative, .btn-success, a.fc_categories{color:#1f2d2f !important;font-weight:600} .miniLink.miniGreen{background:#8bb633 !important} .miniLink.miniGreen:hover, .miniLink.miniGreen:focus{background:#7aa22c !important;color:#1f2d2f !important} a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{outline:3px solid #1f7f8f !important;outline-offset:2px} /* --------------------------------------------------------------- C2. UNE SEULE REGLE D'IMAGE POUR TOUT LE SITE Le site melange des photos et des logos dans les memes emplacements. Rogner (cover) coupe les logos ; c'est ce qui tronquait « eduprat », « Avance Sante » ou « Sante Bank ». On passe donc tout en contain sur fond blanc, dans un cadre unique au format 3/2 : rien n'est jamais coupe, et la grille reste alignee. --------------------------------------------------------------- */ .flexi.value[class*="logo"], .flexi.value[class*="image"]{background:#fff !important;border-radius:10px;overflow:hidden} .flexi.value[class*="image"] > span, .flexi.value[class*="image"] > span > a, .flexi.value[class*="logo"] > span, .flexi.value[class*="logo"] > span > a{ display:block !important; height:auto !important; background:transparent !important; line-height:0} .fc_field_image{ aspect-ratio:3/2 !important; object-fit:contain !important; width:100% !important; height:auto !important; background:#fff !important; padding:8px; box-sizing:border-box; display:block} /* --------------------------------------------------------------- C3. VIGNETTE DE REPLI — les contenus sans image propre FLEXIcontent sert une image generique (fld61_default) aux contenus qui n'en ont pas : c'est le cas des formations. On la remplace par un aplat de la charte et un pictogramme dessine en SVG, encode dans la feuille : aucune image sous droits, aucune requete reseau, et tout nouveau contenu sans image en herite automatiquement. --------------------------------------------------------------- */ .flexi.value[class*="image"]:has(img[src*="_default"]), .flexi.value[class*="logo"]:has(img[src*="_default"]){ position:relative; background:linear-gradient(135deg,#2fa4b5,#1f7f8f) !important} .flexi.value:has(img[src*="_default"]) span, .flexi.value:has(img[src*="_default"]) a{background:transparent !important} .flexi.value:has(img[src*="_default"]) .fc_field_image{opacity:0 !important} .flexi.value:has(img[src*="_default"])::after{ content:""; position:absolute; inset:0; pointer-events:none; background:url('data:image/svg+xml;utf8,') center / 32% no-repeat} /* --------------------------------------------------------------- C4. LA PASTILLE DE CATEGORIE NE DEBORDE PLUS Mesure : l'etiquette sortait de 10 px hors de la carte a 390 px. --------------------------------------------------------------- */ .mod_flexicontent_standard_wrapper_innerbox .field_block.field_categories{ max-width:calc(100% - 16px)} .mod_flexicontent_standard_wrapper_innerbox .field_block.field_categories .fc_categories{ display:inline-block; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap} /* --------------------------------------------------------------- C5. MOBILE — LE CONTENU AVANT LES FILTRES Releve a 390 px sur /emplois et sur les annuaires : le panneau de recherche occupe tout le premier ecran, et il faut faire defiler l'equivalent de deux ecrans avant de voir la premiere annonce. On inverse l'ordre sans toucher au gabarit : la colonne de contenu passe devant, le panneau de filtres descend dessous. --------------------------------------------------------------- */ @media (max-width:767px){ .row:has(> .col-md-3):has(> .col-md-9){display:flex;flex-direction:column} .row:has(> .col-md-3):has(> .col-md-9) > .col-md-9{order:1} .row:has(> .col-md-3):has(> .col-md-9) > .col-md-3{order:2;margin-top:28px} /* cibles tactiles : 44 px minimum */ .miniLink, .btn, button, input[type=submit]{min-height:44px;display:inline-flex;align-items:center;justify-content:center} /* titres : interligne serre, sinon un titre mange quatre lignes */ h1,h2,h3,h4,.fcitem_title,.fcitem_title a{line-height:1.2} /* tableaux : ils defilent dans leur cadre au lieu de pousser la page */ table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch} } /* --------------------------------------------------------------- C6. CONFORT DE LECTURE Mesure de reference du secteur : colonne de 618 px a 20 px, soit 62 a 64 signes par ligne. On vise la meme zone. --------------------------------------------------------------- */ body.view-item .flexicontent .description, body.view-item .flexicontent .description p{font-size:18px;line-height:1.65} body.view-item .flexicontent .description{max-width:66ch} /* --------------------------------------------------------------- C7. LISTE DES EMPLOIS EN MOBILE La ligne d'annonce est un flex horizontal : a 390 px la colonne de gauche tombe a la moitie de l'ecran et « Type de contrat » se brise sur trois lignes. On empile. --------------------------------------------------------------- */ @media (max-width:767px){ .adsmanager-grid > a{flex-direction:column !important;align-items:stretch !important;gap:10px} .adsmanager-grid .listitemleft{display:block !important} .adsmanager-grid .listitemright{ flex-direction:row !important; align-items:center !important; justify-content:space-between !important; width:100%} } /* --------------------------------------------------------------- C8. LA BANNIERE NE PASSE PLUS DEVANT LE MENU Diagnostic du 02/10 : le carrousel Cycle2 pose chaque diapositive en position absolue avec z-index 99, alors que l'en-tete est a 20. Les sous-menus deroulants passaient donc DERRIERE la banniere MED'UP, qui masquait « Offres d'emploi » et la moitie de la liste. On remonte l'en-tete au-dessus du carrousel. Rien d'autre ne bouge. --------------------------------------------------------------- */ header.header{z-index:300 !important} /* ===== FIN BLOC CLAUDE 2026-10-01 C ===== */ /* ===== DEBUT BLOC CLAUDE 2026-10-02 D ===== A coller A LA FIN de templates/healthy/css/user.css, apres le bloc C. Pour annuler : supprimer de DEBUT D a FIN D. =========================================== */ /* --------------------------------------------------------------- D1. ACCUEIL : PLUS DE DEMI-COLONNE VIDE Les blocs « Formations Congres et Salons » et « L'actualite des associations » sont deux demi-colonnes cote a cote. Depuis que la rubrique associations est vide, la moitie droite de la rangee restait blanche. Quand un des deux blocs est seul, il prend desormais toute la largeur. Des que la rubrique associations reçoit un nouvel article, les deux reviennent cote a cote automatiquement : rien a defaire. --------------------------------------------------------------- */ .modcontainer_inner .col-md-12 > .panelHealth.col-md-6:only-child{width:100%} /* ===== FIN BLOC CLAUDE 2026-10-02 D ===== */ /* ===== DEBUT BLOC CLAUDE 2026-10-02 E — menu mobile ===== A coller juste apres le bloc D. Pour annuler : supprimer de DEBUT E a FIN E. ========================================================= */ /* Tout est limite au tiroir #sidemenu : aucun effet sur la version ordinateur. */ /* E1 — le tiroir */ body #sidemenu{width:86vw !important;max-width:330px !important;padding:0 !important; background:#1f2d2f !important;overflow-x:hidden !important;overflow-y:auto !important; -webkit-overflow-scrolling:touch;z-index:4000 !important} /* E2 — on annule tout heritage de la mise en page bureau a l'interieur du tiroir */ body #sidemenu .mobile-menu-inner, body #sidemenu .moduletable_menu, body #sidemenu ul, body #sidemenu ul.nav, body #sidemenu ul.nav-child, body #sidemenu .parent ul, body #sidemenu li, body #sidemenu .nav.menu > li, body #sidemenu .nav-child > li, body #sidemenu li > a, body #sidemenu .nav.menu > li > a, body #sidemenu .nav-child > li > a, body #sidemenu li > span{float:none !important;clear:both !important;position:static !important; display:block !important;width:100% !important;max-width:100% !important;min-width:0 !important; margin:0 !important;left:auto !important;right:auto !important;top:auto !important; bottom:auto !important;transform:none !important;box-shadow:none !important; box-sizing:border-box !important} body #sidemenu ul, body #sidemenu .parent ul{padding:0 !important;list-style:none !important; background:transparent !important;border:0 !important;height:auto !important; opacity:1 !important;visibility:visible !important} /* E3 — en-tete du tiroir, qui reste visible au defilement */ body #sidemenu .headMobMenu{position:sticky !important;top:0;z-index:5;display:flex !important; align-items:center;justify-content:space-between;width:100% !important;margin:0 !important; padding:12px 16px !important;background:#1f2d2f !important; border-bottom:1px solid rgba(255,255,255,.14)} body #sidemenu .headMobMenu > div.menu{margin:0 !important; font-family:'Outfit','Segoe UI',sans-serif !important;font-size:19px !important; font-weight:700 !important;color:#fff !important} body #sidemenu #closesidemenu{width:44px !important;height:44px;display:flex !important; align-items:center;justify-content:center;cursor:pointer} body #sidemenu .headMobMenu .menuFa{top:0 !important;font-size:26px !important} /* E4 — entrees de premier niveau */ body #sidemenu .nav.menu > li > a, body #sidemenu .nav.menu > li > span.separator{padding:14px 16px !important;min-height:44px; line-height:1.3 !important;font-family:'Outfit','Segoe UI',sans-serif !important; font-size:15.5px !important;font-weight:600 !important;color:#fff !important; text-align:left !important;white-space:normal !important;overflow-wrap:anywhere; background:rgba(255,255,255,.06) !important;border:0 !important; border-bottom:1px solid rgba(255,255,255,.10) !important;border-radius:0 !important; text-transform:none !important} /* E5 — sous-entrees */ body #sidemenu .nav-child > li > a, body #sidemenu .parent ul a{padding:12px 16px 12px 32px !important;min-height:42px; line-height:1.3 !important;font-family:'Inter','Segoe UI',sans-serif !important; font-size:14.5px !important;font-weight:400 !important;color:#e6efe6 !important; white-space:normal !important;overflow-wrap:anywhere;background:transparent !important; border:0 !important;border-bottom:1px solid rgba(255,255,255,.06) !important} body #sidemenu .nav-child > li, body #sidemenu .parent ul li{padding:0 !important;border-width:0 !important} /* E6 — intertitres (Divers, Espace Candidat, ...) */ body #sidemenu li.divider{border-bottom:0 !important} body #sidemenu li.divider > .separator{padding:16px 16px 6px !important; font-family:'Outfit','Segoe UI',sans-serif !important;font-size:11.5px !important; font-weight:700 !important;letter-spacing:.08em;text-transform:uppercase; color:#a9d05f !important;opacity:1 !important;background:transparent !important; border:0 !important} /* E7 — page courante et appui du doigt */ body #sidemenu .nav.menu > li.current > a, body #sidemenu .nav.menu > li.active > a{background:rgba(139,182,51,.22) !important; box-shadow:inset 4px 0 0 #8bb633 !important} body #sidemenu .nav.menu > li > a:active, body #sidemenu .nav.menu > li > a:focus, body #sidemenu .nav-child > li > a:active{background:rgba(255,255,255,.14) !important} /* E8 — plus de debordement horizontal sur petit ecran */ @media (max-width:1199px){ html,body{overflow-x:hidden !important} img,video,iframe,table{max-width:100% !important} } /* ===== FIN BLOC CLAUDE 2026-10-02 E ===== */ /* ===== DEBUT BLOC CLAUDE 2026-10-02 I — annuaires et qualite des images ===== A coller a la fin de user.css, apres le bloc H. Pour annuler : supprimer de DEBUT I a FIN I. Portee volontairement etroite : seules les pages Kel Fournisseurs (menuitem127) et Kel Associations (menuitem130) sont retouchees. Les listes d'actualites utilisent le meme balisage mais pas les memes champs : les toucher casserait leur mise en page. =========================================================================== */ /* I1 — grille de fiches */ #flexicontent.menuitem127 .gridItemsList, #flexicontent.menuitem130 .gridItemsList{display:grid !important; grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:16px; margin:0 0 24px !important;float:none !important} #flexicontent.menuitem127 .gridItemsList::before, #flexicontent.menuitem127 .gridItemsList::after, #flexicontent.menuitem130 .gridItemsList::before, #flexicontent.menuitem130 .gridItemsList::after{display:none !important;content:none !important} #flexicontent.menuitem127 .gridItemsList > .gridItem, #flexicontent.menuitem130 .gridItemsList > .gridItem{width:auto !important;float:none !important; padding:0 !important;margin:0 !important;border:0 !important} /* I2 — la fiche */ #flexicontent.menuitem127 .gridItemInner, #flexicontent.menuitem130 .gridItemInner{display:flex;flex-direction:column;height:100%; background:#fff;border:1px solid #e3ecd6;border-radius:16px; box-shadow:0 1px 2px rgba(31,45,47,.05);overflow:hidden; transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease} #flexicontent.menuitem127 .gridItem:hover .gridItemInner, #flexicontent.menuitem130 .gridItem:hover .gridItemInner{transform:translateY(-3px); box-shadow:0 10px 24px rgba(31,45,47,.12);border-color:#8bb633} /* I3 — haut de fiche : logo a gauche, nom et resume a droite */ #flexicontent.menuitem127 .itemInnerTop, #flexicontent.menuitem130 .itemInnerTop{display:grid;grid-template-columns:96px 1fr; gap:16px;align-items:start;padding:18px 18px 18px !important;background:none !important; border:0 !important;position:relative} #flexicontent.menuitem127 .itemInnerTop > .fcclear, #flexicontent.menuitem127 .itemInnerTop > .fc_mublock, #flexicontent.menuitem130 .itemInnerTop > .fcclear, #flexicontent.menuitem130 .itemInnerTop > .fc_mublock{display:none !important} #flexicontent.menuitem127 .topavatar, #flexicontent.menuitem130 .topavatar{margin:0 !important;padding:0 !important; background:none !important;border:0 !important;width:96px} #flexicontent.menuitem127 .topavatar .flexi.element, #flexicontent.menuitem127 .topavatar .flexi.value, #flexicontent.menuitem130 .topavatar .flexi.element, #flexicontent.menuitem130 .topavatar .flexi.value{margin:0 !important;padding:0 !important} /* I4 — le logo : taille fixe, jamais deforme, fond blanc */ #flexicontent.menuitem127 .topavatar img, #flexicontent.menuitem130 .topavatar img{display:block;width:96px;height:72px; object-fit:contain;background:#fff;border:1px solid #eef1ea;border-radius:10px; padding:6px;box-sizing:border-box} /* I5 — nom et resume */ #flexicontent.menuitem127 .itemInnerTopRight, #flexicontent.menuitem130 .itemInnerTopRight{min-width:0} #flexicontent.menuitem127 .itemInnerTopRight h3, #flexicontent.menuitem130 .itemInnerTopRight h3{margin:0 0 6px !important; font-family:'Outfit','Segoe UI',sans-serif;font-size:17px;font-weight:700;line-height:1.25} #flexicontent.menuitem127 .itemInnerTopRight h3 a, #flexicontent.menuitem130 .itemInnerTopRight h3 a{color:#1f2d2f !important;text-decoration:none} #flexicontent.menuitem127 .itemInnerTopRight .field_text, #flexicontent.menuitem130 .itemInnerTopRight .field_text{font-family:'Inter',sans-serif; font-size:14px;line-height:1.5;color:#5a6457} /* I6 — bouton Detail, aligne a droite sur sa propre ligne */ #flexicontent.menuitem127 .itemInnerTop > a.miniLink.miniGreen, #flexicontent.menuitem130 .itemInnerTop > a.miniLink.miniGreen{grid-column:1 / -1; justify-self:end;float:none !important;position:static !important;margin:2px 0 0 0 !important; padding:9px 18px !important;border-radius:999px !important;background:#8bb633 !important; color:#1f2d2f !important;font-family:'Outfit',sans-serif;font-size:14px;font-weight:700; text-decoration:none !important;box-shadow:none !important} #flexicontent.menuitem127 .itemInnerTop > a.miniLink.miniGreen:hover, #flexicontent.menuitem130 .itemInnerTop > a.miniLink.miniGreen:hover{background:#7aa32b !important} /* I7 — bloc coordonnees */ #flexicontent.menuitem127 .itemInnerBottom, #flexicontent.menuitem130 .itemInnerBottom{margin-top:auto;display:flex;flex-direction:column; gap:7px;padding:14px 18px !important;background:#f7faf3 !important; border-top:1px solid #eef1ea;font-family:'Inter',sans-serif;font-size:13.5px;color:#3d4a4c} #flexicontent.menuitem127 .itemInnerBottom .fieldItem, #flexicontent.menuitem130 .itemInnerBottom .fieldItem{display:flex;gap:9px;align-items:flex-start; margin:0 !important;padding:0 !important} #flexicontent.menuitem127 .itemInnerBottom a, #flexicontent.menuitem130 .itemInnerBottom a{color:#1f7f8f !important;word-break:break-word} /* I8 — qualite des images, partout sur le site Aucune image n'est etiree au-dela de sa definition reelle, et le rendu reste net quand le navigateur doit la redimensionner. */ img{max-width:100%;height:auto} .fc_field_image,.flexi.value img,.gridItem img{image-rendering:auto} /* ===== FIN BLOC CLAUDE 2026-10-02 I ===== */ /* ============================================================ RATTRAPAGE — blocs F2, G et H a recoller Ils ont ete effaces par un enregistrement fait depuis un onglet d'editeur ouvert AVANT leur ajout : son contenu, plus ancien, a remplace le fichier. Rien d'autre n'est touche. A coller a la fin de user.css, apres le bloc I. ============================================================ */ /* ===== DEBUT BLOC CLAUDE 2026-10-02 F2 — pages d'articles ===== VERSION A UTILISER SI VOUS AVEZ PLACE LE CHAMP « Titre » DANS LE GABARIT FLEXIcontent (le titre est alors affiche par Joomla lui-meme). A coller a la fin de user.css, apres le bloc E. Pour annuler : supprimer de DEBUT F2 a FIN F2. ============================================================== */ /* Le titre natif FLEXIcontent, mis a la charte */ .row.articleDetail .flexi.element.field_title, .row.articleDetail h1.contentheading, .row.articleDetail .fcitem_title{font-family:'Outfit','Segoe UI',sans-serif !important; font-weight:700;font-size:30px;line-height:1.22;color:#1f2d2f; margin:0 0 14px;padding:0 0 14px;border-bottom:3px solid #8bb633} @media (max-width:767px){ .row.articleDetail .flexi.element.field_title, .row.articleDetail h1.contentheading, .row.articleDetail .fcitem_title{font-size:24px} } /* F2 — on masque les boutons de partage AddThis, hors service depuis 2023 (le service a ferme : ces boutons n'affichaient plus rien du tout). */ .row.articleDetail .addthis_toolbox > a, .row.articleDetail .flexitoolbar, .addthis_toolbox.addthis_floating_style{display:none !important} /* F3 — AUTEUR ET DATE : discrets, sur une seule ligne sous le titre */ .row.articleDetail .flexi.element.field_created_by, .row.articleDetail .flexi.element.field_created{font-size:14px;color:#5a6457} .row.articleDetail .flexi.element.field_created_by .flexi.label, .row.articleDetail .flexi.element.field_created .flexi.label, .row.articleDetail .flexi.element.field_created_by .flexi.value, .row.articleDetail .flexi.element.field_created .flexi.value{display:inline} /* F4 — LISIBILITE DU CORPS DE L'ARTICLE Longueur de ligne limitee, texte plus grand, respiration entre paragraphes. */ .row.articleDetail .flexi.value.field_text{max-width:72ch;font-size:17px; line-height:1.72;color:#3d4a4c} .row.articleDetail .flexi.value.field_text p{margin:0 0 1.05em} .row.articleDetail .flexi.value.field_text > p:first-child strong{ font-size:18.5px;line-height:1.6;color:#1f2d2f} .row.articleDetail .flexi.value.field_text > h3{ font-family:'Outfit','Segoe UI',sans-serif;font-size:20px;font-weight:700; color:#1f2d2f;margin:1.9em 0 .55em;padding:0 0 0 12px; border-left:4px solid #8bb633;line-height:1.3} .row.articleDetail .flexi.value.field_text a{color:#1f7f8f;text-decoration:underline} .row.articleDetail .flexi.value.field_text ul{margin:0 0 1.05em;padding-left:22px} .row.articleDetail .flexi.value.field_text li{margin:0 0 .4em} /* F5 — MOBILE : l'illustration passe au-dessus de l'article */ @media (max-width:991px){ .row.articleDetail{display:flex;flex-direction:column} .row.articleDetail > .col-md-4{order:-1;margin:0 0 18px;padding:0} .row.articleDetail > .col-md-7{order:1} .row.articleDetail .flexi.value.field_text{max-width:100%;font-size:16.5px} } /* ===== FIN BLOC CLAUDE 2026-10-02 F2 ===== */ /* ===== DEBUT BLOC CLAUDE 2026-10-02 G — finition du titre d'article ===== A coller a la toute fin de user.css, apres le bloc F2. Corrige trois details constates en ligne apres l'ajout du champ Titre : le libelle « Titre » qui s'affichait, la taille restee en 14 px, et l'ordre (le titre arrivait apres l'auteur et la date). Pour annuler : supprimer de DEBUT G a FIN G. ======================================================================== */ /* G1 — ordre d'affichage : titre, puis auteur et date, puis l'article */ .row.articleDetail .shadePanel.lineinfo.topright{display:flex !important; flex-direction:column !important} .row.articleDetail .flexi.element.field_title{order:-3 !important} .row.articleDetail .flexi.element.field_created_by{order:-2 !important} .row.articleDetail .flexi.element.field_created{order:-1 !important; margin:0 0 18px !important} .row.articleDetail .flexi.element.field_text{order:1 !important} .row.articleDetail .flexi.element.field_social-button{order:2 !important} /* G2 — on masque le libelle « Titre », qui n'a rien a faire devant le titre */ .row.articleDetail .flexi.label.field_title{display:none !important} /* G3 — le titre a la taille et a la charte Prosante */ .row.articleDetail .flexi.element.field_title{display:block !important; margin:0 0 14px !important;padding:0 0 14px !important; border-bottom:3px solid #8bb633 !important} .row.articleDetail .flexi.value.field_title, .row.articleDetail .flexi.value.field_title > div, .row.articleDetail .flexi.value.field_title [itemprop="name"]{ display:block !important; font-family:'Outfit','Segoe UI',sans-serif !important; font-weight:700 !important;font-size:30px !important; line-height:1.22 !important;color:#1f2d2f !important} @media (max-width:767px){ .row.articleDetail .flexi.value.field_title, .row.articleDetail .flexi.value.field_title > div, .row.articleDetail .flexi.value.field_title [itemprop="name"]{ font-size:24px !important} } /* ===== FIN BLOC CLAUDE 2026-10-02 G ===== */ /* ===== DEBUT BLOC CLAUDE 2026-10-02 H — grilles de rubriques ===== Kel Prestataires, Kel Fournisseurs, Kel Associations, Kel Offres. A coller a la fin de user.css, apres le bloc G. Pour annuler : supprimer de DEBUT H a FIN H. ================================================================= */ /* H0 — Bootstrap pose deux pseudo-elements de nettoyage sur .row ; dans une grille CSS ils devenaient des cases et decalaient tout. */ #flexicontent .subcategorieslist::before, #flexicontent .subcategorieslist::after{display:none !important;content:none !important} /* H1 — grille fluide : 4 colonnes en grand ecran, 2 sur tablette, 1 sur mobile */ #flexicontent .subcategorieslist{display:grid !important; grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px; margin:0 0 28px !important;padding:0 !important;width:auto !important;float:none !important} #flexicontent .subcategorieslist > .subcat{width:auto !important;float:none !important; padding:0 !important;margin:0 !important;min-height:132px} #flexicontent .subcategorieslist .catinfocontainer, #flexicontent .subcategorieslist .catinfo{display:block !important;height:auto !important; min-height:100% !important;max-height:none !important;overflow:visible !important; background:none !important;border:0 !important;padding:0 !important;margin:0 !important} /* H2 — toute la carte est cliquable : le lien EST la carte */ #flexicontent .subcategorieslist a.catlink{position:relative;display:block !important; height:100%;min-height:132px;padding:80px 16px 18px !important;box-sizing:border-box; background:#fff;border:1px solid #e3ecd6;border-radius:16px; box-shadow:0 1px 2px rgba(31,45,47,.05);text-decoration:none !important; text-align:left !important;font-family:'Outfit','Segoe UI',sans-serif;font-size:15.5px; font-weight:600;line-height:1.3;color:#1f2d2f !important;overflow:hidden; transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease} #flexicontent .subcategorieslist a.catlink:hover{transform:translateY(-3px); box-shadow:0 10px 24px rgba(31,45,47,.12);border-color:#8bb633} #flexicontent .subcategorieslist a.catlink:focus-visible{outline:3px solid #1f7f8f; outline-offset:2px} /* H3 — lisere degrade en haut de carte */ #flexicontent .subcategorieslist a.catlink::before{content:"";position:absolute; left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,#8bb633,#2fa4b5)} /* H4 — pictogramme maison a la place des vignettes disparates (les anciennes images restent sur le serveur, elles sont seulement masquees) */ #flexicontent .subcategorieslist .sub-image{display:none !important} #flexicontent .subcategorieslist a.catlink::after{content:"\f0c9";position:absolute; top:20px;left:16px;width:46px;height:46px;border-radius:12px;background:#eef8fa; font-family:FontAwesome !important;font-size:21px;font-weight:400;color:#1f7f8f; display:flex;align-items:center;justify-content:center; transition:background .18s ease,color .18s ease} #flexicontent .subcategorieslist a.catlink:hover::after{background:#eaf4dc;color:#5e8a1e} /* H5 — compteur en pastille, sans le trombone */ #flexicontent .subcategorieslist .number{position:absolute;top:26px;right:16px; min-width:26px;height:26px;padding:0 8px;border-radius:999px;background:#eaf4dc; color:#3f5f14;font-family:'Inter',sans-serif;font-size:12.5px;font-weight:700; display:flex;align-items:center;justify-content:center;line-height:1} #flexicontent .subcategorieslist .number .fa{display:none !important} /* H6 — rubriques encore vides : presentes mais discretes (la classe ps-vide est posee par le module « Filtre des rubriques ») */ #flexicontent .subcategorieslist .ps-vide a.catlink{background:#fbfcfa; border-color:#eef1ea;color:#6c7a6e !important} #flexicontent .subcategorieslist .ps-vide a.catlink::before{opacity:.35} #flexicontent .subcategorieslist .ps-vide a.catlink::after{background:#f3f5f1;color:#9aa89c} #flexicontent .subcategorieslist .ps-vide .number{background:#f0f2ee;color:#9aa89c} #flexicontent .subcategorieslist .ps-vide a.catlink:hover{border-color:#cfe0b6} /* H7 — barre de recherche et de filtre */ .ps-catbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin:0 0 18px} .ps-catbar .ps-catsearch{flex:1 1 260px;max-width:380px;height:44px;padding:0 16px; border:1px solid #e3ecd6;border-radius:999px;background:#fff; font-family:'Inter',sans-serif;font-size:15px;color:#1f2d2f;outline:none; transition:border-color .15s,box-shadow .15s} .ps-catbar .ps-catsearch:focus{border-color:#2fa4b5;box-shadow:0 0 0 3px rgba(47,164,181,.15)} .ps-catbar .ps-catfilter{display:inline-flex;align-items:center;gap:8px;margin:0; font-family:'Inter',sans-serif;font-size:14px;font-weight:500;color:#3d4a4c;cursor:pointer} .ps-catbar .ps-catfilter input{width:17px;height:17px;accent-color:#8bb633;margin:0} .ps-catbar .ps-catcount{flex:1 1 100%;margin:0;font-family:'Inter',sans-serif; font-size:13px;color:#5a6457} /* H8 — une icone par rubrique */ #flexicontent .subcategorieslist .automobile a.catlink::after{content:"\f1b9"} #flexicontent .subcategorieslist .bureautique-informatique a.catlink::after{content:"\f109"} #flexicontent .subcategorieslist .conseils-en-patrimoine a.catlink::after{content:"\f201"} #flexicontent .subcategorieslist .fonds-de-commerce a.catlink::after{content:"\f07a"} #flexicontent .subcategorieslist .gestion-comptabilite a.catlink::after{content:"\f1ec"} #flexicontent .subcategorieslist .piscine a.catlink::after{content:"\f043"} #flexicontent .subcategorieslist .prestation-de-service a.catlink::after{content:"\f0ad"} #flexicontent .subcategorieslist .produits-d-hygiene a.catlink::after{content:"\f2cd"} #flexicontent .subcategorieslist .protection-sociale a.catlink::after{content:"\f21e"} #flexicontent .subcategorieslist .securite-surveillance a.catlink::after{content:"\f132"} #flexicontent .subcategorieslist .formation a.catlink::after{content:"\f19d"} #flexicontent .subcategorieslist .hebergement a.catlink::after{content:"\f236"} #flexicontent .subcategorieslist .restauration a.catlink::after{content:"\f0f5"} #flexicontent .subcategorieslist .seminaire a.catlink::after{content:"\f108"} #flexicontent .subcategorieslist .agence-de-voyage a.catlink::after{content:"\f072"} #flexicontent .subcategorieslist .assistante-personnelle a.catlink::after{content:"\f007"} #flexicontent .subcategorieslist .depannage-telephones-mobiles-et-informatique a.catlink::after{content:"\f10b"} #flexicontent .subcategorieslist .banque a.catlink::after{content:"\f19c"} #flexicontent .subcategorieslist .residence-seniors a.catlink::after{content:"\f015"} #flexicontent .subcategorieslist .alternative-liberale-et-encaissement a.catlink::after{content:"\f09d"} /* ===== FIN BLOC CLAUDE 2026-10-02 H ===== */ /* ============================================================ RATTRAPAGE — blocs F2, G et H a recoller Ils ont ete effaces par un enregistrement fait depuis un onglet d'editeur ouvert AVANT leur ajout : son contenu, plus ancien, a remplace le fichier. Rien d'autre n'est touche. A coller a la fin de user.css, apres le bloc I. ============================================================ */ /* ===== DEBUT BLOC CLAUDE 2026-10-02 F2 — pages d'articles ===== VERSION A UTILISER SI VOUS AVEZ PLACE LE CHAMP « Titre » DANS LE GABARIT FLEXIcontent (le titre est alors affiche par Joomla lui-meme). A coller a la fin de user.css, apres le bloc E. Pour annuler : supprimer de DEBUT F2 a FIN F2. ============================================================== */ /* Le titre natif FLEXIcontent, mis a la charte */ .row.articleDetail .flexi.element.field_title, .row.articleDetail h1.contentheading, .row.articleDetail .fcitem_title{font-family:'Outfit','Segoe UI',sans-serif !important; font-weight:700;font-size:30px;line-height:1.22;color:#1f2d2f; margin:0 0 14px;padding:0 0 14px;border-bottom:3px solid #8bb633} @media (max-width:767px){ .row.articleDetail .flexi.element.field_title, .row.articleDetail h1.contentheading, .row.articleDetail .fcitem_title{font-size:24px} } /* F2 — on masque les boutons de partage AddThis, hors service depuis 2023 (le service a ferme : ces boutons n'affichaient plus rien du tout). */ .row.articleDetail .addthis_toolbox > a, .row.articleDetail .flexitoolbar, .addthis_toolbox.addthis_floating_style{display:none !important} /* F3 — AUTEUR ET DATE : discrets, sur une seule ligne sous le titre */ .row.articleDetail .flexi.element.field_created_by, .row.articleDetail .flexi.element.field_created{font-size:14px;color:#5a6457} .row.articleDetail .flexi.element.field_created_by .flexi.label, .row.articleDetail .flexi.element.field_created .flexi.label, .row.articleDetail .flexi.element.field_created_by .flexi.value, .row.articleDetail .flexi.element.field_created .flexi.value{display:inline} /* F4 — LISIBILITE DU CORPS DE L'ARTICLE Longueur de ligne limitee, texte plus grand, respiration entre paragraphes. */ .row.articleDetail .flexi.value.field_text{max-width:72ch;font-size:17px; line-height:1.72;color:#3d4a4c} .row.articleDetail .flexi.value.field_text p{margin:0 0 1.05em} .row.articleDetail .flexi.value.field_text > p:first-child strong{ font-size:18.5px;line-height:1.6;color:#1f2d2f} .row.articleDetail .flexi.value.field_text > h3{ font-family:'Outfit','Segoe UI',sans-serif;font-size:20px;font-weight:700; color:#1f2d2f;margin:1.9em 0 .55em;padding:0 0 0 12px; border-left:4px solid #8bb633;line-height:1.3} .row.articleDetail .flexi.value.field_text a{color:#1f7f8f;text-decoration:underline} .row.articleDetail .flexi.value.field_text ul{margin:0 0 1.05em;padding-left:22px} .row.articleDetail .flexi.value.field_text li{margin:0 0 .4em} /* F5 — MOBILE : l'illustration passe au-dessus de l'article */ @media (max-width:991px){ .row.articleDetail{display:flex;flex-direction:column} .row.articleDetail > .col-md-4{order:-1;margin:0 0 18px;padding:0} .row.articleDetail > .col-md-7{order:1} .row.articleDetail .flexi.value.field_text{max-width:100%;font-size:16.5px} } /* ===== FIN BLOC CLAUDE 2026-10-02 F2 ===== */ /* ===== DEBUT BLOC CLAUDE 2026-10-02 G — finition du titre d'article ===== A coller a la toute fin de user.css, apres le bloc F2. Corrige trois details constates en ligne apres l'ajout du champ Titre : le libelle « Titre » qui s'affichait, la taille restee en 14 px, et l'ordre (le titre arrivait apres l'auteur et la date). Pour annuler : supprimer de DEBUT G a FIN G. ======================================================================== */ /* G1 — ordre d'affichage : titre, puis auteur et date, puis l'article */ .row.articleDetail .shadePanel.lineinfo.topright{display:flex !important; flex-direction:column !important} .row.articleDetail .flexi.element.field_title{order:-3 !important} .row.articleDetail .flexi.element.field_created_by{order:-2 !important} .row.articleDetail .flexi.element.field_created{order:-1 !important; margin:0 0 18px !important} .row.articleDetail .flexi.element.field_text{order:1 !important} .row.articleDetail .flexi.element.field_social-button{order:2 !important} /* G2 — on masque le libelle « Titre », qui n'a rien a faire devant le titre */ .row.articleDetail .flexi.label.field_title{display:none !important} /* G3 — le titre a la taille et a la charte Prosante */ .row.articleDetail .flexi.element.field_title{display:block !important; margin:0 0 14px !important;padding:0 0 14px !important; border-bottom:3px solid #8bb633 !important} .row.articleDetail .flexi.value.field_title, .row.articleDetail .flexi.value.field_title > div, .row.articleDetail .flexi.value.field_title [itemprop="name"]{ display:block !important; font-family:'Outfit','Segoe UI',sans-serif !important; font-weight:700 !important;font-size:30px !important; line-height:1.22 !important;color:#1f2d2f !important} @media (max-width:767px){ .row.articleDetail .flexi.value.field_title, .row.articleDetail .flexi.value.field_title > div, .row.articleDetail .flexi.value.field_title [itemprop="name"]{ font-size:24px !important} } /* ===== FIN BLOC CLAUDE 2026-10-02 G ===== */ /* ===== DEBUT BLOC CLAUDE 2026-10-02 H — grilles de rubriques ===== Kel Prestataires, Kel Fournisseurs, Kel Associations, Kel Offres. A coller a la fin de user.css, apres le bloc G. Pour annuler : supprimer de DEBUT H a FIN H. ================================================================= */ /* H0 — Bootstrap pose deux pseudo-elements de nettoyage sur .row ; dans une grille CSS ils devenaient des cases et decalaient tout. */ #flexicontent .subcategorieslist::before, #flexicontent .subcategorieslist::after{display:none !important;content:none !important} /* H1 — grille fluide : 4 colonnes en grand ecran, 2 sur tablette, 1 sur mobile */ #flexicontent .subcategorieslist{display:grid !important; grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px; margin:0 0 28px !important;padding:0 !important;width:auto !important;float:none !important} #flexicontent .subcategorieslist > .subcat{width:auto !important;float:none !important; padding:0 !important;margin:0 !important;min-height:132px} #flexicontent .subcategorieslist .catinfocontainer, #flexicontent .subcategorieslist .catinfo{display:block !important;height:auto !important; min-height:100% !important;max-height:none !important;overflow:visible !important; background:none !important;border:0 !important;padding:0 !important;margin:0 !important} /* H2 — toute la carte est cliquable : le lien EST la carte */ #flexicontent .subcategorieslist a.catlink{position:relative;display:block !important; height:100%;min-height:132px;padding:80px 16px 18px !important;box-sizing:border-box; background:#fff;border:1px solid #e3ecd6;border-radius:16px; box-shadow:0 1px 2px rgba(31,45,47,.05);text-decoration:none !important; text-align:left !important;font-family:'Outfit','Segoe UI',sans-serif;font-size:15.5px; font-weight:600;line-height:1.3;color:#1f2d2f !important;overflow:hidden; transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease} #flexicontent .subcategorieslist a.catlink:hover{transform:translateY(-3px); box-shadow:0 10px 24px rgba(31,45,47,.12);border-color:#8bb633} #flexicontent .subcategorieslist a.catlink:focus-visible{outline:3px solid #1f7f8f; outline-offset:2px} /* H3 — lisere degrade en haut de carte */ #flexicontent .subcategorieslist a.catlink::before{content:"";position:absolute; left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,#8bb633,#2fa4b5)} /* H4 — pictogramme maison a la place des vignettes disparates (les anciennes images restent sur le serveur, elles sont seulement masquees) */ #flexicontent .subcategorieslist .sub-image{display:none !important} #flexicontent .subcategorieslist a.catlink::after{content:"\f0c9";position:absolute; top:20px;left:16px;width:46px;height:46px;border-radius:12px;background:#eef8fa; font-family:FontAwesome !important;font-size:21px;font-weight:400;color:#1f7f8f; display:flex;align-items:center;justify-content:center; transition:background .18s ease,color .18s ease} #flexicontent .subcategorieslist a.catlink:hover::after{background:#eaf4dc;color:#5e8a1e} /* H5 — compteur en pastille, sans le trombone */ #flexicontent .subcategorieslist .number{position:absolute;top:26px;right:16px; min-width:26px;height:26px;padding:0 8px;border-radius:999px;background:#eaf4dc; color:#3f5f14;font-family:'Inter',sans-serif;font-size:12.5px;font-weight:700; display:flex;align-items:center;justify-content:center;line-height:1} #flexicontent .subcategorieslist .number .fa{display:none !important} /* H6 — rubriques encore vides : presentes mais discretes (la classe ps-vide est posee par le module « Filtre des rubriques ») */ #flexicontent .subcategorieslist .ps-vide a.catlink{background:#fbfcfa; border-color:#eef1ea;color:#6c7a6e !important} #flexicontent .subcategorieslist .ps-vide a.catlink::before{opacity:.35} #flexicontent .subcategorieslist .ps-vide a.catlink::after{background:#f3f5f1;color:#9aa89c} #flexicontent .subcategorieslist .ps-vide .number{background:#f0f2ee;color:#9aa89c} #flexicontent .subcategorieslist .ps-vide a.catlink:hover{border-color:#cfe0b6} /* H7 — barre de recherche et de filtre */ .ps-catbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin:0 0 18px} .ps-catbar .ps-catsearch{flex:1 1 260px;max-width:380px;height:44px;padding:0 16px; border:1px solid #e3ecd6;border-radius:999px;background:#fff; font-family:'Inter',sans-serif;font-size:15px;color:#1f2d2f;outline:none; transition:border-color .15s,box-shadow .15s} .ps-catbar .ps-catsearch:focus{border-color:#2fa4b5;box-shadow:0 0 0 3px rgba(47,164,181,.15)} .ps-catbar .ps-catfilter{display:inline-flex;align-items:center;gap:8px;margin:0; font-family:'Inter',sans-serif;font-size:14px;font-weight:500;color:#3d4a4c;cursor:pointer} .ps-catbar .ps-catfilter input{width:17px;height:17px;accent-color:#8bb633;margin:0} .ps-catbar .ps-catcount{flex:1 1 100%;margin:0;font-family:'Inter',sans-serif; font-size:13px;color:#5a6457} /* H8 — une icone par rubrique */ #flexicontent .subcategorieslist .automobile a.catlink::after{content:"\f1b9"} #flexicontent .subcategorieslist .bureautique-informatique a.catlink::after{content:"\f109"} #flexicontent .subcategorieslist .conseils-en-patrimoine a.catlink::after{content:"\f201"} #flexicontent .subcategorieslist .fonds-de-commerce a.catlink::after{content:"\f07a"} #flexicontent .subcategorieslist .gestion-comptabilite a.catlink::after{content:"\f1ec"} #flexicontent .subcategorieslist .piscine a.catlink::after{content:"\f043"} #flexicontent .subcategorieslist .prestation-de-service a.catlink::after{content:"\f0ad"} #flexicontent .subcategorieslist .produits-d-hygiene a.catlink::after{content:"\f2cd"} #flexicontent .subcategorieslist .protection-sociale a.catlink::after{content:"\f21e"} #flexicontent .subcategorieslist .securite-surveillance a.catlink::after{content:"\f132"} #flexicontent .subcategorieslist .formation a.catlink::after{content:"\f19d"} #flexicontent .subcategorieslist .hebergement a.catlink::after{content:"\f236"} #flexicontent .subcategorieslist .restauration a.catlink::after{content:"\f0f5"} #flexicontent .subcategorieslist .seminaire a.catlink::after{content:"\f108"} #flexicontent .subcategorieslist .agence-de-voyage a.catlink::after{content:"\f072"} #flexicontent .subcategorieslist .assistante-personnelle a.catlink::after{content:"\f007"} #flexicontent .subcategorieslist .depannage-telephones-mobiles-et-informatique a.catlink::after{content:"\f10b"} #flexicontent .subcategorieslist .banque a.catlink::after{content:"\f19c"} #flexicontent .subcategorieslist .residence-seniors a.catlink::after{content:"\f015"} #flexicontent .subcategorieslist .alternative-liberale-et-encaissement a.catlink::after{content:"\f09d"} /* ===== FIN BLOC CLAUDE 2026-10-02 H ===== */ /* ===== DEBUT BLOC CLAUDE 2026-10-02 J — offres d'emploi ===== A coller a la fin de user.css, apres le bloc H. Pour annuler : supprimer de DEBUT J a FIN J. Portee : pages AdsManager (offres d'emploi, candidatures, annonces). ============================================================= */ /* J1 — chaque annonce devient une carte, entierement cliquable */ .juloawrapper .adsmanager-grid{margin:0 0 12px} .juloawrapper .adsmanager-grid > a{display:flex !important;flex-wrap:wrap; align-items:center;justify-content:space-between;gap:12px 20px; padding:18px 20px !important;background:#fff;border:1px solid #e3ecd6 !important; border-radius:14px !important;box-shadow:0 1px 2px rgba(31,45,47,.05); text-decoration:none !important; transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease} .juloawrapper .adsmanager-grid > a:hover{transform:translateY(-2px); box-shadow:0 8px 20px rgba(31,45,47,.10);border-color:#8bb633} .juloawrapper .listitemleft{flex:1 1 320px;min-width:0;float:none !important;width:auto !important} .juloawrapper .listitemright{display:flex;align-items:center;gap:16px; float:none !important;width:auto !important} .juloawrapper .list-desc{padding:0 !important} .juloawrapper .positionList{float:none !important;width:auto !important; padding:0 !important;margin:0 0 4px !important} /* J2 — hierarchie de l'annonce */ .juloawrapper .fad_fonction{font-family:'Outfit','Segoe UI',sans-serif;font-size:17px; font-weight:700;color:#1f2d2f} .juloawrapper .healthpipe{color:#cfe0b6;margin:0 8px} .juloawrapper .fad_typedecontrat{font-family:'Inter',sans-serif;font-size:13px; font-weight:600;color:#1f7f8f;background:#eef8fa;border-radius:999px;padding:3px 10px} .juloawrapper .fad_city{font-family:'Inter',sans-serif;font-size:14px;color:#5a6457} .juloawrapper .fad_zonegeographique{display:inline-block;margin-top:6px;padding:4px 12px; border-radius:999px;background:#eaf4dc !important;color:#3f5f14 !important; font-family:'Inter',sans-serif;font-size:12.5px;font-weight:700} .juloawrapper .listitemdate{font-family:'Inter',sans-serif;font-size:13px;color:#8a978c; white-space:nowrap} .juloawrapper .miniLink.miniGreen{padding:10px 18px !important;border-radius:999px !important; background:#8bb633 !important;color:#1f2d2f !important;font-family:'Outfit',sans-serif; font-size:14px;font-weight:700;box-shadow:none !important} /* J3 — le panneau de recherche passe du bleu nuit a la charte Prosante (limite aux pages d'annonces : les autres panneaux sombres du site gardent leur apparence) */ body.com_adsmanager .panelHealth.panelDark{background:#fff !important; border:1px solid #e3ecd6 !important;border-radius:16px !important; box-shadow:0 1px 2px rgba(31,45,47,.05)} body.com_adsmanager .panelHealth.panelDark h3, body.com_adsmanager .panelHealth.panelDark .page-header{color:#1f2d2f !important} body.com_adsmanager .adsmanager_search_module{background:#fff !important;border:0 !important; box-shadow:none !important;padding:0 !important;color:#1f2d2f !important} body.com_adsmanager .adsmanager_search_module *{color:#1f2d2f !important} body.com_adsmanager .adsmanager_search_module label, body.com_adsmanager .adsmanager_search_module .control-label{ font-family:'Outfit',sans-serif;font-size:14px;font-weight:600} body.com_adsmanager .adsmanager_search_module input[type=text], body.com_adsmanager .adsmanager_search_module select{background:#fff !important; border:1px solid #e3ecd6 !important;border-radius:999px !important;height:40px; padding:0 14px !important;font-family:'Inter',sans-serif;font-size:14px} /* ===== FIN BLOC CLAUDE 2026-10-02 J ===== */ /* PROSANTE-DECONNEXION-LISIBLE 2026-10-08 : bouton Déconnexion, texte blanc sur fond bleu-vert Prosanté (il était blanc sur gris clair, illisible). Pour annuler : supprimer ce bloc. */ #topMenu .logout-button input,#topLeftMenu .logout-button input{background:#1f7f8f !important;border-color:#1f7f8f !important;color:#fff !important} /* PROSANTE-BANNIERE-LARGE 2026-10-08 : la bannière MED'UP de l'accueil occupe toute la largeur du contenu (le gabarit limitait à 932px). Pour annuler : supprimer ce bloc. */ .bannergroup{max-width:1120px} /* PROSANTE-TITRE-NOUVEAUTES 2026-10-08 : étiquette « Nouveautés fournisseur » des cartes qui défilent : blanc sur fond noir (elle était noire sur noir). Pour annuler : supprimer ce bloc. */ body .suf_homeCarousel .fc_categories,body .suf_homeCarousel .fc_categories a,body .suf_homeCarousel a.fc_categories{color:#fff !important;-webkit-text-fill-color:#fff}