:root{--color-su-primary: #002f5f;--color-su-primary-80: #33587f;font-family:system-ui,Avenir,Helvetica,Arial,sans-serif}*{box-sizing:border-box}body{margin:0}#app{height:100vh;background-color:var(--color-su-primary);display:flex;justify-content:center;flex-direction:column;text-align:center;color:#fff;padding:1em;align-items:center}#app>img{max-width:30em}header{height:4em;background-color:var(--color-su-primary);display:flex;justify-content:space-between;align-items:center;padding-right:1em;color:#fff}header img{max-height:100%}menu.main{position:fixed;bottom:0;background-color:var(--color-su-primary);margin:0;padding:0;left:0;right:0;display:flex}menu.main li{list-style:none;margin:0;flex-basis:1px}menu.main li:last-child{margin-left:auto}menu.main a,menu.main button{color:#fff;padding:1.3em;display:block;margin:0;height:100%;width:100%;min-width:5em}menu.main button{background:none;border:none}menu.main button span{transform:rotate(90deg);display:block}menu.main menu.sub.visible{display:flex}menu.main menu.sub{flex-direction:column-reverse;display:none;position:absolute;bottom:100%;right:0;padding:0;margin:0;color:#fff;background-color:var(--color-su-primary-80)}menu.main menu.sub li{min-width:10em;padding:1em;border:1px solid black;border-bottom:none}#layout{min-height:100vh}main{padding:0 1em}