/* CSS Document */
/* BALISES HTML */
/* __________________________________________________________________ */
* {
margin: 0;
padding: 0;
}
body {
background: #ededed;
height: 100%;
padding: 0;
text-align: center;
}
a img {
border: none;
}
/* ACCESSIBILITE */
/* __________________________________________________________________ */
#liensevitement { /* Block contenant les liens d'evitement */
margin: 0 auto;
color: #adaaaa;
font-size: 0.6em;
text-align: right;
width: 977px;
position: relative;
z-index: 100;
}
#liensevitement a { /* Les liens d'evitement */
color: #adaaaa; /* Même couleur que le background du body */
}
#liensevitement a:hover, #liensevitement a:focus, #liensevitement a:active { /* Rollover des liens d'evitement */
color: #adaaaa;
}
h2.access { /* Balise H2 masquee */
position: absolute;
z-index: 100;
top: -10000px;
left: -10000px;
visibility: hidden;
font-size: 0px;
letter-spacing: -50px;
}
/* STRUCTURE DE LA PAGE */
/* __________________________________________________________________ */
html, body {
/* Pour régler le problème d'arrière plan sur les pages d'accueil, il faut mettre l'arrière plan sur la balise html et non sur body. */
font-family: 'trebuchet ms', verdana, arial, sans-serif;
text-align: center; /* pour corriger le bug de centrage IE */
height: 100%;
font-size: 100%;
color: #61605e; /* Couleur du texte par défaut */
background: #ECE5D5;
}
.body {
width: 100%;
background: #fbfaf7;
}
#bg_body {
background: url(images/int_bg_body.png) no-repeat center -1px;
text-align: center;
margin-top: -13px;
}
.body2 {
background: #E8DFCE url(images/int_bg_body_rep.png) repeat-x top;
height: 100%;
}
#conteneur_bg_rep {
background: transparent url(images/int_conteneur_rep.png) repeat-y center;
text-align: center;
}
#conteneur {
width: 977px;
margin: 0 auto;
text-align: left;
background: transparent url(images/int_conteneur_bottom.png) no-repeat center bottom;
}
/* BANDEAU */
/* __________________________________________________________________ */
#bandeau {
width: 977px;
height: 205px;
position: relative;
background-position: left 60px;
background-repeat: no-repeat;
}
h1 {
position: relative;
float: left;
margin: 67px 0 0 -87px;
font-size: 1.2em;
}
#masque_bandeau {
position: absolute;
top: 0;
left: 0;
width: 977px;
height: 205px;
background: url(images/masque_bandeau_int.png) no-repeat left 1px transparent; /* Ne pas définir d'image en background, c'est géré au niveau du template avec les logos de rubrique */
}
h1 a {
/*
IMPORTANT : on applique le float sur le a plutôt que sur img, cela permet à la navigation au clavier d'avoir la bordure du focus sur tout le bloc.
Sinon l'image est "désolidarisée" du a et le focus se fait sur celui ci mais vide => bordure du focus visible sur un pixel perdu à gauche du bloc...
*/
float: left;
margin: 30px 0 0 60px;
}
/*
* Menu horizontal
*/
#navigation {
position: absolute;
top: 16px;
left: 0;
}
/* MENU PRINCIPAL */
/* __________________________________________________________________ */
ul#nav_principale {
float: left;
display: inline;
position: relative;
z-index: 10;
}
ul#nav_principale li {
float: left;
}
ul#nav_principale li a:link, ul#nav_principale li a:visited {
font-weight: bold;
text-align: center;
color: #d75100;
display: block;
float: left;
text-decoration: none;
font-size: 0.9em;
word-wrap: break-word; /* Si le texte sort du cadre il y a un retour à la ligne automatique */
}
ul#nav_principale li a:link:hover, ul#nav_principale li a:visited:hover, ul#nav_principale li a:active, ul#nav_principale li a:focus {
text-decoration: underline;
}
/* Placement des items du menu principal */
#nav_principale #rub_1 {
margin: 0; width: 90px;
}
#nav_principale #rub_75 {
margin: 1px 0 0 32px;width: 163px;
}
#nav_principale #rub_76 {
margin: 1px 0 0 31px;width: 172px;
}
#nav_principale #rub_77 {
margin: 1px 0 0 23px;width: 92px;
}
#nav_principale #rub_78 {
margin: 2px 0 0 9px; width: 85px;
}
#nav_principale #rub_81 {
margin: 2px 0 0 12px; width: 122px;
}
#nav_principale #rub_86 {
margin: 1px 0 0 23px; width: 123px;
}
/* CONTENU EXTENSIBLE */
/* __________________________________________________________________ */
#block_contenu { /* Block contenu */
min-height: 450px;
}
/* COLONNE GAUCHE */
/* __________________________________________________________________ */
#colonne_gauche { /* Colonne gauche */
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: 183px;
min-height: 1px; /* Pour eviter les décalages de bloc si vide */
}
/* SOUS MENU */
/* __________________________________________________________________ */
#colonne_gauche h2 {
background: #7FA30E url(images/bg_titre_ssmenu.png) no-repeat left center;
margin: 1px 0 0;
padding: 8px 0 5px 15px;
color: #fff;
text-transform: uppercase;
font-size: 0.82em;
}
/* COLONNE CONTENU */
/* __________________________________________________________________ */
#colonne_contenu {
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 */
min-height: 1px; /* Pour eviter les décalages de bloc si vide */
margin: 0 0 0 24px;
padding-bottom: 15px;
width: 567px;
}
/* BOUTON IMPRIMER */
/* __________________________________________________________________ */
.imprimer {
float: right;
margin: 11px 0 0;
min-height: 28px; /* Fixer à la hauteur de l'image du bouton imprimer - HACK POUR IE6 => VOIR FEUILLE DE STYLE spip_ie_template.css */
}
/* COLONNE DROITE */
/* __________________________________________________________________ */
#colonne_droite {
float: right;
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: 185px;
min-height: 1px; /* Pour eviter les décalages de bloc si vide */
}
#colonne_droite #menu_outils h2 {
float: left;
margin: -20px 0 0 8px;
position: relative;
}
.outils {
clear: both;
font-size: 0.76em;
}
.outils li a {
display: block;
padding: 6px 0 8px 13px;
margin-left: 7px;
color: #61605e;
text-decoration: none;
background: url(images/puce_outils.png) no-repeat 2px 14px;
display: block;
}
.outils li a:hover, .outils li a:focus, .outils li a:active, .outils li a.actif {
color: #db870f;
text-decoration: underline;
background: url(images/puce_outils_on.png) no-repeat 2px 14px;
}
#recherche, .outils li {
background: url(images/bg_sep_outils.png) no-repeat left top;
}
/* FORMULAIRE DE RECHERCHE */
/* __________________________________________________________________ */
#bloc_recherche {
width: 164px;
height: 30px;
float: right;
margin: 80px 10px 0 0;
background: url(images/bg_rechercher.png) no-repeat;
position: relative;
z-index: 10;
}
form#formrecherche { /* Formulaire */
padding: 7px 0 10px 10px;
float: left;
display: inline;
}
#formrecherche div { /* Formulaire */
padding: 0;
margin: 5px 0 0 7px;
}
#formrecherche label { /* Label */
display: none;
}
#formrecherche input {
vertical-align: middle;
border: none;
width: auto;
}
#formrecherche input#recherche { /* Champ de saisie */
background: none repeat scroll 0 0 #FFFFFF;
border: 1px solid #B5B5B4;
color: #767573;
font-size: 0.72em;
margin: 0 3px 0 0;
padding: 1px 0 1px 5px;
text-align: left;
width: 120px;
}
/* PIED DE PAGE */
/* __________________________________________________________________ */
#footer { /* Block pied de page */
clear: both;
}
ul#menu_divers {
float: right;
margin: 8px 0 4px;
}
ul#menu_divers li { /* Liste */
background: url("images/bg_sep_pied.png") no-repeat scroll right center transparent;
color: #767573;
display: inline;
font-size: 0.7em;
margin: 0 3px;
padding: 0 5px 0 0;
}
ul#menu_divers li.extranet {
background: none;
margin: 0;
}
ul#menu_divers li.extranet a {
color: #db870f;
}
ul#menu_divers a:link, ul#menu_divers a:visited {
color: #767573;
text-decoration: none;
}
ul#menu_divers a:link:hover, ul#menu_divers a:visited:hover, ul#menu_divers a:active, ul#menu_divers a:focus, ul#menu_divers a.actif {
text-decoration: underline;
color: #adaaaa;
}