accessibility-react-widget/dist/assets/main.css

A React-based web accessibility widget to enhance UI/UX for all users. This powerful tool seamlessly integrates with React applications, offering a wide range of features like adjustable font sizes, text alignment options, dyslexia-friendly fonts, and col

._AccessibilityIcon_w7tb4_1{background-color:var(--primary-color);width:70px;height:70px;display:flex;align-items:center;justify-content:center;box-shadow:0 5px 15px #252c6126,0 2px 4px #5d649433;position:fixed;z-index:500000000000000000;inset-inline-start:20px;bottom:20px;transition:.3s;cursor:pointer}._AccessibilityIcon_w7tb4_1._showSpinner_w7tb4_16{cursor:auto;animation:_spin_w7tb4_1 2.5s linear infinite}._AccessibilityIcon_w7tb4_1:hover{transform:scale(1.2)}._AccessibilityIcon_w7tb4_1>svg{fill:var(--white);width:75%;z-index:1}._AccessibilityIcon_w7tb4_1:after{content:"";position:absolute;left:50%;top:50%;bottom:0;width:80%;height:80%;border:2px solid white;background-color:var(--primary-color);z-index:0;transform:translate(-50%,-50%)}@keyframes _spin_w7tb4_1{0%{transform:rotate(0)}to{transform:rotate(360deg)}}._accHeader__resetBtn_edc9t_1,._accHeader__closeBtn_edc9t_1{background-color:transparent;border:none;outline:none;display:flex;align-items:center}._accHeader__resetBtn_edc9t_1 svg,._accHeader__closeBtn_edc9t_1 svg{fill:#fff;font-weight:700;font-size:2em;width:30px}._accHeader_edc9t_1{height:60px;background-color:#2c2639;display:flex;align-items:center;justify-content:space-between;padding:.5em}._accHeader__title_edc9t_23{color:#fff;margin:0;font-size:18px}._accHeader_edc9t_1>._acc-lang-select-container_edc9t_28{flex:1}._accFooter_1pk2r_1{height:30px;background-color:#2c2639;display:flex;align-items:center;justify-content:center;color:#fff}._accFooter_1pk2r_1>a{color:#fff}@media screen and (max-width: 540px){._accFooter_1pk2r_1{height:55px}}._accAccessibilityMenu__overlay_1yac1_1{position:fixed;top:0;left:0;width:100%;height:100%;z-index:10000}._accMenu_1yac1_10{position:fixed;inset-inline-start:20px;bottom:100px;border-radius:10px;box-shadow:0 0 20px #00000080;opacity:1;transition:.3s;z-index:500000000000000000;overflow:hidden;background:#f9f9f9;width:100%;max-width:500px;line-height:1;font-size:16px;letter-spacing:.015em;display:flex;flex-direction:column}._accMenu_1yac1_10 [class$=-control]{border-radius:0;border:.3px solid #2c2639}._accMenu_1yac1_10 [class$=-indicatorContainer] svg{fill:#2c2639}._accMenu_1yac1_10 [class$=-indicatorSeparator]{background-color:#2c2639}._accMenu_1yac1_10 [class$=-menu]{margin-top:0;z-index:100}@media screen and (max-width: 540px){._accMenu_1yac1_10{inset-inline-start:0;max-width:100%;top:0;border-radius:0}}._accMenuContentBlock_ba9px_1{border:.3px solid #2c2639;display:flex;align-items:center;flex-direction:column;max-height:calc(33.3333333333vh - 83px);justify-content:center;flex-grow:1;transition:max-height .3s linear;padding:10px 5px 5px;position:relative;cursor:pointer;overflow:hidden;z-index:10}._accMenuContentBlock_ba9px_1:focus{border:1px solid #2c2639}._accMenuContentBlock_ba9px_1._isExpanded_ba9px_19{cursor:auto;flex:1;max-height:100%;border:none}._accMenuContentBlock_ba9px_1._isAccMenuContentActive_ba9px_25:not(._isExpanded_ba9px_19){display:none}._accMenuContentBlock__titleContainer_ba9px_28{display:flex;flex-direction:column;align-items:center}._accMenuContentBlock__titleContainer_ba9px_28 svg{font-weight:700;width:30px;fill:#000}._accMenuContentBlock__title_ba9px_28{font-size:20px;font-weight:700;color:#000;text-transform:capitalize;margin:0;padding:.2em}._accMenuContentBlock__expendButtonContainer_ba9px_46{width:100%;display:flex;margin-bottom:10px}._accMenuContentBlock__expendButtonContainer_ba9px_46 button{font-size:30px;width:80%;margin:auto;inset-inline-start:5px;height:100%;border:none;outline:none;background-color:var(--primary-color);border-radius:10px}._accMenuContentBlock__expendButtonContainer_ba9px_46 button>svg{fill:#fff;width:24px}._accMenuContentBlock__expendButtonContainer_ba9px_46 button:hover{opacity:.8}._accMenuContentBlock__content_ba9px_69{display:grid;flex:1;grid-template-columns:repeat(3,1fr);grid-auto-rows:max-content;-moz-column-gap:.8em;column-gap:.8em;overflow:auto;row-gap:1.5em;align-self:baseline;width:100%}._accButton_gu4kw_1{aspect-ratio:6/5;border-radius:4px;display:flex;flex-direction:column;padding:5px;color:#000;background:#fff;border:1px solid #ccc;transition:all .5s ease;position:relative;cursor:pointer}._accButton_gu4kw_1:hover,._accButton_gu4kw_1:focus{border-color:var(--primary-color);outline:none}._accButton_gu4kw_1._isToggled_gu4kw_18{background-color:var(--primary-color);border-color:var(--primary-color);color:#fff}._accButton_gu4kw_1._isToggled_gu4kw_18 svg{fill:#fff}._accButton_gu4kw_1._isActive_gu4kw_26{border-color:var(--primary-color)}._accButton__title_gu4kw_29{font-size:15px;font-weight:400;text-align:center;width:100%;color:inherit;margin:10px auto auto}._accButton__icon_gu4kw_38{width:24px;margin-bottom:8px}._accButton__icon--help_gu4kw_42{position:absolute;inset-inline-end:0}._accButton__icon--help_gu4kw_42:hover{fill:red!important}._accButton__icon--help_gu4kw_42:hover+span[data-tooltip]:after{opacity:1;padding:8px;max-height:10000px;transition-duration:.3s}._accButton__content_gu4kw_55{align-self:flex-end;width:100%;margin-top:auto;flex:.8}._accButton__stats_gu4kw_61{color:var(--primary-color);font-weight:700;position:absolute;align-self:flex-end;font-size:14px}._accButton_gu4kw_1 span[data-tooltip]{position:absolute;left:0;right:0;bottom:0;cursor:help}._accButton_gu4kw_1 span[data-tooltip]:after{position:absolute;opacity:0;pointer-events:none;content:attr(data-tooltip);color:var(--primary-color);left:0;right:0;bottom:0;margin:auto;line-height:1.5;border-radius:3px;box-shadow:0 0 5px 2px #64646499;background-color:#fff;z-index:10;word-wrap:break-word;text-align:start;transform:translateY(100%);transition:all .15s cubic-bezier(.25,.8,.25,1)}._accValueControl_p53sg_1{height:100%;display:flex;align-items:center;justify-content:space-around}._accValueControlButton_1pw3b_1{padding:0;background-color:var(--primary-color);border:none;outline:none;width:28px;aspect-ratio:1;border-radius:50%;display:flex;align-items:center;justify-content:center}._accValueControlButton_1pw3b_1 svg{fill:#fff;width:20px}._accValueControlButton_1pw3b_1:hover{opacity:.8}._accValueControlButton_1pw3b_1:focus{background-color:#fff;border:4px solid var(--primary-color)}._accValueControlButton_1pw3b_1:focus svg{fill:var(--primary-color)}._accLineHeightButton_n1tdk_1,._accZoomButton_1fl6t_1{height:100%;display:flex;align-items:center;justify-content:space-around}._accBrightnessControl_16gcc_1{height:100%;display:flex;align-items:center;justify-content:space-around;position:relative}.rc-slider{position:relative;width:100%;height:14px;padding:5px 0;border-radius:6px;touch-action:none;box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0)}.rc-slider *{box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0)}.rc-slider-rail{position:absolute;width:100%;height:4px;background-color:#e9e9e9;border-radius:6px}.rc-slider-track,.rc-slider-tracks{position:absolute;height:4px;background-color:#abe2fb;border-radius:6px}.rc-slider-track-draggable{z-index:1;box-sizing:content-box;background-clip:content-box;border-top:5px solid rgba(0,0,0,0);border-bottom:5px solid rgba(0,0,0,0);transform:translateY(-5px)}.rc-slider-handle{position:absolute;z-index:1;width:14px;height:14px;margin-top:-5px;background-color:#fff;border:solid 2px #96dbfa;border-radius:50%;cursor:pointer;cursor:grab;opacity:.8;touch-action:pan-x}.rc-slider-handle-dragging.rc-slider-handle-dragging.rc-slider-handle-dragging{border-color:#57c5f7;box-shadow:0 0 0 5px #96dbfa}.rc-slider-handle:focus{outline:none;box-shadow:none}.rc-slider-handle:focus-visible{border-color:#2db7f5;box-shadow:0 0 0 3px #96dbfa}.rc-slider-handle-click-focused:focus{border-color:#96dbfa;box-shadow:unset}.rc-slider-handle:hover{border-color:#57c5f7}.rc-slider-handle:active{border-color:#57c5f7;box-shadow:0 0 5px #57c5f7;cursor:grabbing}.rc-slider-mark{position:absolute;top:18px;left:0;width:100%;font-size:12px}.rc-slider-mark-text{position:absolute;display:inline-block;color:#999;text-align:center;vertical-align:middle;cursor:pointer}.rc-slider-mark-text-active{color:#666}.rc-slider-step{position:absolute;width:100%;height:4px;background:transparent}.rc-slider-dot{position:absolute;bottom:-2px;width:8px;height:8px;vertical-align:middle;background-color:#fff;border:2px solid #e9e9e9;border-radius:50%;cursor:pointer}.rc-slider-dot-active{border-color:#96dbfa}.rc-slider-dot-reverse{margin-right:-4px}.rc-slider-disabled{background-color:#e9e9e9}.rc-slider-disabled .rc-slider-track{background-color:#ccc}.rc-slider-disabled .rc-slider-handle,.rc-slider-disabled .rc-slider-dot{background-color:#fff;border-color:#ccc;box-shadow:none;cursor:not-allowed}.rc-slider-disabled .rc-slider-mark-text,.rc-slider-disabled .rc-slider-dot{cursor:not-allowed!important}.rc-slider-vertical{width:14px;height:100%;padding:0 5px}.rc-slider-vertical .rc-slider-rail{width:4px;height:100%}.rc-slider-vertical .rc-slider-track{bottom:0;left:5px;width:4px}.rc-slider-vertical .rc-slider-track-draggable{border-top:0;border-bottom:0;border-right:5px solid rgba(0,0,0,0);border-left:5px solid rgba(0,0,0,0);transform:translate(-5px)}.rc-slider-vertical .rc-slider-handle{position:absolute;z-index:1;margin-top:0;margin-left:-5px;touch-action:pan-y}.rc-slider-vertical .rc-slider-mark{top:0;left:18px;height:100%}.rc-slider-vertical .rc-slider-step{width:4px;height:100%}.rc-slider-vertical .rc-slider-dot{margin-left:-2px}.rc-slider-tooltip-zoom-down-enter,.rc-slider-tooltip-zoom-down-appear,.rc-slider-tooltip-zoom-down-leave{display:block!important;animation-duration:.3s;animation-fill-mode:both;animation-play-state:paused}.rc-slider-tooltip-zoom-down-enter.rc-slider-tooltip-zoom-down-enter-active,.rc-slider-tooltip-zoom-down-appear.rc-slider-tooltip-zoom-down-appear-active{animation-name:rcSliderTooltipZoomDownIn;animation-play-state:running}.rc-slider-tooltip-zoom-down-leave.rc-slider-tooltip-zoom-down-leave-active{animation-name:rcSliderTooltipZoomDownOut;animation-play-state:running}.rc-slider-tooltip-zoom-down-enter,.rc-slider-tooltip-zoom-down-appear{transform:scale(0);animation-timing-function:cubic-bezier(.23,1,.32,1)}.rc-slider-tooltip-zoom-down-leave{animation-timing-function:cubic-bezier(.755,.05,.855,.06)}@keyframes rcSliderTooltipZoomDownIn{0%{transform:scale(0);transform-origin:50% 100%;opacity:0}to{transform:scale(1);transform-origin:50% 100%}}@keyframes rcSliderTooltipZoomDownOut{0%{transform:scale(1);transform-origin:50% 100%}to{transform:scale(0);transform-origin:50% 100%;opacity:0}}.rc-slider-tooltip{position:absolute;top:-9999px;left:-9999px;visibility:visible;box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0)}.rc-slider-tooltip *{box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0)}.rc-slider-tooltip-hidden{display:none}.rc-slider-tooltip-placement-top{padding:4px 0 8px}.rc-slider-tooltip-inner{min-width:24px;height:24px;padding:6px 2px;color:#fff;font-size:12px;line-height:1;text-align:center;text-decoration:none;background-color:#6c6c6c;border-radius:6px;box-shadow:0 0 4px #d9d9d9}.rc-slider-tooltip-arrow{position:absolute;width:0;height:0;border-color:transparent;border-style:solid}.rc-slider-tooltip-placement-top .rc-slider-tooltip-arrow{bottom:4px;left:50%;margin-left:-4px;border-width:4px 4px 0;border-top-color:#6c6c6c}._accRcSlider_dhokk_1{position:absolute;left:0;right:0;bottom:-6px}._accRcSlider_dhokk_1 .rc-slider-rail{background-color:var(--primary-color)}._accRcSlider_dhokk_1 .rc-slider-handle{border:solid 2px var(--primary-color);background-color:red;opacity:1;width:22px;height:22px;margin-top:-9px}._accButtonTextColorPicker_dw9mu_1{grid-column:span 3;aspect-ratio:10/5}._accButtonTextColorPicker_dw9mu_1>h2{margin:0;position:absolute;display:inline-block;width:auto;inset-inline-end:5px}._accButtonTextColorPicker_dw9mu_1 [class^=_accButton__content]{flex:1}._accTextColorPicker_dw9mu_16{height:100%;display:flex;flex-direction:column;align-items:center}._accTextColorPicker__topContainer_dw9mu_22{width:100%;display:flex;align-items:center;justify-content:center;margin-bottom:15px;gap:10px}._accTextColorPicker__inputText_dw9mu_30{text-align:center;font-weight:700;letter-spacing:1px}._accTextColorPicker__hexColorPicker_dw9mu_35{flex:1;width:100%!important}._accSelectVoicesContainer_1d5zn_1 .accSelectVoices__indicators{display:none}._accSelectVoicesContainer_1d5zn_1 .accSelectVoices__option{color:#333}._accMenuContent_1v82o_1{display:grid;height:calc(100vh - 250px);display:flex;flex-direction:column;overflow:hidden}:root{--primary-color: #222e8a;--highlight-color:#0048ff;--white:#fff}.acc-readingGuide{position:fixed;top:0;left:0;right:0;width:100%;height:0;pointer-events:none;background-color:#00000080;z-index:1000000}