.toggle-btns { position: sticky; } button.toggle.open:not(.see-more) { font-weight: bold; } button.toggle.left::after { margin-left: var(--unit--horizontal); } button.toggle.left.close::after { content: "+"; } button.toggle.left.open::after { content: "-"; } button.toggle.right::before { margin-right: var(--unit--horizontal); } button.toggle.right.close::before { content: "+"; } button.toggle.right.open::before { content: "-"; } #tabs { --mg: 4; position: relative; margin-top: calc(0px - (2 * var(--unit--vertical))); margin-bottom: calc((var(--mg) / 2) * var(--unit--vertical)); } #tabs.safari { margin-top: calc(-60px - (3 * var(--unit--vertical))); } #home #tabs { margin-top: calc(0px - (6 * var(--unit--vertical))); } .active-tab { max-height: 70vh; overflow: auto; margin-top: calc((var(--unit--vertical) * 0.5)); transition: height 0.5s ease-in-out; } .page-cover.open .active-tab { height: calc(100vh - 7.5 * var(--unit--vertical)); } .texts__year.short .year__edito { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; } .texts__year .see-more { width: 100%; margin-top: calc(var(--unit--vertical) / 2); } @media screen and (min-width: 640px) { #home #tabs { margin-top: calc(0px - (10 * var(--unit--vertical))); } button.toggle.left::after { margin-left: calc(var(--unit--horizontal) / 2); } button.toggle.right::before { margin-right: calc(var(--unit--horizontal) / 2); } }