/* Élimination des styles par défaut
======================================*/

body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dd,dt,form,address,div {margin : 0 ; border : 0 ; padding : 0}
table {border-collapse : collapse}
th, td {padding : 0 ; vertical-align : top}
ul,ol,dl,li {list-style-type : none}
img, a {border : 0 ; display : block}
p img, li img, dt img, dd img {display : inline ; vertical-align : bottom}
p a, li a, dt a, dd a, h1 a, h2 a, h3 a, h4 a, td a {display : inline}
input.image {vertical-align : bottom ; margin : 0 ; padding : 0}

div.clear {clear : both ; height : 1px}

/* Styles par défaut
======================================*/

label, .label {cursor : pointer}
a.ancre {position : relative ; top : -5em}
p, ul {text-align : justify ; margin : 10px 0}
.power {font-size : 0.8em ; padding-left : 0.1em ; position : relative ; top : -0.33em}
input.checkbox, input.radio {position : relative ; top : 3px}
select { padding: 1px; }
p.l, table.l td, table.l th, tr.l td, tr.l th, td.l, th.l {text-align : left}
p.r, table.r td, table.r th, tr.r td, tr.r th, td.r, th.r {text-align : right}
p.c, table.c td, table.c th, tr.c td, tr.c th, td.c, th.c {text-align : center}
.fr {float : right}
.fl {float : left}
.photo.fr {margin-left : 10px}
.photo.fl {margin-right : 10px}
.clear {clear: both; width: 100%; height: 1px; font-size: 1px; margin: 0; padding: 0; background-color: transparent; }
.colonnes {width : 100%}
.colonnes td {padding-right : 20px}
.hide {display : none}

p, li, td {line-height : 19px}

/* Titres
======================================*/ 

h1.light {clear : both ; font: bold 20px/26px Arial,sans-serif ; color: #555 ; padding : 0 0 ; background:#fff; margin : 10px 0 5px 0 ; color: #00709A}
h1 {clear : both ; border:none; font : bold 22px/28px Arial,sans-serif ; height: 39px;  color: #fff ; background: #00709A url(/images/bg/h1-rubrique-bleu.gif) repeat-x top left; padding : 3px 10px 0; margin : 10px 0 18px 0 ;}
h2,h6 {clear : none ; font : bold 15px Arial ; color : #DF520D ; padding-bottom : 2px ; border-bottom : 1px solid #ccc ; margin : 20px 0 8px}
h3 {clear : both ; font : bold 11px Verdana ; line-height : 18px ; padding-bottom : 2px ; padding-left : 11px ; color : #000 ; margin : 12px 0 8px ; background : url(/images/puces/puce-5px-carree-vert.gif) 0 8px no-repeat} 



/* Listes
======================================*/ 

ul.grosse-liste li {padding : 4px 0 4px 20px ; background : url(/images/puces/carre-blanc.gif) 0 7px no-repeat}
ul.grosse-liste li .intitule {color : #c00 ; font-weight : bold ; font-variant : small-caps}

ul.petite-liste li {padding : 0 0 0 15px ; background : url(/images/puces/carre-bleu.gif) 4px 9px no-repeat}

/* Photos
======================================*/ 

div.illustration {background : #eee ; border : 1px solid #bbb ; text-align : center ; padding : 6px ; margin-bottom : 10px ; margin-top : 10px}
div.right {float : right ; margin-left : 18px}
div.left {float : left ; margin-right : 18px}
div.illustration img {border : 1px solid #bbb}
div.illustration p.credit {margin : 6px 3px 0 ; font : 9px/9px Arial ; text-align : right ; font-style : italic ; color : #999}
div.illustration p.legende {margin : 6px 3px 0 ; text-align : center}
div.center {background : #fff ; border : 0 ; text-align : center}
div.center p.credit {text-align : center}
div.center img {display : inline}

/* Blocs de textes
======================================*/ 

div.hauteur {height : 62px} /* permet d'allonger les div où le texte ne suffit pas */

div.note, div.important, div.exemple {padding : 0 10px 10px 90px ; margin : 10px 0 16px}
div.note li.courant a {font-weight : normal ; color : #000}

div.note {background : #f4fbff url(/images/icones/note.gif) 10px 8px no-repeat ; border-top : 1px solid #a6cbe1}
div.note b {color : #0d88d4}
div.note a {color : #0d88d4 ; font-weight : bold}

div.important {background : #fff5ef url(/images/icones/important.gif) 10px 10px no-repeat ; border-top : 1px solid #ffa26f}
div.important b {color : #df4e00}
div.important a {color : #df4e00 ; font-weight : bold}

div.exemple {background : #f3e5ce url(/images/icones/exemple.gif) 10px 10px no-repeat ; border-top : 1px solid #87765b}
div.exemple b {color : #87765b}
div.exemple a {color : #87765b ; font-weight : bold}

a.discret {color : #666}

/* Tableaux
======================================*/ 

table.data {margin : 10px auto}
table.data th {background : #E0EDEF}
table.data td, table.data th {vertical-align : middle}
table.data thead th {border : 1px solid #c1dad7 ; padding : 3px 12px ; color : #206272 ; background : #d1eaee url(/images/bg/degrade-bleu-gris.gif) 0 0 repeat}
table.data tbody th {border : 1px solid #c1dad7 ; padding : 3px 12px 3px 16px}
table.data tbody td {border : 1px solid #c1dad7 ; padding : 3px 12px}
table.data .impair {color : #4f6b72 ; background-color : #ffffff}
table.data .impair a {color : #4f6b72 ; background-color : #ffffff}
table.data .impair a:hover {text-decoration: underline;}
table.data .impair th {background-image : url(/images/bg/tr-impair.gif) ; background-position : 2px 2px ; background-repeat : no-repeat}
table.data .pair {color : #797268 ; background-color : #f5fafa}
table.data .pair a{color : #797268 ; background-color : #f5fafa}
table.data .pair a:hover{text-decoration: underline;}
table.data .pair th {background-image : url(/images/bg/tr-pair.gif) ; background-position : 2px 2px ; background-repeat : no-repeat}
table.data caption {font : 11px Verdana ; color : #777 ; text-align : center ; padding : 10px 0 0}

form.formulaire th {text-align : left}
form.formulaire th, form.formulaire td {padding : 3px 6px 3px 0}
form.formulaire tr.erreur label {color : #c00}

.erreur {color : #c00}

/* Menu contextuel
==================================== */
#menu-contextuel {color: #444; margin: 10px 0 10px 0; padding: 0; background-color: #ddd; }

#menu-contextuel ul {border-right: #ccc solid 1px; border-bottom: #ccc solid 1px; padding: 10px}
#menu-contextuel li {font-weight: bold;  background-color: #fff; padding: 1px 0 1px 10px; border-bottom: #ddd solid 2px; border-left: #ddd solid 2px; border-right: #ddd solid 2px;}
#menu-contextuel li.titre {font-weight: bold; color: #fff; padding: 2px 0 2px 10px; background-color: #00709A; border-right:0; border-left:0;}
#menu-contextuel li.selected {background : url(/images/puces/menu-select.gif) 10px 50% no-repeat; padding-left: 20px;}
#menu-contextuel li a {padding-left: 10px; font-weight: bold;}
#menu-contextuel li a:hover  {background : url(/images/puces/menu-select.gif) left center no-repeat; padding-left: 10px; text-decoration: none; color: #444; }

/* pub
==================================== */
#pub-top    {width:900px; text-align:center}
#pub-middle {margin-top: 10px; text-align:center}
#pub-right  {margin-top: 10px; text-align:center}

#oas_top {text-align : center ; margin : auto ; vertical-align : middle}
#oas_right {width : 300px ;}
#oas_middle {width : 300px ;}
#oas_top img {display : inline}

/* Tableaux de visuels de constructeurs
==================================== */
table.lignages {margin-top : 10px}	
table.lignages td {background : url(/images/bg/shadow-vignette-maison.gif) no-repeat; padding : 3px 20px 10px 3px}	
table.lignages img {width : 125px ; height : 81px ; border : 1px solid #ccc}
table.lignages div.label {font-size : 10px ; margin-top : 8px ; text-align : center ; color : #777 ; line-height : 16px ; padding : 0 5px}


/* Formulaire court
==================================== */
form.court table {margin : 0 0 20px 0 ; padding : 10px; background : #f3f3f3 ; border : 1px solid #ccc}
form.court table td {padding : 4px 8px}
form.court table label {background : url(/images/puces/carre-vert.gif) 0 6px no-repeat ; padding-left : 11px }
form.court table td.center {text-align : center}
form.court table tr.erreur input, form.court table tr.erreur textarea {border : 1px solid #DF0D3D}
form.court table tr.erreur label {color : #DF0D3D ; font-weight : bold}
form.court input.bouton {padding : 3px 8px ; background : #477BCC ; border : 0 ; color : #fff ; font-weight : bold}