.btn-primaire, .btn-secondaire {width:100% !important; max-width:100%}
hr {display:block; height:0.1rem; margin:0; padding:0; border:0; background-color:#eee}

.visionneuse-img-xl380 li a {display:block; height:380px; background:none left center no-repeat}
.visionneuse-img-xl380 li a.slide-1 {background-image:url(../img/recharge-internet-1440.jpg)}
.visionneuse-img-xl380 li a.slide-2 {background-image:url(../img/recharge-max-1440.jpg)}
.visionneuse-img-xl380 li a.slide-3 {background-image:url(../img/offre-generique-300go-1440.jpg)}

.bloc1-nav-ext .row {padding:0 0 15px}
.bloc1-nav-ext .row .titre {display:none}
/*.bloc1-nav-ext .row .menu {display:flex; flex-wrap:wrap; width:100%; border-bottom:1px solid #ccc}*/
.bloc1-nav-ext .row .menu {display:flex; justify-content:center; overflow-x:auto; scrollbar-width:thin; scrollbar-color:#f16e00 #ccc; border-bottom:1px solid #ccc}
.bloc1-nav-ext .row .menu .item {line-height:2.4rem; font-size:1.8rem; margin:15px 45px 0 0}
.bloc1-nav-ext .row .menu .item:last-child {margin-right:0}
.bloc1-nav-ext .row .menu .item a {display:block; height:100%; font-weight:700; text-align:center; white-space:nowrap; padding:15px 0; border-bottom:5px solid transparent}
.bloc1-nav-ext .row .menu .item a img, .bloc1-nav-ext .row .menu .item a .icon {display:block; height:24px; font-size:2.4rem; text-align:center; margin:0 auto 6px}
.bloc1-nav-ext .row .menu .item a:hover, .bloc1-nav-ext .row .menu .item a:focus {color:#555}
.bloc1-nav-ext .row .menu .item a:active {color:#f16e00}
.bloc1-nav-ext .row .menu .item a.actif {border-bottom-color:#f16e00}
.bloc1-nav-ext .row .menu .item a.actif:hover, .bloc1-nav-ext .row .menu .item a.actif:focus {color:#555}
.bloc1-nav-ext.centre .row .zone {justify-content:center}
.bloc1-nav-ext.centre .row .zone .menu {width:auto}
.bloc1-nav-ext.xl .row .menu .item {flex:1 1 auto}
.bloc1-nav-ext.dark .row .menu {border-bottom-color:#555}
.bloc1-nav-ext.dark .row .menu .item a:hover, .bloc1-nav-ext.dark .row .menu .item a:focus {color:#ccc}
.bloc1-nav-ext.dark .row .menu .item a:active {color:#ff7900}
.bloc1-nav-ext.dark .row .menu .item a.actif {border-bottom-color:#ff7900}
.bloc1-nav-ext.dark .row .menu .item a.actif:hover, .bloc1-nav-ext.dark .row .menu .item a.actif:focus {color:#ccc}

.bloc1-nav-ext .row .menu .item a h2 {line-height:inherit; font-size:inherit; padding-bottom:0 !important}

.bloc1-nav-int .row {padding:0 0 15px}
.bloc1-nav-int .row .titre {display:none}
/*.bloc1-nav-int .row .menu {display:flex; flex-wrap:wrap; width:100%; border-bottom:1px solid #ccc}*/
.bloc1-nav-int .row .menu {display:flex; justify-content:center; overflow-x:auto; scrollbar-width:thin; scrollbar-color:#f16e00 #ccc; border-bottom:1px solid #ccc}
.bloc1-nav-int .row .menu .item {line-height:2.4rem; font-size:1.8rem; margin:15px 45px 0 0}
.bloc1-nav-int .row .menu .item:last-child {margin-right:0}
.bloc1-nav-int .row .menu .item a {display:block; height:100%; text-align:center; white-space:nowrap; padding-bottom:15px; border-bottom:5px solid transparent}
.bloc1-nav-int .row .menu .item a img, .bloc1-nav-int .row .menu .item a .icon {display:block; height:24px; font-size:2.4rem; text-align:center; margin:0 auto 6px}
.bloc1-nav-int .row .menu .item a:hover, .bloc1-nav-int .row .menu .item a:focus {color:#555}
/*.bloc1-nav-int .row .menu .item a:active {border-bottom-color:#f16e00}
.bloc1-nav-int .row .menu .item a.actif {border-bottom-color:#f16e00}*/
.bloc1-nav-int .row .menu .item a:active {font-weight:bold}
.bloc1-nav-int .row .menu .item a.actif {font-weight:bold}
.bloc1-nav-int .row .menu .item a.actif:hover, .bloc1-nav-int .row .menu .item a.actif:focus {color:#000}
.bloc1-nav-int.centre .row .zone {justify-content:center}
.bloc1-nav-int.centre .row .zone .menu {width:auto}
.bloc1-nav-int.xl .row .menu .item {flex:1 1 auto}
.bloc1-nav-int.dark .row .menu {border-bottom-color:#555}
.bloc1-nav-int.dark .row .menu .item a:hover, .bloc1-nav-int.dark .row .menu .item a:focus {color:#ccc}
.bloc1-nav-int.dark .row .menu .item a:active {color:#ff7900}

.bloc4-prod-ttl-prix-txt-btn .separation {width:80%; margin:0 auto; border:1px solid #f4f4f4}
.bloc4-prod-ttl-prix-txt-btn .btn {display:flex !important; justify-content:center}

.bloc4-offres .row .bloc {display:flex; flex-direction:column; flex:0 1 300px; text-align:center; margin:0 30px 16px 0}
.bloc4-offres .row .bloc:last-child {margin-right:0}
.bloc4-offres .row .bloc li {margin-left:0; padding:15px 0; border-bottom:1px solid #eee}
.bloc4-offres .row .bloc li .icon {font-size:2rem; margin-right:10px}
.bloc4-offres .row .contenu {display:flex; justify-content:center; overflow-x:auto; scrollbar-width:thin; scrollbar-color:#f16e00 #ccc}
.bloc4-offres .row .contenu img{display:block; margin:0 auto}
.bloc4-offres .row .contenu .superieur {justify-content:flex-start !important}
.bloc4-offres .row .contenu::-webkit-scrollbar {width:10px}
.bloc4-offres .row .contenu::-webkit-scrollbar-track {background-color:#ccc}
.bloc4-offres .row .contenu::-webkit-scrollbar-thumb {background-color:#f16e00}

.bloc1-faq .row .item {border-bottom:1px solid #000}
.bloc1-faq .row .item:last-child {border-bottom:0}
.bloc1-faq .row .item .titre {display:flex; justify-content:space-between; align-items:center; min-height:70px; padding:11px 0}
.bloc1-faq .row .item .titre h3 {line-height:2.4rem; font-size:1.8rem; padding:0}
.bloc1-faq .row .item .titre h3.txt-max {max-width:1000px !important}
.bloc1-faq .row .item .titre:hover h3, .bloc1-faq .row .item .titre:focus h3 {text-decoration:underline; color:#555}
.bloc1-faq .row .item .titre:active h3 {color:#f16e00}
.bloc1-faq .row .item .titre::after {font-family:icon-orange; font-size:1.4rem; font-weight:700; color:#f16e00; content:"\e93c"; margin-left:15px}
.bloc1-faq .row .item .texte {margin-bottom:30px}
.bloc1-faq .row .item .texte .txt-max {max-width:900px !important}
.bloc1-faq .row .item.ouvert .titre::after {content:"\e93d"}
.bloc1-faq.xl .row .item .titre {min-height:90px; padding:15px 0}
.bloc1-faq.xl .row .item .titre h3 {line-height:3rem; font-size:2.6rem}
.bloc1-faq.xl .row .item .titre::after {font-size:1.9rem}
.bloc1-faq.xl .row .item .texte {line-height:2.4rem; font-size:1.8rem}
.bloc1-faq.dark .row .item {border-bottom-color:#fff}
.bloc1-faq.dark .row .item .titre:hover h3, .bloc1-faq.dark .row .item .titre:focus h3 {color:#ccc}
.bloc1-faq.dark .row .item .titre:active h3 {color:#ff7900}
.bloc1-faq.dark .row .item .titre::after {color:#ff7900}


@media (max-width:1199.98px){
.visionneuse-img-xl380 li a.slide-1 {background-image:url(../img/recharge-internet-1199.jpg)}
.visionneuse-img-xl380 li a.slide-2 {background-image:url(../img/recharge-max-1199.jpg)}
.visionneuse-img-xl380 li a.slide-3 {background-image:url(../img/offre-generique-300go-1199.jpg)}

.bloc1-nav-ext .row .menu .item {line-height:2.2rem; font-size:1.6rem; margin-right:30px}
.bloc1-nav-ext .row .menu .item a img, .bloc1-nav-ext .row .menu .item a .icon {height:22px; font-size:2.2rem}

.bloc1-nav-int .row .menu .item {line-height:2.2rem; font-size:1.6rem; margin-right:30px}
.bloc1-nav-int .row .menu .item a img, .bloc1-nav-int .row .menu .item a .icon {height:22px; font-size:2.2rem}

.bloc1-faq .row .item .titre {min-height:70px; padding:13px 0}
.bloc1-faq .row .item .titre h3 {line-height:2.2rem; font-size:1.6rem}
.bloc1-faq .row .item .titre h3.txt-max {max-width:800px !important}
.bloc1-faq .row .item .titre::after {font-size:1.2rem}
.bloc1-faq .row .item .texte .txt-max {max-width:700px !important}
.bloc1-faq.xl .row .item .titre {min-height:80px; padding:14px 0}
.bloc1-faq.xl .row .item .titre h3 {line-height:2.6rem; font-size:2.2rem}
.bloc1-faq.xl .row .item .titre::after {font-size:1.6rem}
.bloc1-faq.xl .row .item .texte {line-height:2.2rem; font-size:1.6rem}
}


@media (max-width:959.98px){
.visionneuse-img-xl380 li a.slide-1 {background-image:url(../img/recharge-internet-959.jpg)}
.visionneuse-img-xl380 li a.slide-2 {background-image:url(../img/recharge-max-959.jpg)}
.visionneuse-img-xl380 li a.slide-3 {background-image:url(../img/offre-generique-300go-959.jpg)}

.bloc1-ttl-txt-btn-img .row .visuel {right:15px}

/*comme il y a 5 bloc, je remonte les lignes css ici au lieu de 735px*/
.bloc4-offres .row .bloc {flex:1 0 240px; margin-right:15px}
.bloc4-offres .row .contenu {justify-content:flex-start}
}


@media (max-width:735.98px){
.visionneuse-img-xl380 li a {height:475px; background-position:center center}
.visionneuse-img-xl380 li a.slide-1 {background-image:url(../img/recharge-internet-735.jpg)}
.visionneuse-img-xl380 li a.slide-2 {background-image:url(../img/recharge-max-735.jpg)}
.visionneuse-img-xl380 li a.slide-3 {background-image:url(../img/offre-generique-300go-735.jpg)}

/*.bloc1-nav-ext .row {padding:15px 0}
.bloc1-nav-ext .row .zone {position:relative}
.bloc1-nav-ext .row .titre {display:inline-block; text-decoration:none; padding:0 21px 0 0}
.bloc1-nav-ext .row .menu {position:absolute; left:0; top:28px; flex-direction:column; width:auto; padding-bottom:7px; border-top:5px solid #f16e00; border-bottom:0; background-color:#fff; box-shadow:0 1px 4px 0 rgba(0, 0, 0, 0.4); z-index:15}
.bloc1-nav-ext .row .menu.invisible {display:none}
.bloc1-nav-ext .row .menu .item {margin:0}
.bloc1-nav-ext .row .menu .item a {font-weight:400; text-align:left; white-space:normal; margin:0 20px; padding:9px 0; border:0}
.bloc1-nav-ext .row .menu .item a br, .bloc1-nav-ext .row .menu .item a img, .bloc1-nav-ext .row .menu .item a .icon {display:none}
.bloc1-nav-ext .row .menu .item a:hover, .bloc1-nav-ext .row .menu .item a:focus {text-decoration:underline; color:#555}
.bloc1-nav-ext .row .menu .item a:active {color:#f16e00}
.bloc1-nav-ext .row .menu .item a.actif {border-bottom-color:#f16e00}
.bloc1-nav-ext .row .menu .item a.actif:hover, .bloc1-nav-ext .row .menu .item a.actif:focus {color:#555}
.bloc1-nav-ext.centre .row .zone {justify-content:flex-start}
.bloc1-nav-ext.dark .row .menu {border-top-color:#ff7900; background-color:#000; box-shadow:0 1px 4px 0 rgba(255, 255, 255, 0.4)}
.bloc1-nav-ext.dark .row .menu .item a:hover, .bloc1-nav-ext.dark .row .menu .item a:focus {color:#ccc}
.bloc1-nav-ext.dark .row .menu .item a:active {color:#ff7900}
.bloc1-nav-ext.dark .row .menu .item a.actif:hover, .bloc1-nav-ext.dark .row .menu .item a.actif:focus {color:#ccc}*/
.bloc1-nav-ext .row .menu .item a {text-align:left; white-space:normal; margin:0 20px; padding:9px 0}
.bloc1-nav-ext .row .menu {justify-content:left}

.bloc1-nav-int .row {padding:15px 0}
.bloc1-nav-int .row .zone {position:relative}
/*.bloc1-nav-int .row .titre {display:inline-block; text-decoration:none; padding:0 21px 0 0}
.bloc1-nav-int .row .menu {position:absolute; left:0; top:28px; flex-direction:column; width:auto; padding-bottom:7px; border-top:5px solid #f16e00; border-bottom:0; background-color:#fff; box-shadow:0 1px 4px 0 rgba(0, 0, 0, 0.4); z-index:15}
.bloc1-nav-int .row .menu.invisible {display:none}*/
.bloc1-nav-int .row .menu {justify-content:left}
.bloc1-nav-int .row .menu .item {margin:0}
.bloc1-nav-int .row .menu .item a {font-weight:400; text-align:left; margin:0 20px; padding:9px 0; border:0}
.bloc1-nav-int .row .menu .item a br, .bloc1-nav-int .row .menu .item a img, .bloc1-nav-int .row .menu .item a .icon {display:none}
.bloc1-nav-int .row .menu .item a:hover, .bloc1-nav-int .row .menu .item a:focus {text-decoration:underline; color:#555}
.bloc1-nav-int .row .menu .item a:active {color:#f16e00}
.bloc1-nav-int.centre .row .zone {justify-content:flex-start}
.bloc1-nav-int.dark .row .menu {border-top-color:#ff7900; background-color:#000; box-shadow:0 1px 4px 0 rgba(255, 255, 255, 0.4)}
.bloc1-nav-int.dark .row .menu .item a:hover, .bloc1-nav-int.dark .row .menu .item a:focus {color:#ccc}
.bloc1-nav-int.dark .row .menu .item a:active {color:#ff7900}

.bloc1-ttl-prix-btn-img .row .visuel {order:-1}

.bloc4-prod-ttl-prix-txt-btn .row .bloc {flex:1 0 240px; margin-right:15px}
.bloc4-prod-ttl-prix-txt-btn .row > .bloc:nth-child(n+2) {margin-top: 0px !important;}
.bloc4-prod-ttl-prix-txt-btn .row > .bloc:nth-child(n+3) {margin-top: 30px !important;}
.bloc4-prod-ttl-prix-txt-btn .row .contenu {justify-content:flex-start}

.bloc1-faq .row .item .titre h3.txt-max {max-width:none !important}
.bloc1-faq .row .item .texte {margin-bottom:15px}
.bloc1-faq .row .item .texte .txt-max {max-width:none !important}
.bloc1-faq.xl .row .item .titre {min-height:70px; padding:11px 0}
.bloc1-faq.xl .row .item .titre h3 {line-height:2.4rem; font-size:2rem}
.bloc1-faq.xl .row .item .titre::after {font-size:1.5rem}
}


@media (max-width:479.98px){
.visionneuse-img-xl380 li a.slide-1 {background-image:url(../img/recharge-internet-479.jpg)}
.visionneuse-img-xl380 li a.slide-2 {background-image:url(../img/recharge-max-479.jpg)}
.visionneuse-img-xl380 li a.slide-3 {background-image:url(../img/offre-generique-300go-479.jpg)}

.bloc4-prod-ttl-prix-txt-btn .row > .bloc:nth-child(n+2) {margin-top: 30px !important;}
}