/* ----- Table des matières -----

    - générique 
    - la custom dans assurance auto
    - onglets
    - contenu
    - déclinaison des marques
        - type d'assurance (icon)
    - produit habitation
    -version mobile
        - version mobile de la custom dans assurance-auto

*/



/* ----- générique ----- */
#zoneCTA {
    position: absolute;
    margin-left: 20px;
}

#zoneCTA .invisible {
    display: none;
}

/* ----- la custom dans assurance auto ----- */
#zoneCTA.auto {
    background: #CBE5DB url(/ressources/images/b20-img-concours-soum-auto-v2.svg);
    height: 300px;
    position: relative;
    margin: 0;
    padding: 0;
}

.dadi-accueil #zoneCTA.auto {
    background: none;
    height: 400px;
}

#contenuTexte {
    position: absolute;
    right: 20px;
    bottom: 60px;
    width: 275px;
}

.dadi-accueil #contenuTexte {
    position: relative;
    right: 40px;
    top: 10px;
    width: 275px;
}

#zone-centrale #contenu.quoter #carrousel-promotionnel #zoneCTA.auto h2 {
    display: inline-block !important;
}

.auto .quoterProduits.quoterProduitAuto .contenuOnglet {
    box-shadow: none;
    padding: 10px;
    margin: 0 0 0 0;
    width: 100%;
}

#zone-centrale #zoneCTA.auto #contenuTexte h2,
#page:not(.mobile) #zone-centrale #zoneCTA.auto #contenuTexte h2 {
    background-color: #2a3b44;
    color: #ffffff;
    font-family: robotoblack, sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    padding: 7px 0 7px 10px;
    margin: 0;
    width: 100%;
}

#zone-centrale .dadi-accueil #zoneCTA.auto #contenuTexte h2 {
    background-color: #000000;
    font-family: inherit;
    font-size: 1.375rem;
    font-weight: normal;
    line-height: 1.7rem;
}

.auto #zoneCTA .quoterProduits.quoterProduitAuto .contenuOnglet p,
#page:not(.mobile) #zoneCTA .quoterProduits.quoterProduitAuto .contenuOnglet p {
    font-size: 16px;
    margin-top: 8px;
}

.dadi-accueil .auto #zoneCTA .quoterProduits.quoterProduitAuto .contenuOnglet p,
.dadi-accueil #page:not(.mobile) #zoneCTA .quoterProduits.quoterProduitAuto .contenuOnglet p {
    font-size: 22px;
    margin-top: 8px;
}

#cartouche {
    display: block;
    margin: 5px 0 0 145px;
    padding-top: 40px;
    text-align: center;
    width: 23%;
}

.en #cartouche {
    padding-top: 60px;
}

#zone-centrale #zoneCTA.auto h2 {
    width: auto;
}

#zone-centrale #zoneCTA #cartouche h2,
#page:not(.mobile) #zone-centrale #zoneCTA #cartouche h2 {
    color: #004c1f;
    font-family: roboto, sans-serif;
    font-size: 24px;
    font-weight: normal;
}

#page:not(.mobile).en #zone-centrale #zoneCTA #contenuTexte h2 .nowrap {
    display: block;
}

#zone-centrale #zoneCTA #cartouche h2 span {
    display: block;
    font-family: robotoblack, sans-serif;
    font-size: 32px;
    line-height: 26px;
    margin-top: 5px;  
}

#zone-centrale #zoneCTA #cartouche p,
#page:not(.mobile) #zone-centrale #zoneCTA #cartouche p {
    color: #3e3e3e;
    font-family: roboto, sans-serif;
    font-size: 16px;
    line-height: 20px;
}

/* ----- ajustement pour vitrine dans un carrousel ----- */
#zone-centrale #contenu.quoter #carrousel-promotionnel .txt1-2 {
    width: 100%;
}
#zone-centrale #contenu.quoter #carrousel-promotionnel #zoneCTA h2 {
    display: block !important;
}

#zone-centrale #zoneCTA h2 {
    color: #383838;
    display: block;
    font-size: 30px;
    font-weight: 900;
    line-height: 32px;
    margin-bottom: 10px;
    margin-top: 20px;
    position: relative;
    width:340px;
}

#page:not(.mobile) #zone-centrale #zoneCTA h2 {
    font-family: robotoblack, sans-serif;
}

#zone-centrale #zoneCTA.locataire h2 {
    color: #383838;
}

#zone-centrale #zoneCTA .tel  {
    display: inline;
    position: relative;
    vertical-align: super;
}

#zone-centrale #zoneCTA .tel a, 
#zone-centrale #zoneCTA .tel {
    color: #383838;
    font-size: 13px;
    font-weight: bold; 
}

#page:not(.mobile) #zone-centrale #zoneCTA .tel a, 
#page:not(.mobile) #zone-centrale #zoneCTA .tel {
    font-family: robotoregular, sans-serif;
}

#zone-centrale #zoneCTA.auto .tel a:link {
    color: #383838;
    display: inline-block;
    font-size: 0.85rem;
    font-weight: bold;
    margin-top: 8px;
    text-decoration: none;
}

#zone-centrale #zoneCTA.auto .tel a:focus {
    background-color:#0B4B77; 
    color: #ffffff;
    outline: 0;
}

#zoneCTA .inactif .tel a, #zoneCTA .inactif .tel {
    display: none;
}

/* ----- onglets ----- */

.quoterProduits {
    position: relative;
    width: 100%;
}

.quoterProduits *{
    box-sizing: border-box;
}

.quoterProduits .ongletsDA {
    padding: 0;
    display: -webkit-flex;
    display: flex;
}

.quoterProduits .ongletsDA .regroupement{
    float: left;
    width:  50%;
    display: -webkit-flex;
    display: flex;
}

.quoterProduits .ongletsDA .ongletDA{
    display: list-item;
    text-align: -webkit-match-parent;
    margin-right: 4px;
    min-height: 34px;
    width: 104px;
    list-style: none;
}
.quoterProduits .ongletsDA .ongletDA:last-of-type{
    margin-right: 0px;
}

.quoterProduits .ongletsDA .ongletDA.actif {
    min-height: 40px;
    height: 40px;
}

.quoterProduits .ongletsDA .ongletDA.actif .contenuOnglet{
    -webkit-animation: fadein 0.5s; /* Safari, Chrome and Opera > 12.1 */
    -moz-animation: fadein 0.5s; /* Firefox < 16 */
    -ms-animation: fadein 0.5s; /* Internet Explorer */
    -o-animation: fadein 0.5s; /* Opera < 12.1 */
    animation: fadein 0.5s;
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.quoterProduits .ongletsDA .ongletDA button{
    display: list-item;
    text-align: -webkit-match-parent;
    min-height: 34px;
    width: 100%;
    font-size: 14px;
    line-height:12px;
    padding: 15px 10px 10px 35px;
    text-align: left;
    color:  #383838;
    position: relative;
}

#page:not(.mobile) .quoterProduits .ongletsDA .ongletDA button{
    font-family: robotoregular, sans-serif;
}
.auto .quoterProduits .ongletsDA .ongletDA button {
    min-height: 54px;
    /* width: 158px; */
    width: 320px;
    padding: 10px 10px 10px 55px;
    position: relative;
}

.auto .quoterProduits .ongletsDA .ongletDA{
    height: 55px;
    width: auto;
}

/* .quoterProduits .ongletsDA .ongletDA button.autoDetaillee {
    margin-left:150px;
} */

.quoterProduits .ongletsDA .ongletDA button:focus{
    outline: 0;
}

.quoterProduits .ongletsDA .ongletDA button span {
    font-weight: 400;
    font-size: 1.2rem;
    display:block;
    margin-top: 5px;
}

.quoterProduits .ongletsDA .ongletDA button span.precision {
    font-weight: normal;
    font-size: 11px;
    font-size: 0.7rem;
    display:block;
    margin-top: 0;
}
#page:not(.mobile) .quoterProduits .ongletsDA .ongletDA button span.precision {
    font-family: robotoregular, sans-serif;
}

.quoterProduits .ongletsDA .ongletDA button:hover{
    cursor : pointer;
}

.quoterProduits .ongletsDA .ongletDA.actif button:hover{
    cursor: default;
}

[data-state="keyboard"] .quoterProduits .ongletsDA .ongletDA button:focus{
    color: #FFF;
}

/* ----- contenu ----- */

.quoterProduits .contenuOnglet {
    position: absolute;
    left: 0;
    width: 320px;
    margin-top: 4px;
    color: #FFF;
    padding: 0px 10px 12px 10px;
}

.quoterProduits.quoterProduitAuto .contenuOnglet {
    position: relative;
    /*left: 0;*/
    display:inline-table;
    height: 115px;
    width: 260px;
    margin: 10px 0 0 0;
    padding: 8px 10px 10px;
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);
}

.quoterProduits.quoterProduitAuto .contenuOnglet fieldset{
    border:none;
    padding: 0;
    margin: 0;
}

#zoneCTA .quoterProduits.quoterProduitAuto .contenuOnglet p {
    font-family: robotoregular, sans-serif;
    margin-top: 0em;
    font-size: 16px;
    font-weight: bold;
    color: #383838;
    margin-bottom: 4px;
    /*padding-top: 10px;*/
}

.quoterProduits.quoterProduitAuto .contenuOnglet fieldset legend{
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0;
}

.quoterProduits.quoterProduitAuto .contenuOnglet input[type=text] {
    height: 35px;
}

#zoneCTA .quoterProduits.quoterProduitAuto .contenuOnglet input[type="submit"] {
    background: #007944;
    color: #FFF;
    border: 1px solid #ffffff;
    border-radius: 0;
    margin: 0;
}

.quoterProduits .contenuOnglet:focus {
    outline: 0;
}

.quoterProduits .groupeCodePostal, 
.quoterProduits .btnSoumission { 
    display: inline-block;
    vertical-align: bottom;
 }

.quoterProduits .btnSoumission{ 
    position: relative;
 }

.quoterProduits .contenuOnglet label{
    font-size: 13px;
    font-size: 1.3rem;
    margin-right: 15px;
    line-height: 1.3rem;
    color: #FFF;
    display: inline;
}

.quoterProduits .contenuOnglet input{
    /*padding: 8px;*/
    font-size: 10px;
    font-size: 1rem;
    max-width: 100%;
    margin-right: 25px;
    display: inline;
    border-radius: 0;
}

.quoterProduits .contenuOnglet input[type="submit"]:focus{
    outline: 0;
}

.quoterProduits .contenuOnglet input[type="submit"]:hover{
    cursor: pointer;
}

/* ----- déclinaison des marques ----- */

.quoterProduits.dadi .ongletsDA .ongletDA button{
    background-color: rgba(186, 220, 206, 0.9);
    border: 2px solid transparent;
    border-radius: 0;
    color: #383838;
    height: 100%;
    position: relative;
}

[data-state="keyboard"] .quoterProduits.dadi .ongletsDA .ongletDA button:focus{
    border: 1px solid #0B4B77;
}

.quoterProduits.dadi .ongletsDA .ongletDA.actif  button{
    background-color: rgba(255, 255, 255, 0.9);
    height: 100%;
    z-index: 90;
    transition: all ease-out 0.2s 0.1s;
}

[data-state="keyboard"] .quoterProduits.dadi .ongletsDA .ongletDA.actif button:focus{
    border: 1px solid #0B4B77;
    color: #FFF;
}

.quoterProduits .ongletsDA .ongletDA.actif button:after {
    -webkit-animation: fadein 0.8s; 
    -moz-animation: fadein 0.8s; 
    -ms-animation: fadein 0.8s; 
    -o-animation: fadein 0.8s; 
    animation: fadein 0.8s;
    border-color: rgba(255, 255, 255, 0.9);
    content: "";
    display: block;
    position: relative;
    width: 100px;
    border-style: solid;
    border-width: 2px;
    margin-left: -37px;
    margin-top:11px;
}

.auto .quoterProduits .ongletsDA .ongletDA.actif button:after {
    /* width: 154px; */
    width: 316px;
    margin-left: -57px;
    /* margin-top: 7px; */
    margin-top: 19px;
    position: absolute;
    bottom: -6px;
    transition: none;
}

.quoterProduits.dadi .contenuOnglet{
    background: rgba(255, 255, 255, 0.9);
}

[data-state="keyboard"] .quoterProduits.dadi .contenuOnglet input:focus{
    outline: 4px solid #FFF;
    border: 4px solid #0B4B77;
}

#zoneCTA .quoterProduits.dadi .contenuOnglet input[type="submit"] {
    -webkit-appearance: none;
    background: #007944;
    color: #FFF;
    border: 1px solid #ffffff;
    border-radius: 0;
    margin: 0;
}

[data-state="keyboard"] #zoneCTA .quoterProduits.dadi .contenuOnglet input[type="submit"]:focus{
    border: 1px solid #FFFFFF;
    background: #0B4B77;
    color: #FFF;
    outline: 0;
}

/* ----- type d'assurance (icon) ----- */
/*.quoterProduits.dadi .ongletsDA .ongletDA button.autoDetaille{  
     background: url("/ressources/images/b20-icn-auto-gris.svg") no-repeat 7px 12px rgba(186, 220, 206, 0.9); 
    background: url("/ressources/images/b20-icn-auto-rapide-gris.svg") no-repeat 7px 12px rgba(186, 220, 206, 0.9);
}*/

/*.quoterProduits.dadi .ongletsDA .ongletDA.actif button.autoDetaille{    
     background: url("/ressources/images/b20-icn-auto-vert.svg") no-repeat 7px 12px rgba(255, 255, 255, 0.9); 
    background: url("/ressources/images/b20-icn-auto-rapide-vert.svg") no-repeat 7px 12px rgba(255, 255, 255, 0.9);
}*/

/*[data-state="keyboard"] .quoterProduits.dadi .ongletsDA .ongletDA button.autoDetaille:focus, 
[data-state="keyboard"] .quoterProduits.dadi .ongletsDA .ongletDA.actif button.autoDetaille:focus{
    
     background: url("/ressources/images/b20-icn-auto-blanc.svg") no-repeat 7px 12px rgba(11, 75, 119, 0.9); 
    background: url("/ressources/images/b20-icn-auto-rapide-blanc.svg") no-repeat 7px 12px rgba(11, 75, 119, 0.9);
    color: #FFF;
}*/

.quoterProduits.dadi .ongletsDA .ongletDA button.autoRapide{    
    background: url("/ressources/images/b20-icn-auto-rapide-gris.svg") no-repeat 5px 18px rgba(186, 220, 206, 0.9);
}

.quoterProduits.dadi .ongletsDA .ongletDA.actif button.autoRapide{  
    background: url("/ressources/images/b20-icn-auto-rapide-vert.svg") no-repeat 5px 18px rgba(255, 255, 255, 0.9);
}

[data-state="keyboard"] .quoterProduits.dadi .ongletsDA .ongletDA button.autoRapide:focus, 
[data-state="keyboard"] .quoterProduits.dadi .ongletsDA .ongletDA.actif button.autoRapide:focus{
    
    background: url("/ressources/images/b20-icn-auto-rapide-blanc.svg") no-repeat 5px 18px rgba(11, 75, 119, 0.9);
}

.quoterProduits.dadi .ongletsDA .ongletDA button.proprietaire{  
    background: url("/ressources/images/b20-icn-proprietaire-gris.svg") no-repeat 5px 8px rgba(186, 220, 206, 0.9);
}

.quoterProduits.dadi .ongletsDA .ongletDA.actif button.proprietaire{    
    background: url("/ressources/images/b20-icn-proprietaire-vert.svg") no-repeat 5px 8px rgba(255, 255, 255, 0.9);
}

[data-state="keyboard"] .quoterProduits.dadi .ongletsDA .ongletDA button.proprietaire:focus,
[data-state="keyboard"] .quoterProduits.dadi .ongletsDA .ongletDA.actif button.proprietaire:focus{
    
    background: url("/ressources/images/b20-icn-proprietaire-blanc.svg") no-repeat 5px 8px rgba(11, 75, 119, 0.9);
}

.quoterProduits.dadi .ongletsDA .ongletDA button.condo{
    background: url("/ressources/images/b20-icn-condo-gris.svg") no-repeat 8px 8px rgba(186, 220, 206, 0.9);
}

.quoterProduits.dadi .ongletsDA .ongletDA.actif button.condo{   
    background: url("/ressources/images/b20-icn-condo-vert.svg") no-repeat 8px 8px rgba(255, 255, 255, 0.9);
}

[data-state="keyboard"] .quoterProduits.dadi .ongletsDA .ongletDA button.condo:focus,
[data-state="keyboard"] .quoterProduits.dadi .ongletsDA .ongletDA.actif button.condo:focus{
    
    background: url("/ressources/images/b20-icn-condo-blanc.svg") no-repeat 8px 8px rgba(11, 75, 119, 0.9);
}

.quoterProduits.dadi .ongletsDA .ongletDA button.locataire{
    background: url("/ressources/images/b20-icn-locataire-gris.svg") no-repeat 8px 8px rgba(186, 220, 206, 0.9);
}

.quoterProduits.dadi .ongletsDA .ongletDA.actif button.locataire{   
    background: url("/ressources/images/b20-icn-locataire-vert.svg") no-repeat 8px 8px rgba(255, 255, 255, 0.9);
}

[data-state="keyboard"] .quoterProduits.dadi .ongletsDA .ongletDA button.locataire:focus,
[data-state="keyboard"] .quoterProduits.dadi .ongletsDA .ongletDA.actif button.locataire:focus{
    
    background: url("/ressources/images/b20-icn-locataire-blanc.svg") no-repeat 8px 8px rgba(11, 75, 119, 0.9);
}

/*.quoterProduits.dadi .ongletsDA .ongletDA button.vr{  
    background: url("/ressources/images/b20-icn-vr-gris.svg") no-repeat center 35px #FBFBFB;
}

.quoterProduits.dadi .ongletsDA.ongletDA.actif button.vr{   
    background: url("/ressources/images/b20-icn-vr-vert.svg") no-repeat center 35px #E2F0D4;
}

[data-state="keyboard"] .quoterProduits.dadi .ongletsDA .ongletDA button.vr:focus,
[data-state="keyboard"] .quoterProduits.dadi .ongletsDA .ongletDA.actif button.vr:focus{
    
    background: url("/ressources/images/b20-icn-vr-blanc.svg") no-repeat center 35px #0B4B77;
}*/

.quoterProduits.dadi .contenuOnglet label{
    color: #383838;
} 

/* ----- produit habitation ----- */
.quoterProduits{
    margin-top:0px;
    max-width: 100%;
}

.quoterProduits .ongletsDA .regroupement{
    width: 100%;
}

.quoterProduitHabitation.quoterProduits .ongletsDA .ongletDA button{
    border-right: none;
}

.habitation .quoterProduits .ongletsDA .ongletDA.actif button:after,
.locataire .quoterProduits .ongletsDA .ongletDA.actif button:after {
    width: 104px;
}

#zoneCTA.habitation .quoterProduits .ongletsDA .ongletDA.actif .contenuOnglet .online-purchase,
#zoneCTA.locataire .quoterProduits .ongletsDA .ongletDA.actif .contenuOnglet .online-purchase {
    margin: 10px 0 5px;
    color: #383838;
    font-family: Arial;
    font-family: robotoregular, sans-serif;
    font-size: 14px;
    line-height: 18px;
}

#zoneCTA .quoterProduits form{
    display: inline;
    margin: 0;
    width: 65%;
}

#zoneCTA .quoterProduits .contenuOnglet label{
    border-color: 1px solid #737373;
    font-size: 13px;
    font-weight: bold;
    display: block;
}

#page:not(.mobile) #zoneCTA .quoterProduits .contenuOnglet label{
    font-family: robotoregular, sans-serif;
}

#page:not(.mobile) #zoneCTA.auto .quoterProduits .contenuOnglet label{
    font-weight: normal;
}

.quoterProduits .contenuOnglet input{
    min-height: 26px;
    margin-bottom: 0;
}
.quoterProduits .contenuOnglet input[type=text]{
    max-width: 85px;
}

.quoterProduits .contenuOnglet input[type="submit"]{
    font-size: 13px;
    font-weight: bold;
    height: 35px;
    width: 95px;
}
#page:not(.mobile) .quoterProduits .contenuOnglet input[type="submit"]{
    font-family: 'Roboto', sans-serif;
}


/* AJUSTEMENTS POUR LES VITRINES EN PAGE D'ACCUEIL */
.vitrine.dadi-accueil #zoneCTA {
    margin-left: 0;
    top: 20px;
    width: 355px;
}
  @media (min-width: 513px) {
    .vitrine.dadi-accueil #zoneCTA {
      top: 68px;
      width: 460px;
    }
  }
#zone-centrale .vitrine.dadi-accueil #zoneCTA h3 {
    font-family: 'robotoblack', sans-serif;
    color: #3e3e3e;
    font-size: 30px;
}
  @media (min-width: 513px) {
    #zone-centrale .vitrine.dadi-accueil #zoneCTA h3 {
      font-size: 40px;
    }
  }
#zone-centrale .vitrine.dadi-accueil #zoneCTA .tel {
    display: block;
    margin-top: 15px;
    font-size: 16px;
}
.vitrine.dadi-accueil #zoneCTA .quoterProduits .ongletsDA .ongletDA {
    width: 112px;
}
  @media (min-width: 513px) {
    .vitrine.dadi-accueil #zoneCTA .quoterProduits .ongletsDA .ongletDA {
      width: 130px;
    }
  }
	
.vitrine.dadi-accueil #zoneCTA .quoterProduits .contenuOnglet input[type="submit"] {
	font-size: 16px;
	width: 128px;
	height: 44px;
}
	
.vitrine.dadi-accueil #zoneCTA .quoterProduits .ongletsDA .ongletDA button {
    padding: 11px 10px 10px 36px;
    font-weight: bold;
    font-size: 16px;
}
  @media (min-width: 513px) {
    .vitrine.dadi-accueil #zoneCTA .quoterProduits .ongletsDA .ongletDA button {
      padding-left: 42px;
    }
  }
.vitrine.dadi-accueil #zoneCTA .quoterProduits .contenuOnglet {
    width: 344px;
    padding: 12px 16px;
    height: auto;
}
  @media (min-width: 513px) {
    .vitrine.dadi-accueil #zoneCTA .quoterProduits .contenuOnglet {
      width: 398px;
    }
  }
.vitrine.dadi-accueil #zoneCTA .quoterProduits .ongletsDA .ongletDA.actif {
  min-height: 36px;
	height: 36px;
}
.vitrine.dadi-accueil #zoneCTA .quoterProduits .ongletsDA .ongletDA.actif button:after {
    width: 112px;
    margin-left: -38px;
    margin-top: 11px;
}

  @media (min-width: 513px) {
    .vitrine.dadi-accueil #zoneCTA .quoterProduits .ongletsDA .ongletDA.actif button:after {
      width: 130px;
      margin-left: -44px;
    }
  }
.vitrine.dadi-accueil #zoneCTA .quoterProduits.dadi .ongletsDA .ongletDA button {
    background-position: 6px 8px;
}
.vitrine.dadi-accueil #zoneCTA .quoterProduits.dadi .ongletsDA .ongletDA button.proprietaire {
    background-position: 6px 5px;
}
  @media (min-width: 513px) {
    .vitrine.dadi-accueil #zoneCTA .quoterProduits.dadi .ongletsDA .ongletDA button {
      background-position: 12px 8px;
    }
    .vitrine.dadi-accueil #zoneCTA .quoterProduits.dadi .ongletsDA .ongletDA button.proprietaire {
      background-position: 12px 5px;
    }
  }
.vitrine.dadi-accueil #zoneCTA .quoterProduits .contenuOnglet label {
    font-size: 22px;
    font-weight: normal;
}
.vitrine.dadi-accueil #zoneCTA .quoterProduits .contenuOnglet input[type=text]{
    margin-top: 6px;
    padding: 2px;
    min-height: 44px;
    max-width: 120px;
    font-size: 16px;
}


/* VERSION RESPONSIVE - PATCH POUR AFFICHER LES QUOTER BOX*/
@media screen and (max-width: 399px) { 
   #contenu .cd-bloc-avantage-membre .titre { font-size: 16px; };
   #page.mobile #zoneCTA { margin-left: 10px; }
   #page.mobile .vitrine.dadi-accueil #zoneCTA { margin-left: 0; }
   #page.mobile .quoterProduits .ongletsDA .ongletDA button { padding-right: 5px; }
   #page.mobile .quoterProduits .ongletsDA .ongletDA { width: auto; }
   #page.mobile .quoterProduits .ongletsDA .ongletDA.actif button:after { width: auto; }
   #page.mobile #zone-centrale #zoneCTA h2 { font-size: 22px; width: auto; line-height: 26px; }
   #page.mobile .quoterProduits.dadi .ongletsDA .ongletDA.actif button.autoRapide, #page.mobile .quoterProduits.dadi .ongletsDA .ongletDA button.autoRapide, #page.mobile .quoterProduits.dadi .ongletsDA .ongletDA button.autoDetaille, #page.mobile 
.quoterProduits.dadi .ongletsDA .ongletDA.actif button.autoDetaille { background-image: none; }
   #page.mobile .auto .quoterProduits .ongletsDA .ongletDA button { padding: 10px; width: 280px; transition: inherit; }
   #page.mobile .auto .quoterProduits .ongletsDA .ongletDA.actif button::after { margin-left: -12px; width: 276px; }
   #page.mobile #zone-centrale #zoneCTA .tel { display: block; margin-top: 5px; font-size: 12px;}
   #page.mobile #zone-centrale #zoneCTA.auto .tel { margin-top: 7px; }
   #page.mobile .quoterProduits .contenuOnglet { width: 280px;}
   #page.mobile .quoterProduits.quoterProduitAuto .contenuOnglet { width: 280px; padding: 0px 10px 10px 10px; }
   #page.mobile #zone-centrale #zoneCTA.auto .quoterProduits .contenuOnglet { height: 76px; }
   #zone-centrale #zoneCTA.locataire h2 { color: #383838; }
   #page.mobile #zone-centrale #zoneCTA.auto .quoterProduits.quoterProduitAuto .contenuOnglet { height: auto; }
   #page.mobile #zone-centrale #zoneCTA .quoterProduits.quoterProduitAuto .contenuOnglet p { font-size: 16px; margin-top: 8px; padding-top: 10px;}
   #zoneCTA.habitation .quoterProduits .ongletsDA .ongletDA.actif .contenuOnglet .online-purchase, #zoneCTA.locataire .quoterProduits .ongletsDA .ongletDA.actif .contenuOnglet .online-purchase { font-size: 13px; line-height: 16px; margin: 3px 0;}
   #zoneCTA .quoterProduits .contenuOnglet label { font-size: 12px; }
}

/* VERSION RESPONSIVE ----- la custom dans assurance auto ----- */
@media screen and (max-width: 767px) {
    #zoneCTA.auto {
        background-size: cover;
        height: 280px;
    }

    #cartouche {
        margin: 5px 0 0 0;
        padding-top: 40px;
        width: 33%;
    }

    .en #cartouche {
        padding-top: 60px;
    }

    #zone-centrale h2, #zone-centrale .titre-n2 {
        margin-top: 10em;
    }

    .auto .quoterProduits.quoterProduitAuto .contenuOnglet {
        border: 1px solid rgba(0,0,0,0.3);
    }

    #contenuTexte {
        position: relative;
        right: 0;
        top: 60px;
        width: 100%;
    }

    #zone-centrale #zoneCTA #cartouche h2,
    #page.mobile #zone-centrale #zoneCTA #cartouche h2 {
        font-size: 18px;
        line-height: 22px;
    }

    #zone-centrale #zoneCTA #cartouche h2 span {
        font-size: 24px;
        line-height: 20px;
    }
    
    #zone-centrale #zoneCTA #cartouche h2,
    #zone-centrale #zoneCTA #cartouche p  {
        margin: 15px 0 0 140px;
        width: 150px;
    }    
}


@media screen and (max-width: 459px) {
    #zoneCTA.auto {
        background-position-x: -35px;
        background-repeat: no-repeat;
    }

    #cartouche {
        margin-left: -10%;
    }

    #zone-centrale #zoneCTA #cartouche h2, 
    #page.mobile #zone-centrale #zoneCTA #cartouche h2 {
        font-size: 18px;
        line-height: 22px; 
        width: 150px;   
    }

    #zone-centrale #zoneCTA #cartouche h2 span {
        font-size: 24px;
        line-height: 20px;
        margin-top: 5px;
    }

    #zone-centrale #zoneCTA #cartouche p {
        font-size: 14px;
        line-height: 18px;
        margin-top: 15px;
    }

    #page.mobile #zone-centrale #zoneCTA.auto #contenuTexte h2 {
        font-size: 18px; 
        line-height: 22px;
    }
    #page.mobile #zone-centrale #zoneCTA.auto .tel { font-family: robotoregular, sans-serif; font-size: 13px; margin-top: 8px; }
    #page.mobile .quoterProduits.quoterProduitAuto .contenuOnglet { width: 100%; }
    #page.mobile #zoneCTA.auto .quoterProduits .contenuOnglet label { font-family: robotoregular, sans-serif; font-weight: normal; font-size: 13px; }
}
