#main_content_souscription {position:relative; width:950px;font-size:82.5%}
#main_content_souscription form {float:right; width: 741px; margin-right: 0; border: none 0;font: normal 1em Arial, Helvetica, Sans-serif;}
* > #main_content_souscription form {width:732px; margin-right:8px; border-right: solid 1px #ccc;}

#col_infos {position: relative;width: 204px;float: left;padding-left: 5px;text-align: right;background: url(../images/fond_col_infos_main.gif) left top repeat-y;}
#col_infos h1 {color: #333;font: bold 1.3em Arial;text-transform: uppercase;text-align: center;padding: 5px 20px 5px 10px;border-bottom: dotted 1px #ccc;}
#main_content_souscription #col_infos form {display:block;text-align: right;width: 135px;padding: 0;margin: 0;color: #fff;font: bold 1em Arial;}
* > #main_content_souscription #col_infos form {width:175px}
.webcallback {background: url(../images/fond_bloc_p_webcall.gif) left top no-repeat !important; height: 50px; margin-bottom: 0; padding-bottom: 0;}
.bloc_info {float: right;width: 191px;text-align: left;background: url(../images/fond_col_infos_bloc.gif) left top repeat-y;margin: 10px auto;padding: 5px 0;}
.bloc {width: 156px;padding: 10px;margin: 5px;color: #fff;font: bold 1.1em Arial;background: #A71919 url(../images/fond_bloc_p_info.gif) left top repeat-x;}

#nav_etapes {position: absolute;width: 732px;height: 41px;background: url(../images/fond_nav_etapes.gif) left top repeat-x;z-index: 200;overflow:visible;}
#nav_etapes ul {list-style-type: none;text-align: center;padding-left:0;}
#nav_etapes ul li {display: inline;float: left;text-align: center;}
#nav_etapes a {display: block;position: relative;float: left;width: 102px;height: 50px;padding: 5px 0 0 0;color: #f66;text-decoration: none;text-transform: uppercase;font: bold 1.2em Arial;}
#nav_etapes a:hover {color: #fff;}
#nav_etapes a.on {height: 44px;padding: 3px 0;color: #fff;background: url(../images/fond_nav_etapes_on.gif) left bottom no-repeat;}
#nav_etapes a.on small {padding-top: 6px;color: #000;}
#nav_etapes p {position: relative;float: left;width: 100px;height: 50px;padding: 5px 0 0 0;color: #f66;text-decoration: none;text-transform: uppercase;font: bold 1.2em Arial;}
#nav_etapes p.off {color: #600;}
#nav_etapes small {display: block;position: relative;line-height: 20px;color: #fff;text-transform: none;}

#warning {color: #000;border: solid 1px #000;clear: both;width: 630px;margin: 5px auto;padding: 10px 10px 10px 60px;background-color: #F90;background-position: 2% 50%;background-repeat: no-repeat;font: bold 1.1em Arial, Helvetica;}

#contenu_etape {position: relative;width: 721px;padding: 45px 5px 20px 5px;margin-top: 40px;border: solid 1px #fff;border-left-color: #EEE;border-right-color: #CCC;background: #fff url(../images/fond_contenu_etape.gif) left 40px repeat-x;font: normal 1.1em Tahoma, Arial, Helvetica;min-height: 270px;overflow: visible;}
* > #contenu_etape {background-position: left top; padding-top: 5px; !padding-top: 45px; !background-position: left 40px;}
#contenu_etape p {padding: 5px 8px;}
#contenu_etape h1 {padding: 7px 3px;color: #c00;font: bold 1.6em Arial, Helvetica; margin-bottom:0.5em;}
#contenu_etape h2 {position: relative;padding: 3px 0 5px 15px;background: url(../images/puce_contenu_etape_h2.gif) 5px 9px no-repeat;color: #333;font: bold 1.1em Arial, Helvetica;border-bottom: dotted 1px #ccc;margin-bottom: 4px;}
#contenu_etape th,
#contenu_etape td,
#contenu_etape caption {
padding:2px;
}
.web_call_back {background-image: url(../images/message.gif);}
.error {background-image: url(../images/warning2.gif);}
.alert {background-image: url(../images/alert.gif);}
.message {background-image: url(../images/message.gif); background-color:#EEF !important;}
.form_error {display: block;color: #000 !important;border: solid 1px #000 !important;background-color: #F90 !important;}
.form_info {color: #000 !important;border: solid 1px #000 !important;background-color: #CF9 !important;}
.form_alert {color: #C00 !important;border: solid 1px #C00 !important;background-color: #FCC !important;}
.form_exemple {font-style: italic !important;}
.encart {display: block;color: #c00;font-weight: bold;text-align: center;border-top: dotted 1px #ccc;}
.cadre_contenu {position: relative;background: url(../images/fond_cadre_contenu.gif) left bottom repeat-x;border: solid 1px #CCC;border-bottom: none 0;padding: 5px;margin: 2px 5px;overflow:visible;}
.information {position: relative;background: #EEEEFF url(../images/message.gif) 10px 10px no-repeat;border: solid 2px #339;padding: 10px;margin: 2px 5px;overflow:visible;color: #339;}
.bloc_offre {position:relative;float:left;width: 220px;padding: 0;margin: 0;}
.bloc_offre_dual {padding: 10px 50px 0px 70px;} /*{position:relative;float:left;width: 340px;padding: 0;margin: 0 auto;}*/
.center {text-align: center;}
.left {float: left;}
.right {float: right;}
.information {position: relative;background: #EEEEFF url(../images/message.gif) 10px 10px no-repeat;border: solid 2px #339;padding: 10px;margin: 2px 5px;overflow:visible;color: #339;}
.box_area  .left {margin-left: 10px;}
.box_area {position: relative;width: 530px;float: left; margin: 5px 8px; padding: 3px; background-color: #f5f5f5; border: solid 1px #ccc;-moz-border-radius: 4px;}
.box_area span.left{width: 80px; height: 90px;}
.box_area select {margin-left:30px;}
.box_area_question {width: 110px;float: left;background: #EDEDED;border: solid 1px #ccc;margin: 5px 8px;padding: 3px;-moz-border-radius: 4px;font: 1em/12px Tahoma, Arial, Helvetica;color: #000;}
.help {position: absolute;right: 20px;top: 2px;width: 23px;height: 23px;background: url(../images/help3.png) left top no-repeat;}
* > .help {right: 2px;}
#contenu_etape h2 a.help {position:absolute; top: 3px; right: 20px;}
* > #contenu_etape h2 a.help {right: 3px;}
.question_num {font: bold 1.6em Arial, Helvetica, Sans-serif;color: #C00;}
.info {position: absolute; right: 10px; top: 56px; font: normal 0.8em Tahoma, verdana, arial, helvetica; color: #999;}
* > .info {top: 25px;right: 25px;}
#contenu_etape a.link {color:#c00;font: bold 1em/16px Tahoma, Arial, Helvetica;}
.choix_paiement {display: block;float:left;width: 200px;height: 50px;margin: 0 10px;text-align: center;background: url(../images/bt_choix_paiement.gif) left bottom repeat-x;}
.choix_paiement a {display: block;height: 30px;padding-top: 14px;font: bold 1.2em Tahoma, verdana, arial, helvetica;color: #FFF;border: solid 1px #900;text-decoration: none;}
.choix_paiement a:hover {border: solid 1px #f00;}
/* ajouter le 27/03/08 EC */
#contenu_etape .choix_paiement a:visited {color: #FFF;}
/* mensu 20/02/09 EC */
.choix_paiement_off {display: block;float:left;width: 200px;height: 50px;margin: 0 10px;text-align: center;background: url(../images/bt_choix_paiement_off.png) left bottom repeat-x;}
.choix_paiement_off a {display: block;height: 30px;padding-top: 14px;font: bold 1.2em Tahoma, verdana, arial, helvetica;color: #666;border: solid 1px #CCC;text-decoration: none;}
.choix_paiement_off a:hover {text-decoration:none;cursor:not-allowed;}
#contenu_etape .choix_paiement_off a:visited {color: #666;}
#bloc_gif ul, #mes ul {margin: 10px 0; padding: 0 10px; list-style-type: square;}
* > #bloc_gif ul, * > #mes ul {margin: 10px; padding: 0 0 0 10px;}
#help_elec {background: url(../images/hlp_fond.gif) left top no-repeat;width: 315px;height: 150px;margin: 0 auto;}
#help_gaz {background: url(../images/hlp_fond_gaz.gif) left top no-repeat;width: 315px;height: 150px;margin: 0 auto;}
#help_elec_col {background: url(../images/hlp_fond_col.gif) left top no-repeat;width: 165px;height: 142px;margin: 0 auto;}

#residence #contenu_etape h2  {border-bottom: none 0;border-top: dotted 1px #ccc;}
#residence #contenu_etape h2.first  {border-bottom: none 0;border-top: none 0;}
#residence #contenu_etape .information h2,
#validation #contenu_etape .information h2 {background-image: none; padding: 2px 0 5px 25px; border: none 0 !important; color:#339 !important;}
#consommation h3 {font: bold 1.3em Arial, Helvatica, Sans-serif;color: #C00;margin: 10px;}
#consommation span.question {display:block;font: normal 1em Arial, Helvatica, Sans-serif;color: #333;margin: 10px;}
#recapitulatif .cadre_contenu {height: 1%;}
#recapitulatif .cadre_contenu p {position: relative;padding: 10px 0 0 25px;border-top: dotted 1px #ccc;overflow:visible;height: 1%;}
#confirmation iframe {display:block; width: 700px;}

input.button {color: #333;padding: 2px 5px;}
.label {display: block;float: left;margin-left: 10px;}
.radioOn,
.radioOff {display: inline;margin: 0;padding: 2px;border: none 0;overflow: visible;font: normal 1em/12px Arial, Helvetica;padding-left: 12px;padding-right: 0;margin-bottom: 5px;}
* > .radioOn,
* > .radioOff {
display: block;
margin: 0;
!display: inline;
}
.radioOn {background: url(../images/radio_on.gif) left 5px no-repeat;color: #333;font-weight:bold}
.radioOff {background: url(../images/radio_off.gif) left 5px no-repeat;color: #666;}
.radioOff span,
.radioOn span {display: block; background: none;}
.radioOff:hover {color: #000 !important}
.altradioOff {display: block;width: 80px;height: 90px;padding: 2px;background: url(../images/radimg_off.gif) left top no-repeat;color: #333;}
.altradioOn {display: block;width: 80px;height: 90px;padding: 2px;background: url(../images/radimg_on.gif) left top no-repeat;}
.altradioOff:hover {background: url(../images/radimg_over.gif) left top no-repeat !important;}
div.special .altradioOff {display: block;width: 450px;height: auto;padding: 5px 5px 5px 20px;background: url(../images/radio_off.gif) 5px 7px no-repeat;color: #333;}
div.special .altradioOn {display: block;width: 450px;height: auto;padding: 5px 5px 5px 20px;background: url(../images/radio_on.gif) 5px 7px no-repeat;color: #333;}
div.special .altradioOff:hover {background: url(../images/radio_off.gif) 5px 7px no-repeat !important;background-color: #F5F5F5 !important;}
.checkboxOff {display: inline;margin: 0px;padding: 2px;padding-left: 20px;color: #666;font: normal 1em/16px Tahoma, Arial, Helvetica;background: url(../images/check_off.gif) 0% 6px no-repeat;border: none 0;}
.checkboxOn {display: inline;margin: 0px;padding: 2px;padding-left: 20px;color: #000;font: normal 1em/16px Tahoma, Arial, Helvetica;background: url(../images/check_on.gif) 0% 6px no-repeat;border: none 0;}
.checkboxOff:hover {color: #000;}
#profil .radioOff,
#profil .radioOn {display: block; width: 100%; padding-left: 0;}
#profil .radioOff span,
#profil .radioOn span {padding-left: 12px;}
.avantage {color:#f36d10;}
.planete {color:#8e228c; /* ancienne couleur : #b6c721 */}
.ecoduo {color:#f36d10;}
.ecogaz {color:#16ace0;}
.avenir {color:#009e9b;}
.soloelec {color:#8e228c;}
.sologaz {color:#16ace0;}
.dualelec,
.dualgaz {color:#f36d10;}
strong.avantage, strong.planete, strong.avenir, strong.ecoduo, strong.ecogaz {font: bold 1.2em arial;}
.logorecap {position:relative; float:left; margin: 0 25px 30px}

/* OMO détail de l'offre */
body #tip  {
position:absolute; visibility:hidden; z-index:800;
background: #fff url(../images/omo_souscription.png) 0px 0px no-repeat;
width:350px; text-align:left;
font-size:1em;
padding: 32px 10px 10px 20px;
border: 2px solid #6699cc;
font-weight:normal;
color:#333;}
html body #tip h1 {padding: 10px 0; font: bold 1.6em Arial, Helvetica;}
html body #tip ul {padding: 0 0 10px 0; list-style-type: square}
html body #tip li, html body #tip p {margin:10px 0;}
html body #tip small {font-size: 85%}
html body #tip .avantage {color:#f49e24 !important;}
html body #tip .ecoduo {color:#f36d10 !important;}
html body #tip .ecogaz {color:#16ace0 !important;}
html body #tip .planete {color:#8e228c !important; /* ancienne couleur : #b6c721 */}
html body #tip .avenir {color:#009e9b !important;}
html body #tip span.hr {display:block; line-height:1px; border-top:dotted 1px #ccc; margin: 5px auto; width: 250px}
/* fin OMO */

#nav_boutons {position: relative;clear: both;width: 730px;height: 32px;border: solid 1px red;border-top: none 0;background: url(../images/fond_nav_boutons.gif) left bottom repeat-x;text-align:center}
.precedent {position: absolute;left:0;display:block;width: 150px;height: 32px;}
.suivant {position: absolute;right:0;display:block;width: 135px;height: 32px;text-align: right;}
.btback {display:block;width: 150px;height: 32px;background: url(../images/bt_etape_precedente.gif) left top no-repeat;}
.btnext {display:block;width: 135px;height: 32px;background: url(../images/bt_etape_suivante.gif) right top no-repeat;}
#nav_boutons .sauvegarder {display:block; margin: auto; padding-top:5px; text-align:center;}
#nav_boutons .sauvegarder a {display:block; padding: 2px 5px; margin: auto; width:180px; border:solid 1px #fff; font: bold 1.2em arial; color:#fff !important; background-color:#696d84;}
#nav_boutons .sauvegarder a:hover,
#nav_boutons .sauvegarder a:visited {background-color:#445;text-decoration:none}

/* Nouvelle version proposition_offre */

#proposition_offre .offre {margin: 10px 5px; height: 1%;}
#proposition_offre .offre label {display:block; font-weight: normal; padding: 5px; padding-left: 90px; height: 1%;}
#proposition_offre .offre label.radioOff {cursor: pointer; background: #FCFCFC url(../images/fond_bloc_select_offre-off.png) 0 0 no-repeat;}
#proposition_offre .offre label.radioOff:hover {background-color: #F0F0F0;}
#proposition_offre .offre label.radioOn {background: #EFE url(../images/fond_bloc_select-on.png) 0 0 no-repeat;}

#proposition_offre .bloc_offre_option {margin: 10px 5px; height: 1%;}
#proposition_offre .bloc_offre_option label {display:block; font-weight: normal; padding: 5px; padding-left: 90px; height: 1%;}
#proposition_offre .bloc_offre_option label.checkboxOff {cursor: pointer; background: #FCFCFC url(../images/fond_bloc_select_option-off.png) 0 0 no-repeat;}
#proposition_offre .bloc_offre_option label.checkboxOff:hover {background-color: #F5F5F5;}
#proposition_offre .bloc_offre_option label.checkboxOn {background: #EFE url(../images/fond_bloc_select-on.png) 0 0 no-repeat;}
#proposition_offre .bloc_offre_option img.detailoption {vertical-align: top; margin-top: -4px;}
#proposition_offre .choixdansladate {font-weight: bold; display:block; padding: 10px 0 0; margin-left: 65px; background: transparent url(../images/fond_bloc_proposition-offre.png) no-repeat scroll 50% 0}

#proposition_offre .description {display:block; background-color: #FFF; padding:5px; background: url(../images/fond_bloc_proposition-offre.png) 0 0 no-repeat; width:585px; height:1%; position:relative;}
#proposition_offre .logo {display:block; float:left; margin: 10px 20px 35px;}
#proposition_offre .argcom {clear:right; font: bold 1.65em/1.1em arial, helvetica, sans-serif; margin: 10px 0 5px; /*display:block; font: bold 1.6em/1.5em arial, helvetica, sans-serif; text-transform: uppercase*/}
#proposition_offre .argeco{clear:right; font: bold 1.1em/1.1em arial, helvetica, sans-serif; /*display:block; font: bold 1.5em/1.2em arial, helvetica, sans-serif; color: #C00;*/}
#proposition_offre .nomoption {display:block; font: bold 1.4em arial, helvetica, sans-serif; text-transform: uppercase; color: #C00; margin-top:15px;}
#proposition_offre .baseline {display:block; font: bold 1.1em arial, helvetica, sans-serif; clear: none; margin: 0; padding: 0; text-align: left; width: auto;}
#proposition_offre .desc-option {display:block; font: normal 1em arial, helvetica, sans-serif;}
#proposition_offre .prixoption {display:block; position:relative; float:right; margin: 5px; border: solid 1px #ccc; background-color: #F5F5F5; padding: 10px; text-align: center}
#proposition_offre .prixoption b {font-size:1.2em;}
#proposition_offre .descriptif {position:absolute; top:95px; left:50%; margin:10px 0 0 -55px; /*position:relative; float:right; margin: 5px; cursor: help;*/}
#proposition_offre .tarifs {position:relative; float:right; margin: 5px; color: #333; width:auto;}
#proposition_offre .tarifs td {padding: 2px 5px;text-align:center;border: solid 3px #FFF; font-weight: bold; text-transform: uppercase; white-space: nowrap;}
#proposition_offre .tarifs td span.unite {display:inline; font-weight:normal}
#proposition_offre .tarifs td.titre {background-color:#FFF}
#proposition_offre .tarifs b {color: #C00}
#proposition_offre table.avantage {background-color: #FEC;}
#proposition_offre table.planete {background-color: #EFB; display:none;}
#proposition_offre table.avenir {background-color: #DFF;}
#proposition_offre .detail {cursor: help;}
#proposition_offre div.bloc_promo {margin:auto; text-align:center}
#proposition_offre span.codepromo {display: block; width:255px; background: url(../images/fond_bloc_code-promo.png) 0 0 no-repeat; padding: 30px 0px 35px; text-align:center; margin:auto;}
#proposition_offre div.double_bloc_promo {margin:auto; text-align:center;}
#proposition_offre div.double_bloc_promo span.codepromo {display: block; float:left; width:255px;  background: url(../images/fond_bloc_code-promo.png) 0 0 no-repeat; padding: 30px 0px 35px; margin-left:42px; text-align:center;}
* > #proposition_offre div.double_bloc_promo span.codepromo {margin-left:70px;}


#proposition_offre span.hr {display:block; line-height:1px; border-top:dotted 1px #ccc; margin: 5px auto; width: 250px}
#proposition_offre span.form_error {border: solid 2px #F90 !important;}
#proposition_offre .offre_speciale {clear:both;display: block; padding: 0; margin-bottom: 0; background: url(../images/bloc-promo.gif) 50% top repeat-y; text-align: center; font: normal 1.2em/2.4 arial;}

#resultat_forfait thead th {background-color: #FFF}
#nomOffreReduc {font-size: 1.4em}

/* Split Offres/Options */

#proposition_options .offre {margin: 10px 5px; height: 1%;}
#proposition_options .offre label {display:block; font-weight: normal; padding: 5px; padding-left: 90px; height: 1%;}
#proposition_options .offre label.radioOff {cursor: pointer; background: #FCFCFC url(../images/fond_bloc_select_offre-off.png) 0 0 no-repeat;}
#proposition_options .offre label.radioOff:hover {background-color: #F0F0F0;}
#proposition_options .offre label.radioOn {background: #EFE url(../images/fond_bloc_select-on.png) 0 0 no-repeat;}

#proposition_options .bloc_offre_option {margin: 10px 5px; height: 1%;}
#proposition_options .bloc_offre_option label {display:block; font-weight: normal; padding: 5px; padding-left: 90px; height: 1%;}
#proposition_options .bloc_offre_option label.checkboxOff {cursor: pointer; background: #FCFCFC url(../images/fond_bloc_select_option-off.png) 0 0 no-repeat;}
#proposition_options .bloc_offre_option label.checkboxOff:hover {background-color: #F5F5F5;}
#proposition_options .bloc_offre_option label.checkboxOn {background: #EFE url(../images/fond_bloc_select-on.png) 0 0 no-repeat;}
#proposition_options .bloc_offre_option img.detailoption {vertical-align: top; margin-top: -4px;}
#proposition_options .choixdansladate {font-weight: bold; display:block; padding: 10px 0 0; margin-left: 65px; background: transparent url(../images/fond_bloc_proposition-offre.png) no-repeat scroll 50% 0}

#proposition_options .description {display:block; background-color: #FFF; padding:5px; background: url(../images/fond_bloc_proposition-offre.png) 0 0 no-repeat; width:585px; height:1%}
#proposition_options .logo {display:block; float:left; margin: 10px;}
#proposition_options .argcom {display:block; font: bold 1.6em/1.5em arial, helvetica, sans-serif; text-transform: uppercase}
#proposition_options .argeco{display:block; font: bold 1.5em/1.2em arial, helvetica, sans-serif; color: #C00;}
#proposition_options .nomoption {display:block; font: bold 1.4em arial, helvetica, sans-serif; text-transform: uppercase; color: #C00; margin-top:15px;}
#proposition_options .baseline {display:block; font: bold 1.1em arial, helvetica, sans-serif; clear: none; margin: 0; padding: 0; text-align: left; width: auto;}
#proposition_options .desc-option {display:block; font: normal 1em arial, helvetica, sans-serif;}
#proposition_options .prixoption {display:block; position:relative; float:right; margin: 5px; border: solid 1px #ccc; background-color: #F5F5F5; padding: 10px; text-align: center}
#proposition_options .prixoption b {font-size:1.2em;}
#proposition_options .descriptif {position:relative; float:right; margin: 5px; cursor: help;}
#proposition_options .tarifs {position:relative; float:right; margin: 5px; color: #333; width:auto;}
#proposition_options .tarifs thead {background-color: #FFF}
#proposition_options .tarifs td {padding: 2px 5px;text-align:center;border: solid 3px #FFF; font-weight: bold; text-transform: uppercase; white-space: nowrap;}
#proposition_options .tarifs td span.unite {display:inline; font-weight:normal}
#proposition_options .tarifs td.titre {background-color:#FFF}
#proposition_options .tarifs b {color: #C00}
#proposition_options table.avantage {background-color: #FEC;}
#proposition_options table.planete {background-color: #EFB;}
#proposition_options table.avenir {background-color: #DFF;}
#proposition_options .detail {cursor: help;}
#proposition_options div.bloc_promo {margin:auto; text-align:center}
#proposition_options span.codepromo {display: block; width:255px; background: url(../images/fond_bloc_code-promo.png) 0 0 no-repeat; padding: 30px 0px 35px; text-align:center; margin:auto;}
#proposition_options div.double_bloc_promo {margin:auto; text-align:center;}
#proposition_options div.double_bloc_promo span.codepromo {display: block; float:left; width:255px;  background: url(../images/fond_bloc_code-promo.png) 0 0 no-repeat; padding: 30px 0px 35px; margin-left:42px; text-align:center;}
* > #proposition_options div.double_bloc_promo span.codepromo {margin-left:70px;}

#proposition_options span.hr {display:block; line-height:1px; border-top:dotted 1px #ccc; margin: 5px auto; width: 250px}
#proposition_options span.form_error {border: solid 2px #F90 !important;}
#proposition_options .offre_speciale {clear:both;display: block; padding: 0; margin-bottom: 0; background: url(../images/bloc-promo.gif) 50% top repeat-y; text-align: center; font: normal 1.2em/2.4 arial;}

/* Fin Options */

#main_content_souscription * > .text {margin: 1px 0;}
#main_content_souscription .small {width: 262px; font-size: 100%;}
#main_content_souscription * > .small {width: 268px; font-size: 100%;}
#main_content_souscription .medium {width: 455px;}
#main_content_souscription * > .medium {width: 448px;}
#main_content_souscription .large {width: 715px;}
#main_content_souscription * > .large {width: 716px;}
#main_content_souscription .sauvegarder a {text-decoration:none;}

table {border: none;}

input.text {
background-color:#F7F7F7;
border:1px solid #CCCCCC;
color:#666666;
height: 18px;
padding: 1px 2px;
vertical-align:middle;
width:120px;
}