@media (max-width: 1024px) {
.index-container { position: fixed; display: flex; align-items: center; flex-direction: column; bottom: 5vw; right: 5vw; background-color: #FCCEC0; padding: 1.5vh; border-radius: 100%; width: 10vh; height: 10vh; z-index: 1; }
.index-container:focus-within .index-header, .index-container:focus .index-header { height: 0; overflow: hidden; }
.index-container:focus-within .index-content, .index-container:focus .index-content { height: 100%; overflow-y: auto; overflow-x: hidden; }
.index-container:focus-within, .index-container:focus { width: 33vw; max-height: 50vh; height: auto; border-radius: 25px; padding: 48px 48px; align-items: flex-start; }
.index-header { width: 100%; height: 100%; position: relative; display: flex; align-items: center; justify-content: center; width: 100%; text-align: center; font-family: var(--secondary-font); font-weight: 800; font-style: normal; font-size: 2vh; color: rgba(13, 75, 94, 1); text-transform: uppercase; }
.index-content { font-family: var(--main-font); font-size: 2vh; font-style: normal; font-weight: 300; letter-spacing: 0em; text-align: left; color: #000000; width: 100%; padding-right: 25px; }
.index-header > .vertical-breaker { display: none; }
#figures-button { display: none; }
#references-button { display: none; }
.index-header > div { cursor: pointer; }
.index-content { height: 0px; overflow: hidden; }
.index-content > div { margin-bottom: 24px; padding-left: 18px; cursor: pointer; }
.index-content > .active { border-left: 0.5vw solid #0D4B5E; padding-left: 12px; }
.index-content::-webkit-scrollbar { width: 5px; }
.index-content::-webkit-scrollbar-thumb { background-color: rgba(0, 0, 0, 0.1); border-radius: 100px; height: 10px; }
.index-content::-webkit-scrollbar-track { background-color: rgba(255, 255, 255, 0.2); border-radius: 100px; }
}