@media only screen and (max-width: 1025px) {
    button.btnPrev, button.btnNext {
        top: calc(50% - 35px);
        border-radius: 15px;
        width: 52px;
        height: 70px;
    }
    button.btnPrev i.material-icons, button.btnNext i.material-icons {
        font-size: 60px;
    }
    .bookmarkContainer i {
        font-size: 35px;
    }
    .bookmarkContainer {
        width: 12px;
        height: 12px;
    }
    div#bottomFooterMini i.material-icons {
        font-size: 40px;
    }
    #panzoomBtnContainer {
        height: 50px;
    }
    #panzoomBtnContainer button i {
        font-size: 25px;
    }
    div#topHeader button i.material-icons, div#bottomFooter button i.material-icons {
        width: 40px;
        height: 40px;
        font-size: 16px;
    }
    div#topHeader button, div#rightBottomFooter button, #highlightsMenu {
        font-size: 13px;
    }
    div#topHeader {
        padding: .5em 0;
    }
    div#bottomFooter, div#menu, #highlightsMenu {
        height: 80px;
    }
    .tocContainer h2, #annotationsWrapper h1, #highlightsWrapper h1, #notesWrapper h1, #bookmarksWrapper h1 {
        font-size: 22px;
        padding: 0.5em .3em;
    }
    .btnColorPickerContent {
        width: 20px;
        height: 20px;
    }
    .btnColorPicker {
        height: 40px !important;
        width: 40px !important;
    }
    div#menu button i.material-icons, div#highlightsMenu button i.material-icons {
        font-size: 20px !important;
        width: 40px !important;
        height: 40px !important;
    }
}
@media only screen and (max-width: 750px) {
    button.btnPrev, button.btnNext {
        top: calc(50% - 27px);
        border-radius: 7px;
        width: 37px;
        height: 55px;
    }
    button.btnPrev i.material-icons, button.btnNext i.material-icons {
        font-size: 50px;
    }
    div#bottomFooterMini i.material-icons {
        font-size: 30px;
    }
    #panzoomBtnContainer {
        height: 30px;
    }
    #panzoomBtnContainer button i {
        font-size: 22px;
    }
    div#topHeader button i.material-icons, div#bottomFooter button i.material-icons {
        width: 30px;
        height: 30px;
        font-size: 12px;
    }
    div#topHeader button, div#rightBottomFooter button, #highlightsMenu {
        font-size: 12px;
    }
    div#topHeader {
        padding: .5em 0;
    }
    div#bottomFooter, div#menu, #highlightsMenu {
        height: 60px;
        width: 100%;
    }
    div#leftBottomFooter {
        flex-direction: column;
        justify-content: center;
    }
    div#leftBottomFooter button {
        font-size: 12px;
        width: 100px;
        border-right: none;
        height: auto;
        line-height: 12px;
    }
    .btnHideHighlights {
        border-bottom: 2px solid white !important;
        padding-bottom: 7px !important;
    }
    .btnHideNotes {
        padding-top: 5px !important;
    }
    .tocContainer h2, #annotationsWrapper h1, #highlightsWrapper h1, #notesWrapper h1, #bookmarksWrapper h1 {
        font-size: 18px;
        padding: 0.5em .3em;
    }
    .btnColorPickerContent {
        width: 15px;
        height: 15px;
    }
    .btnColorPicker {
        height: 35px !important;
        width: 35px !important;
    }
    div#menu button i.material-icons, div#highlightsMenu button i.material-icons {
        font-size: 17px !important;
        width: 35px !important;
        height: 35px !important;
    }
    .txtGoToLabel {
        font-size: 12px;
        min-width: 70px;
    }
    .tocContainer ol {
        padding-inline-start: 10px;
        padding-inline-end: 10px;
        font-size: 12px;
    }
    .wPaint-menu {
        transform: translateX(-50%) scale(0.6) !important;
    }
    #menu button, #highlightsMenu button, .btnColorPickerContainer {
        font-size: 12px;
    }
}
@media only screen and (max-width: 420px) {
    button.btnPrev, button.btnNext {
        top: calc(50% - 20px);
        border-radius: 7px;
        width: 32px;
        height: 40px;
    }
    button.btnPrev i.material-icons, button.btnNext i.material-icons {
        font-size: 40px;
    }
    div#bottomFooterMini i.material-icons {
        font-size: 32px;
    }
    #panzoomBtnContainer {
        height: 41px;
    }
    #panzoomBtnContainer button i {
        font-size: 22px;
    }
    .topNavDrawer {
        align-items: flex-start;
    }
    div#topHeader button, div#rightBottomFooter button, #highlightsMenu {
        font-size: 9px;
        min-width: fit-content;
        width: auto;
    }
    div#topHeader button i.material-icons, div#bottomFooter button i.material-icons {
        width: 25px;
        height: 25px;
        font-size: 11px;
    }
    div#bottomFooter, div#menu, #highlightsMenu {
        height: 70px;
        width: 100%;
    }
    .txtGoToLabel {
        font-size: 11px;
        min-width: auto;
        text-align: center;
    }
    input.txtGoTo {
        width: 40px;
    }
    div#leftBottomFooter {
        flex-direction: column;
        justify-content: center;
    }
    div#leftBottomFooter button {
        font-size: 11px;
        width: auto;
        border-right: none;
        height: auto;
    }
    .btnHideHighlights {
        border-bottom: 2px solid white !important;
        padding-bottom: 7px !important;
    }
    .btnHideNotes {
        padding-top: 5px !important;
    }
    .btnColorPickerContainer {
        font-size: 11px;
    }
    .btnColorPicker {
        height: 35px !important;
        width: 35px !important;
    }
    .btnColorPickerContent {
        width: 15px;
        height: 15px;
    }
    .notesColorPickerPanel.btnColorPickerPanel {
        display: flex;
        left: 0;
        transform: none;
        height: 30px;
    }
    #highlightColorPickerPanel {
        display: flex;
        right: 0px;
        transform: none;
        left: auto;
        height: 30px;
    }
    .btnColorPickerPanelItem {
        width: 15px;
        height: 15px;
    }
    div#menu button i.material-icons, div#highlightsMenu button i.material-icons {
        font-size: 16px !important;
        width: 35px !important;
        height: 35px !important;
    }
    #menu button, #highlightsMenu button {
        font-size: 11px;
    }
    .tocContainer ol {
        padding-inline-start: 10px;
        padding-inline-end: 10px;
    }
    #highlightsWrapper, #notesWrapper, #bookmarksWrapper, #annotationsWrapper, #tocWrapper {
        width: 55%;
        font-size: 10px;
    }
    .tocContainer h2, #annotationsWrapper h1, #highlightsWrapper h1, #notesWrapper h1, #bookmarksWrapper h1 {
        font-size: 16px;
        padding: 0.5em .3em;
    }
}