header .minimenu { display: none; } @media only screen and (max-width: 600px) { header { position: fixed; top: 0; left: 0; z-index: 10; width: 100%; max-height: 100vh; height: 60px; overflow: hidden; .minimenu { display: block; position: absolute; right: 3px; top: 3px; } section { display: block; nav { display: none; } } } header.expanded { overflow: auto; height: auto; nav { display: block; text-align: center; ul { flex-wrap: wrap; justify-content: right; li > * { padding: 18px; } } } } .container { margin-top: 65px; .content { max-width: unset; margin: 6px; section { article { padding: 10px; } .image { padding: 0; margin: 10px -6px; } &.directory article.entry { width: 100%; margin-left: 0; } } } .aside-wrap + .content { max-width: unset; margin-top: 120px; } .aside-wrap { z-index: 3; top: 60px; position: fixed; width: 100%; margin: 0; height: auto; left: 0; .aside { margin: 0; padding: 0; top: 0; position: unset; & > h2 { position: relative; cursor: pointer; padding: 5px 10px; &:after { content: "v"; font-family: $bodyfont; font-weight: bold; color: $lien; position: absolute; right: 10px; } } &:not(.expanded) { .aside-content { display: none; } } ul { text-align: center; li { display: inline-block; & > * { display: block; padding: 15px; } } } .aside-content { max-height: calc(100vh - 110px); } } } } }