@font-face{font-family:'RMC-Regular';src:url("//static.s-sfr.fr/img/RMC.woff2")}
@font-face{font-family:'RMC-Bold';src:url("//static.s-sfr.fr/img/RMC-Bold.woff2")format("woff2")}
a,article,audio,b,body,del,details,div,em,fieldset,figcaption,figure,footer,form,header,html,i,iframe,img,input,label,legend,li,menu,nav,ol,p,pre,section,small,span,strong,sub,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,video{margin:0;padding:0;border:0;font-size:100%;background:transparent;box-sizing:border-box;font-style:normal}
b,strong{font-family:Arial,sans-serif;font-weight:700}
button {border:none;margin:0;text-decoration:none;-webkit-appearance:none;-moz-appearance:none;background:transparent;}
h1{display:block;font:700 40px/48px RMC-Bold;margin:0}
h2{display:block;font:700 26px RMC-Bold;margin:0 0 20px 0}
h3,h4{display:block;font:700 15px Arial,sans-serif;margin:0 0 6px 0}
body{font-family:Arial;color:var(--clr-black);background:var(--clr-bg);}
input::placeholder{color:var(--clr-grey)}
button:focus-visible, 
input:focus-visible, 
input[type="radio"]:focus-visible + label, 
input[type="checkbox"]:focus-visible + label:before,
span[role="button"]:focus-visible,
[tabindex="0"]:focus-visible,
textarea:focus-visible, 
summary:focus-visible,
a:focus-visible {outline: 2px solid var(--clr-black);outline-offset: 2px;}
[role="tooltip"] a:focus-visible {outline: 2px solid #fff;outline-offset: 2px}
:root{
    --clr-rmc:#233C82;
    --clr-rmc2:#3B2E9E;
    --clr-black:#1A1A1A;
    --clr-bg:#F7F7F7;
    --clr-disable:#A0A0AB;
    --clr-grey:#70707B;
    --clr-green:#098937;
    --clr-yellow:#fac515;
    --clr-error:#DE3024;
    --clr-event:#DCB253;
}

a[class^="btn"],input[class^="btn"],button[class^="btn"]{display:block;position:relative;font:700 14px Arial,sans-serif;padding:12px 20px;text-align:center;cursor:pointer;overflow:hidden;text-decoration:none;user-select:none;-webkit-user-select:none;transition:background-color .3s ease-out}
a[class^="btn"]:hover,input[class^="btn"]:hover,button[class^="btn"]:hover{background-color:var(--clr-rmc);}
.btn{color:#fff;background-color:var(--clr-rmc)}
a.btn:hover,input.btn:hover,button.btn:hover{background-color:var(--clr-rmc);}
a.btn2:hover,input.btn2:hover,button.btn2:hover{background-color:#3F3F46;}
a.btn3:hover,input.btn3:hover,button.btn3:hover{background-color:var(--clr-black);color:#fff;}
a.btn4:hover,input.btn4:hover,button.btn4:hover{color:#2c4a9c;border:solid 1px #3F3F46;background: unset;}
a.btn5:hover,input.btn5:hover,button.btn5:hover{color:#d1d1d6;border:solid 1px #d1d1d6;background: transparent;}
a.btn6:hover,input.btn6:hover,button.btn6:hover{color:#d1d1d6;border:solid 1px #d1d1d6;background: transparent;}
.btn2{color:#fff;background:var(--clr-black)}
.btn3{color:var(--clr-black);background:#fff}
.btn4{color:var(--clr-rmc);border:solid 1px var(--clr-rmc)}
.btn5{color:#fff;background:var(--clr-black);border:solid 1px #fff;}
.btn6{color:#fff;border:solid 1px #fff}
.btn:disabled,.btn2:disabled,.btn3:disabled{color:#A0A0AB;background-color:#E4E4E7;pointer-events: none;}
.btn4:disabled,.btn5:disabled{color:var(--clr-grey);border-color:var(--clr-grey);pointer-events: none;}
.btn[disabled],.btn2[disabled],.btn3[disabled]{color:#A0A0AB;background-color:#E4E4E7;pointer-events: none;}
.btn4[disabled],.btn5[disabled]{color:var(--clr-grey);border-color:var(--clr-grey);pointer-events: none;}
a[class^="btn"].loader,input[class^="btn"].loader{background:var(--clr-disable);border:var(--clr-disable);cursor:default}
a[class^="btn"].loader:before,input[class^="btn"].loader:before{content:'';position:absolute;width:100%;height:100%;background:var(--clr-disable);left:0;top:0}
.loader:after{content:"";position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;height:16px;width:16px;color:var(--clr-rmc);display:inline-block;border:2px solid;border-radius:50%;border-top-color:transparent;animation:rotate 1s linear infinite}
@keyframes rotate{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}

button[class^="link"],a[class^="link"]{position:relative;font:700 14px Arial,sans-serif;padding:0;cursor:pointer}
/* button[class^="link"]:after,a[class^="link"]:after{content:'';position:absolute;width:8px;height:8px;right:1px;top:0;bottom:0;margin:auto;border-radius:2px;border:2px solid;border-left:0;border-bottom:0;transform:rotate(45deg);transition:all .2s cubic-bezier(.4,0,.2,1)}
button[class^="link"]:hover:after,a[class^="link"]:hover:after{right:-3px} */
/* button[class^="link"].l, a[class^="link"].l {padding: 2px 0 2px 14px; margin: 0 24px 0 0;}
button[class^="link"].l:after, a[class^="link"].l:after {transform: rotate(225deg);left: 1px;right: auto;}
button[class^="link"].l:hover:after, a[class^="link"].l:hover:after {left: -3px;} */
button[class^="link"]{border:0;background:transparent;cursor:pointer}
sup { font-size: 73%; }

span.error,p.error{color:var(--clr-error)}
.link{color:var(--clr-rmc);text-decoration:none}
.link2{color:var(--clr-black);text-decoration:none}
.link3{color:#fff;text-decoration:none}
.link.u{color:var(--clr-rmc);text-decoration:underline;padding:0}
.link.u:after{content:none}
.link.cta{position:relative;padding:12px 0 12px 22px}
.link.cta:after{content:'';position:absolute;width:8px;height:8px;top:-1px;bottom:0;left:0;margin:auto;border:3px solid;border-left:0;border-bottom:0;transform:rotate(45deg);transition:all .2s cubic-bezier(.4,0,.2,1)}
.link.cta:hover:after{left: 2px}

.price {position:relative;display: flex;flex-flow: wrap;align-items: baseline;font:700 24px/29px Arial,sans-serif;text-align:left}
.price .L {margin:0;}
.price .R:last-of-type{font:700 14px/14px Arial,sans-serif}
.price .o {font:normal 14px/20px Arial,sans-serif;display:inline-block;margin-left:4px;position:relative}
.price .o:after {content: '';width:calc(100% - 8px);height:1px;background: var(--clr-black);position:absolute;left:0;top:9px}
.price > .o {width:100%;margin:0;text-decoration:line-through;}
.price > .o:after {display:none;}

.message{position:relative;display:grid;padding: 24px 24px 24px 72px;gap:16px;width: 100%;overflow:hidden;font:normal 14px/22px Arial,sans-serif}
.message:before{position:absolute;content:"";top:24px;left:24px;margin: auto;width:24px;height:24px}
.message:after{position:absolute;content:"";top:0;left:0px;width:4px;height:100%}
.message.ko{background:#FFF0F0}
.message.ko:before{background: url(//static.s-sfr.fr/assets/pictos/croix_cercle_40_rouge.svg) center/contain}
.message.ko:after{background:#D90D25}
.message.ok{background:#E8F8F0}
.message.ok:before{background:url(//static.s-sfr.fr/assets/pictos/check_circle_40_vert.svg) center/contain}
.message.ok:after{background:var(--clr-green)}
.message.wa{background:#FFF4E0}
.message.wa:before{background:url(//static.s-sfr.fr/assets/pictos/alerte_40_orange.svg) center/contain}
.message.wa:after{background:#E26C00}
.message.i{background:#ECF2FF}
.message.i:before{background:url(//static.s-sfr.fr/assets/pictos/information_bleu.svg) center/contain}
.message.i:after{background:#6172F3}
.message.tr{background:transparent;border:1px solid #70707B}
.message.tr:before{background:url(https://static.s-sfr.fr/assets/pictos/hors_jeu_40_rouge.svg) center/contain}
.message.tr:after{background:#70707B}

.message ul{list-style:none;font-size:14px;margin: 0 0 0 16px;}
.message li{margin:0 0 8px 0;}
.message li:before{content: '';position: absolute;width:8px;height:8px;margin:7px 0 0 -16px}
.message.i li:before{background: #6172F3}
.message.wa li:before{background:#E26C00}
.message.ko li:before{background:var(--clr-rmc)}
.message.ok li:before{background:var(--clr-green)}

details.faq > summary{list-style-type:none;padding: 0 24px 0 0;cursor:pointer}
details.faq > summary>*{font:700 16px/24px Arial,sans-serif}
details.faq > summary::-webkit-details-marker{display:none}
details.faq{position: relative;overflow:hidden;background-color:#fff;margin:0 0 24px 0;padding:24px}
details.faq:last-child {margin:0}
details.faq summary:after{content:'';position:absolute;width:8px;height:8px;border:2px solid var(--clr-black);transform:rotate(45deg);top:29px;right:26px;border-top:0;border-left:0;transition:all 0.2s ease-out}
details.faq[open] summary:after{transform:rotate(225deg)}
details.faq>div{font-size:14px;margin:24px 0 0 0;list-style:inside}
details.faq> p:not(:last-child){margin: 0 0 16px 0}
details.faq>div a{text-decoration:underline}

.hid{border:0;clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;width:1px;margin:0 -1px -1px 0;overflow:hidden;padding:0;position:absolute}
#FilAriane{width:1280px;max-width:calc(100% - 32px);margin:16px auto 24px;text-align:left}
#FilAriane ol{list-style:none;font-size:0}
#FilAriane li{display:inline-block;position:relative;margin: 0 13px 0 0;font:12px/normal Arial,sans-serif}
/*#FilAriane li:not([aria-current="page"]):after{ content:'/'; display:block; position:absolute; top:0px;right: -10px;}*/
#FilAriane li:not([aria-current="page"]):after { content: ''; display: block; position: absolute; top: 1px; right: -10px; width: 1.2px; height: 14px; background: black; transform: rotate(15deg); right: -8px; }
#FilAriane a{text-decoration:underline;color:var(--clr-black)}
#FilAriane li[aria-current="page"]{font-weight:700}

#REA {width:1280px;max-width: calc(100% - 64px);padding: 40px 0;font:700 16px/24px Arial,sans-serif;color:var(--clr-black);margin:0 auto}
#REA>p {font:700 32px/normal Arial,sans-serif;margin: 0 0 40px 0}
#REA ul{margin: 16px 0 0;display: flex;gap: 40px;flex-wrap: wrap;background: #fff;width:100%;padding: 24px;position: relative;justify-content:space-between;text-align:center;list-style:none;}
#REA img {height:40px;margin:0 0 16px;}
#REA ul li{flex:1;}
#REA ul li p{font-size:14px;}

#Spinner { position: fixed; width: 100vw; height: 100vh; left: 0; top: 0; background: #00000017; z-index:55;}
#Spinner::before { content: ''; position: absolute; width: 96px; height: 96px; left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: 50%; background: conic-gradient(from 180deg at 50% 50%, var(--clr-rmc) 0deg, rgba(238, 0, 4, 0) 360deg); animation: spin 0.9s linear infinite; }
#Spinner::after { content: ''; position: absolute; width: 76px; height: 76px; left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: 50%; background-color: #dcdcdc; background-image: url(https://static.s-sfr.fr/media/red-img-logo-rmc-sport.svg); background-size: 56px 56px; background-repeat: no-repeat; background-position: center; }
@keyframes spin { 0% { transform: translate(-50%, -50%) rotate(0deg); } 100% { transform: translate(-50%, -50%) rotate(360deg); } }

hr {border:0;border-bottom:1px solid var(--clr-disable);margin:0}
[id^="SEO"] {color:var(--clr-black);background:#fff;list-style:inside;margin:40px 0 0}
[id^="SEO"] details {position:relative;padding:24px 0;width:calc(100% - 64px);max-width:1280px;margin:0 auto}
[id^="SEO"] details strong{font-weight:700}
[id^="SEO"] details a{color:var(--clr-black);cursor:pointer}
[id^="SEO"] details p+*{margin:16px 0 0 0;} /* attention ! */
[id^="SEO"] summary{list-style-type:none;cursor:pointer;}
[id^="SEO"] summary::-webkit-details-marker{display:none}
[id^="SEO"] summary>span{font:700 16px/normal Arial,sans-serif;display:block;padding:0 16px 0 0}
[id^="SEO"] summary>span+p{margin: 24px 0 0 0}
[id^="SEO"] summary>p:empty{display:none}
[id^="SEO"] summary>span+i{margin: 24px 0 0 0;display:block;font-size:14px}
[id^="SEO"] summary>p{font: 14px/normal Arial,sans-serif}
[id^="SEO"] summary>p>a{font:700 14px/normal Arial,sans-serif}
[id^="SEO"] summary+div{font: 14px/normal Arial,sans-serif;margin: 24px 0 0 0}
[id^="SEO"] a{color:var(--clr-black);text-decoration:underline}
[id^="SEO"] details summary:after{content:'';position:absolute;width:8px;height:8px;border:2px solid var(--clr-black);transform:rotate(45deg);top:29px;right:0;border-top:0;border-left:0;transition:all 0.2s ease-out}
[id^="SEO"] details[open] summary:after{transform:rotate(225deg)}

.CP{width:290px;display:grid;grid-template-rows: subgrid;grid-row: span 8;position:relative;background:#fff;padding:24px 16px;overflow:hidden;transition:opacity .4s ease-out;gap:24px;cursor:pointer}
.CP:hover .img-central {transform: scale(1.1);}
.CP .stickers{display: flex;gap: 8px;flex-wrap: wrap;align-items: flex-start;}

.sticker{line-height:24px;font:700 12px Arial,sanns-serif;background:var(--clr-yellow); color:var(--clr-black);border-radius:4px;padding:0 8px;}
.sticker.j{background:var(--clr-yellow);color:var(--clr-black);}
.sticker.b{background: var(--clr-green);color:#fff;}
.sticker.n{background: var(--clr-black);color:#fff;}
.sticker.e{background: var(--clr-event);color:var(--clr-black);}
.sticker.r{background: #75E0A7; color:var(--clr-black);}
.sticker.c{background: var(--clr-rmc); color:#fff}

.CP .T{position: relative;display: inline-block;text-align: center;}
.CP .T .img-central{transition: 0.5s ease-out transform;width: 184px;object-fit: contain;max-height: 100%;height: auto;}
.CP .T .img-r{width: 32px;position: absolute;top: 0;right: 0;}
.CP .marque{font: normal 14px/22px Arial,sans-serif;text-transform:uppercase;}
.CP .M a{font:700 24px/36px Arial,sans-serif;color: var(--clr-black);text-decoration: none;white-space: normal;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}
.CP .M a:after{ content:'';position: absolute;left:0;top:0;width: 100%;height: 100%;}
.CP .from-price {text-transform:lowercase; font-size:14px;}
.CP .from-price + .B{margin: -16px 0 0 0;white-space:normal}
.CP .B {position:relative;line-height: normal;font-size:14px;}
.CP .B .desc-p{font-weight:700;color:var(--clr-rmc);margin:0 0 4px;}
.CP .colors{display: flex;flex-direction: column;width: 12px;justify-content: center;position: absolute;top: 0;bottom: 0;left: 0;margin: auto;}
.CP .colors span{position: relative;cursor: pointer;-webkit-background-clip: text;-webkit-text-fill-color: transparent;border: 1px solid var(--clr-grey);width: 12px;font-size: 5px;height: 12px;border-radius: 50%;box-sizing:content-box;margin: 4px 0;z-index:5;}
[data-title]:is(:hover, :focus, :focus-visible):after{content: attr(data-title);position:absolute;left: 14px;top: -90%;transform:translateY(-50%);background-color: var(--clr-black); color: #fff; font-size: 12px; padding: 2px 8px; text-align: left;border-radius: 2px;z-index:1;-webkit-text-fill-color:#fff;width:max-content;border-radius:4px;}
.CP .colors .d:before{content: '';position:absolute;width: 18px;height: 1.5px;background: var(--clr-black);transform: rotate(320deg);left: -3px;border-radius: 2px;bottom: 0;top: 0px;margin: auto;}
.CP .from-price + .price {margin: -16px 0 0 0;}
.CP .price{justify-content: flex-start;}
.CP.RMC .price{justify-content:center}
.CP .param{display: flex;gap:0 4px;}
.CP .param .option{position: relative;display: flex;align-items: center;flex-direction: column;justify-content: center;text-decoration: unset;color: var(--clr-black);height: auto;text-align: center;padding:16px;font:normal 12px/18px Arial,sans-serif;margin:0;width: 100%;background: #fff;border: 1px solid var(--clr-grey);cursor: pointer;}
.CP .param .option.a,.param input:checked + .option{padding:15px;border:var(--clr-rmc) 2px solid;box-shadow: 0 3px 9px transparent;cursor: default;font-weight:700}
.CP .param .option.d{background: #E9E9E9;color:var(--clr-grey);text-decoration:line-through;border: 2px solid var(--clr-grey);padding:15px;cursor:default;}
.CP .param input:disabled + .option{background: #E9E9E9;color:var(--clr-grey);border: 2px solid var(--clr-grey);padding:15px;cursor:default;}
.CP .star{font-weight:700;color:var(--clr-rmc)}

.AVIS{ position:relative; margin: 0;}
.AVIS a{ font-size:12px;color:var(--clr-black);display:inline-block;text-decoration:underline;z-index: 5; /*position: absolute; top: 5px;*/ margin: 0 0 0 4px;}
.AVIS span{font:700 12px Arial,sans-serif;display: inline-block; vertical-align: middle; margin: 0 4px 0 0;}
.AVIS .stars {width: 78px;height: 16px;background: url(//static.s-sfr.fr/media/pictos/stars_vide.svg) no-repeat left top;background-size:contain;}
.AVIS mark {height: 16px;background: url(//static.s-sfr.fr/media/pictos/stars_pleine.svg) no-repeat left top;background-size: 78px 16px;display: block;}
.AVIS>img{ height: 16px; width: 16px; filter: invert(84%) sepia(19%) saturate(5971%) hue-rotate(0deg) brightness(105%) contrast(103%); display: inline-block; vertical-align: middle;}
.AVIS>img.emp{ height: 18px; width: 18px; margin: 0 0 0 -1px;}

.availability{position: relative;display: block;font:normal 12px/18px Arial,sans-serif;margin-left: 14px;}
.availability:before{position: absolute;content: '';width: 10px;height: 10px;top: 0;bottom:0;margin:auto;left: -14px;border-radius: 100%}
.availability.wa:before{background-color: #ff9300}
.availability.ok:before{background-color: var(--clr-green)}
.availability.ko:before{background-color: var(--clr-error)}
.availability.in:before{background-color: var(--clr-black)}
.availability.pe:before{background-color: #444CE7}

.POPIN {margin:auto;box-sizing:border-box;background:#fff;border-radius: 12px;box-shadow: 0 8px 16px rgba(24, 24, 24, .08);max-height: calc(100% - 32px);max-width: calc(100% - 32px);width: 880px;overflow-y: auto;padding: 48px 24px 24px;position: fixed;top: 0;z-index: 99;bottom: 0;border:0; gap:16px;color:var(--clr-black);}
.POPIN::backdrop{background-color: rgba(0, 0, 0, .5);}
.POPIN>button,.POPIN header button {content: "";cursor: pointer;display: block;height: 24px;position: absolute;right: 24px;top: 24px;width: 24px;background:none;}
.POPIN>button:before,.POPIN header button:before {content: "";position: absolute;background: url(https://static.s-sfr.fr/assets/pictos/fermer_40_noir.svg);background-size:cover;height:24px;width:24px;left:0;top:0}

/*.transcription{position:relative;overflow:hidden;background-color:#fff;margin:0 0 24px 0;padding:24px 24px 24px 0}*/
.transcription{position:relative;/*overflow:hidden;*/background-color:#fff;margin:0 0 24px 0; border: 1px solid var(--clr-black); border-left: 0; border-right: 0; border-radius: 0; }
.transcription > summary{list-style-type:none;font:700 16px/24px Arial,sans-serif;cursor: pointer;padding: 16px 24px 16px 0}
.transcription > summary::-webkit-details-marker{display:none}
.transcription summary:after{content:'';position:absolute;width:8px;height:8px;border:2px solid var(--clr-black);transform:rotate(45deg);/*top:29px;*/top:20px;right:4px;border-top:0;border-left:0;transition:all 0.2s ease-out}
.transcription[open] summary:after{transform:rotate(225deg)}
.transcription>div{margin:8px 0 16px 0}
.transcription> p:not(:last-child){margin: 0 0 16px 0}
.transcription>div a{text-decoration:underline}

.radio:before {position:relative;display:inline-block;vertical-align:middle;content:"";width: 16px;height: 16px;background-color: #fff;border-radius: 100%;box-shadow: inset 0 0 0 8px #fff;border: 2px solid var(--clr-grey);margin: 0 8px 0 0;}
input:checked + .radio:before {background:var(--clr-green);box-shadow: inset 0 0 0 2.5px #fff;border: 2px solid var(--clr-green);}
input:disabled + .radio:before {background:#A0A0AB;box-shadow: inset 0 0 0 2.5px #fff;border: 2px solid #A0A0AB;}

.chckbx {display:block;cursor:pointer;position:relative;padding-left:28px;}
.chckbx:before {content: '';position: absolute;cursor: pointer;left: 0;border: 1px solid #8a8a8a;width: 18px;height: 18px;background-color: #fff;border-radius: 4px;}
input:checked + .chckbx span {font-weight:700}
input:checked + .chckbx:before{background-color:var(--clr-green);border-color:var(--clr-green);}
input:checked + .chckbx:after{content:'';width: 6px;height:12px;border:2px solid #fff;transform:rotate(45deg);border-top:none;border-left:none;left: 6px;top: 1px;display:block;position:absolute;}
input:disabled + .chckbx:before {background-color:#A0A0AB;border:1px solid #70707B;}
input:disabled + .chckbx:after{content:'';/*width:6px;height:12px;border:2px solid #E4E4E7;transform:rotate(45deg);border-top:none;border-left:none;left:7px;top:2px;display:block;position:absolute;*/}

.ttp { z-index: 5;bottom: auto;cursor:pointer;position: absolute;display:flex;gap:4px;font-size:12px;}
.ttp>button {width: 15px;height: 15px;cursor:pointer;background-color:transparent; background-image: url(//static.s-sfr.fr/assets/pictos/aide_plein_40_noir.svg); background-repeat: no-repeat; background-size: contain; line-height: 12px;padding: 0 17px 0 0; }
.ttp>button:before {content: "";position: absolute; top:0; left:0; right: 0; width: 100%; height: 100%;}
.ttp [popover] + [role="tooltip"] {display: none;}
.ttp [popover]:popover-open + [role="tooltip"] {display: block;width: 336px;border-radius: 8px;color: #fff;background-color: var(--clr-black);font-size: 12px;padding: 16px;position: absolute;z-index: 9;right:-8px;top: auto;bottom: 24px;transition: opacity 0.3s;white-space: normal;}
.ttp [popover]:popover-open + [role="tooltip"]::after {content: "";position: absolute;bottom: -12px;right:12px;border-width:6px;transform:scaleX(1.5);border-style: solid;border-color: var(--clr-black) transparent transparent transparent;}
.ttp.i>span { color:#fff;}
.ttp.i>button{ filter:invert(1); }
nav[aria-label="Pagination"] ul {list-style: none;display: flex;justify-content: center;gap: 12px;}
nav[aria-label="Pagination"] li {margin: 0;font-size:14px;}
nav[aria-label="Pagination"] a {color: var(--clr-black);border-radius: 4px;}
nav[aria-label="Pagination"] span {color: var(--clr-black);border-radius: 4px;}
nav[aria-label="Pagination"] a[aria-current="page"],
nav[aria-label="Pagination"] span[aria-current="page"]{background: var(--clr-rmc);color: #fff;font-weight:700;padding: 2px 8px;text-decoration: none;}
nav[aria-label="Pagination"] a[class^="link"] {padding: 2px 14px; /*margin: 0 0 0 24px;*/}
/*nav[aria-label="Pagination"] a[class^="link"].l {padding: 2px 0 2px 14px; margin: 0 24px 0 0;}*/
/*nav[aria-label="Pagination"] button[class^="link"].l:after, nav[aria-label="Pagination"] a[class^="link"].l:after {transform: rotate(225deg);left: 1px;right: auto;}*/
/*nav[aria-label="Pagination"] button[class^="link"].l:hover:after,nav[aria-label="Pagination"] a[class^="link"].l:hover:after {left: -3px;}*/
nav[aria-label="Pagination"] button[class^="link"].l, nav[aria-label="Pagination"] a[class^="link"].l{padding-left: 13px;margin:0;}
.pill {position: relative;display: block; font: 14px / 19.6px Arial,sans-serif; padding: 8px 16px;background: transparent;border: 1px solid var(--clr-black);color: var(--clr-black);border-radius: 24px;text-decoration: none;transition: .5s background-color ease-out;width: fit-content;}
.pill:focus-visible, .pill:hover {color: #fff;background: var(--clr-black);}
.pill:after {position: relative;display: inline-block;vertical-align: middle;content: '';margin-left: 8px;background: url(https://static.s-sfr.fr/assets/pictos/fleche_DROITE_40_noir.svg);background-size: contain;width: 16px;height: 16px;}
.pill.d:after {rotate: 90deg;}
.pill:hover:after {filter: invert(100%);}

a.badge {text-decoration: none;width: fit-content; display: block;}
a.badge  > div {display: flex; align-items: center; gap: 5px; color: #fff; background-color: var(--clr-black); border: 1px solid #a6a6a6; border-radius: 6px; padding: 4px 15px 5px 7px;}
a.badge:nth-of-type(2) > div {gap: 7px; padding: 3px 8px 4px 7px;}
a.badge span {font: 7px/12px Arial; letter-spacing: 0.75px;}
a.badge div>div { display: inline-grid; }
a.badge:nth-of-type(2) > div span:first-child {text-transform: uppercase}

[role="tablist"] {display:flex;width:fit-content;max-width:100%;margin:0 auto;gap:8px;}
[role="tablist"] > div, [role="tablist"] .switch{position:relative;display:flex;/* overflow:auto hidden; */-ms-overflow-style:none;scrollbar-width:none;scroll-behavior:smooth;scroll-snap-type:x mandatory;background:#fff;border-radius:10px;border:1px solid var(--clr-black);}
[role="tablist"] .right, [role="tablist"] .left{display:flex;justify-items:center;align-items:center;cursor:pointer;}
[role="tablist"] .tab {position: relative;font-size:14px;padding:8px 24px;color:var(--clr-black);cursor:pointer;line-height:20px;text-decoration:none;}
[role="tablist"] .tab:not(.active):not(:last-of-type):not(:focus-visible):before {content: '';position: absolute;width: 1px;height: calc(100% - 16px);background: var(--clr-grey);top: 0;bottom: 0;margin: auto;right: -1px;}
[role="tablist"] .tab.active {color:#fff;background:var(--clr-black);font-weight:700;pointer-events:none;}
[role="tablist"] img {width:16px;height:auto;}
#SB{padding:40px 0;width: 1280px;max-width:calc(100% - 64px);margin:40px auto auto;}
#SB div { margin: 40px auto 0; padding: 24px;display:flex;flex-wrap: wrap;gap:8px;background-color: #fff;}
#SB .pill {margin:0;}

.responly{display:none}
@media(max-width:1100px){
    .responly{display:block}
    h1{font-size:32px;line-height:38px}
    h2{font-size:24px}
    
    details.faq{ margin: 0 0 16px 0; padding: 16px;}
    details.faq>div{ margin: 16px 0 0 0;}
    details.faq summary:after { top: 21px;}
    
    #REA {padding: 24px 0;width: 486px;max-width: calc(100% - 32px);}
    #REA > p {font:700 24px/normal Arial,sans-serif;margin: 0 0 24px 0;}
    #REA ul{flex-flow: column;justify-content:start;gap: 24px;text-align: left;padding:16px;}
    #REA img,#REA ul p {display:inline-block;vertical-align:middle;margin: 0 16px 0 0;}
    #REA ul p {font:700 14px/21px Arial,sans-serif}
    
    [id^="SEO"] {margin:24px 0 0}
    [id^="SEO"] details { width:calc(100% - 32px);}
    .ttp [popover]:popover-open + [role="tooltip"] { width: 264px; }
    
    .CP { padding: 16px 16px; }
    .transcription {margin: 0 0 16px 0;}
    .transcription>div {margin: 16px 0;}
    
    .message{padding:64px 16px 16px}
    .message:before{left:16px;top:16px}
    
    .POPIN{padding:38px 16px 16px;}
    .POPIN>button,.POPIN header button{top:16px;right:16px;}
    
    nav[aria-label="Pagination"] a[class^="link"] {margin-left: 0;}
    nav[aria-label="Pagination"] a[class^="link"].l {margin-right: 0;}
    nav[aria-label="Pagination"] a[class^="link"]:after{top: 0;bottom: 0;}
    #SB{width:486px;padding:0;max-width:calc(100% - 32px);margin:24px auto;}
    #SB div{margin:24px 0 0 0;padding:16px;}
    #SB h2 {font-size:24px;}
}