.hidden {
    display: none;
}
#sideView {
    height: 40vh;
    width: 55%;
    position: relative;
    top: 15vh;
    float: left;
}
    #sideView .closed {
        height: 90%;
        margin: auto;
        width: auto;
        display: block;
    }
    #sideView .open {
        width: 100%;
        height: auto;
        display: block;
        position: absolute;
        bottom: 6%;
    }
    #sideView #page {
        width: 40%;
        height: auto;
        position: absolute;
        left: 50%;
        bottom: 16%;
    }
        @keyframes flip {
            from {transform: rotate(0deg)}
            to {transform: rotate(-180deg)}
        }
        .animFlip {
            transform-origin: 0% 0%;
            animation: flip 0.3s linear 0s 1
        }
        .animFlipBack {
            transform-origin: 0% 0%;
            animation: flip 0.3s linear 0s 1;
            animation-direction: reverse
        }
    #sideView #scrollbar {
        width: 100%;
        height: 5%;
        overflow-x: scroll;
        position: absolute;
        bottom: 0;
        display: none
    }
        #sideView #scrollbar #expander {
            width: 10000px;
            height: 1%;
        }
    #sideView img {
        height: 15%;
        width: auto;
        position: absolute;
        cursor: pointer
    }
    #sideView #bookMark1 {
        top: 80%;
        left: 60%
    }
    #sideView #bookMark2 {
        top: 78%;
        left: 23%
    }
    #sideView #bookMark3 {
        top: 83%;
        left: 75%
    }
#frontView {
    height: 450pt;
    width: 625pt;
    position: absolute;
    align-self: center;
    left: calc((100% - 625pt) / 2);
    top: 70vh;
}
    #leather {
        background: #3b0102;
        width: 100%;
        height: 100%
    }
    #paper {
        background: #fdf2d9;
        height: 95%;
        width: 97%;
        margin-left: 1.5%;
        position: absolute;
        top: 2.5%;
    }
        #paper div {
            width: 50%;
            height: 100%;
        }
        #paper .left {
            background-image: linear-gradient(to right, #fadc95, #fdf2d9, #fdf2d9, #fdf2d9, #fdf2d9, #fdf2d9, #fadc95);
            cursor: w-resize;
        }
        #paper .right {
            background-image: linear-gradient(to right, #fdf2d9, #fdf2d9, #fdf2d9, #fdf2d9, #fdf2d9, #fadc95);
            cursor: e-resize;
        }
        #paper #leftPage {
            width: 97.5%;
            margin-left: 2.5%;
            padding-right: 2.5%;
            cursor: default;
            overflow: hidden;
        }
        #paper #rightPage {
            width: 95%;
            padding-left: 2.5%;
            cursor: default;
            overflow: hidden;
        }
            #paper div div p {
                text-align: justify;
                line-height: max(1.2, );
                letter-spacing: 0.5pt;
                text-indent: 10pt;
                padding-right: 2.5%
            }
.black {
    color: black
}