body { margin-left: 10px; margin-right: 10px; location: relative; }
div.top { 
    height: 20vh;
    min-height: 5em;
    width: 100%;
    min-width: 30em;
    border-bottom: 5pt double rgb(67%,67%,100%);
    border-left: 10pt solid rgb(87%,93%,87%);
    border-top: 10pt solid rgb(87%,93%,87%);
    border-right: 10pt solid rgb(87%,93%,87%);
    border-top-left-radius: 30pt;
    border-top-right-radius: 30pt;
    background: rgb(87%,93%,87%);
    box-sizing: border-box;
    position: relative;
    z-index: 10;
    white-space: nowrap;
    overflow: hidden;
}
div.top a.title {
    font-family: "Lobster Two", sans-serif;
    position: absolute; top: 2%; left: 5%;
    font-size: 250%;
    text-decoration: none;
    color: black;
}
div.top span.sub {
    position: absolute; bottom: 10%; right: 10%;
    font-size: 150%;
}
div.top span.sub span.from {
    font-size: 80%; font-style: italic;
}
div.top span.sub a.booktit {
    font-family: "Dancing Script", sans-serif;
    text-decoration: none;
    color: black;
}
div.top a.title:hover, div.top span.sub a.booktit:hover {
    color: rgb(13%,27%,13%);
}
div.index {
    width: 100px;
    padding-right: 5pt;
    height: 80vh; /* A vh is 1% of the window height. */
    overflow-y: scroll;
    z-index: 8;
}
div.index div { text-align: center;
      		margin-right: auto; margin-left: auto;
		border: 1px solid rgb(93%,100%,93%);
	      }
div.image {
    position: absolute;
    left: 120px; top: 20vh;
    height: 80vh;
    text-align: center;
    z-index: 2;
}
div.image img { height: 100%; }
#me { border: 1px solid black; }