/* POLICE PAR DEFAUT */ /* __________________________________________________________________ */ html, body { font-size: 100%; color: #4d4c4c; font-family: Arial, Helvetica, sans-serif; } /* COULEUR SELECTION POUR FIREFOX */ /* __________________________________________________________________ */ ::-moz-selection { color: white; background: #316AC5; } /* HR */ /* __________________________________________________________________ */ div.hr { /* background: #EDEDED; height: 1px; margin: 5px 0 10px 0; */ } hr.spip { border: none; clear: both; } /* LISTES */ /* __________________________________________________________________ */ ul, ol {list-style-type: none;}/* Masquage des puces par défaut - NE PAS EFFACER */ .retourligne {clear: left;}/* On place le retour ligne. A utiliser à  chaque fois que l'on veut faire un clear sur un élément de liste */ acronym { border: 0; } /* Masquage de la bordure par défaut - NE PAS EFFACER */ /* TAILLE DES POLICES */ /* __________________________________________________________________ */ #block_contenu {font-size: 0.8em;} /* LIENS STANDARD ET ROLLOVER */ /* __________________________________________________________________ */ a img {border: none;} a:link, a:visited, h3.depliage span, h4.depliage span, h5.depliage span, h3.depliage.carto span, h4.depliage.carto span, h5.depliage.carto span { /* Liens par defaut + liens de dépliage */ color: #025387; text-decoration: underline; } a:link:hover, a:visited:hover, a:focus, a:active, h3.depliage span.layer-actif, h4.depliage span.layer-actif, h5.depliage span.layer-actif, h3.depliage span:hover, h4.depliage span:hover, h5.depliage span:hover, h3.depliage.carto span:hover, h4.depliage.carto span:hover, h5.depliage.carto span:hover, .pagination span.on, ul.liste_lettre li span.on { /* Liens par defaut over + liens de dépliage over et actif */ text-decoration: none; } a.spip_out:link, a.spip_out:visited, a.spip_mail:link, a.spip_mail:visited {/* Liens externes */ color: #c27511; } a.spip_out:after, a.spip_mail:after { /* Liens externes suite */ content: "\0000a0[\2197]"; /* Voir caractêre unicode */ line-height: 1em; } a.spip_out:hover, a.spip_out:focus, a.spip_out:active { /* Liens externes over */ color: #985b0b; } a[name] { /* On masque les ancres nommées (lien d'évitement) - NE PAS EFFACER */ visibility: hidden;/* HACK POUR IE => VOIR FEUILLE DE STYLE spip_ie_template.css */ } a.spip_note[name] {visibility: visible;} /* On affiche les notes spip - NE PAS EFFACER */ /* FIL D'ARIANE */ /* __________________________________________________________________ */ #chemin { /* Chemin general */ color: #abaaaa; margin: 0; font-style: italic; font-size: 0.9em; padding: 9px 10px 25px 14px; background: url(squelettes/images/fond_ombre_header_article.png) repeat-x bottom left; } #chemin a:link, #chemin a:visited { /* Chemin lien */ text-decoration: none; color: #606060; } #chemin a:link:hover, #chemin a:visited:hover, #chemin a:focus, #chemin a:active, #chemin strong { /* Chemin lien over et actif */ text-decoration: underline; color: #277cad; font-weight: normal; } /* TITRES */ /* __________________________________________________________________ */ #colonne_contenu h2 { /* Titre article / rubrique */ color:#00a1e5; font-weight: 100; margin-left: 28px; font-size: 1.8em; } #colonne_contenu h2 span { } /* Pour les effets de style compliqués */ h3.spip { /* intertitre */ text-align:left; color: #00a1e5; font-size: 1.4em; font-weight: 100; padding: 0 0 0 0; /* Prérégler le déclage de la seconde ligne et suivante qd picto */ margin: 1.2em 0 0.8em 30px; clear: both; } h3.spip span {} /* Pour les effets de style compliqués */ h4 { /* intertitre niveau 2*/ text-align:left; font-size: 0.9em; font-weight: bold; margin: 1.5em 0 0.5em 0; color: #4d4c4c; /* background: url(squelettes/images/picto_h4.png) no-repeat 0 0; */ padding: 0; /* Prérégler le déclage de la seconde ligne et suivante qd picto */ clear: both; } h5 { font-size: 0.9em; font-weight: normal;} /* Pour régler la taille police sous IE - NE PAS EFFACER */ h6 { font-size: 0.9em; font-weight: normal;} /* Pour régler la taille police sous IE - NE PAS EFFACER */ #colonne_contenu h2 span.spip_surligne, #colonne_contenu h3 span.spip_surligne, #colonne_contenu h4 span.spip_surligne, #colonne_contenu h5 span.spip_surligne, #colonne_contenu h6 span.spip_surligne { /* On masque les croisements styles de titre/ styles de surlignage de la recherche */ background-image: none; padding: 0; display: inline; float: none; width: auto; } /* INFOS COMPLEMENTAIRES EN TETE D'ARTICLE LORS D'UN AFFICHAGE D'ARTICLE OU DE LISTE (BLOC_ARTICLE_DOC) */ /* __________________________________________________________________ */ .dateevmnt { /* style des dates d'événements */ margin: 0 0 17px 34px; /* Cette valeur doit àªtre égale au margin bottom du datearticle - NE PAS EFFACER */ color:#c92526; font-weight: bold; font-size: 0.8em; } .datearticle, .cheminliste, .themearticle, .extraarticle, .nbresult, .dateforum, .block_document .infodoc, .liste_doc_col .infodoc, .liste_doc_col_pageflip .infodoc { /* style des POLICES des dates (dans article et liste = block article doc) , chemin dans les listes (block article doc), thematiques des articles (dans article et liste = block article doc) */ font-weight:normal; font-size: 0.8em; color: #C92526; font-style: italic; } .datearticle { /* style des dates*/ margin: 0 0 17px 34px; /* Cette valeur doit àªtre égale au margin bottom du dateevmnt - NE PAS EFFACER */ } .themearticle { /* style des thêmatiques d'article */ /*margin: 0 0 25px 0;*/ font-size: 1em; /* Ne pas effacer cette ligne, permet de ne pas réduire la taille à  cause de la cascade */ } .extraarticle { /* style des thêmatiques d'article */ /*margin: 0 0 25px 0;*/ } .nbresult { /* résultat de la recherche */ margin: 0 0 10px 20px; } /* CONTENU ARTICLE */ /* __________________________________________________________________ */ /* L'article contient : - Titre (H2/H3) - Date évênement (dateevmnt) - Date publication (datearticle) - Mots clés thématique (themearticle) - Extra date/heure (extraarticle) - Chapo (chapo) - Texte (spip) - Note (spip_note) */ .chapo, .descriptif_video, .spip_forms div.spip_descriptif { /* chapos */ color: #484747; font-weight: bold; margin: 0 0 10px 0; /* Ne pas mettre de margin haut */ padding: 0 0 5px 0; text-align:justify; } .chapo strong{/*color: #008A57;*/} /* chapos */ .chapo > .spip:first-child, h3 + p.spip, h4 + p.spip, h5 + p.spip, h6 + p.spip, .block_extras + p.spip, .layerdeplie > .spip:first-child, .layerdeplie > h5:first-child, blockquote > .spip:first-child { margin: 0;} /* On annule la marge haute du premier paragraphe, plus ceux qui suivent un h3, des docs... */ .layerdeplie > table.spip:first-child, dl.spip_documents.doc_ajoute { margin-top: 10px; } /* On réafecte une marge sur les tableaux dans les dépliages, les listes */ .spip { /* texte */ text-align:justify; margin: 10px 0 0 0; /* Mettre le même margin top sur dl.spip_documents */ } dl.spip_documents.doc_ajoute + p.spip { /* Sur les paragraphe qui suivent des document insérer en flottant : on force le retour ligne */ clear: both; margin: 0; } /* ~~~~~~~~~~~~~~~~~~~~~~~ NOTES DE BAS DE PAGE */ .complement .spip_note:first-child { margin: 20px 0 0 0; } .spip_note { margin: 0; font-size: 0.9em; } /* ~~~~~~~~~~~~~~~~~~~~~~~ SURLIGNAGE DES TERMES RECHERCHES */ .spip_surligne { /* Recherche : Couleur de surlignage */ color: #fff; background: #E2151A; } /* ~~~~~~~~~~~~~~~~~~~~~~~ LISTE PREMIER NIVEAU DANS LE CONTENU */ ul.spip, ol.spip { margin: 10px 0 10px 13px !important;padding: 0; } /* Le margin top doit être le même que sur le .spip */ ul.spip li, ol.spip li { margin: 0; padding: 5px 0 0 0; text-align: left; /*font-size: 0.9em;*/} ul.spip ul.spip li, ol.spip ol.spip li { /*font-size: 1em;*/} ul.spip { list-style-image: url(squelettes/images/liste_spip_niv1.gif); } /* ~~~~~~~~~~~~~~~~~~~~~~~ LISTE SECOND NIVEAU */ /* Réglages margin et padding des listes */ ul.spip ul.spip, ol.spip ol.spip {font-size: 1em; margin: 16px 0 10px 20px !important; } ul.spip ul.spip li, ol.spip ol.spip li { margin: 0; padding: 0; } ul.spip ul.spip { list-style-image: url(squelettes/images/liste_spip_niv2.gif); } /* ~~~~~~~~~~~~~~~~~~~~~~~ LISTE NUMEROTEE */ ol.spip { list-style-position: outside; list-style-type: decimal; } /* ~~~~~~~~~~~~~~~~~~~~~~~ BLOCK DE CITATION */ blockquote.spip { clear: both; padding: 20px; background: #EDEAE8; } /* ~~~~~~~~~~~~~~~~~~~~~~~ IMAGES OU DOCUMENTS INSERES => BORDURES */ /* .spip_logos : logo d'article .spip_documents img : image de document inséré */ .spip_logos, .spip_documents img { border: 1px solid #bbbbbb; padding: 5px; background: #FFF; } .spip_documents a img { border: 1px solid #00A1E5 } .spip_documents a:hover img, .spip_documents a:focus img , .spip_documents a:active img { background: #00A1E5; } .spip_documents a.spip_doc img{ border: 0; } .spip_logos { float: left; margin: 0 10px 10px 0; } div.nocadre img { /* Utilisé dans doc et emb pour supprimer le cadre aux gif */ border:none; } /* ~~~~~~~~~~~~~~~~~~~~~~~ IMAGES OU DOCUMENTS INSERES => LEGENDE ET */ dl.spip_documents { /* Block du document => styler le block et les éléments de texte (titre / descritif) */ display: block; margin-top: 5px; /* Mettre le même margin top que sur .spip */ } .spip_doc_titre, .spip_doc_descriptif {/* Espacement titre / descriptif */ text-align: center; font-size: 0.85em; font-weight: normal; color:#606060; font-style:italic; } .spip_doc_titre { padding: 5px 0 0 0; } /* +3px pour corriger le bug 3px sur firefox si */ .spip_doc_descriptif { padding: 0 0 2px 0; } dl.spip_documents dt:first-child { /* Correction bug margin 3px si bg sur les infos doc */ margin: 0 0 -3px 0; text-align: center; } .spip_doc_titre strong, .spip_doc_descriptif span {/* Pour padding si alignement à gauche */ padding: 0; } .spip_doc_titre strong {font-weight: normal;} .spip_documents a { }/* Titre qui sert de lien vers le document */ .spip_documents_left {margin: 0 2em 0.5em 0;} /* Correction du bug d'aligement image insérée */ .spip_documents_right {margin: 0 12px 0.5em 2em;} /* .spip_documents_center {text-align: center; position: relative; margin: 0 auto;} */ .spip_documents_center { clear:both;display:block;margin:1em auto;width:100%; text-align: center;} .spip_documents_center .spip_doc_titre, .spip_documents_center .spip_doc_descriptif {/* Centrage des textes */ margin: auto; } /* Calage particulier pour les doc spip à l'aide du style doc_ajoute (modele )) */ .spip_documents_left.doc_ajoute { text-align: center; } .spip_documents_left.doc_ajoute .spip_doc_titre, .spip_documents_left.doc_ajoute .spip_doc_descriptif {/* Espacement titre / descriptif */ word-wrap: normal; } dl.spip_documents img.spip_logos { margin: auto; float: none; } .block_document_article { /* Documents insérés dans les articles */ /* Décommenter pour mettre un picto sur les documents insérés */ /* padding: 0 0 0 5px; margin: 0 0 10px 0; background: url(squelettes/images/picto_doc.gif) no-repeat 0em 0.3em; /* Caler la hauteur toujours en em */ } /* ~~~~~~~~~~~~~~~~~~~~~~~ TABLEAU */ table.spip { /* Tableau general */ padding:0px; border-collapse:collapse; width: 100%; margin-bottom : 20px; } table.spip tr.row_first { /* Premiere ligne */ font-weight: bold; color: #fff; background: #00a1e5; } table.spip tr.row_odd { /* Ligne paire */ color: #000000; background: #EDF6F9; /* #a6def6;*/ } table.spip tr.row_even { /* Ligne impaire */ color: #000000; background: #ccecfa ; } table.spip td, table.spip th { /* Cellule */ padding: 3px 2px 3px 10px; text-align: left; font-size: 0.9em; } table.spip caption{ /* Resume masque */ /* color:#FFFFFF; A régler selon que l'on veut pasquer our pas la balise caption des tableaux */ /* font-size: 0.7em; Mettre une taille petite pour réduire l'espace occupé en cas de masquage de la balise */ padding: 0; } /* RESEAUX SOCIAUX */ #reseaux_sociaux { margin: 30px 0 10px 0; } #reseaux_sociaux li { display: inline; } /* MISE EN FORME DES LISTES DE PHOTOS DANS ARTICLE ET DANS RUBRIQUE PHOTOTHEQUE / PORTRAIT */ /* __________________________________________________________________ */ /* Utilise dans liste_article_photo_pardate, affiche_article et liste_article_img (phototheque) */ .fondecran { /* Le tableau contenant la photo */ float: left; display: inline; /* Correction du bug ie sur les flottants */ word-wrap: break-word; /* Si le texte sort du cadre il y a un retour à  la ligne automatique */ border-collapse: collapse; width: 157px; /* Reporter cette valeur sur table.fondecran .spip_doc_titre et table.fondecran .spip_doc_descriptif */ margin: 10px 14px 10px 0; } .fondecran.retourligne{ margin: 10px 0; } td.fondecranphoto { /* La cellule contenant la photo */ height: 103px; text-align: center; vertical-align: bottom; padding: 10px 0 9px 0; } td.fondecranphoto a:visited img, td.fondecranphoto a:link img { /* Roll over sur l'image */ border: 1px solid #00A1E5; /* Modif PW : 2px #e1e1e1;*/ padding: 5px; vertical-align: bottom; /* NE PAS EFFACER !! */ width: 157px; } td.fondecranphoto a:hover img, td.fondecranphoto a:focus img, td.fondecranphoto a:active img { /* Roll over sur l'image */ background: #00A1E5; padding: 5px; width: 157px; } table.fondecran .spip_doc_titre, table.fondecran .spip_doc_descriptif { /* Titre et info sur la photo */ width: 137px; /* Centrage sous firefox */ padding: 0 10px; position: relative; /* Centrage sous firefox */ margin: 0 auto; /* Centrage sous firefox */ } /* ~~~~~~~~~~~~~~~~~~~~~~~ Redéfinition taille image pour Liste_article_img (phototheque) */ .phototheque { /* Le tableau contenant la photo */ float: left; display: inline; /* Correction du bug ie sur les flottants */ word-wrap: break-word; /* Si le texte sort du cadre il y a un retour à  la ligne automatique */ border-collapse: collapse; width: 200px; /* Reporter cette valeur sur table.fondecran .spip_doc_titre et table.fondecran .spip_doc_descriptif */ margin: 10px 0 10px 33px; } td.photothequephoto { /* La cellule contenant la photo */ height: 90px; text-align: center; padding: 10px 0 0 0; vertical-align: middle; } td.photothequephoto a:visited img, td.photothequephoto a:link img { /* Roll over sur l'image */ border: 1px solid #e1e1e1; padding: 3px; } td.photothequephoto a:hover img, td.photothequephoto a:focus img, td.photothequephoto a:active img { /* Roll over sur l'image */ background: #313131; padding: 3px; } table.phototheque .spip_doc_titre, table.phototheque .spip_doc_descriptif { /* Titre et info sur la photo */ width: 250px; /* Centrage sous firefox */ position: relative; /* Centrage sous firefox */ margin: 0 auto; /* Centrage sous firefox */ } /* EXTRAS => SQUELETTE BLOCk_EXTRAS */ /* __________________________________________________________________ */ /* ~~~~~~~~~~~~~~~~~~~~~~~ Style block extra avec et sans logo */ .block_extras { /* Block extras */ margin: 0 0 0 0; } .block_extras .extraarticle { /* Infos date et heure + offre d'emploi */ font-size: 0.95em; } .block_extras .extraarticle div { margin: 0 0 5px 0; } .layerdeplie .block_extras { /* Block extras : on définit des marges dans les dépliages */ padding: 5px 10px 5px 10px; } .layerdeplie .block_extras.avec_logo { /* Block extras avec un logo => on applique une image de bg pour simuler un colonnage */ background: url(squelettes/images/colonne_extras.png) repeat-y; } .layerdeplie .block_extras.avec_logo .chapo { /* Block extras avec un logo => on decale le chapo sur la "colonne" de droite */ margin: 0 0 0 118px; } .affiche .layerdeplie.carto { /* Padding et largeur particuliêres pour la carto dans le dépliage (block extra) */ padding: 10px 0 0 0; width: 485px; } .extras { /* Ensemble des extras */ clear: both; margin: 0 0 10px 0; } .extras.colonne_gauche_logo { /* Colonne de gauche avec logo à  droite */ width: 58%; float: left; clear: none; } .spip_logo_fiche { /* Affichage des logos sur portrait ou fiche annuaire */ float: right; margin: 0 0 3px 10px; } .ligneextras { /* Ligne d'extra */ clear: both; margin: 0; } .ligneextras strong { /* Intitule en gras */ color: #000; } .alignextra, .alignextra2 { /* Présentation sur deux colonnes */ padding: 2px 0; float: left; word-wrap: break-word; /* Si le texte sort du cadre il y a un retour à  la ligne automatique */ text-align: left; } .alignextra {width: 40%;} /* Colonne 1 - Régler la dimension */ .alignextra2 { width: 59%;} /* Colonne 2 - Régler la dimension */ .signaler_erreur { /* Lien signaler une erreur */ margin: 5px 0; text-align: right; } /* Rédéfinition des largeurs de colonnes pour certaines rubriques (si dépliage par exemple...) */ .extras_ .alignextra {width: 30%;} /* Colonne 1 - Régler la dimension */ .extras_ .alignextra2 {width: 69%;} /* Colonne 2 - Régler la dimension */ /* AFFICHAGE DES ITEMS ARTICLES DOCUMENTS DANS LES LISTES (BOCK_ARTICLE_DOC) */ /* __________________________________________________________________ */ /* Utilisé par : liste_actus liste_article recherche_liste_article liste_evnmnt Les blocs article/doc se compose de : - Titre (H3/H4) - Date evenement (dateevmnt) - Date publication (datearticle) - Chemin (cheminliste) - Mots clés thématique (themearticle) - Extra Date Heure (extraarticle) - Infos document (infodoc) - Intro article / descriptif document / descriptif site (complement) */ h3.titreliste, h4.titreliste, h5.titreliste, h6.titreliste { text-align:left; font-size: 0.9em !important; font-weight: bold; text-transform: none; padding: 0 0 0 0; /* Prérégler le déclage de la seconde ligne et suivante qd picto */ margin: 0 0 2px 0px; clear: both; color: #4d4c4c; } .block_document .datearticle, .block_article .datearticle, .block_site .datearticle { /* Date de publication dans les listes article et doc */ font-size: 0.85em; text-align: left; margin: 0 0 3px 0; /* doit être identique à  la valeur définie pour le block .block_article .dateevmnt */ } .cheminliste { /* couleur et taille du chemin dans les listes d'article et de document */ text-align: left; margin: 0 0 0 15px; } .complement { font-size: 0.95em; margin: 2px 0 0 0; padding: 0; } /* ~~~~~~~~~~~~~~~~~~~~~~~ SQUELETTE BLOCK_ARTICLE_DOC */ .block_article { /* Partie haute du block de présentation d'un article */ text-align: justify; margin: 0 0 10px 0; padding: 0 0 12px 0; clear: both; background: url("squelettes/images/separateur-item-block-conte.png") no-repeat 9px 100%; } .block_article .info { /* date / heure/ lieu d'événement */ /* Dans block article_doc, remplacer dateevmnt par info */ font-size: 0.95em; } .block_article .dateevmnt { /* Sert pour la date d'événement */ margin: 0 0 3px 0; /* doit àªtre identique à  la valeur définie pour le block .block_article .datearticle */ } .block_article .themearticle { /* Sert les thématiques de l'article(Mot-clés associés affichés ) */ font-size: 0.95em; } .block_article .extraarticle { /* Sert les thématiques de l'article(Mot-clés associés affichés ) */ font-size: 0.95em; } .block_article .photo_block { /* Block de la vignette */ /* min-height: 56px; HACK POUR IE6 => VOIR FEUILLE DE STYLE spip_ie_template.css */ float: left; display: inline; margin: 0 16px 0 0; width: 149px; } .block_article .block_droite { /* Block qui contient le texte de l'article */ float: left; width: 320px; display: inline; /* Correction du bug ie sur les flottants */ word-wrap: break-word; /* Si le texte sort du cadre il y a un retour à  la ligne automatique */ margin: 3px 0 0 0; } .block_article .block_droite_full { /* Block qui contient le texte de l'article sur toute la largeur (pas de photo) */ width: auto; } .layerdeplie .block_article .block_droite {/*width: 291px;*/} /* On redéfinit la largeur pour les listes d'article dans les dépliages */ .block_article .datearticle{ margin: 0 0 0 15px; } .block_article .themearticle{ font-size: 0.8em; } /* LIENS EN SAVOIR PLUS / LIRE LA SUITE */ /* S'appliquent aussi aux : - block document - Liens vers fiches élus, à  partir des présentation détaillée et trombi Pour les différencier : supprimer les lignes , repos et hover, puis styler individuellement (les styles sont déjà  définis) */ .block_article .savoirplus a:link, .block_article .savoirplus a:visited, .block_document .savoirplus a:link, .block_document .savoirplus a:visited, .info_elu .savoirplus a:link, .info_elu .savoirplus a:visited, .block_elu_trombi .savoirplus a:link, .block_elu_trombi .savoirplus a:visited, .liste_doc_col .savoirplus a:link, .liste_doc_col .savoirplus a:visited, .infos .savoirplus a:link, .infos .savoirplus a:visited, div .savoirplus a:link, div .savoirplus a:visited { font-weight: bold; padding: 0; margin-top: 6px; display: block; } .block_article .savoirplus a:link:hover, .block_article .savoirplus a:visited:hover, .block_article .savoirplus a:focus, .block_article .savoirplus a:active, .block_document .savoirplus a:link:hover, .block_document .savoirplus a:visited:hover, .block_document .savoirplus a:focus, .block_document .savoirplus a:active, .info_elu .savoirplus a:link:hover, .info_elu .savoirplus a:visited:hover, .info_elu .savoirplus a:focus, .info_elu .savoirplus a:active, .block_elu_trombi .savoirplus a:link:hover, .block_elu_trombi .savoirplus a:visited:hover, .block_elu_trombi .savoirplus a:focus, .block_elu_trombi .savoirplus a:active, .liste_doc_col .savoirplus a:link:hover, .liste_doc_col .savoirplus a:visited:hover, .liste_doc_col .savoirplus a:focus, .liste_doc_col .savoirplus a:active, .infos .savoirplus a:link:hover, .infos .savoirplus a:visited:hover, .infos .savoirplus a:focus, .infos .savoirplus a:active, div .savoirplus a:link:hover, div .savoirplus a:visited:hover, div .savoirplus a:focus, div .savoirplus a:active { } /* ~~~~~~~~~~~~~~~~~~~~~~~ SQUELETTE BLOCK_DOC */ .block_document { /* Block document dans liste d articles */ margin: 0 0 16px 2px; text-align:justify; padding: 0 0 16px 0; clear: both; background: url("squelettes/images/separateur-item-block-conte.png") no-repeat 7px 100%; } .block_document .infodoc, .document_col .infodoc,.block_document .cheminliste { /* info sur le document dans le block_doc */ font-size: 0.85em; text-align: left; margin: 0 0 0 15px; font-weight: normal; font-style: italic; } .block_document .photo_block { width: 62px; float: left; margin: 0 13px 0 0; /* min-height: 56px; HACK POUR IE6 => VOIR FEUILLE DE STYLE spip_ie_template.css */ } .block_document .block_droite { float: left; width: 408px; margin: 0; display: inline; /* Correction du bug ie sur les flottants */ word-wrap: break-word; /* Si le texte sort du cadre il y a un retour à  la ligne automatique */ } .layerdeplie .block_document .block_droite {width: 390px;} /* On redéfinit la largeur pour les listes de docs dans les dépliages */ .layerdeplie .block_article .block_droite {width: 245px;} /* On redéfinit la largeur pour les listes d'article dans les dépliages */ /* Lien en savoir plus - Voir le block_article bloc document - Décommenter pour différentier les deux */ .block_document .savoirplus a:link, .block_document .savoirplus a:visited {} .block_document .savoirplus a:link:hover, .block_document .savoirplus a:visited:hover, .block_document .savoirplus a:active, .block_document .savoirplus a:focus {} /* ~~~~~~~~~~~~~~~~~~~~~~~ SURCHARGE POUR LES DOCS DANS LES ACTUS */ .liste_actus .block_document .photo_block { width: 149px; margin: 0 16px 0 0; text-align: center; } .liste_actus .block_document .block_droite { width: 318px; } /* ~~~~~~~~~~~~~~~~~~~~~~~ SQUELETTE BLOCK_SITE */ .block_site { /* Block document dans liste d articles */ padding: 0 0 2px 0; margin: 0 0 15px 0; text-align:justify; clear:both; } .block_site .complement { /* info sur le site dans le block_site */ } .block_site .photo_block { width: 75px; float: left; text-align: center; margin: 0 10px 0 0; /* min-height: 56px; HACK POUR IE6 => VOIR FEUILLE DE STYLE spip_ie_template.css */ } .block_site .block_droite { float: left; display: inline; /* Correction du bug ie sur les flottants */ word-wrap: break-word; /* Si le texte sort du cadre il y a un retour à  la ligne automatique */ width: 440px; margin: 0; } /* SQUELETTE LISTE_DOC_COL, LISTE_DOC_COL_pageflip */ /* __________________________________________________________________ */ .liste_doc_col{ margin-top: 30px; } .liste_doc_col h4, .liste_doc_col_pageflip h4 {margin: 0 0 0.5em 0;} /* Titres des documents */ .spip.avertissement { /* texte avertissement */ margin: 10px 0 10px 0; font-size: .85em; font-style: italic; } .document_col { /* Liste liste_doc_col sur plusieurs colonnes */ padding: 0 0 10px 0; margin: 10px 5px 0 0; float: left; width: 48%; /* Valeur à  adapter en fonction du nombre de colonnes pour les documents affichés */ } .document_col_logo { float: left; margin: 0 5px 9px 0; width: 68px;/* Valeur à  adapter en fonction du nombre de colonnes pour les documents affichés */ display: inline; text-align: left; } .document_col_texte { float: left; width: 60%;/* Valeur à  adapter en fonction du nombre de colonnes pour les documents affichés */ display: inline; margin-top: -5px; } .document_col_texte .savoirplus { margin-top: 8px; } /* SQUELETTE LISTE_MOT_SSCAT */ /* __________________________________________________________________ */ .liste_mot_sscat {} /* Liste principale des catégories et des sous catégories */ .liste_mot_sscat h4, .liste_mot_sscat h5 { margin: 0 0 15px 0;} /* Liste principale des catégories et des sous catégories */ .liste_mot_sscat .ss_cat { /* Item de liste : une catégorie + ses sous catégorie */ float: left; width: 49%; } .liste_mot_sscat .deuxcol { /* Item de liste : une catégorie + ses sous catégorie sur 2 colonne équilibrées */ clear: both; margin: 0 0 10px 0; } /* PAGINATION LISTE + LISTE_LETTRE */ /* __________________________________________________________________ */ .pagination, ul.liste_lettre { text-align: right; color: #fff; margin: 10px 0 10px 0; padding: 5px 0 5px 0; font-weight: bold; clear: both; font-size: 1.2em; /* line-height: 2.5em; Décommenter en cas de chevauchement des items si ils se présentent sur 2 lignes */ } ul.liste_lettre {text-align: center;} ul.liste_lettre li {display: inline;} .pagination a.lien_pagination, ul.liste_lettre li a { text-decoration: none; background: #1b5eab; padding: 2px 5px; margin: 0 0 10px 0; display: inline-block; color: #fff; } ul.liste_lettre li a { padding: 2px 5px; } .pagination a.lien_pagination:hover, .pagination a.lien_pagination:focus, .pagination a.lien_pagination:active, ul.liste_lettre li a:hover, ul.liste_lettre li a:focus, ul.liste_lettre li a:active { text-decoration: underline; margin: 0 0 10px 0; padding: 2px 5px; display: inline-block; color: #fff; background: #ab671b; } .pagination span.on, ul.liste_lettre li span.on { text-decoration: underline; margin: 0 0 10px 0; padding: 2px 5px; display: inline-block; color: #E41318; } /* SQUELETTE LISTE D'ITEM */ /* __________________________________________________________________ */ /* Sert à  toutes les listes de liens : liste elus par ligne, liste mot, liste titre, ... ATTENTION => Squelettes/modele/doc - img - emb à  corriger ATTENTION => appliquer le class liste à  tous les ul de squelettes faisant des listes de lien (liste mot 2 col, liste titre, ... */ ul.liste li, ol.liste li { /* le ol sert pour le plan */ /* display: inline; */ } ul.liste , ul.liste , ol.liste, ol.liste, .liste_2col, .liste_elus_nom_toute_communes_par_fonction { /*background: url(...) prévoir un picto correctement calé + marge gauche */ padding: 0 0 0 15px; list-style-image: url(squelettes/images/puce_li_lien.png); margin: 0 0 3px 0; display: block; } ul.liste li a, ul.liste li a, ul.liste li a, ol.liste li a, ol.liste li a, ol.liste li a { color: #025387; } ul.liste li a:hover, ul.liste li a:focus, ul.liste li a:active, ol.liste li a:hover, ol.liste li a:focus, ol.liste li a:active { /*background: url(...) prévoir un picto correctement calé + marge gauche */ /* background: url(squelettes/images/puce_liste_liens-over.gif) no-repeat 0 0.5em;Caler la hauteur toujours en em */ text-decoration: none; color: #025387; } /* On annule la puce sur les liste d'élu (commune et commission) qui peuvent avoir aussi un lien, on ne garde que la puce du li */ .liste_2col li a, .liste_elus_nom_toute_communes_par_fonction li a { padding: 0 !important; background: none !important; /* Caler la hauteur toujours en em */ display: inline; } /* CARTO INTERACTIVE DES COMMUNES */ /* __________________________________________________________________ */ #layer1 { /* LES DIMENSIONS WIGHT ET HEIGHT SONT DEFINIES DANS LE SQUELETTE AFFICHE_CARTECOM */ position:relative; z-index:2; margin-left: auto; margin-right: auto; } #formcommune { background: #EBE9E7; left: 393px; padding: 5px; position: absolute; top: 42px; width: 200px; z-index: 99; } #formcommune label { display: none; } /* SQUELETTE ANNUAIRE, LISTE_FICHE, LISTE_ARTICLE_DEPLIAGE, LISTE_DOC_DEPLIAGE, MODELE COMMISSIONS ... */ /* __________________________________________________________________ */ /* ATTENTION, les styles des dépliages inactif, actif et over sont définis dans les styles a et a:hover h3.depliage span, h4.depliage span {} h3.depliage span.layer-actif, h4.depliage span.layer-actif {} h3.depliage span:hover, h4.depliage span:hover {} */ /* Espace entre les items */ .margin_depliage, .liste_fiche_depliage>li, .liste_fiche_depliage_all>li, .affiche_commissions>li, .liste_titre_article_par_mot_depliage>li, .liste_fiche_nomcat>li, .liste_fiche_lettre_depliage>li, .liste_fiche_depliage>li, .liste_evmnt_depliage>li, .liste_doc_depliage_par_annee>li, .liste_doc_depliagesurannee_par_annee>li, .liste_doc_depliage_une_annee>li, .liste_doc_depliage>li, .liste_article_depliage_par_annee>li, .liste_article_depliage>li, .googlemap_menu_nav>li { margin: 0 0 0 0; } .liste_doc_depliagesurannee_par_annee .layerdeplie{ padding: 3px 0 3px 9px; width: 476px; margin: 0; } h3.depliage, h4.depliage, h5.depliage { /* Titre servant à  deplier */ font-size: 1em; padding: 3px 0 3px 9px; margin: 0; clear: both; color: #025387; font-weight: bold; width: 476px; /* Ne pas effacer pour un affichage correct sous ie*/ background: #FFF url(squelettes/images/fond_h4_depliage_top.png) no-repeat top left; line-height: 2.1em; } /* Pour définir un roll over sur tout le block, style persistant quand actif */ /* Ajouter un dans le titre pour "pousser" le block */ /* Commenter ces lignes si pas de bacground sur le h3 ou h4 */ h3.depliage:hover, h4.depliage:hover, h5.depliage:hover, h3.depliage.actif, h4.depliage.actif, h5.depliage.actif {color: #e41318;background: #f0f0f0 url(squelettes/images/fond_h4_depliage_top.png) no-repeat top left;} /* Remplacer les valeurs si pas de bacground sur le h3 ou h4 */ h3.depliage span.clear, h4.depliage span.clear, h5.depliage span.clear, h3.depliage:hover span.clear, h4.depliage:hover span.clear, h5.depliage:hover span.clear {display: block;float: none;/* display: none; */} /* Pour modifier le texte au survol du picto */ h3.depliage span, h4.depliage span, h5.depliage span {color: #025387; } h3.depliage span.layer-actif, h4.depliage span.layer-actif, h5.depliage span.layer-actif, h3.depliage span:hover, h4.depliage span:hover, h5.depliage span:hover, h3.depliage:hover span, h4.depliage:hover span, h5.depliage:hover span {color: #e41318; text-decoration: underline;} h3.depliage img, h4.depliage img, h5.depliage img { /* Image de depliage */ float: left; /* NE PAS EFFACERCETTE LIGNE (empeche le retour à  la ligne du texte sous l'image en cas de titre long) */ display: inline; /* NE PAS EFFACERCETTE LIGNE (empeche le retour à  la ligne du texte sous l'image en cas de titre long) */ width: 26px; /* NE PAS EFFACERCETTE LIGNE (empeche le retour à  la ligne du texte sous l'image en cas de titre long) */ margin: 6px 5px 0 0; cursor: pointer; vertical-align: middle; } h3.depliage span, h4.depliage span, h5.depliage span { /* Etat au repos du lien => NE PAS DEFINIR LA COULEUR -> définie dans le style a */ margin: 0; padding: 0; cursor: pointer; display: inline; /* NE PAS EFFACERCETTE LIGNE (empeche le retour à  la ligne du texte sous l'image en cas de titre long) */ width: 443px; /* NE PAS EFFACERCETTE LIGNE (empeche le retour à  la ligne du texte sous l'image en cas de titre long) */ float: left; /* NE PAS EFFACERCETTE LIGNE (empeche le retour à  la ligne du texte sous l'image en cas de titre long) */ } h2.h2_recherche span.spip_surligne, h3.depliage span.spip_surligne, h4.depliage span.spip_surligne, h5.depliage span.spip_surligne{ width: auto !important; display: inline !important; } /* ~~~~~~~~~~~~~~~~~~~~~~~ DEPLIAGE DANS UNE FICHE ANNUAIRE AVEC LOGO */ .colonne_gauche_logo h3.depliage span, .colonne_gauche_logo h4.depliage span, .colonne_gauche_logo h5.depliage span { /* Etat au repos du lien => NE PAS DEFINIR LA COULEUR -> définie dans le style a */ width: 430px; /* NE PAS EFFACERCETTE LIGNE (empeche le retour à  la ligne du texte sous l'image en cas de titre long) */ } .layerdeplie { /* Layer de contenu */ padding: 10px; margin: 0 0 10px 31px; clear: both; width: 454px; overflow: hidden; /* Masque les image trops grande qui sortent du cadre - NE PAS EFFACER */ background: #F0F0F0 url(squelettes/images/fond_li_depliage.jpg) repeat-x bottom left; min-height: 80px; } /* ~~~~~~~~~~~~~~~~~~~~~~~ Spécificité de la carto google dans les dépliages */ /* Pour avoir un dépliage dans un dépliage, on ré-affecte toute la largeur de la zone au layerdeplie et on supprime le padding */ .affiche .layerdeplie { margin: 0px 0 10px 0; padding: 0 0 10px 0; clear: both; float: left; width: 485px; } .masque .layerdeplie { /* On utilise une autre méthode de masque pour éviter les bug d'affichage sur la carto */ margin: -20000px 0 0 -20000px; clear: none; float: left; } /* Layer de contenu et marge de l'extra du liste_evmnt_depliage*/ .liste_evmnt_depliage .layerdeplie , .liste_evmnt_depliage .extraarticle {margin-left: 31px;} /* Par défaut garder le margin left du .layerdeplie */ /* Affichage des logos sur portrait ou fiche annuaire dans un dépliage */ .layerdeplie .spip_logo_fiche { float: left; /* => float: right; pour aligner à  droite */ margin: 0 28px 5px 16px; display: inline; } /* Dépliage de la carto dans un autre dépliage... (2 niveaux de dépliage) */ .layerdeplie h4.depliage, .layerdeplie h5.depliage { width: 479px; margin-top: 15px; } .layerdeplie .layerdeplie h4.depliage:hover, .layerdeplie .layerdeplie h4.depliage.actif, .layerdeplie .layerdeplie h5.depliage:hover, .layerdeplie .layerdeplie h5.depliage.actif { background: #A9C307; } .layerdeplie .layerdeplie { width: 490px; padding: 0; } /* SQUELETTE CARTO GOOGLE DU TERRITOIRE */ /* __________________________________________________________________ */ /* ULTERIEUREMENT : VOIR POUR POSITIONNEMENT DEUXIEME LIGNE DE TITRE SI TITRE SUR DEUX LIGNES */ /* ATTENTION, les styles des dépliages inactif, actif et over sont définis dans les styles a et a:hover h3.depliage span, h4.depliage span {} h3.depliage span.layer-actif, h4.depliage span.layer-actif {} h3.depliage span:hover, h4.depliage span:hover {} */ .googlemap_menu_nav {margin: 15px 0 0 0; width: 100%;} .googlemap_menu_nav .item { width: 250px;/* Régler la largeur des colonnes - Commenter pour supprimer le double colonnage */ float: left; /* Commenter pour supprimer le double colonnage */ } h3.depliage.carto, h4.depliage.carto { /* Titre servant à  deplier */ padding: 0; margin: 0; font-size: 0.9em; min-height: 28px; /* Cette ligne permer de corriger le bug du pixel de décalage au survol sur IE */ width: 240px; } h3.depliage.carto img, h4.depliage.carto img { /* Image de depliage */ cursor: pointer; vertical-align: middle; width: auto; } h3.depliage.carto span, h4.depliage.carto span { /* Etat au repos du lien => NE PAS DEFINIR LA COULEUR -> définie dans le style a */ margin: 0 0 1px 5px; padding: 0; font-weight: normal; cursor: pointer; vertical-align: middle; width: 150px; /* Régler la largeur suivant la largeur des colonnes */ } h3.depliage.carto span.clear, h4.depliage.carto span.clear { margin: 0; padding: 0; display: block; } h3.depliage.carto span, h4.depliage.carto span, h3.depliage.carto img, h4.depliage.carto img, h3.depliage.carto input, h4.depliage.carto input { vertical-align: middle; float: left; } h3.depliage.carto input, h4.depliage.carto input { margin: 3px 0 0 0; /* HACK POUR IE => VOIR FEUILLE DE STYLE spip_ie_template.css */ } .layerdepliecarto { margin: 0 0 10px 74px; font-size: 0.9em; } .stylelayer { max-height: 120px; overflow: auto; clear: both; } /* LISTE CATEGORIE ANNUAIRE SUR 2 COLONNES */ /* __________________________________________________________________ */ .liste_mot_2col li, .liste_2col li, .liste_elus_nom_par_fonction_2col li { float: left; width: 49%; } .liste_2col li { display: inline; margin: 0;width: 46%;} ul.liste_2col.president li { display: inline; margin: 0;width: 100%;} /* ZOOM SUR VIGNETTE FICHE ANNUAIRE */ /* __________________________________________________________________ */ #previsu { background:none repeat scroll 0 0 #FFFFFF; border: 1px solid #FFFFFF; display:none; margin:0; padding:3px; position:absolute; z-index: 200; } .fauxsurvol:hover { cursor: pointer; } /* ~~~~~~~~~~~~~~~~~~~~~~~ MARCHE PUBLIC POUR LISTE_AVIS_COMPLET */ .liste_avis li { margin: 0 0 15px 0; } .liste_avis li strong { color: #000; } /* SQUELETTE LISTE_TITRE_DOSSIER / ENCARD DANS LE CONTENU */ /* __________________________________________________________________ */ .encart { border: 2px solid #f9f9f9; clear: both; position: relative; margin: 20px 0 0 0; padding: 0 0 9px 0; z-index: 100; } /* SQUELETTE ENCART_DOSSIERS */ /* __________________________________________________________________ */ .encartdossiers {}/* Encart des dossiers, à  styler si utilisé */ .encartdossiers h2 {}/* Titre, à  styler si utilisé */ .encartdossiers ul {}/* Liste, à  styler si utilisé */ /* SQUELETTE ENCART_INFO_CONTACT */ /* __________________________________________________________________ */ .encartinfocontact {}/* Encart info_contact, à  styler si utilisé */ .encartinfocontact h2 {}/* Titre, à  styler si utilisé */ /* SQUELETTE ENCART_ACTUALITE_THEMATIQUE */ /* __________________________________________________________________ */ .actus_thematiques {}/* Encart actus thematiques, à  styler si utilisé */ .actus_thematiques .date_actu_thema {}/* Encart info_contact, date, à  styler si utilisé */ .actus_thematiques h3 {}/* Titre, à  styler si utilisé */ .actus_thematiques .texte_actu_thema {}/* Encart info_contact, texte, à  styler si utilisé */ /* ELUS */ /* __________________________________________________________________ */ /* ~~~~~~~~~~~~~~~~~~~~~~~ Block élu détail*/ .block_elu_detail { /* Block un elu */ margin: 20px 0 0 0; padding: 12px; border: 1px solid #d2d2d2; } .block_elu_detail .photo_elu { /* Photo de l'elu */ float: left; display: inline; width: 140px; /* Régler la taille en fonction du masque ou de la taille de la photo */ height: 162px; /* Régler la taille en fonction du masque ou de la taille de la photo */ } .info_elu { /* Informations sur l'elu */ float: left; display: inline; width: 330px; margin: 0; } .block_elu_detail h3, .block_elu_detail h4 { /* Nom de l'élu */ font-size: 1.1em; color: #007799; margin: 0 0 24px 0; background: url(squelettes/images/picto_h3.gif) no-repeat 0 0.3em; padding: 0 0 0 14px; /* Prérégler le déclage de la seconde ligne et suivante qd picto */ } .info_elu .fonction_elu { /* Fonction sur l'élu */ } .info_elu .texte_elu { /* Autres infos sur l'élu */ } .info_elu p { /* Paragraphe Informations sur l'élu */ margin: 0; } /* Lien "Consulter la fiche" - Idem "Lire la suite" des listes d'article mais personalisable */ .info_elu .savoirplus a:link, .info_elu .savoirplus a:visited {} .info_elu .savoirplus a:link:hover, .info_elu .savoirplus a:visited:hover, .info_elu .savoirplus a:active, .info_elu .savoirplus a:focus {} /* ~~~~~~~~~~~~~~~~~~~~~~~ Block élu trombi*/ /* HACK POUR IE => VOIR FEUILLE DE STYLE spip_ie_template.css */ .block_elu_trombi { /* General */ } .fiche_entete { /* La fiche en tàªte */ margin: 0 0 2em 0; text-align: center; } .fiche_entete .photo_elu { /* Alignement de la photo de la fiche entete */ width: 100px; margin: 0 0 0 203px;/* HACK POUR IE => VOIR FEUILLE DE STYLE spip_ie_template.css */ } .fiche_trombi { /* Les blocks élu */ float: left; display: inline; text-align: center; width: 170px; margin: 0 0 2em 0; min-height: 150px;/* HACK POUR IE6 => VOIR FEUILLE DE STYLE spip_ie_template.css */ } .fiche_trombi .photo_elu { /* Alignement de la photo de la fiche entete */ width: 100px; margin: 0 0 0 34px;/* HACK POUR IE => VOIR FEUILLE DE STYLE spip_ie_template.css */ } .block_elu_trombi h3, .block_elu_trombi h4 { /* Style sur le nom */ font-size: 1em; color: #007799; clear: both; } .block_elu_trombi .fonction_elu { /* Fonction sur l'élu */ } .block_elu_trombi .texte_elu { /* Autres infos sur l'élu */ } /* Lien "Consulter la fiche" - Idem "Lire la suite" des listes d'article mais personalisable */ .block_elu_trombi .savoirplus a:link, .block_elu_trombi .savoirplus a:visited {} .block_elu_trombi .savoirplus a:link:hover, .block_elu_trombi .savoirplus a:visited:hover, .block_elu_trombi .savoirplus a:active, .block_elu_trombi .savoirplus a:focus {} /* ~~~~~~~~~~~~~~~~~~~~~~~ Liste_elu_par_commission*/ .liste_elus_par_commission li { clear: both; } .liste_elus_par_commission li td strong { /*color: #707D65;*/ } /* ~~~~~~~~~~~~~~~~~~~~~~~ liste_elu_nom_toutes_communes_par_fonction*/ ul.liste_elus_nom_toute_communes_par_fonction li.block_commune { /* Boite pour une commune */ float: left; display: inline; /* Correction du bug ie sur les flottants */ width: 150px; min-height:85px;/* HACK POUR IE6 => VOIR FEUILLE DE STYLE spip_ie_template.css */ word-wrap: break-word; /* Si le texte sort du cadre il y a un retour à  la ligne automatique */ margin: 5px 5px 0 1px; padding: 0 5px 5px 5px; background: #E9ECF1; border: 1px solid #BAC2D5; } ul.liste_elus_nom_toute_communes_par_fonction ul.liste {/* Liste des élus */ margin: 0; } ul.liste_elus_nom_toute_communes_par_fonction ul.liste li { font-size: 0.9em; text-align: left; margin: 0 5px 0 0; } ul.liste_elus_nom_toute_communes_par_fonction h3.spip {/* La zone réduite peut demander un surtraitement pour le titre (si picto ou filet...) */ margin: 5px 0 7px 0; } /* ~~~~~~~~~~~~~~~~~~~~~~~ MODELE AFFICHE_COMMISSION*/ /* Présentation des élus sur une ligne (genre) */ .affiche_commissions li p.spip { /* Descriptif de la commission (texte descriptif du mot clé commission) */ clear: both; margin: 0 0 20px 0 !important; } .affiche_commissions li h5 { /* On définit des marges et padding différents pour les titres dans les dépliages */ margin: 0.8em 0 0.5em 0 !important; padding: 0; font-weight: bold; } /* ~~~~~~~~~~~~~~~~~~~~~~~ MODELE LISTE_ELUS_NOM_PAR_FONCTION_2COL*/ .liste_elus_nom_par_fonction_2col li { /* Pour mettre les élus sur 2 colonnes décommenter float: left; width: 50%; */ } /* AGENDA */ /* __________________________________________________________________ */ /* ~~~~~~~~~~~~~~~~~~~~~~~ LISTE_AGENDA*/ ul.listemois { /* Liste des mois */ list-style-type: none; width: 30%; float: left; margin: 0 2% 0 0; } ul.listemois li { /* Mois de la liste */ word-wrap: break-word; /* Si le texte sort du cadre il y a un retour à  la ligne automatique */ } .liste_agenda .themearticle, .liste_agenda .dateevmnt, .liste_agenda .extraarticle { /* On redéfinit les tailles et margin des dates et infos */ margin: 0; padding: 0; font-size: 1em; } .liste_agenda h4 { /* On redéfinit les tailles et margin des titres */ margin: 0; padding: 0; font-size: 1em; } .liste_agenda .dateevmnt { /* On redéfinit les tailles et margin des dates */ font-size: 1em; } .liste_agenda .themearticle { /* Mise en forme de la thématique - Màªme couleur que .dateevmnt ? */ } .liste_agenda .extraarticle { /* Mis en forme de l heure et du lieu - Màªme couleur que .dateevmnt ? */ } /* Largeur des colonnes du tableau sur le liste agenda */ .largeur1 {width: 20%; vertical-align: top;} /* Régler la largeur de la colonne */ .largeur2 {width: 25%; vertical-align: top;} /* Régler la largeur de la colonne */ .largeur3 {width: 40%; vertical-align: top;} /* Régler la largeur de la colonne */ .largeur4 {width: 15%;} /* Régler la largeur de la colonne */ /* ~~~~~~~~~~~~~~~~~~~~~~~ LISTE_EVENEMENT_DEPLIAGE*/ .liste_evmnt_depliage .extraarticle { clear: both; } /* SQUELETTE LISTE_CHOIX_MOT, LISTE_CHOIX_MOT_AGENDA, LISTE_CHOIX_RUB_AGENDA */ /* __________________________________________________________________ */ /* Liste déroulante de mots clés */ #liste_choix_mot, #liste_choix_mot_agenda, #liste_choix_rub_agenda, #liste_choix_article, #liste_choix_rubrique { /* listes deroulantes en haut à  droite */ margin: 30px 0 15px 0; clear: both; text-align: right; } #liste_choix_mot label, #liste_choix_mot_agenda label, #liste_choix_rub_agenda label, #liste_choix_article label, #liste_choix_rubrique label { display:none; } .liste_deroulante { /* Liste deroulante */ padding: 0; } #liste_choix_mot option.titrelistemot { /* mise en valeur du titre*/ font-weight: bold; font-style: italic; } /* AFFICHE AAPC */ /* __________________________________________________________________ */ .marge_contrat { /*margin: 30px 0 10px 0;*/ } /* FORMULAIRES */ /* __________________________________________________________________ */ /* SQUELETTE FORM_CONTACT, FORM_DEMANDE_BAC */ /* __________________________________________________________________ */ form, div.reponse_sondage form { /* Le formulaire */ width: 100%; background: transparent; color: #4d4c4c; /* Ne pas effacer : utilisé par le formulaire sur la page abonnement à  la newsletter */ margin: 10px 0 0 0; } /* ~~~~~~~~~~~~~~~~~~~~~~~ Lignes et champs de saisie*/ form input, .formulaire_forum form input, form select, form textarea { /* Réglage des couleurs de bordure et de la largeur des champs de saisie */ border: 1px solid #e3e3e3; background: #fff; width: 200px; } form textarea { font-size: 1em; font-family: Arial, Helvetica, sans-serif; } form input:focus, form textarea:focus, form select:focus, .spip_forms .forml:focus, .spip_forms .fondl:focus { /* Changement de la couleur de fond des champs de saisie au focus, pas reconnu par IE */ background: #e3e3e3; } .formulaire_inscription fieldset, form fieldset, div.spip_forms form fieldset { /* Cadre d'info */ margin: 0 0 10px 0;/* HACK POUR IE => VOIR FEUILLE DE STYLE spip_ie_template.css */ padding: 15px 20px; border: 1px solid #afaeae; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } div.spip_forms form fieldset.margintop10 { margin-top: 10px;} /* POUR FORMULAIRE MARCHE PUBLIC */ .formulaire_inscription legend, form legend { /* Legende cadre */ color: #484747; font-weight: bold; margin-left: 9px; /* HACK POUR IE => VOIR FEUILLE DE STYLE spip_ie_template.css */ } form input.radio, form input.checkbox {width: auto;border: none;min-height: 1px;} /* Champ radio et checkbox - Annule largeur et bordure */ #formcontactcss .ligne{ margin-bottom: 6px; } form option { color: #54595C; } .contact1, .contact2 { /* Presentation du formulaire sur deux colonnes */ padding: 2px 0; float: left; text-align: left; } .contact1 { width: 45%; text-align: left; } .contact2 { width: 55%; margin: 0 0 5px 0; } form ul.contact2 { /* Liste de choix avec texte long => on met sur une ligne entiêre */ clear: both; width: auto; } form ul.contact2 li { /* Liste de choix avec texte long => on met sur une ligne entiêre */ margin: 0 0 0 30px; clear: both; } .reponse_formulaire { /* Message de reponse du formulaire de candidature */ color: #FF3300; font-size: 1em; } .nbplaces { width: 30px; } /* ~~~~~~~~~~~~~~~~~~~~~~~ Boutons*/ .spip_boutoncss, .spip_bouton { /* Bouton de validation */ font-size: 1.1em; color:#FFFFFF; width: auto; cursor:pointer; text-align:center; margin: 15px 0 0 0; padding: 1px; font-style: italic; } .spip_boutoncss.reset { /* Bouton d'annulation */ background: url(squelettes/images/fond_bouton_anuler_form.png); border: 1px solid #a1a1a1; padding: 0 17px; margin: 10px 10px 10px 0; vertical-align: middle; line-height: 1.7em; } .spip_boutoncss.reset:hover, .spip_boutoncss.reset:focus, .spip_boutoncss.reset:active { /* Bouton d'annulation hover */ border: 1px solid #626262; text-decoration: underline; } .spip_boutoncss.submit { /* Bouton de validation */ background: url(squelettes/images/fond_bouton_envoyer_form.png); border: 1px solid #9fc0e3; margin: 10px 0 10px 0; padding: 0 15px; vertical-align: middle; line-height: 1.7em; } .spip_boutoncss.submit:hover, .spip_boutoncss.submit:focus, .spip_boutoncss.submit:active { /* Bouton de validation hover */ border: 1px solid #456b93; text-decoration: underline; } /* Forums */ .formulaire_spip input.spip_boutoncss {width: auto;} .formulaire_spip textarea {width: 95%; margin: 0 2%;} /* Formulaires de login */ #login, #oubli_form {width:100%;} #login input , #login_admin input {width: auto;} #login div, #inscription div, #login_admin div, #oubli_form div {text-align: left;margin: 5px 0 0 0;} #login p, #inscription p, #login_admin p, #oubli_form p {margin: 0;} /* Message de confirmation d'envoi de formulaire */ .reponse, .spip_form_ok, .formulaire_ok { background: none repeat scroll 0 0 #262626; display: block; font-weight: bold; margin: 1em 0; padding: 0.6em; background: #F1F1F1; } /* Message d'erreur d'envoi de formulaire */ span.erreur, .obligatoire_oublie, .erreur_message { color: red; } .champ_obli_oubli { border:2px solid red; width:auto; } /* Couleur de fond des champs obligatoire */ .spip_forms .forml, .spip_forms .fondl { /*color: #EDEBAF;*/ } /* Picto de l'aide */ .formInfo a, .formInfo a:active, .formInfo a:visited{ background-color: #f66; font-size: 1.3em; font-weight:bold; padding:1px 2px; margin-left:2px; margin-right: -15px; color:#FFFFFF; text-decoration: none; float: right; } .formInfo a:hover{ } /* Picto de l'aide => survol */ #JT_arrow_left{ background-image: url(../plugins/auto/forms_et_tables_2_0/img_pack/arrow_left.gif); background-repeat: no-repeat; background-position: left top; position: absolute; z-index:101; left:-12px; height:23px; width:10px; top:-3px; } #JT_arrow_right{ background-image: url(../plugins/auto/forms_et_tables_2_0/img_pack/arrow_right.gif); background-repeat: no-repeat; background-position: left top; position: absolute; z-index:101; height:23px; width:11px; top:-2px; } #JT { position: absolute; z-index:100; border: 2px solid #CCCCCC; background-color: #fff; } #JT_close_left{ background-color: #CCCCCC; text-align: left; padding-left: 8px; padding-bottom: 5px; padding-top: 2px; font-weight:bold; } #JT_close_right{ background-color: #CCCCCC; text-align: left; padding-left: 8px; padding-bottom: 5px; padding-top: 2px; font-weight:bold; } #JT_copy p{ margin:3px 0; font-size: 0.8em; } #JT_copy img{ padding: 1px; border: 1px solid #CCCCCC; } .jTip{ cursor:help; } /* POSITION DU DATE PICKER */ a.date-picker { margin: -3px 0 0 0; } .spip_forms .spip_sondage .ligne_barre { background: url("squelettes/images/ligne.gif"); } /* THICKBOX */ /* __________________________________________________________________ */ /* REGLER LES STYLES DANS PLIGIN/THICKBOX/TICKBOX.CSS */ /* VIDEO */ /* __________________________________________________________________ */ /* Rubrique */ .liste-videos li {width: 48%; float: left; margin-right: 1%;} /* Article */ .video {} /* SQUELETTE CARTE_AFFICHE_CARTE, CARTE_AFFICHE_SITE */ /* __________________________________________________________________ */ /* Il est maintenant possible d'appeller differents affiches site selon les besoin, on doit donc pouvoir positionner differement les encart affiche_site selon l'appel. Pour ca, créer autant de style que nécessaire, en remplacant par le nom de lencart appellée (celui qui est dans l'appel du carte_affiche_carte) Regler : mise en forme commune Position et taille individuels */ .infos { /* Mis en forme div infos */ left: 484px; /* Positionner l'encart */ top: 100px; /* Positionner l'encart */ /* Positionner en em si du texte passe par dessus quand on aggrandi les caractêres (on simule mais à§a reste limité...) */ width: 181px; /* Largeur */ min-height: 370px; /* Hauteur *//* HACK POUR IE6 => VOIR FEUILLE DE STYLE spip_ie_template.css */ z-index: 99; text-align: left; background: #FFFFFF; border: 1px solid #F9F0E9; padding: 5px; overflow: auto; } .infos h3.spip { /* styler comme le h2 */ width: 155px; color: #6F6F6F; font-size: 1.3em; clear: none; } .infos h4 {} /* styler si besoin, comme le h3.spip */ .infos .chapo { /* Alignement du chapo */ text-align: left; margin: 2px 0 2px 0; } .infos .extraarticle { /* Présentation des extras */ /* margin: 0; */ } .infos .spip { /* Réglage du class spip */ margin: 0; } .fermeture { /* Bouton fermeture */ width: 1em; height: 1em; line-height: 1em; float: right; display: inline; background: #FF0000; margin: 5px 2px 2px 0; padding: 0 0 2px 1px; text-align: center; /* Coins arrondis en css - Non reconnu par ie... */ -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; } .fermeture a { /* Bouton fermeture lien */ color: #FFFFFF; text-decoration: none; font-weight: bold; } .fermeture a:hover { /* Bouton fermeture lien */ color: #FFFFFF; } /* ~~~~~~~~~~~~~~~~~~~~~~~ Positionnement spécifiques des encarts */ /* Encart ENTREPRISES */ .infos.entreprise { /* Position et taille div infos dechetterie */ left: 484px; /* Positionner l'encart */ top: 100px; /* Positionner l'encart */ /* Positionner en em si du texte passe par dessus quand on aggrandi les caractêres (on simule mais à§a reste limité...) */ width: 181px; /* Largeur */ min-height: 450px; /* Hauteur *//* HACK POUR IE6 => VOIR FEUILLE DE STYLE spip_ie_template.css */ } /* Encart COMMUNES */ .infos.commune { /* Position et taille div infos dechetterie */ left: 484px; /* Positionner l'encart */ top: 100px; /* Positionner l'encart */ /* Positionner en em si du texte passe par dessus quand on aggrandi les caractêres (on simule mais à§a reste limité...) */ width: 181px; /* Largeur */ min-height: 450px; /* Hauteur *//* HACK POUR IE6 => VOIR FEUILLE DE STYLE spip_ie_template.css */ } /* Encart DECHETTERIE */ .infos.dechetterie { /* Position et taille div infos dechetterie */ left: 484px; /* Positionner l'encart */ top: 6em; /* Positionner l'encart */ /* Positionner en em si du texte passe par dessus quand on aggrandi les caractêres (on simule mais à§a reste limité...) */ width: 181px; /* Largeur */ min-height: 450px; /* Hauteur *//* HACK POUR IE6 => VOIR FEUILLE DE STYLE spip_ie_template.css */ } /* Tableau d'ouverture des déchetterries */ table.dechetterie { width: auto; text-align: center; } table.dechetterie caption {} /* Permet si besoin de masquer le texte de la balise caption */ .ouvert {background: #a2c7a3;color: #a2c7a3;width: 33%;} /* Jours d'ouverture */ .ferme { background: #be9761;color: #be9761; width: 33%;} /* Jours de fermeture */ /* PLAN */ /* __________________________________________________________________ */ /* ~~~~~~~~~~~~~~~~~~~~~~~Couleur des titres h3/h4/h5/h6 => reste des infos définies en tàªte de cette feuille de styles */ h3.plan a { color: #004595; } h4.plan a { color: #AAAA45; } h5.plan a { color: #CDCDCD; } h6.plan a { color: #141512; } /* ~~~~~~~~~~~~~~~~~~~~~~~ Niveau 1 */ .plan1 { /* Ecart Block niveau 1 */ margin: 20px 0 10px 20px; } .plan1 li { /* Item list block (Tous) */ display: inline; } .plan1 li a { /* Ecart Item list block niveau 1 (hérité par les autres niveaux) */ display: block; margin: 3px 0 2px 0; padding: 0 0 5px 15px; background: url(squelettes/images/liste_spip_niv1.gif) no-repeat left 30% !important; color: #484747; text-decoration: none; } .plan1 li a:hover{ text-decoration: underline; } /* ~~~~~~~~~~~~~~~~~~~~~~~ Niveau 2 */ .plan2 { /* Ecart Block niveau 2 */ margin: 0 0 0 40px; } .plan2 li a { /* Ecart Item list block niveau 2 */ margin: 3px 0 2px 0; padding: 0 0 5px 15px; background: url(squelettes/images/liste_spip_niv2.gif) no-repeat left 30% !important; color: #484747; } /* ~~~~~~~~~~~~~~~~~~~~~~~ Niveau 3 */ .plan3 { /* Ecart Block niveau 3 */ margin: 0 0 0 40px; } .plan3 li a { /* Ecart Item list block niveau 3 */ margin: 3px 0 2px 0; padding: 0 0 5px 15px; background: none !important; color: #484747; } .plan3 li a:before{ content: '- '; } /* ~~~~~~~~~~~~~~~~~~~~~~~ Liste Niveau final */ .liste.plan { /* liste Plan final */ margin: 0 0 20px 40px; } .liste.plan li a { /* taille liste Plan final */ font-size:0.8em; color: #484747; } .liste.plan li a:hover{ text-decoration: underline; color: #D65100; } /* BOUTON RETOUR & HAUT DE PAGE */ /* __________________________________________________________________ */ .retour { /* Bouton retour en texte ou block retour*/ text-align: right; font-size: 1em; padding: 25px 0 10px 0; clear: both; } .retour img { /* Bouton retour image */ vertical-align: middle; } .retour a {} /* Bouton retour lien */ .retour a:hover, .retour a:focus, .retour a:active {} /* Bouton retour lien hover */ /* DIVERS */ /* __________________________________________________________________ */ /* __________________________________________________________________ */ /* Principe : le nom de la classe correpond à  l'action voulu => une propiété/valeur par classe !! */ .align_right {text-align: right;} /* Aligner a droite */ .align_left {text-align: left;} /* Aligner a gauche */ .centrer, .center {text-align: center;} /* Centrer */ .float_left {float: left;} /* Flottant gauche */ .float_right {float: right;} /* Flottant droit */ .float_none {float: none;} /* Pas de flottant */ .sanspadding {padding: 0;} /* Pas de padding */ .annulewidth {width: auto;} /* Annule la largeur */ .display_none {display: none;} /* Masquer un élément */ /* __________________________________________________________________ */ /* pour "pousser" si presence de float */ .clear { clear: both; line-height: 0; font-size: 1px; } /* FORUM */ /* __________________________________________________________________ */ /* REPRENDRE TOUS LE STYLAGE DES FORUM SUR LA BASE DU DEPLIAGE CLASSIQUE => on DOIT FACILEMENT POUVOIR D2FINIR DES STYLE SPECIFICAUQE POUR LE DEPLIAGE FORUM /* METTRE EN PLACE DES TITRE AVEC NIVEAU H3/H4/H5 avec niveau d'entrée en paramêtre */ /* CSS Document */ /* SUPPRIMER SI LES FORUMS NE SONT PAS UTILISES */ /* __________________________________________________________________ */ /* ~~~~~~~~~~~~~~~~~~~~~~~ MASQUAGE BARRE TYPO DANS LES FORUM */ table.spip_barre { display: none; } /* ~~~~~~~~~~~~~~~~~~~~~~~ FIL DE FORUM */ .sujet_forum { /* Sujet principal (premier niveau) */ margin: 0 0 10px 0; } .item_forum { /* Indentation des niveaux de message */ margin: 0 0 10px 0; padding: 0; } .item_forum.bg { background: #CCCCCC;} .ssniveau { /* Indentation des niveaux de message */ margin: 0 0 0 20px; } .depliageforum { /* Tous les titres servant à  deplier */ font-size: 1em; font-weight: bold; padding: 0; margin: 0; clear: both; color: #669600; width: 100%; } /* Pour définir un roll over sur tout le block, style persistant quand actif */ /* Ajouter un dans le titre pour "pousser" le block */ /* .depliageforum:hover, .depliageforum.actif {} .depliageforum span.clear, .depliageforum:hover span.clear {display: block;float: none;} */ .depliageforum img { /* Image de depliage */ float: left; /* NE PAS EFFACERCETTE LIGNE (empeche le retour à  la ligne du texte sous l'image en cas de titre long) */ display: inline; /* NE PAS EFFACERCETTE LIGNE (empeche le retour à  la ligne du texte sous l'image en cas de titre long) */ width: 15px; /* NE PAS EFFACERCETTE LIGNE (empeche le retour à  la ligne du texte sous l'image en cas de titre long) */ margin: 0 5px 0 0; cursor: pointer; vertical-align: middle; } .depliageforum span { /* Etat au repos du lien => NE PAS DEFINIR LA COULEUR -> définie dans le style a */ margin: 0 0 2px 0; padding: 0; cursor: pointer; display: inline; /* NE PAS EFFACERCETTE LIGNE (empeche le retour à  la ligne du texte sous l'image en cas de titre long) */ width: 80%; /* NE PAS EFFACERCETTE LIGNE (empeche le retour à  la ligne du texte sous l'image en cas de titre long) */ float: left; /* NE PAS EFFACERCETTE LIGNE (empeche le retour à  la ligne du texte sous l'image en cas de titre long) */ } .dateforum { clear: both; margin: 0 0 0 20px; font-size: 0.9em; } .layerdeplieforum { margin: 0 0 0 20px; } /* ~~~~~~~~~~~~~~~~~~~~~~~ Conditions generales d'utilisation du forum présent dans le formulaire d'inscription*/ .cgu { height: 100px; overflow-y: scroll; padding: 2px 10px 0 0; } /* SUPPRIMER SI LES FORMUMS NE SONT PAS UTILISES */ /* __________________________________________________________________ */ /* --------------------------------------------------- RESPONSIVE --------------------------------------------------- */ /* --------------------------------------------------- RESPONSIVE --------------------------------------------------- */ /* --------------------------------------------------- RESPONSIVE --------------------------------------------------- */ @media screen and (max-width: 1000px){ #colonne_contenu h2, #colonne_contenu h3{ margin-left: 0; } } /* MARKER */ .olLayerDiv img{ border:0px !important; };