html { height: 100%; box-sizing: border-box; } *, *:before, *:after { box-sizing: inherit; } body { position: relative; margin: 0; padding-bottom: 5rem; min-height: 100%; } footer { position: absolute; right: 0; bottom: 0; left: 0; padding: 1.5rem; text-align: center; } header{ /*min-height:10%;*/ /*height: 15vh;*/ text-align:center; padding: 1.5rem/*var(--hf-padding)*/; margin-bottom:/*1%*/0; } nav{ /*min-width:10%; max-width:10%;*/ /*width:100px; min-height:var(--main-height); max-width:10%; padding:5px; padding-top:0%; display:inline-block; vertical-align:top;*/ text-align:center; padding:0.2rem; } .nav-tab{ /*width:100%;*/ margin:0.1rem; padding-top: 0.4rem; padding-bottom: 0.4rem; padding-left: 1rem; padding-right: 1rem; display:inline-block; text-align:center; } main{ /*width: 80%;*/ background-color:white; min-height: 60vh; width:100%; display:inline-block; padding-left:4%; padding-right:4%; padding-top:2rem; padding-bottom:2rem; } ol, ul { padding-left:2rem; } li > * { vertical-align: top; } p{ text-align:justify; margin-bottom:1rem; } .social{ margin:0.4rem; } details{ display:inline-block; block-size:fit-contents; } summary{ padding:0.8em; margin-bottom:0.25rem; } summary h2, summary h3, summary h4, summary h5, summary h6 { display:inline; } details.heading{ display:block; margin-bottom:0.1rem; }