html{scroll-behavior: smooth;background:var(--clr-bg);}
html>body { overflow-x: unset; }
main { scroll-padding-top: 300px; }

#FilAriane { padding: 16px 0 0 0; margin: 0 auto -16px auto;}

#Faq{display:flex;padding:48px 0 0;max-width:1280px;width: calc(100% - 64px);margin: 0 auto;gap:40px;font-family: 'SFR-Regular',Arial;}
#Faq h1, #Faq h2, #Faq h3{font-family: 'SFR-Bold',Arial;color:#181818;}
#Faq h1{margin:0 0 8px 0;}
#Faq h3{font-size: 18px;}
#Faq p, #Faq a, #Faq b, #Faq ul, #Faq ol{font-size:14px;line-height: 21px;color:#181818;}
#Faq input[type="checkbox"],#Faq input[type="radio"] {display:none;}
#Faq .sstxt {color: #8A8A8A;font-size: 12px;line-height: 18px;}
#Faq [id^="Test"] .hide{display:none;}
#Faq [id^="Test"] .show{display:block;}

#Faq > .L{width:calc(35% - 20px);height:100%;background:#fff;border-radius:8px;overflow:hidden;position:sticky;top:80px;z-index:999;}
#Faq > .L > div{position:relative;max-height:calc(100vh - 104px);overflow-y:scroll;-ms-overflow-style: none; scrollbar-width: none; }
#Faq > .L > div::-webkit-scrollbar {display: none;}
#Faq > .L h3 {padding:24px; color:#fff;background:#000; font-family: 'SFR-Bold',Arial;font-size:24px;}
#Faq > .L strong {padding:24px; color:#fff;background:#000; font-family: 'SFR-Bold',Arial;font-size:24px;display:block;}
#Faq > .L .menuctx{padding:24px;font-family: 'SFR-Bold',Arial;border-top:1px solid #d2d2d2;display: flex; justify-content: space-between;align-items: center;cursor:pointer;font-size:14px;position:relative;}
#Faq > .L .ctaMenu{display:none;}
#Faq > .L input[type="checkbox"]:checked + .menuctx{color:#d90d25;}
#Faq > .L .menuctx:after{content: ''; width: 10px; height: 10px; border: 1.5px solid #000; border-radius: 1px 1px 1px; border-top: 0;border-left: 0; transform: rotate(45deg); transition: transform 0.3s; position: relative;display:block;};
#Faq > .L input[type="checkbox"]:checked + .menuctx:after{border-color: #d90d25;transform: rotate(225deg);}
#Faq > .L label + .menuList{padding : 0 32px 24px;display:none;}
#Faq > .L .menuList{display:block;padding:0;margin:24px 0 0 0;}
#Faq > .L .menuList ul{ list-style:none;font-size:14px;padding:0 0 0 28px;}
#Faq > .L .menuList ul li{display:flex;flex-direction:column;cursor: pointer; margin: 8px 0; transition: text-decoration .2s ease-out;}
#Faq > .L .menuList ul li a {text-decoration: none; font-family:'SFR-Regular', Arial;}
#Faq > .L .menuList ul li a.current { font-family: 'SFR-Bold'; }
#Faq > .L .menuList ul li:hover{text-decoration: underline;}
#Faq > .L .menuList ul li:after{content:"";background:url(https://static.s-sfr.fr/assets/pictos/fleche_DROITE_40_rouge.svg);background-size:contain;position:absolute;width:20px;height:20px;display:block;margin-left:-30px;margin-top:1px;}
#Faq > .L .menuctx summary{list-style:none;display:flex;justify-content: space-between;align-items: center;}
#Faq > .L .menuctx summary:after{content: ''; width: 10px; height: 10px; border: 1.5px solid #000; border-radius: 1px 1px 1px; border-top: 0; border-left: 0; transform: rotate(45deg); transition: transform 0.3s; position: relative; display: block;}
#Faq > .L .menuctx summary:before{content:'';top:0;left:0;width:100%;height: 48px; display: block; position: absolute;}
#Faq > .L .menuctx[open] summary{color:#d90d25;}
#Faq > .L .menuctx[open] summary:after{border-color: #d90d25;transform: rotate(225deg);}
#Faq > .L input[type="checkbox"]:checked + .menuctx + .menuList{display:block;}

#Faq > .R{width:calc(65% - 20px);}
#Faq > .R > p{margin-bottom:40px;}
#Faq > .R > img.illustration {width: 100%;margin: 0 0 40px 0;}

#Faq > .R .C{width:100%;background:#fff;border-radius:8px;padding:24px;margin: 0 0 40px 0;position:relative;}
#Faq > .R .C h2{margin: 0 0 16px 0;padding-right:90px;box-sizing:border-box;}
#Faq > .R .C>strong {font-size:28px;margin: 0 0 16px 0;padding-right:90px;box-sizing:border-box;display: block;}
#Faq > .R .C h2 span{color:#D90D25;font-family:'SFR-Regular', Arial;margin-right:16px;}
#Faq > .R .C b{font-family: 'SFR-Bold',Arial;font-size:16px;}
#Faq > .R .C ul{font-size:14px;}
#Faq > .R .C ul li { margin:0 0 8px 0; }
#Faq > .R .C ul li:before{content: '';position: absolute;width:8px;height:8px;margin:7px 0 0 -16px;background: var(--clr-sfr2);}
/*#Faq > .R .C ul li{margin:0 0 8px 0;}*/
#Faq > .R .C .plus {width:24px;height:24px;position:absolute;display:flex;align-items:center;justify-content:center;border-radius:4px;z-index:1;cursor:pointer;background-image: url(https://static.s-sfr.fr/assets/pictos/ajouter_40_blanc.svg); background-size: 66%; background-repeat: no-repeat; background-position: center center; }
#Faq > .R .C .fullscreen{padding:11px;border-radius:8px; background:#fff;opacity:.8;box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.16);width:40px; height:40px;position:relative;float:right;bottom:60px;right:16px;cursor:pointer;}
#Faq > .R .C .fullscreen img{display: none;}
#Faq > .R .C .fullscreen {background-image: url(https://static.s-sfr.fr/assets/pictos/plein_ecran_40_noir.svg); background-repeat: no-repeat; background-size: 56%; background-position: center center; transition: all .2s ease-out; }
#Faq > .R .C .fullscreen:hover { background-size:75%; }
#Faq > .R .C .plus.red{background-color:#D90D25;}
#Faq > .R .C .plus.black{background-color:#181818;}
#Faq > .R .C > p{margin-bottom:24px;}
#Faq > .R  ul{list-style:none; margin: 8px 0 8px 16px; }
/*#Faq > .R  ul li:before{content:'';width: 8px;height: 8px;background:#D90D25;position:absolute;margin-top: 7px;margin-left: -16px;}*/

#Faq > .R .C.connec {padding:24px 40px;display:flex;justify-content:space-between;align-items:center;}
#Faq > .R .C.connec a{text-align: center; border-radius: 10px; background: #181818;font-family: 'SFR-Bold';box-shadow: 0 4px 8px rgb(150 0 0 / 16%); padding: 9.5px 24px; font-family: 'SFR-Bold'; font-size: 14px;line-height: 1.4; text-decoration: none;color: #fff;cursor:pointer;}
#Faq > .R .C.connec a:hover{box-shadow: 0 4px 12px rgb(24 24 24 / 32%);}

#Faq .SCP h2{font-size:24px;}
#Faq>.R .SCP>strong {font-size:24px; display:block; font-family: 'SFR-Bold'; }
#Faq .SCP a {font-family:'SFR-Bold', Arial;display:block; margin: 16px 0 0 0; text-decoration: none; transition: color .2s ease-out; }
#Faq .SCP a:hover {color: var(--clr-sfr2); }
#Faq .SCP a span{color: var(--clr-sfr2);;font-family:'SFR-Bold',Arial;margin: 0 8px 0 0; text-decoration: underline #fff;}

#Faq .STF { overflow:hidden; }
#Faq .STF>img{ width: calc(100% + 24px*2); margin: -24px -24px 40px -24px; }

#Faq > .R .C.Pap h2{ padding: 0 90px 0 0; }
#Faq .Pap .sli{ display: block; position: absolute; top: 24px; right: 16px; }
#Faq .Pap .sli button { width: 40px; height: 40px; display: inline-block; cursor: pointer; border-radius: 8px; background:transparent; border: 1px solid var(--clr-black); line-height:0; vertical-align: middle; padding: 0; }
#Faq .Pap .sli button svg { display: block; width: 24px; height: 24px; margin: 0 auto; fill: #181818; cursor: pointer; }
#Faq .Pap .sli button.L svg { transform: rotate(180deg);}
#Faq .Pap .car{ scroll-behavior: smooth; white-space: nowrap; overflow: scroll hidden; scroll-snap-type: x mandatory; -ms-overflow-style: none; overflow: -moz-scrollbars-none;}
#Faq .Pap .car::-webkit-scrollbar {display: none;}
#Faq .Pap .car>img{ width:368px; height: 368px; scroll-snap-align: start; margin: 0 24px 0 0;}
#Faq .grabbing {cursor: grabbing;}
#Faq .RT>div strong { font-family: 'SFR-Bold';}
#Faq .RT>div b { font-family: 'SFR-Bold';}
#Faq .RT>div a[class^="btn"] { color: #fff; width:fit-content; }
#Faq .RT>div a.link { color: var(--clr-sfr2); }

#Faq .Fdctim b{font-size:14px;}
#Faq ol { list-style:none;margin: 16px 28px 0 0;}
#Faq ol li{margin:0 0 16px 28px;position:relative;}
#Faq ol li:before{background:#D90D25;display:flex;justify-content:center;width:20px;height:20px;border-radius:50%;font-family:'SFR-Bold';position:absolute;margin: 0 0 0 -28px;color:#fff;}
#Faq ol li:nth-child(1):before{content:'1';}
#Faq ol li:nth-child(2):before{content:'2';}
#Faq ol li:nth-child(3):before{content:'3';}
#Faq ol li:nth-child(4):before{content:'4';}
#Faq ol li:nth-child(5):before{content:'5';}
#Faq ol li:nth-child(6):before{content:'6';}
#Faq ol li:nth-child(7):before{content:'7';}
#Faq ol li:nth-child(8):before{content:'8';}
#Faq ol li:nth-child(9):before{content:'9';}
#Faq ol li:nth-child(10):before{content:'10';}
#Faq ol li:nth-child(11):before{content:'11';}
#Faq ol li:nth-child(12):before{content:'12';}
#Faq ol li:nth-child(13):before{content:'13';}
#Faq ol li:nth-child(14):before{content:'14';}
#Faq ol li:nth-child(15):before{content:'15';}
#Faq ol li:nth-child(16):before{content:'16';}
#Faq ol li:nth-child(17):before{content:'17';}
#Faq ol li:nth-child(19):before{content:'19';}
#Faq ol li:nth-child(20):before{content:'20';}
#Faq ol li:nth-child(21):before{content:'21';}
#Faq ol li:nth-child(22):before{content:'22';}
#Faq ol li:nth-child(23):before{content:'23';}
#Faq ol li:nth-child(24):before{content:'24';}
#Faq ol li:nth-child(25):before{content:'25';}

#Faq ol li>strong { font-family:'SFR-Bold'; }
#Faq .Fdctim > img {width:100%;}

#Faq .Puces { position: relative; }
#Faq .Puces h2 { width:calc(100% - 226px); }
#Faq .Puces .tr { font-family: 'SFR-Bold'; position: absolute; right: 24px; top: 40px; }
#Faq .Puces .tr strong { position: relative; font-size: 14px; display: inline-block; vertical-align: top;}
#Faq .Puces .tr strong.mins {margin: 0 35px 0 0;}
#Faq .Puces .tr strong.mins:before{ background-image: url(https://static.s-sfr.fr/assets/pictos/chrono_fast_40_rouge.svg); }
#Faq .Puces .tr strong.steps:before{ background-image: url(https://static.s-sfr.fr/assets/pictos/hors_jeu_40_rouge.svg); }
#Faq .Puces .tr strong:before { content: ''; position: absolute; left: -27px; top: 0; width : 24px; height: 24px; background-size: contain;}
#Faq .Puces .p { margin: 0 0 32px 0; }
#Faq .Puces .p strong { font-family: 'SFR-Bold'; font-size: 14px; }
#Faq .Puces .p i { color: var(--clr-grey); font-size: 12px; margin: 16px 0; display: block; }

#Faq .Video>video { width: 100%; }
#Faq .Podcast>audio { width: 100%; }

#Faq > .R > .message { margin: 0 0 40px 0; }
#Faq > .R .plart{margin-top:40px;}
     
#Faq section article{margin:0;width:100%;}
#Faq > .R .C > .b .R >div{opacity:1;}
#Faq > .R .C > .b .R >div:last-child{width:100%;justify-content:center;display:flex;gap:8px;margin-top:24px;}
#Faq > .R .C > .b .R .fleche{border: 1px solid #000;padding: 8px;border-radius: 8px;width: 40px;height: 40px;}
#Faq > .R .C > .b .R .fleche.disabled{border: 1px solid #D2D2D2;}
#Faq > .R .C > .b .R .fleche svg{width:24px;height:24px;margin:auto; fill:#181818;cursor:pointer;}
#Faq > .R .C > .b .R .fleche.left{transform: rotate(180deg);}
#Faq > .R .C > .b .R .fleche.disabled svg{fill:#D2D2D2;cursor:auto;}

#Faq .message a.tert { position: absolute; left: 73px; bottom: 18px; }
#Faq .message.i ul li:before { background-color: #4C89FF; }
#Faq .message.flag { border:1px solid #d2d2d2; margin: 0 0 24px 0;}
#Faq .message.flag ul li:before { background-color: var(--clr-sfr2); }
#Faq .message.flag:before { content: ''; background-image: url(https://static.s-sfr.fr/assets/pictos/hors_jeu_40_rouge.svg); background-size: cover; }
#Faq .message strong { font-family: 'SFR-Bold'; }
#Faq .link:after{top:unset;bottom:4px;}

#Faq .Dow a { position: relative; font-family: 'SFR-Bold'; display: block; color: #fff; background: var(--clr-black); margin: 0 0 16px 0; padding: 16px 48px 16px 24px; border-radius: 8px; text-decoration: none; }
#Faq .Dow a:after { content: ''; background-image: url(https://static.s-sfr.fr/assets/pictos/televerser_40_blanc.svg); height: 16px; width: 16px; position: absolute; right: 24px; top: 50%; transform: translateY(-50%); background-size: cover; }

#Faq #Step { position: relative; }
#Faq #Step strong { font-family: 'SFR-Bold'; font-size 14px; }
#Faq #Step ul { columns: 2; margin: 16px 11px; font-size: 12px;}
#Faq #Step i { display: block; font-size: 12px; color: var(--clr-grey); margin: 0 0 16px 0; }

#Faq #Step h2 { width: calc(100% - 220px); }
#Faq #Step .inf { position: absolute; top: 36px; right: 24px; font-family: 'SFR-Bold'; }
#Faq #Step .inf span { position: relative; display: inline-block; vertical-align: middle; margin: 0 0 0 28px; }
#Faq #Step .inf span:before { content: ''; width: 16px; height: 16px; background-size:cover; position: absolute; left: -20px; top: 3px; }
#Faq #Step .inf span:nth-child(1):before { background-image: url(https://static.s-sfr.fr/assets/pictos/chrono_40_rouge.svg); }
#Faq #Step .inf span:nth-child(2):before { background-image: url(https://static.s-sfr.fr/assets/pictos/Actus_40_rouge.svg); }

#Faq .Ill img { max-width: 100%; margin: 0 0 40px 0;}

#Faq .Entrees.nm>div { margin: 0; }
#Faq .Entrees>div { margin: 0 0 64px 0; }
#Faq .Entrees>div a:not(.btn4) { display: block; position: relative; font-family: 'SFR-Bold'; text-decoration: none; padding: 16px 0 16px 32px; border-bottom: 1px solid var(--clr-bg); transition: all .2s ease-out;}
#Faq .Entrees>div a:hover { color: var(--clr-sfr2); }
#Faq .Entrees>div a:before { content: ''; width: 24px; height: 24px; background-image: url(https://static.s-sfr.fr/assets/pictos/fleche_DROITE_40_rouge.svg); background-size: contain; background-position: center center; display: block; position: absolute; left: 0; top: 15px; transition: left .4s ease-out; }
#Faq .Entrees>div a:hover:before { left: 4px; }
#Faq .Entrees>div .faqmore { display: none; }
#Faq .Entrees>div label[for^="morefaq"] { position: absolute; bottom: 24px; }
#Faq .Entrees>div label .btn4{display:block;position:relative;font-family:SFR-Bold;font-size:14px;line-height:16px;padding:12px 24px;text-align:center;width:100%;border-radius:8px;cursor:pointer;overflow:hidden;text-decoration:none;transition: box-shadow .2s cubic-bezier(.4,0,.2,1);user-select:none;-webkit-user-select:nonecolor:var(--clr-black);border:solid 1px var(--clr-black);box-shadow:0 0 12px rgba(24,24,24,0.16)}
#Faq .Entrees>div label .btn4:hover { box-shadow:0 4px 12px rgba(24,24,24,0.32) }
#Faq .Entrees>div [id^="morefaq"] + label .m { display: none; }
#Faq .Entrees>div [id^="morefaq"]:checked + label .m { display: block; }
#Faq .Entrees>div [id^="morefaq"]:checked + label .p { display: none; }
#Faq .Entrees>div [id^="morefaq"]:checked + label + .faqmore { display: block; }
#Faq > .R .C > div{font-size:14px;}
#Faq > .R .C > .link{color: var(--clr-sfr2);}
#Faq .Puces#avant .p{margin:0;}
#Faq > .R > h1 + .SCP{margin-top:40px;}
#Faq .message a{font-family:'SFR-Bold';}
#Faq .Entrees>div a:not(.btn4):last-child{border:0;}
#Faq .btn2, #Faq .btn{color:#fff;}

#Faq .sli .slider { scroll-behavior: smooth;  overflow: scroll hidden; scroll-snap-type: x mandatory;white-space: nowrap;height:fit-content;}
#Faq .sli .slider::-webkit-scrollbar { display: none;}
#Faq .sli .slider > div{width: 100%; scroll-snap-align: start; margin: 0 24px 0 0;display:inline-flex;align-items:flex-start;justify-content:center;gap:24px;}
#Faq .sli .slider > div p{white-space:initial;flex:1;}
#Faq .sli .slider > div img{flex:1;max-width:50%}
#Faq .sli .fle{width: 10px; height: 10px; border: 1.5px solid #000; border-radius: 1px 1px 1px; border-top: 0; border-left: 0; transform: rotate(135deg); transition: transform 0.3s; position: relative;cursor:pointer;}
#Faq .sli .fle:after{content:'';width: 21px; height: 21px; display: block; position: absolute;top: 50%; left: 50%; transform: translate(-50%,-50%);}
#Faq .sli .fle.r{transform: rotate(-45deg);}
#Faq .sli .scrollPoints{display:flex;justify-content:center; gap:16px;margin-top:16px;}
#Faq .sli .scrollPoints .scrollPts{display:flex;gap:16px;justify-content:center;}
#Faq .sli .scrollPoints .scrollPts label{width:8px;height:8px;border-radius:100%;background:var(--clr-disable);display:block;position:relative;cursor:pointer;transition:all .3s;}
#Faq .sli .scrollPoints .scrollPts label:after{content:'';width: 16px; height: 16px; display: block; position: absolute;top: 50%; left: 50%; transform: translate(-50%,-50%);}
#Faq .sli .scrollPoints .scrollPts input[type="radio"]:checked + label{background:var(--clr-black);transform:scale(1.5);}

.huge{width:100vw;height:100%;position:fixed;z-index:550000; justify-content:center;align-items:center;background:#000000a8;top:0;left:0;}
.huge > img{ max-width: 1280px; margin: 24px auto; display: block;max-height:calc(100% - 48px);}
.huge > div:first-of-type{width:65px;height:65px;position:absolute;right:24px;top:24px;background:#D90D25;border-radius:8px;padding:16px;display:flex;align-items:center;justify-content:center;cursor:pointer;}
.huge > div .cross{height:auto;width:40px;}
.huge .close{width:100vw;height:100vh;z-index:550000;position:absolute;top:0;left:0;cursor:pointer;}

.btn-rate-mobile {display: block;}
.rating-bloc .btn-container { display: flex; align-items: center; justify-content: center; }
.rating-bloc .btn-rate-mobile { margin: 10px 0; }
.btn-rate-mobile { display: block; text-align: center; line-height: 46px;}
.rating-bloc .btn-M { width: 116px; height: 44px; font-family: 'SFR-regular'; }
.grey-btn { background: #cdcdcd; }

.C .gc { position: relative; margin: 24px 0;}
.C .gc input[type="radio"] { display: none; }
.C .gc input[type="radio"] + label { position: absolute; top: 0; left: 0; display: inline-block; text-align: center; font-family: 'SFR-Bold'; font-size: 14px; background: #fff; z-index:55; line-height: 16px; padding: 11px 24px; border: 1px solid #d2d2d2; cursor: pointer; border-top-left-radius: 8px; border-bottom-left-radius: 8px; height: auto;width: 50%; }
.C .gc input[type="radio"] + label:last-of-type { right: 0; left: auto; margin: 0 0 16px -5px;border-radius: 0 8px 8px 0; border-left: 0; }
.C .gc input[type="radio"]:checked + label {color: #fff;background: #181818; border: solid 1px #181818; cursor: default;}
.C .gc input[type="radio"] + label + div { display: none;}
.C .gc input[type="radio"]:checked + label + div { display: flex;}
.C .gc .b { padding: 64px 0 0 0; position: relative; width:100%;display: flex;gap:24px;}
.C .gc .b>div{ width:calc(50% - 12px); }
.C .gc .b>.L{ min-width:300px ;position:relative;height:fit-content; }
.C .gc .b>.L>img{ width:100%;height:auto; }
.C .gc .b>.R { background: #F2F2F2;box-shadow: 0px 0px 24px 4px rgba(0, 0, 0, 0.04);border-radius: 8px;padding: 40px 32px 82px 32px;height:fit-content; min-height:500px;position:relative}
.C .gc .b>.R article { display: none; }
.C .gc .b>.R article.show { display: block; }
.C section article{margin:0;width:100%;}
.C .gc .b .R >div{opacity:1;}
.C .gc .b .R >div:last-child{justify-content:center;display:flex;gap:8px;position: absolute; width: fit-content; bottom: 24px;left: calc(50% - 44px);}
.C .gc .b .R .fleche{border: 1px solid #000;padding: 8px;border-radius: 8px;width: 40px;height: 40px;}
.C .gc .b .R .fleche.disabled{border: 1px solid #D2D2D2;}
.C .gc .b .R .fleche svg{width:24px;height:24px;margin:auto; fill:#181818;cursor:pointer;}
.C .gc .b .R .fleche.left{transform: rotate(180deg);}
.C .gc .b .R .fleche.disabled svg{fill:#D2D2D2;cursor:auto;}

.toggle { position: relative; margin: 24px 0; }
.toggle input[type="radio"]{ display: none; }
.toggle input[type="radio"] + label { position: absolute; top: 0; left: 0; display: inline-block; text-align: center; font-family: 'SFR-Bold'; font-size: 14px; background: #fff; z-index:55; line-height: 16px; padding: 11px 24px; border: 1px solid #d2d2d2; cursor: pointer; border-top-left-radius: 8px; border-bottom-left-radius: 8px; height: auto;width: 50%; }
.toggle input[type="radio"] + label:last-of-type { right: 0; left: auto; margin: 0 0 16px -5px;border-radius: 0 8px 8px 0; border-left: 0; }
.toggle input[type="radio"]:checked + label {color: #fff;background: #181818; border: solid 1px #181818; cursor: default;}
.toggle input[type="radio"] + label + div { display: none;}
.toggle input[type="radio"]:checked + label + div { display: block; position: relative; padding: 64px 0 0 0; }
.toggle input[type="radio"]:checked + label + div>img { width: 100%;}

#Rank { text-align: center; transition: all .4s ease-out; }
#Rank.bye { opacity: 0; }
#Rank>strong{ font-family: 'SFR-Bold'; font-size: 24px;}
#Rank>a{color: #fff;width:fit-content; margin: 0 auto;}
#Rank>.stars { margin: 16px 0; }
#Rank>.stars>label{ cursor: pointer; margin: 0 8px; }
#Rank>.stars>input:checked+label>.star { filter: invert(69%) sepia(37%) saturate(1472%) hue-rotate(0deg) brightness(111%) contrast(108%); background-image: url(https://static.s-sfr.fr/assets/pictos/étoile_plein_40_noir.svg) }
#Rank>.stars>input:checked+label>.star path { fill: transparent; }
#Rank>.stars>label .star:hover{ transition: all .2s ease-out; }
#Rank>.stars:hover>label .star{ filter: invert(69%) sepia(37%) saturate(1472%) hue-rotate(0deg) brightness(111%) contrast(108%); background-image: url(https://static.s-sfr.fr/assets/pictos/étoile_plein_40_noir.svg); }
#Rank>.stars:hover>label .star path{ fill: transparent; }
#Rank>.stars label.p .star { filter: invert(69%) sepia(37%) saturate(1472%) hue-rotate(0deg) brightness(111%) contrast(108%); background-image: url(https://static.s-sfr.fr/assets/pictos/étoile_plein_40_noir.svg)     }
#Rank>.stars label.p .star path { fill: transparent; }
#Rank>.stars>label:hover ~ label>.star{ background-image: url(https://static.s-sfr.fr/assets/pictos/etoile_40_noir.svg); }
#Rank>.stars .starform { width: 300px; margin: 0 auto; text-align: left; display: none;}
#Rank>.stars .starform label { font-size:14px; color: var(--clr-grey); display: block; }
#Rank>.stars .starform input { display: block; width: 100%; border: 1px solid var(--clr-grey); padding: 8px; font-size: 14px; }
#Faq > .R #Rank > p {margin-bottom:0;}

#Faq>.R>#Plus.C { background-color: transparent; padding: 0;}
#Plus strong { display: block; font-family: 'SFR-Bold'; font-size: 24px; padding:0 0 24px 0; border-bottom: 1px solid var(--clr-disable); }
#Plus>a { display: block; font-family: 'SFR-Bold'; text-decoration: none; position: relative; padding: 16px 0; line-height: 28px; border-bottom: 1px solid var(--clr-disable); padding-right:56px;}
#Plus>a:last-child { border: 0; }
#Plus>a:after { content: ''; transition: right .4s ease-out; position: absolute; right: 8px; border-radius: 8px; width: 40px; height: 40px; background-color: var(--clr-sfr2); background-image: url(https://static.s-sfr.fr/assets/pictos/fleche_DROITE_40_blanc.svg); background-size: 50%; background-position: center; background-repeat: no-repeat; box-shadow: 0px 4px 8px 4px rgba(150, 0, 0, 0.16); top: 10px; }
#Plus>a:hover:after { right: 0; }

#Wizard { max-width: 1536px; min-height: 602px; background-color: var(--clr-sfr2); margin: 0 auto 40px auto; position: relative; background:url(https://static.s-sfr.fr/assistancewiz-min.webp); background-size: cover; background-repeat:no-repeat; }
#Wizard .R { z-index:1; margin: 0 0 0 auto; width: 50%; height: 100%; background-color: #c00404cc; padding: 64px; scroll-margin-top: 400px; position: absolute; right: 0;}
#Wizard .R h1 { color: #fff; margin: 0 0 16px 0; font-size: 32px; display: block;}
#Wizard .R>span { color: #fff; font-size: 14px; display: block; margin: 0 0 8px 0; }
#Wizard .R>div>.link { padding: 0 0 0 13px; text-decoration: none; }
#Wizard .R>div>.link:after { left: 0; right: auto; transform: rotate(220deg); }
#Wizard .R>div>.link:hover:after{ left: -3px; }
#Wizard .R .elem { overflow-y: auto; max-height: 382px; padding: 0 0 24px 0; }
#Wizard .R .elem.tile { display: flex; justify-content: flex-start; gap: 16px; flex-wrap: wrap;}
#Wizard .R .elem.tile .Q { width: calc(50% - 16px); text-align: center; padding: 8px;margin:0;}
#Wizard .R .elem.tile .Q img { height: 100px; display: block; margin: 0 auto 16px auto; transition: transform .2s ease-out;}
#Wizard .R .elem.tile .Q:hover img { transform: scale(1.1); }
#Wizard .R .elem.tile .Q:after { display:none;}
#Wizard .R .elem .Q { display: block; padding: 24px 56px 24px 24px; background: #fff; margin: 0 0 16px 0; border-radius: 8px; position: relative; cursor: pointer; line-height: 1; color: var(--clr-black); text-decoration: none; }
#Wizard .R .elem .Q:after { content:''; background-image:url(https://static.s-sfr.fr/assets/pictos/chevron_droite_40_rouge.svg); width: 16px; height: 16px; position: absolute; background-size: contain; top: calc(50% - 8px); right: 24px; transition: transform .2s ease-out; }
#Wizard .R .elem .Q:hover:after { transform: translateX(8px); }
#Wizard .R .elem .Q>strong{ font-family: 'SFR-Bold'; line-height: 24px; }
#Wizard .R { padding: 40px; }
#Wizard .R.o>div { background: #fff; padding: 24px; border-radius: 12px; /*min-height: 100%;*/ /*height: fit-content;*/ height: 100%; overflow: hidden; }
#Wizard .R.o>div>strong { color: var(--clr-black); display: block; font: normal 32px/38px SFR-Bold; margin: 16px 0; }
#Wizard .R.o>div .Q { border: 1px solid var(--clr-disable); padding: 8px 24px; }

#Wizard [id^="A"] { display: none; }
/*#Wizard #Z0:target { display: block; }*/
#Wizard [id^="A"]:target { display: block;}
#Wizard [id^="A"]:target ~ #Z0{ display: none;}

#Sujets { max-width: 1280px; margin: 0 auto; padding: 16px 0; width: calc(100% - 32px); }
#Sujets h2 { margin: 0 0 24px 0; }
#Sujets .sub { display: flex; gap: 20px; flex-wrap: wrap; justify-content: space-between;}
#Sujets .s { height: 233px; width: calc((100% / 4) - 16px); background: #000; border-radius: 8px; cursor: pointer; background-size: cover; background-position: center center; background-repeat:no-repeat; position: relative; overflow: hidden; transition: transform .4s ease-in-out; }
#Sujets .s:after { content: ''; height: 70px; width: 100%; position: absolute; left: 0; right: 0; margin: auto; background: #fff; bottom: 0; box-shadow: 0px 20px 0 20px #fff;}
#Sujets .s a { color: #000; font-family: 'SFR-Bold'; font-size: 14px; position: absolute; bottom: 0; left: 0; right: 0; margin: auto; z-index:1; line-height: 70px; text-align: center; text-decoration: none; }
#Sujets .s a:after { content: ''; width: 100%; height: 233px; position: absolute; bottom:0; left: 0;}
#Sujets .s:hover { transform: scale(1.03);}

#Info { max-width: 1280px; padding: 24px 40px; background-color: #fff; margin: 40px auto; border-radius: 8px; }
#Info .esca { width: fit-content; margin: 0 auto; }
#Info .esca>div { display: inline-block; vertical-align: middle; margin: 0 12px; }
#Info .esca strong { font-size: 24px; font-family: 'SFR-Bold'; color: var(--clr-black);;}
#Info .esca p { font-size: 12px; color: var(--clr-black); }
#Info .esca p>a { font-size: 12px; color: var(--clr-black); text-decoration: none; }

#Apps { background-color: var(--clr-black); padding: 24px 16px; text-align: center; }
#Apps strong { font-family: 'SFR-Bold'; color: #fff; font-size: 24px; }
#Apps>div { display:inline-block; vertical-align: middle; margin: 0 16px;}
#Apps>div>a { margin: 0 8px;}

.C.DT > div{display:flex;gap:24px;}
.C.DT > div:not(:last-of-type){margin-bottom:24px;}
.C.DT > div p, .C.DT > div img{flex:1;height:fit-content;}
.C.DT > div img{max-width:50%;margin: 0 auto;}
.C.DT > div:nth-child(2n) img { order: 1; }
.C.DT > div:nth-child(2n) p{order:2;}

    @media all and (max-width: 1100px) {
        #FilAriane { padding: 24px 0 0 0;}
        
        #Faq { width: calc(100% - 32px); gap: 24px;}
        #Faq > .R .C > .b > .R{display:none;}
        #Faq > .R .C > .b > .L{max-width:none;width: 100%;}
        #Faq > .L h3{font-size:21px;position:relative;padding: 24px 24px 24px 24px;}
        #Faq > .L h3:before:hover{background:#fff;color:#000;}
        #Faq > .L strong { font-size:16px; padding: 16px;}
        #Faq > .L .menuctx { padding: 16px; }
        .fw-facture > img{width:70%;height:auto;}
        #Faq > .R > .C.Puces  ul > li:nth-child(1), #Faq > .R > .C.Puces  ul > li:nth-child(2){margin-right:24px;}
        [id^="Test"] .gc input[type="radio"]:checked + label + div{flex-direction:column;}
        [id^="Test"] p +.gc > div{flex-direction:column;}
        [id^="Test"] .gc .b>.R{width:100%;}
        [id^="Test"] .gc .b>.L{width:100%;}
        #Faq .message a.tert:after{top:0;bottom:0;}
        .C.DT > div{flex-direction:column;}
        .C.DT > div img{order:1;}
        .C.DT > div p{order:2;}
        #Faq .sli .slider > div{flex-direction:column;align-items:center;}
        #Faq .sli .slider > div img{ max-width: none; width: 100%; }
        
        #Wizard { max-width: none; height: 570px; /* background-image: url(https://static.s-sfr.fr/sfrassistancemob.webp);*/ background-size: cover; background-position: center -120px; /*background-color: rgba(226, 0, 0, 0.8); background-image: linear-gradient(360deg, var(--clr-sfr) 70%, rgba(97, 91, 91, 0) 95%), url(https://static.s-sfr.fr/sfrassistancemob.webp);*/ background-color: var(--clr-sfr); background-image: url(https://static.s-sfr.fr/sfrassistancemob.webp);}
        #Wizard .R { width: 100%; padding: 16px; height: 416px; bottom: 0; background-color: var(--clr-sfr); }
        #Wizard .R h1 { font-size: 24px; font-family: 'SFR-Bold'; line-height: normal;}
        #Wizard .R .elem .Q { padding: 16px 32px 16px 16px; }
        #Wizard .R .elem .Q:after { right: 16px; }
        #Wizard .R .elem .Q>strong { font-size: 14px; line-height: normal; }
        
        #Wizard .R.o { top: 0; height: 100%; padding: 0; border-radius:0;}
        #Wizard .R.o>div { border-radius: 0; padding: 16px;}
        #Wizard .R.o>div .Q { padding: 16px 24px 16px 16px; }
        
        
        #Sujets h2 {margin: 0 8px 24px 8px; }
        #Sujets .sub { justify-content: space-around; }
        #Sujets .s { width: calc((100% / 2) - 16px); }
    }
    @media all and (max-width: 768px) {
        #Faq{flex-direction:column; padding: 150px 0 0 0;position:relative;}
        #Faq > .L, #Faq > .R{width:100%;}
        .fw-facture > img{width:85%;height:auto;}
        #Faq > .R .C > .b > .L{min-width:0;width:100%;}
        #Faq > .R .C{padding:24px 16px;}
        #Faq .message a.tert { left: 16px; bottom: 12px; }
        #Faq .Puces .tr{position: static; margin: 16px 0px 16px 24px;}
        #Faq > .R .C h2{width:100%;padding:0;}
        #Faq .message.flag{ gap: 8px;}
        #Faq .message.flag p{padding-left:48px;}
        #Faq .message.flag:before{left:18px;bottom:95px;}
        
        #Faq > .L strong { font-size: 16px; padding: 16px 148px 16px 16px; }
        /*#Faq > .L{border-radius:0;left:0;position:absolute;top:130px;z-index:44001;height:fit-content;}*/
        #Faq > .L{ border-radius: 0; left: -16px; position: absolute; top: 27px; z-index: 44001; height: fit-content; right: 0; margin: auto; width: calc(100% + 32px);}
        #Faq > .L .menuctx{display:none;}
        #Faq > .L .menuctx:last-of-type{border-bottom:1px solid #d2d2d2;}
        #Faq > .L h3{font-size:16px;padding: 16px 128px 16px 16px;}
        #Faq .Entrees>div label[for^="morefaq"]{width:calc(100% - 32px);}
        #Faq > .L .ctaMenu{display:block;position:absolute;top:7px;right:24px;padding: 8px 0; border-radius: 8px; border: 1px solid #fff;color:#fff;font-family:'SFR-Bold';width: 118px;text-align: center;}
        #Faq > .L #Ccm1:checked ~ .menuctx{display:flex;}
        #Faq>.L #Ccm1:not(:checked)+label~*{display: none}
        body.hSc #Faq > .L{position:fixed;top:52px; left: 0; right: 0; width: 100%;}
        #Faq .Pap .sli button{width:30px;height:30px;}
        #Faq .Pap .sli button svg{width:16px;height:16px;}
        .C.DT > div:not(:last-of-type){margin-bottom:16px;}
        .C.DT > div img{max-width:none;width:100%;}
        #Faq .sli .slider > div img{max-width:100%}
        #Faq .Pap .car>img { width: 100%; height: auto; }
        
        #Wizard { min-height: 570px; height: calc(100vh - 108px); background-size: contain; background-position: top;}
        #Wizard .R { height: calc((100vh - 108px) / 1.4); min-height: 416px; }
        #Wizard .R .elem { max-height: calc(100% - 108px); }
        
        #Sujets { width: 100%;}
        #Sujets .s { width: calc(100% - 16px); }
        
        .C .gc input[type="radio"]:checked + label + div { display: block;}
        .C .gc .b { display: block; }
        .C .gc .b>.R { width: auto; }
        .C .gc .b>.L { width: auto; }
    }