@media (max-width: 800px) { body { overflow-y: initial; } #mnml { font-size: 12pt; padding: 0; grid-template-columns: 1fr; grid-template-rows: 10fr 1fr; grid-template-areas: "main" "footer"; height: 100vh; max-height: initial; min-height: initial; } table td { height: 2.5em; } nav { display: none; } aside { display: none; } footer { display: flex; position: fixed; bottom: 0; width: 100%; button { font-size: 90%; } } #nav-btn, #instance-nav { display: unset; } #mnml.nav-visible nav { padding: 0.5em; margin: 0; display: block; grid-area: main; } #mnml.nav-visible main { display: none; } main { overflow-x: hidden; overflow-y: initial; max-height: 100vh; padding: 0 0.5em; } .welcome .login { width: 100%; } .welcome .options { width: 100%; flex-flow: row wrap; } .welcome .options button { flex: 1 0 50%; } .timer-container { margin: 0.5em 0 0 0; } .mobile-title { display: block; margin-bottom: 1em; } .menu-instances { display: grid; grid-template-columns: 1fr; grid-template-areas: "constructs" "inventory" "games"; } .options { flex-flow: row wrap; button { flex: 1; } } section { .list { grid-template-columns: 1fr; } } }