sert au centrage de la page à l'intérieur de (pour limiter la largeur à 778px => pas de défilement horizontal sur un écran 15" en 800x600) => ce

remplace (toute la page se trouve à l'intérieur) */ /* Le

sert à centrer la page utile, de largeur 778px à l'intérieur de => cette balise remplace (toute la page se trouve à l'intérieur) */ /* N.B. : position relative de ce bloc pour pouvoir y effectuer des positionnements d'autres blocs */ div#toute_la_page { background-color: white; font: 14px Arial, sans-serif; overflow: hidden; width: 778px; position: relative; margin: 0 auto; border: none; } /* Logo et en-tête, tout en haut de la page */ div#bandeau_eid { width: 778px; height: 71px; } div#bandeau_eid * { text-decoration: none; } div#bandeau_eid img { border: none; } div#EID-logo-et-nom { text-align: left; } div#EID-logo-et-nom img { float: left; /*Pour IE6=>*/ position: relative; } div#EID-logo-et-nom p { line-height: 1.1em; position: relative; top: 3px; font-family: /* "Eras Medium ITC", */Arial, sans-serif; font-weight: bold; font-size: 1.2em; /* color: #606060; */ color: white; } div#EID-logo-et-nom p strong { font-family: /* "Eras Bold ITC", */"Arial Black", Arial, sans-serif; /* color: #5279B6; */ color: white; } div#EID-logo-et-nom img#logo-mini-EID { margin-left: 10px; } div#EID-logo-et-nom img#titre_EID { position: absolute; top: 3px; *top: 5px; _top: 3px; left: 110px; _left: 20px; } div#logosCG { position: absolute; top: 8px; right: 5px; } div#logosCG img { padding-right: 5px; } p#titre-sur-logos-CG-mini { text-align: left; font-size: 0.8em; } div#logosCG a:hover { text-decoration: none; } /* Classes afficher (display: block;) et masquer (display: none;), utilisées pour les sous-menus */ .afficher { display: block; } .masquer { display: none; } /* Flottant à gauche */ .flotteAgauche, .flottG { float: left; margin-right: 10px; } /* Flottant à droite */ .flotteAdroite, .flottD { float: right; margin-left: 10px; } /* En ligne (sans retour à la ligne) */ .enligne, #page .enligne { display: inline; } /* Texte de taille plus petite */ .petit, .pluspetit, #page .petit, #page .pluspetit { font-size: 80%; } /* Taille normale */ .normal, .taillenormale, #page .normal, #page .taillenormale { font-size: 100%; } /* Taille plus grande */ .plusgrand, #page .plusgrand { font-size: 120%; } /* Décalage vers le bas */ .indice { vertical-align: -12%; } /* Centrage horizontal du contenu du bloc de classe "centre" */ .centre, #page .centre { text-align: center; } /* Texte en gris */ .gris, #page .gris { color: gray; } /* Texte en bleu (bleu des titres du site EID) */ .bleuEID, #page .bleuEID, #toute_la_page .bleuEID, #toute_la_page #page .bleuEID { color: #5279B6; } /* color: #008bbd; */ /* Menu principal (titres des menus déroulants, dans la barre bleue horizontale) /* */ /* Le menu horizontal est un bloc qui se superpose à un bandeau bleu de taille fixe => cela évite que ce bandeau bleu s'agrandisse dans IE, lorsqu'un sous-menu se déroule */ div#fond_pour_menu { background-color: #5279B6; width: 100%; height: 40px; display: block; position: absolute; top: 71px; left: 0; } /* */ /* Bloc dans lequel s'affichent tous les menus */ div#tous_les_menus { z-index: 1000; position: absolute; /* pour IE 6 et 7 : */ *top: 71px; } /* Décalage nécessaire après introduction de l'image en haut à droite op-moustique.gif */ ul.bloc_menus { position: absolute; top: 4px; height: 35px; width: 148px; } /* Position à partir de la gauche => classes utilisées pour les blocs

contenant les menus (marge de 6px à gauche, puis pour chaque bloc : largeur 148px + marges 6px = 154px de décalage) */ .gauche1 { left: 1px; } .gauche2 { left: 155px; } .gauche3 { left: 309px; } .gauche4 { left: 463px; } .gauche5 { left: 617px; } /* Ligne de menu du haut */ div#tous_les_menus li.menu { text-align: center; height: 30px; width: 143px; margin-left: 5px; /* Pour IE6 : */position: absolute; left: 0; font: 14px /* "Eras Bold ITC", */Arial, sans-serif; font-weight: bold; line-height: 30px; list-style-type: none; /* Couleurs du boutons inactif : */ background-color: #5279B6; border: 1px solid; border-color: #fbfee9 #fffaec #fffaec #fbfee9; } div#tous_les_menus li.sur2lignes { line-height: 15px; } /* pour le centrage vertical avec les menus d'une seule ligne */ /* Pour ul#menu li a, display: block; pour avoir un seul bloc rectangulaire lorsque la couleur de fond change, au passage de la souris */ #tous_les_menus a.menu { display: block; color: #fffbed; text-decoration: none; height: 30px; } /* Au passage de la souris sur les menus ("a:hover" à placer APRES "a") - Couleurs du bouton actif : */ #tous_les_menus ul.bloc_menus:hover li.menu { /* background-color: #9BAFFF; */ background-color: #7B8DED; border: 1px solid; border-color: #fafdf2 #fffaea #fffaea #fafdf2; } /* */ /* Sous-menus déroulants */ /* */ /* Ligne de décalage en haut */ #tous_les_menus ul li.ligne_du_haut { height: 36px; background-color: #5279B6; } /* il faut une couleur de fond pour IE 6 et 7 */ #tous_les_menus ul li.sousmenu { background-color: #FFFFF9; color: #5279B6; font-size: 12px; font-weight: bold; border: 1px solid #5279B6; border-top: none; border-bottom: none; font-family: Arial, Verdana, sans-serif; width: 158px; z-index: 1000; list-style-type: none; text-align: left; } #tous_les_menus li.sousmenu { line-height: 15px; } #tous_les_menus ul.bloc_menus li.ligne_du_bas { border-bottom: 1px solid #5279B6; } /* Initialement, les sous-menus sont masqués */ #tous_les_menus ul.bloc_menus li.sousmenu { display: none; } /* Au passage de la souris sur les sous-menus (":hover" à placer APRES ":link") - Sous-menu affiché : */ #tous_les_menus ul.bloc_menus:hover li.sousmenu { display: block; } #tous_les_menus li.sousmenu a { text-decoration: none; color: #5279B6; display: block; padding-top: 3px; padding-bottom: 3px; padding-left: 2px; /* Pour IE6 et 7 : */ height: 15px; } #tous_les_menus li.sousmenu2lignes a { height: 30px; } #tous_les_menus li.sousmenu a:hover { background-color: #5279B6; color: white; } /* "a:hover" à placer APRES "a" */ #tous_les_menus li.sousmenu a:actif { background-color: #5279B6; color: white; } /* "a:actif" à placer APRES "a:hover" */ /* Chemin de la page dans l'arborescence du site */ div#chemin_nav { font-size: 14px; font-family: /* "Eras Bold ITC", */Arial, sans-serif; color: #66b2a3; height: 20px; margin: 0 -7px; padding-left: 50px; text-align: left; padding-top: 5px; padding-bottom: 5px; _padding-bottom: 0; border-bottom: 1px solid #5279B6; } div#chemin_nav a { display: inline; color: #66b2a3; } div#chemin_nav img { float: left; margin-top: 6px; } /* pour centrage vertical à côté du texte */ div#page { clear: left; min-height: 600px; _height: 600px; padding: 5px 7px 15px 7px; text-align: left; position: relative; top: 30px; } #page p.chapeau { padding: 0 20px 15px 11px; } /* Multicolonnage du texte dans la page */ /* Texte sur 3 colonnes */ div.col1 { padding: 0 11px 0 11px;} div.col2 { padding: 0 11px 0 11px;} div.col3 { padding: 0 7px 0 11px; } #page .col123 { padding: 0 20px 0 11px; } /* sur 3 colonnes */ div.col1, div.col2, div.col3 { width: 30%; float: left; } /* 3 colonnes séparées */ /* Une colonne de largeur double (col12 ou col23) et une colonne simple (col3 ou col1) */ div.col12, div.col23 { width: 60%; padding: 0 15px; float: left; } /* 2 colonnes ensemble */ /* Texte sur 2 colonnes de même largeur */ div.colA { padding: 0 11px 0 14px;} div.colB { padding: 0 7px 0 11px; } div.colA, div.colB { width: 45%; float: left; } /* 2 colonnes séparées */ div.unecol, p.unecol { padding: 0 20px 0 11px; } /* Titres et sous-titres des pages */ #page h1, #page h2, #page h3, #page h4 { font-family: "Arial Black", Arial, Verdana, sans-serif; color: #5279b6; text-align: left; } /* color: #008bbd; */ /* Titre principal de la page */ #page h1 { font-size: 28px; padding: 10px 10px; } /* Sous-titres */ #page h2 { font-size: 22px; padding-top: 5px; } #page h3 { font-size: 17px; padding-top: 5px; } #page h4 { font-size: 15px; padding-top: 5px; } #page h2.margegauche, #page h3.margegauche { padding-left: 7px;} /* Paragraphes et notes */ #page p, #page ul { padding: 5px 0; text-align: justify; } #page p a.lien_astérisque { text-decoration: none; } .note, #page .note { font-size: 0.8em; } .note-it, #page .note-it, .note-italique, #page .note-italique { font-size: 0.8em; font-style: italic; } #page p.note a { font-style: italic; } #page p.note a.lexique { font-style: normal; } /* Mots du lexique : en gris */ a.lexique { color: gray; font-weight: bold; } /* Listes à puces */ #page ul.liste { list-style-type: disc; padding-left: 16px; } #page ul.liste li { padding: 3px 0; text-align: justify; } #page ul.liste li.sans_puce { list-style-type: none; } /* Texte plus petit (en général dans une balise span) */ .pluspetit { font-size: 80%; } /* Exposant (plus petit et placé plus haut) */ #page span.exp { font-size: 80%; vertical-align: 50%; } /* Pour tous les liens de la page */ #page a { text-decoration: none; } #page a img { border: none; } #page a:hover { text-decoration: underline; } /* ================================================================================= */ /* Pour IE6 - Pour IE7 - Pour Firefox et Opera - etc. */ /* Classes pour distinguer quel navigateur doit afficher ou pas l'élément : IE6, IE7, Firefox, ... */ /* -------------------------------------------------------------------------------- */ /* En HTML, balises conditionnelles possibles avec : */ /* -------------------------------------------------------------------------------- */ .saufIE6 { _display: none; } /* pour Firefox et IE7 seulement - masqué par IE6 */ .saufIE6ou7 { *display: none; } /* pour Firefox seulement - masqué par IE6 et IE7 seulement */ *+html .saufIE7 { display: none; } /* pourFirefox et IE6 seulement - masqué par IE7 seulement */ html>body .IE6seul { display: none; } /* pour IE6 seulement - masqué par Firefox, Opera, IE7 */ html>/**/body .IE6ou7seul { display: none; } /* affiché par IE 6 et 7 seulement */ html>/**/body .IE7seul { display: none; } /* (deux règles pour .IE7seul : celle-ci et la suivante) */ html body .IE7seul { _display: none; } /* ================================================================================= */ /* Pour revenir à la ligne (pas d'éléments flottants sur la gauche ou sur la droite) */ .Alaligne { clear: both; } /* Pied de page */ /* ============ */ /* Pour pb position du pointeur de liens avec Firefox sur certaines pages, un div est placé avant : */ div#avant_ppage { float: left; font-size: 25px; } div#pied_de_page { font: 16px /* "Eras Medium ITC", */Arial, sans-serif; color: gray; text-align: center; border-top: 1px solid #5279B6; clear: both; } div#pied_de_page ul { width: 778px; margin: 0 auto; padding-left: 50px; } div#pied_de_page ul li { list-style: none; float: left; padding: 5px 0; } div#pied_de_page ul li a span { padding: 5px 8px; } div#pied_de_page ul li a { color: #5279B6; text-decoration: none; padding-top: 5px; padding-bottom: 5px; line-height: 15px; padding: 20px 0; /* font-weight: bold; */ } div#pied_de_page ul li a:hover span { background-color: #5279B6; color: white; text-decoration: none; } div#pied_de_page ul li a:hover { _background-color: #5279B6; } /* pour IE6 */ div#phpmyvisites { color: ivory; display: none; }