﻿/******************************************************************************/
/* offres.css                                                                 */
/* Auteur : Romuald Bernard                                                   */
/* Licence : Aucune (domaine public)                                          */
/* Dernière modification : 24/04/2015 10:30                                   */
/******************************************************************************/

/******************************************************************************/
/* I    - OFFRES (Styles généraux)                                            */
/* II   - DÉTAILS D'UNE OFFRE                                                 */
/* III  - GRILLES DES OFFRES                                                  */
/* IV   - GRILLES DES FORFAITS                                                */
/* V    - SIMULATEUR                                                          */
/* VI   - SIMULATEUR DE BUDGET                                                */
/* VII  - SIMULATEUR DE CONSOMMATION                                          */
/******************************************************************************/

/******************************************************************************/
/* OFFRES                                                                     */
/******************************************************************************/

/******************************************************************************/
/* DÉTAILS D'UNE OFFRE                                                        */
/******************************************************************************/

.offres.detailOffre .contentSection > p {
  margin-bottom: 20px;
}

.offres.detailOffre .tableauOffres {
  margin-top: 20px;
}

/******************************************************************************/
/* GRILLES DES OFFRES                                                         */
/******************************************************************************/

.offres.grilleOffres .sectionGrise {
  padding: 0 0 1em 0;
}

.offres.grilleOffres .contentSection > .custom.bouton {
  float: right;
  margin-bottom: 20px;
  width: 327px;
}

/******************************************************************************/
/* GRILLES DES FORFAITS                                                       */
/******************************************************************************/

.offres.grilleForfaits .sectionGrise {
  padding: 0 0 1em 0;
}

/******************************************************************************/
/* SIMULATEUR                                                                 */
/******************************************************************************/

.offres.simulateurConso input[type=number],
.offres.simulateurBudget input[type=number] {
  -moz-appearance: textfield;
  padding: 0 30px 0 10px;
}

.offres.simulateurConso input[type=number]::-webkit-inner-spin-button,
.offres.simulateurBudget input[type=number]::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

.offres.simulateurConso input[type=range],
.offres .simulateurBudget input[type=range] {
  position: absolute;
  width: 100%;
  z-index: 10;
}

.offres.simulateurConso input[type=range]:after,
.offres.simulateurConso input[type=range]:before,
.offres.simulateurBudget input[type=range]:after,
.offres.simulateurBudget input[type=range]:before {
  display: none;
}

.offres .cssCurseurConso input[type="range"] {
  height: 80px;
  margin: 0;
  width: 600px;
}

html[data-useragent*="MSIE 10.0"] .cssCurseurConso input[type="range"],
html[data-useragent*="rv:11.0"] .cssCurseurConso input[type="range"] {
  height: 45px;
}

html[data-useragent*="Edge"] input[type=range]::-webkit-slider-thumb {
  margin-top: 0;
}

.offres .valeur {
  font-size: 1.6em;
  font-weight: bold;
}

.offres .sectionOnglets {
  margin-bottom: 0;
}

.offres .titreSimulateur,
.offres .titreResultats {
  color: #085da9;
  font-weight: bold;
  margin: 0 auto;
  padding: 1em 0;
}

.offres .titreSimulateur span,
.offres .titreResultats span {
  display: inline-block;
  font-size: 1.6em;
  line-height: 1.5em;
}

.offres .numeroTitreSimulateur,
.offres .numeroTitreResultats {
  background-color: #085da9;
  color: #FFF;
  height: 1.5em;
  text-align: center;
  margin: 0 0.25em;
  width: 1.5em;
}

.offres #wsqCurseurVoix,
.offres #wsqCurseurSms,
.offres #wsqCurseurData {
  position: relative;
}

/* Partie curseur */

.offres .voixSimulateur,
.offres .smsSimulateur,
.offres .dataSimulateur {
  float: left;
  height: 80px;
  width: 100%;
}

.offres .voixSimulateur > div,
.offres .smsSimulateur > div,
.offres .dataSimulateur > div {
  float: left;
  height: 80px;
  width: 620px;
}

.offres div.cssCurseurConso {
  padding: 0 10px;
  width: 600px;
}

.offres div.cssCurseurConso > div {
  position: relative;
  height: 80px;
}

.offres .voixSimulateur .manuelSimulateur,
.offres .smsSimulateur .manuelSimulateur,
.offres .dataSimulateur .manuelSimulateur {
  width: 360px;
}

.offres .manuelSimulateur ul {
  display: table;
}

.offres .manuelSimulateur li {
  display: table-cell;
  height: 80px;
  width: 81px;
  text-align: right;
  vertical-align: middle;
}

.offres .manuelSimulateur li:first-child {
  width: 352px;
}

.offres .manuelSimulateur li > * {
  display: inline-block;
  vertical-align: top;
}

.offres .manuelSimulateur label,
.offres .manuelSimulateur em,
.offres #lblQuantiteEnMinute {
  font-size: 1.4em;
  font-weight: bold;
  line-height: 45px;
}

.offres .manuelSimulateur label {
  width: 41%;
}
.offres .manuelSimulateur > ul > li > div {
  width: 43%;
}
.offres .manuelSimulateur > ul > li > em {
  width: 12%;
  padding-left: 2%;
}

.offres .manuelSimulateur em {
  text-align: left;
  line-height: normal;
  margin: .3em 0;
 }

.offres #lblQuantiteEnMinute {
  color: #d6047f;
}

.offres .manuelSimulateur input[type="text"],
.offres .manuelSimulateur input[type="number"] {
  color: #d6047f;
  font-weight: bold;
  font-size: 3em;
  /* width: 125px; */
  width: 100%;
}

.offres span.cssFleches{
  position: absolute;
  height: 43px;
  top: 1px;
  right: 1px;
  width: 22px;
}

.offres span.cssFleches a {
  background: #d6047f;
  color: #FFF;
  cursor: pointer;
  display: inline-block;
  font-size: 2.4em;
  height: 21px;
  line-height: 18px;
  text-align: center;
  text-decoration: none;
  width: 22px;
  -webkit-user-select: none; /* webkit (safari, chrome) browsers */
  -moz-user-select: none; /* mozilla browsers */
  -khtml-user-select: none; /* webkit (konqueror) browsers */
  -ms-user-select: none; /* IE10+ */
}

.offres span.cssFleches a:first-child {
  margin-bottom: 1px;
}

.offres span.cssFleches a:hover {
  background: #f9419d;
}

.offres .cssCurseurHTML4 {
  background: #848484;
  position: absolute;
  height: 5px;
  left: 0;
  top: 38px;
  width: 100%;
}

.offres .cssPointeurHTML4 {
  background: transparent url("/_img/_commun/fndCurseur.gif?v=2020.03") center center no-repeat;
  cursor: pointer;
  height: 80px;
  position: absolute;
  top: 0;
  width: 68px;
  z-index: 1000;
}

.offres .cssValeur {
  color: #d6047f;
  font-weight: bold;
  font-size: 1.5em;
  left: 0;
  position: absolute;
  text-align: center;
  top: 0;
  width: 70px;
}

.offres .cssMarqueurIntervalleEchelle {
  background-color: #848484;
  height: 17px;
  position: absolute;
  top: 32px;
  width: 1px;
}

.offres .cssIntervalleEchelle {
  display: block;
  color: #848484;
  font-size: 1.2em;
  position: absolute;
  bottom: 2px;
  text-align: center;
  width: 28px;
}

.offres .cssIntervalleEchelleLast {
  display: block;
  color: #848484;
  font-size: 1.2em;
  position: absolute;
  bottom: 2px;
  text-align: center;
  width: 70px;
  
}

.offres .offreResultats > div,
.offres section .conteneurResultats > div {
  display: table-cell;
  height: 110px;
  vertical-align: middle;
}

.offres .logoResultats {
  min-width: 174px;
}

.offres .prixMontantResultats {
  color: #d6047f;
  font-size: 2em;
  text-align: center;
}

.offres .prixMontantResultats em {
  font-size: 2.9em;
  font-weight: bold;
}

.offres .detailsResultats li {
  list-style: square outside;
  margin-left: 14px;
}

.offres li .detailResultats {
  font-size: 1.4em;
  line-height: 20px;
}

.offres .detailsResultats em {
  font-weight: bold;
}

.offres .panierResultats {
  text-align: center;
}


.offres #notes {
  margin-top: 30px;
}

.offres #notes a {
  font-size: 1.4em;
  cursor: pointer;
}

.offres #contentNotes {
  font-size: 1.2em;
  line-height: 22px;
}

/******************************************************************************/
/* SIMULATEUR DE BUDGET                                                       */
/******************************************************************************/

.offres.simulateurBudget .configSimulateur {
  margin: 0 auto;
  width: 980px;
}

.offres.simulateurBudget .choixSimulateur {
  display: inline-block;
  vertical-align: top;
}

.offres.simulateurBudget #divRegionFormule {
  width: 61%;
}

.offres.simulateurBudget #divRegionRallonge {
  width: 38%;
}

.offres.simulateurBudget .conteneurSimulateur .titreSimulateur {
  width: 980px;
}

.offres.simulateurBudget .offreSimulateur,
.offres.simulateurBudget .rallongeSimulateur {
  display: table;
  height: 30px;
  margin-bottom: 7px;
  position: relative;
}

.offres.simulateurBudget #divRegionFormule {
  margin-right: 1%;
}

.offres.simulateurBudget .offresSimulateur ul {
  display: inline-block;
  vertical-align: top;
  /* width: 50%; */
  width: 33.33333333%
}

.offres.simulateurBudget .offreSimulateur > *,
.offres.simulateurBudget .rallongeSimulateur > * {
  display: table-cell;
  vertical-align: middle;
}

.offres.simulateurBudget .offreSimulateur input[type="radio"] {
  margin: 8px 5px;
}

.offres.simulateurBudget .rallongeSimulateur input {
  width: 80px;
}

.offres.simulateurBudget .offreSimulateur label {
  width: 300px;
}

.offres.simulateurBudget .offreSimulateur span,
.offres.simulateurBudget .rallongeSimulateur label,
.offres.simulateurBudget .prixOffre {
  font-size: 1.4em;
}

.offres.simulateurBudget .rallongeSimulateur label {
  padding: 0 7px;
  width: 113px;
}

.offres.simulateurBudget .offreSimulateur .moyenneOffre,
.offres.simulateurBudget .offreSimulateur .courteOffre {
  display: none;
}

.offres.simulateurBudget .offreSimulateur > span,
.offres.simulateurBudget .prixOffre {
  background: #085da9;
  border-radius: 0 16px;
  color: #FFF;
  font-weight: bold;
  text-align: right;
  padding: 0 5px;
  width: 106px;
}

.offres.simulateurBudget .prixOffre {
  font-size: 1.6em;
}

.offres.simulateurBudget #divRegionFormule .prixOffre {
  display: none;
}

.offres.simulateurBudget .manuelSimulateur em {
  text-align: left;
  /* width: 50px; */
}

.offres.simulateurBudget .cssAfficherIncluse,
.offres.simulateurBudget .cssNonSaisissable {
  background: transparent url("/_img/_commun/fndInclus.gif?v=2020.03") 0 0 repeat-x;
  color: #d6047f;
  font-size: 1.8em;
  font-weight: bold;
  padding-top: 18px;
  position: absolute;
  text-align: center;
  height: 62px;
  top: 0;
  width: 0px;
  z-index: 999;
}

.offres.simulateurBudget .cssNonSaisissable {
  width: 100%;
}


.offres.simulateurBudget .choixSimulateur span.cssFleches{
  top: 1px;
  left: 57px;
}


.offres.simulateurBudget .conteneurResultats {
  display: table;
  margin-bottom: 20px;
  width: 100%;
}

.offres.simulateurBudget .conteneurResultats > div {
  width: 33.33%;
}

/******************************************************************************/
/* SIMULATEUR DE CONSOMMATION                                                 */
/******************************************************************************/


.offres.simulateurConso .titreSimulateur,
.offres.simulateurConso .titreResultats {
  width: 980px;
}

.offres.simulateurConso .sectionGrise {
  margin: 0;
  padding: 1em 0;
}

/* .offres.simulateurConso .manuelSimulateur em {
  width: 25px;
} */

.offres.simulateurConso .conteneurResultats {
  margin-bottom: 30px;
}

.offres.simulateurConso .offreResultats {
  display: table;
  width: 980px;
}

.offres.simulateurConso .offreResultats > div {
  padding: 0 1%;
  position: relative;
  width: auto;
}

.offres.simulateurConso .offreResultats > div img,
.offres.simulateurConso .offreResultats > div a {
  display: inline-block;
  vertical-align: middle;
}

.offreResultats > div img {
  width:119px;
  height:175px;
}

.offres.simulateurConso .offreResultats div {
  padding: 0 1%;
  position: relative;
}

.offres.simulateurConso .offreResultats div[id^="divLogo"] {
  width: 162px;
}

.offres.simulateurConso .offreResultats div[id^="divBlockOptionRallonge"] {
  width: 260px;
}

.offres.simulateurConso .offreResultats .detailsResultats {
  width: 260px
}

.offres.simulateurConso .offreResultats .ajoutPanier {
  width: 45px;
  display:none;
}

.offres.simulateurConso .offreResultats .supplementResultats {
  padding: 0;
}

.offres.simulateurConso .supplementResultats > div {
  font-weight: bold;
  font-size: 1.6em;
  float: left;
  color: #d6047f;
  height: 20px;
  line-height: 20px;
  padding: 5px 0;
  text-align: center;
  width: 30px;
}

.offres.simulateurConso div.cssOptionRallonge {
  color: #000;
  text-align: left;
  width: auto;
}

.offres.simulateurConso div.cssOptionRallonge > span {
  position: relative;
  top: 4px;
}

.offres.simulateurConso div.cssRallongeQuantite > span {
  position: relative;
  top: 4px;
}

.offres.simulateurConso .ou1Resultats,
.offres.simulateurConso .ou2Resultats {
  margin-bottom: 13px;
  text-align: center;
  width: 100%;
}

.offres.simulateurConso .ou1Resultats span,
.offres.simulateurConso .ou2Resultats span {
  color: #085da9;
  font-size: 2.8em;
  font-weight: bold;
}


/******************************************************************************/
/* NOUVELLE OFFRE 14.95 (PROVISOIRE)                                                      */
/******************************************************************************/

.tableauOffres td.moisPrixOffre span,
.promotion span{
  font-size: 1.8em;
  font-weight: 100;
}

.tableauDetailOffre td.moisPrixOffre span,
.promotion span{
  font-size: 1.8em;
  font-weight: 100;
}

.montantPrixElementPanier .promotion {
  font-size: 0.8em;
}

/******************************************************************************/
/*                               Fin du fichier                               */
/******************************************************************************/