@import url(https://fonts.googleapis.com/css2?family=Outfit:wght@100;300;400;500;600;700&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap);

.easyr-btn-outline:hover {
    color: #ac38bd !important;
    background-color: #ac38bd !important
}

#easyr2 {
    z-index: 1000 !important;
}

.save_button_wrapper .easyr-btn-outline:hover {
    color: gray !important
}

#reader-settings>hr {
    border: "none !important";
    border-bottom: "none !important"
}

.save_button_wrapper .easyr-btn-outline:hover {
    background-color: gray !important
}

.easyr-open-modal hr {
    border-bottom: "none" !important;
    border: "none" !important
}

.easyr-btn-outline:hover span {
    color: #fff !important
}

#voice-select-input button svg {
    fill: transparent !important
}

ul#help-list {
    list-style: none;
    margin-left: 0;
    padding-left: 1.2em;
    text-indent: -1.2em
}

#help-list li {
    font-weight: 500;
    margin-bottom: 12px;
    padding-left: 2px
}

#help-list li:before {
    content: "\25B6";
    margin: 0 1em 0 0;
    color: #ac38bd;
    font-size: 10px
}

.easyr-open-modal hr {
    background-image: none
}

.App {
    text-align: center
}

.snack {
    width: 500px
}

@font-face {
    font-family: opendyslexic;
    src: url(/3asyRjsNew/static/media/OpenDyslexic-Regular.7312cd3f.woff) format("woff");
    font-style: normal;
    font-weight: 400
}

@font-face {
    font-family: dyslexicgreek;
    src: url(/3asyRjsNew/static/media/dyslexicgreek.132795e9.woff) format("woff");
    font-style: normal;
    font-weight: 400
}

@font-face {
    font-family: verdana;
    src: url(/3asyRjsNew/static/media/Verdana.b7180c84.woff) format("woff");
    font-style: normal;
    font-weight: 400
}

@font-face {
    font-family: comicNeueRegular;
    src: url(/3asyRjsNew/static/media/ComicNeue-Regular.f610f878.woff) format("woff");
    font-style: normal;
    font-weight: 700
}

@font-face {
    font-family: helvetica;
    src: url(/3asyRjsNew/static/media/helvetica.b512a302.woff) format("woff");
    font-style: normal;
    font-weight: 400
}

body {
    margin: 0;
    padding: 0
}

.easyr-extension {
    position: absolute !important;
    display: contents;
    width: 100%;
    height: 100%;
    z-index: 10000;
    font-family: Outfit, sans-serif !important
}

#voice-select-input button svg {
    display: none !important
}

.field_wrapper button {
    height: 20px !important
}

label+div {
    margin-top: 0 !important
}

.easyr-open-modal-help {
    font-family: Outfit, sans-serif !important
}

.easyr-open-modal>div>div {
    padding: 0 !important
}

.easyr-open-modal div {
    font-family: Outfit, sans-serif !important;
    color: #1e1e1e
}

.need_help {
    text-align: center
}

.field_wrapper.voice-reader button {
    height: unset !important
}

.need_help a {
    text-decoration: none;
    text-align: center;
    font-family: Outfit, sans-serif !important;
    font-size: 16px !important;
    font-weight: 700
}

.field_wrapper.voice-reader.speaker-mode #voice-reader-input button:last-child {
    padding: 0 !important
}

.field_wrapper.voice-reader.speaker-mode #voice-reader-input button {
    padding: 0 11px 0 0 !important
}

.field_wrapper.voice-reader.speaker-mode #voice-reader-input {
    border-top: none !important;
    height: unset
}

.field_wrapper.voice-reader.speaker-mode>div {
    padding-top: 0;
    width: auto !important
}

.field_wrapper.voice-reader.speaker-mode {
    position: fixed;
    right: 25px;
    background: #fff;
    box-shadow: 0 19px 38px rgba(0, 0, 0, .3), 0 15px 12px rgba(0, 0, 0, .22);
    border-radius: 36px;
    background: linear-gradient(270deg, #fe37a7, #6e3adc);
    top: 40%
}

.save_button_wrapper {
    margin-bottom: 20px;
    margin-top: 33px
}

.easyr-open-modal label {
    position: unset;
    font-family: Outfit, sans-serif !important;
    font-weight: 700;
    -ms-transform: none !important;
    transform: none !important;
    position: unset !important
}

.underline_input label,
[for=color-select-input],
[for=fontsize-select-input] {
    font-size: 16px;
    font-family: Outfit, sans-serif !important
}

#voice-select-input div {
    line-height: unset !important;
    top: 0 !important;
    height: unset !important
}

.field_wrapper>div {
    padding-top: 12px;
    box-sizing: border-box;
    line-height: unset !important
}

#reader-settings>div>div,
#speaker-settings>div>div,
.field_wrapper>div {
    margin-top: 0 !important
}

#reader-settings>div>label,
#speaker-settings>div>label {
    position: relative !important;
    top: 0 !important
}

#reader-settings>div,
#speaker-settings>div {
    box-shadow: 0 1px 9px 0 rgba(5, 46, 79, .2);
    margin-bottom: 5px;
    border-radius: 7px;
    width: 100% !important;
    padding: 5px 11px;
    box-sizing: border-box
}

.easyr-open-modal hr {
    margin-top: 0;
    margin-bottom: 10px;
    border-bottom: 0 !important;
    border: 0 !important
}

#color-select-input>div>div:first-child {
    height: unset
}

#easyr-extension-root {
    position: absolute !important;
    width: 100%;
    height: 100%;
    z-index: 10000
}

#color-select-input>div>div:first-child+div {
    height: unset !important
}

.main-modal {
    position: fixed !important;
    right: 10px;
    top: 10px;
    box-shadow: 0 19px 38px rgba(0, 0, 0, .3), 0 15px 12px rgba(0, 0, 0, .22);
    z-index: 2000
}

#font-select-input div,
#fontsize-select-input div {
    height: unset !important;
    line-height: unset !important
}

#font-select-input>div,
#fontsize-select-input>div {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between
}

#font-select-input button,
#fontsize-select-input button {
    position: unset !important
}

#font-select-input>div>div:first-child,
#font-select-input>div>div:last-child,
#fontsize-select-input>div>div:first-child,
#fontsize-select-input>div>div:last-child {
    display: none !important
}

#font-select-input,
#fontsize-select-input {
    height: unset !important;
    line-height: unset !important
}

#reader-settings>div {
    display: -ms-flexbox;
    display: flex;
    line-height: unset
}

.easyr-max-index {
    z-index: 1000000001 !important
}

.easyr-hidden {
    display: none !important
}

#underline-toggle-input+div {
    -ms-flex-align: center;
    align-items: center
}

.underline_input>div {
    display: -ms-flexbox !important;
    display: flex !important
}

#speaker-settings>div {
    -ms-flex-align: center;
    align-items: center
}

#easyr-save-button span {
    font-weight: 700 !important;
    color: #fff !important
}

.save_button_wrapper {
    height: 50px;
    -ms-flex-align: center;
    align-items: center;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center
}

#color-select-input div,
#font-select-input div,
#fontsize-select-input div,
#voice-select-input div {
    font-size: 18px !important;
    font-weight: 300 !important;
    padding-right: 0 !important
}

#color-select-input>div>button>div:after {
    top: -7px
}

#color-select-input>div>button>div:after,
#font-select-input>div>button>div:after,
#fontsize-select-input>div>button>div:after {
    width: 16px;
    height: 16px;
    display: block;
    position: relative;
    content: "";
    background: url("/arrow.png");
    right: -16px
}

#color-select-input>div>button svg,
#font-select-input>div>button svg,
#fontsize-select-input>div>button svg {
    display: none !important
}

.reader-source>span:last-child {
    border-left: none
}

.reader-source>span {
    border: 1px solid red;
    padding: 0 6px;
    cursor: pointer
}

@media only screen and (max-width:780px) {
    #easyr>span {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: center;
        justify-content: center
    }

    .main-modal.easyr-open-modal {
        width: 97% !important;
        right: unset
    }
}

/*# sourceMappingURL=main.1feb41ee.css.map*/