div.access * {
    font-family: Arial, sans-serif;
}

div.access {
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.2);
    font-size: 16px;
    position: fixed;
    z-index: 99999999;
    top: 0;
    bottom: 0;
    display: grid;
    grid-template-rows: 50px 1fr 70px;
    right: 0;
    border-left: 1px solid #e3e3e3;
    width: min(445px, 100%);
    background-color: #fff;
}

div.access button {
    text-align: center;
}

div.access__header {
    background-color: var(--primaire, #d53b77);
    position: relative;
    color: #fff;
    display: grid;
    place-items: center;
}

div.access__header button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 15px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    background: none;
    color: #fff;
    cursor: pointer;
}

div.access__header button svg {
    width: 20px;
}

div.access__header button path {
    fill: currentColor;
}

div.access__footer {
    padding-top: 15px;
    background: #f8f9fc;
}

div.access__footer button {
    font-size: 16px;
    cursor: pointer;
    width: 80%;
    margin: auto;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    font-weight: 700;
    border-radius: 8px;
    height: calc(100% - 10px);
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
    background-color: var(--primaire, #d53b77);
    color: #fff;
    border: none;
}

div.access__footer button svg {
    width: 20px;
}

div.access__footer button svg path {
    fill: currentColor;
}

div.access__main {
    background: #f8f9fc;
    padding: 25px 15px;
    display: grid;
    gap: 30px;
    align-content: flex-start;
    overflow: auto;
    position: relative;
}

div.access__main::-webkit-scrollbar {
    background: transparent;
    width: 4px;
}

div.access__main::-webkit-scrollbar-thumb {
    background: var(--primaire, #d53b77);
}

div.access__main:has(#structureHn.visible) {
    overflow: hidden;
}

div.access__main button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    cursor: pointer;
    background: #fff;
    aspect-ratio: 133/115;
    height: auto;
    display: grid;
    place-items: center;
    place-content: center;
    gap: 10px;
    padding: 5px;
    font-size: 16px;
    font-weight: 600;
    border: 1px solid rgb(242, 242, 248);
    box-shadow: rgba(25, 27, 30, 0.031372549) 0 0 5px;
    border-radius: 8px;
}

div.access__main button svg {
    width: 20px;
    height: 20px;
}

div.access__main button path {
    fill: var(--primaire, #d53b77);
}

div.access__main button:hover {
    box-shadow: var(--primaire, #d53b77) 0 0 5px;
    color: var(--primaire, #d53b77);
    border-color: var(--primaire, #d53b77);
}

div.access__main button.active,
div.access__main button:has(.acces__step.active) {
    box-shadow: var(--primaire, #d53b77) 0 0 5px;
    background: var(--primaire, #d53b77);
    border-color: var(--primaire, #d53b77);
    color: #fff;
}

div.access__main button.active path,
div.access__main button:has(.acces__step.active) path {
    fill: currentColor;
}

div.access__subsection b {
    font-size: 20px;
    font-weight: 900;
    display: block;
    margin-bottom: 15px;
}

div.access__buttons {
    display: grid;
    gap: 15px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

#openAccessibility {
    position: fixed;
    @media(width >= 1200px) {
        top:10px;
    }
    @media(width < 1200px) {
        bottom: 15px;
    }
    z-index: 999;
    right: 15px;
    width: 45px;
    display: grid;
    place-items: center;
    aspect-ratio: 1;
    border-radius: 50px;
    padding: 0;
    cursor: pointer;
    background: var(--primaire, #d53b77);
    border: none;
}

#openAccessibility svg {
    width: 31px;
}

#openAccessibility path {
    fill: #fff;
}

.ncAccess--exergueLiens a {
    background: #000 !important;
    color: #ff0 !important;
    text-decoration: underline !important;
}

.ncAccess--cacherImages * {
    background-size: 0 0!important;
    background-repeat: no-repeat!important;
}

.ncAccess--cacherImages :is(img) {
    opacity: 0!important;
}

.ncAccess--dyslexicMode * {
    font-family: opendyslexic !important;
}

.ncAccess--lisibleMode * {
    font-family: Arial, Helvetica, sans-serif !important;
}

.ncAccess--bigCursor:hover,
.ncAccess--bigCursor * {
    cursor: url(data:image/png;base64,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), default;
}

.ncAccess--stopAnim * {
    transition-duration: 0s !important;
    animation-duration: 0s !important;
}

.ncAccess--lineHeight * {
    line-height: 1.8 !important;
}

.ncAccess--lineHeight .access * {
    line-height: 1.1 !important;
}

html[class] {
    background: transparent;
}

html.ncAccess--grayscale {
    filter: grayscale(1);
}

html.ncAccess--invertColor {
    filter: invert(1);
}

html.ncAccess--luminosity {
    filter: brightness(75%);
}

html.ncAccess--saturation {
    filter: saturate(75%);
}

html.ncAccess--contrast header,
html.ncAccess--contrast footer,
html.ncAccess--contrast main {
    background: white !important;
    color: black !important;
}

html.ncAccess--contrast header *,
html.ncAccess--contrast footer *,
html.ncAccess--contrast main * {
    background: white !important;
    color: black !important;
    border-color: black !important;
}

html.ncAccess--contrast input {
    border-width: 1px !important;
}

html.ncAccess--contrast svg {
    fill: black !important;
}

html.ncAccess--contrast .homeTriangle {
    display: none !important;
}

html:has(.ncAccess--biggerText1) {
    font-size: 18px !important;
}

html:has(.ncAccess--biggerText2) {
    font-size: 20px !important;
}

html:has(.ncAccess--biggerText3) {
    font-size: 22px !important;
}

.access-steps {
    display: flex;
    align-items: center;
    gap: 5px;
}

.access-steps .acces__step {
    display: block;
    width: 22px;
    height: 4px;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 4px;
}

.access-steps .acces__step.active {
    background: #fff;
}

#ligneLecture {
    position: fixed;
    pointer-events: none;
    left: 0;
    right: 0;
    height: 5px;
    background: #000;
    z-index: 99999999;
    display: none;
}

#ligneLecture.visible {
    display: block;
}

#accessTools * {
    pointer-events: none;
}

#accessTools {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    pointer-events: none;
}

#masqueLecture {
    position: fixed;
    pointer-events: none;
    left: 0;
    right: 0;
    height: 25lvh;
    transform: translateY(-50%);
    z-index: 99999999;
    display: none;
}

#masqueLecture:before {
    left: 0;
    right: 0;
    bottom: 100%;
    height: 100vh;
    position: absolute;
    content: "";
    background: rgba(0, 0, 0, 0.6);
    pointer-events: none;
}

#masqueLecture:after {
    left: 0;
    right: 0;
    top: 100%;
    height: 100vh;
    position: absolute;
    content: "";
    background: rgba(0, 0, 0, 0.6);
    pointer-events: none;
}

#masqueLecture.visible {
    display: block;
}

#structureHn {
    margin: 0;
    position: absolute;
    display: none;
    top: 0;
    left: 0;
    right: 0;
    height: 100%;
    list-style: none;
    align-content: flex-start;
    background: #fff;
    padding: 30px;
    gap: 5px;
}

#structureHn button {
    background: var(--primaire, #d53b77);
    aspect-ratio: unset;
    padding: 5px 10px;
    margin-bottom: 15px;
    color: #fff;
}

#structureHn.visible {
    display: grid;
}

#structureHn li.H2 {
    padding-left: 10px;
}

#structureHn li.H3 {
    padding-left: 20px;
}

#structureHn li.H4 {
    padding-left: 30px;
}

#structureHn li.H5 {
    padding-left: 40px;
}

#structureHn li.H6 {
    padding-left: 50px;
}

#structureHn span {
    display: inline-block;
    padding: 2px 5px;
    background: #3e3e3e;
    color: #fff;
}

.ncAccess--toggleInfoBulle #infoBulle {
    display: block;
}

#infoBulle {
    display: none;
    position: fixed;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2), 0 6px 20px rgba(0, 0, 0, 0.1882352941);
    padding: 5px 10px;
    background: #fff;
    transform: translateY(-100%);
    font-size: 1.125rem;
    opacity: 1;
}

#infoBulle:empty {
    opacity: 0;
}

@font-face {
    font-family: opendyslexic;
    src: url("./fonts/OpenDyslexic-Regular-CrW49Z3D.otf");
    font-style: normal;
    font-weight: 400;
}

@font-face {
    font-family: opendyslexic;
    src: url("./fonts/OpenDyslexic-Italic-BAfMOhXy.otf");
    font-style: italic;
    font-weight: 400;
}

@font-face {
    font-family: opendyslexic;
    src: url("./fonts/OpenDyslexic-Bold-lnlycIvj.otf");
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: opendyslexic;
    src: url("./fonts/OpenDyslexic-Bold-Italic-C9nHZKnc.otf");
    font-weight: 700;
    font-style: italic;
}


