html { min-height: 100%; } body { color: #777; min-ehgiht: 100%; } div.content { padding: 15px; min-height: 100%; color: black; } .header { margin-left: 0; } #menu { width: 100%; height: 40px; position: relative; background: #191818; webkit-overflow-scrolling: touch; } #menu .pure-menu-heading { display: inline-block; } #menu .menu-button { display: inline; position: absolute; top: 0px; right: 0px; margin-top: 10px; margin-right: 10px; color: white; text-decoration: none; } .menu-bottom { width: 150px; border-top: 1px solid white; } #menu .menu-container { display: none; position: absolute; right: 0px; top: 40px; background-color: #191818; } #menu .menu-container>ul { background-color: #191818; } input.uuid-field { width: 360px; } @media (min-width: 40em) { #menu { width: 150px; height: 100%; position: fixed; } #menu .menu-button { display: none; } #menu .menu-container{ display: initial; width: 100%; } .menu-bottom { width: 150px; position: fixed; left: 0px; bottom: 0px; } .header { margin-left: 150px; } aside.flash { margin-left: 150px; } .content { margin-left: 150px; } } @media screen and (max-width:35.5em) { div.pure-control-group label.control-label { text-align: left; } } @media screen and (max-width:64em) and (min-width: 48em) { div.pure-control-group label.control-label { text-align: left; } }