/* Dialogue*/

#dialogue {
position: absolute;
z-index:100;
width: 100%;
height: 100%;
top: 0;
left: 0;
min-height:100%;
display: none;
}

#dialogue .shadow {
position: absolute;
z-index:100;
width: 100%;
height: 100%;
top: 0;
left: 0;
min-height:100%;
}


/* Boite de dialogue
================================================*/
/* Basic styling, used when JavaScript is unsupported */

#dialogue .cbb {
position: absolute;
z-index: 102;
width: 626px;
height: 200px;
left: 50%;
top: 50%;
margin-top: -100px;
margin-left: -323px;
border: 1px solid #222;
background: #fff;
padding: 10px;
}


/* Normal styling */
#dialogue .cb {
position: absolute;
z-index: 102;
width: 620px;
height: 274px;
left: 50%;
top: 160px;
margin-left: -310px;
background-color: transparent;
}


/* Top corners and border */
#dialogue .bt {
height: 10px;
margin:0 0 0 11px;
background:url(/images/dialogue/box.png) no-repeat 100% 0;
}

#dialogue .bt div {
position:relative;
left:-11px;
width:11px;
height:10px;
background:url(/images/dialogue/box.png) no-repeat 0 0;
font-size:0;
line-height:0;
}


/* Bottom corners and border */

#dialogue .bb {
height: 13px;
margin:0 0 0 13px;
background:url(/images/dialogue/box.png) no-repeat 100% 100%;
}

#dialogue .bb div {
position:relative;
left:-13px;
width: 13px;
height: 13px;
background:url(/images/dialogue/box.png) no-repeat 0 100%;
font-size:0;
line-height:0;
}


/* Left border */
#dialogue .i1 {background:url(/images/dialogue/borders.png) repeat-y 0 0;}


/* Right border */
#dialogue .i2 {
padding:0 11px 0 11px;
background:url(/images/dialogue/borders.png) repeat-y 100% 0;
}


/* Wrapper for the content. Use it to set the background colour and insert some padding between the borders and the content. */

#dialogue .i3 {
display:block;
margin: 0;
padding: 12px;
height: 250px;
z-index: 999;
position: relative;
color: #111;
}

.tome7 .i3 {
background: url(/images/dialogue/back_tome7.gif) left bottom repeat-x #fff;
}

.tome6 .i3 {
background: url(/images/dialogue/back_tome6.gif) left bottom repeat-x #4aa9ad;
}

/* Make the content wrapper auto clearing so it will contain floats (see http://positioniseverything.net/easyclearing.html). */

#dialogue .i3:after {
content:"."; 
display:block; 
height:0; 
clear:both; 
visibility:hidden;
}
#dialogue .i3 {display:inline-block;}
#dialogue .i3 {display:block;}



/* Contenu de dialogue */

#dialogue_content {
border: 0 none;
}

#dialogue h2 {
position: relative;
padding: 0;
margin: 0;
text-indent: -999px;
overflow: hidden;
}

.tome7 h2 {
background: url(/images/dialogue/back_titre_t7.gif) repeat-x 0 0 transparent;
width: 335px;
height: 47px;
margin: 0;
}

.tome6 h2 {
background: url(/images/dialogue/back_titre_t6.gif) repeat-x 0 0 transparent;
width: 515px;
height: 59px;
margin: 0 0 4px;
}

#dialogue h2 span {
position: absolute;
right: 0;
top: 0;
font: normal 18px helvetica, arial, sans-serif;
line-height: 18px;
letter-spacing: 3px;
display: none;
}

#dialogue .wrap_box {
padding: 0;
padding-left: 230px;
background: url(/images/dialogue/border.gif) repeat-y 220px 0 transparent;
border: 0 none;
}

#dialogue .instructions {
float: left;
width: 210px; /*230px - padding*/
padding: 0 12px 0 2px;
margin: 0;
margin-left: -232px;
}

#dialogue .sidetruc {
width: 345px;
float: left;
padding: 0;
}

#dialogue form {
margin: 0;
padding: 0;
border: 0 none;
}

#dialogue form .text,
#dialogue form .password,
#dialogue form .select {
margin: 0 0 1px 0;
padding: 6px 0 8px;
height: 1.7em;
}

#dialogue form label,
#dialogue form div .group p {
line-height: 18px;
float: left;
width: 145px;
text-align: left;
vertical-align: top;
margin: 0 0 0 5px;
padding: 0 0 0 22px;
background: url(/images/dialogue/bullet.gif) 2px 2px no-repeat transparent;
}

#dialogue form .errormsg {
display: none;
}

#dialogue form div .group {
border: 0 none;
padding: 0;
margin: 8px 0 0 0 ;
}

#dialogue form div .group label {
float: none;
display: block;
font: normal 11px verdana, helvetica, arial, sans-serif;
line-height: 15px;
margin: 0 0 0 7px;
padding: 0 0 0 21px;
background: none transparent;
width: auto;
}

#dialogue form div .group label input{
padding: 0;
margin: -2px 4px 0 -20px;
vertical-align: middle;
}



/* Styles pour les input */

#dialogue form div.text input,
#dialogue form div.select select {
padding: 0;
margin: 0;
border: 1px solid #aaa;
}

#dialogue form div.text input,
#dialogue form div.password input {
width: 160px;
margin-bottom: 2px;
padding: 1px 0;
border: 1px solid #aaa;
}

#dialogue form div.select select {
width: 160px;
margin-bottom: 2px;
padding: 3px 0;
border: 1px solid #aaa;
}

#dialogue form div.hidden {
display: none;
}

#dialogue form p.form_button {
padding: 0;
margin: 0;
position: absolute;
bottom: 14px;
right: 12px;
border: 0 none;
}

#dialogue form p.form_button input {
margin: 0 5px 0 0;
}

#dialogue form button {
margin: 0 5px 0 0;
padding: 3px 10px;
font-size: 14px;
line-height: 16px;
font-weight: bold;
border: 1px solid #999;
}

#dialogue form .bt_continuer {
margin: 0;
padding: 0;
display: block;
height: 26px;
width: 104px;
text-indent: -999px;
overflow: hidden;
border: 0 none;
}

#dialogue form .bt_annuler {
float: left;
margin: 0 5px 0 0;
padding: 0;
display: block;
height: 26px;
width: 75px;
text-indent: -999px;
overflow: hidden;
border: 0 none;
xbackground: url(/images/dialogue/bt_annuler.gif) 0 0 no-repeat transparent;
}

#dialogue form button:hover {
cursor: pointer;
border: 0 none;
}

.tome7 form .bt_continuer {
background: url(/images/dialogue/bt_continuer_t7.gif) 0 0 no-repeat transparent;
}

.tome7 form .bt_annuler {
background: url(/images/dialogue/bt_annuler_t7.gif) 0 0 no-repeat transparent;
}

.tome6 form .bt_continuer {
background: url(/images/dialogue/bt_continuer_t6.gif) 0 0 no-repeat transparent;
}

.tome6 form .bt_annuler {
background: url(/images/dialogue/bt_annuler_t6.gif) 0 0 no-repeat transparent;
}

/* Styles pour les erreurs */

#dialogue form .error {
border: 0 none;
background: none #eaeaea;
position: relative;
padding: 0;
}

#dialogue form .error label,
#dialogue form .error .group p {
color: #df0000;
font-weight: normal;
background-image: url(/images/dialogue/bullet_error.gif);
}

/* Étape 3 */

#dialogue .step3,
#dialogue .download {
padding: 0;
background: none transparent;
}

#dialogue .step3 .instructions,
#dialogue .download .instructions {
float: none;
width: 100%;
padding-right: 0;
margin-right: 0;
padding-left: 0;
margin-left: 0;
}

#dialogue .step3 .instructions p {
clear: left;
}

#dialogue .step3 .instructions p b,
#dialogue .download .instructions p b {
display: block;
font-size: 14px;
margin: 9px 0 15px 15px;
padding: 3px 10px 4px 30px;
float: left;
background: url(/images/dialogue/arrow.gif) 10px center no-repeat #444;
color: #fff;
}





/* bouton fermer */

#dialogue.tome6 .bt_fermer,
#dialogue.tome7 .bt_fermer {
position: absolute;
bottom: 14px;
left: 12px;
margin: 0;
padding: 0;
display: block;
height: 28px;
width: 92px;
text-indent: -999px;
overflow: hidden;
border: 0 none;
}

#dialogue.tome6 .bt_fermer {
background: url(/images/bt_fermer_t6.gif) 0 0 no-repeat transparent;
}

#dialogue.tome7 .bt_fermer {
background: url(/images/bt_fermer_t7.gif) 0 0 no-repeat transparent;
}

#dialogue a.bt_fermer:hover {
background-position: 0 -34px;
}

#dialogue .teaser {
margin-top: 20px;
margin-left: 14px;
}

#dialogue .teaser a {
padding: 2px 0 2px 0;
color: #343434;
height: 24px;
background: url(/images/dialogue/icon_download.gif) 0 0 no-repeat transparent;
padding-left: 40px;
cursor: pointer;
padding-top: 10px;
}

#dialogue .teaser a em {
color: #555;
}

#dialogue .teaser a em span {
color: #343434;
cursor: pointer;
}

#dialogue .download .teaser a {
line-height: 32px;
}