section.book-index-header { display: grid; grid-template-columns: 1fr 1fr; margin: 100px auto 20px; width: 100%; max-width: 900px; } section.book-index-header > div.book-index-header-left { text-transform: capitalize; display: inline-block; color: var(--white); font-size: 3em; } section.book-index-header > div.book-index-header-right { text-align: right; display: inline-block; } section.book-index-pages { margin: 0 auto; width: 100%; max-width: 900px; } section.book-index-pages > a.page-link { vertical-align: top; display: inline-block; width: 100%; text-decoration: none; margin: 0 0 20px; border-radius: 3px; height: 350px; overflow: hidden; } section.book-index-pages > a.page-link div.page-video { width: 100%; height: 350px; display: flex; justify-content: left; align-items: center; border-radius: 5px; border-bottom: none; position: relative; } section.book-index-pages > a.page-link video { width: 100%; height: 100%; position: absolute; object-fit: cover; } section.book-index-pages > a.page-link > div.page-bg { width: 100%; height: 350px; display: flex; justify-content: left; align-items: center; border-radius: 5px; border-bottom: none; position: relative; } section.book-index-pages aside { font-size: 1.1em; color: var(--white); text-shadow: 2px 2px 2px var(--black); padding: 10px; position: relative; } section.book-index-pages hr { color: var(--white); border: 0.1px solid; margin: 7px 0; } section.book-index-pages button[data-active="true"] { background: var(--primary); color: var(--primary-highlight); } section.book-index-pages button[data-active="false"] { background: var(--secondary); } section.book-index-pages > div.paginate { width: fit-content; margin: 0 auto; font-size: 1.5em; color: var(--secondary-highlight); } section.book-index-pages > div.paginate i { color: var(--secondary); } section.book-index-pages > div.paginate a, section.book-index-pages > div.paginate span { display: inline; } section.book-index-pages > div.paginate span { position: relative; top: -15px; }