@media only screen and (max-width: 768px) { #body-login #header { padding-top: 10px; } /* don’t show appname next to logo on narrow screens */ .header-appname { display: none; } /* slightly different caret position when appname isn’t shown */ #header .icon-caret { height: 15px; } #body-login .wrapper { display: -webkit-box; -webkit-box-orient: horizontal; -webkit-box-pack: center; -webkit-box-align: center; display: -moz-box; -moz-box-orient: horizontal; -moz-box-pack: center; -moz-box-align: center; display: box; box-orient: horizontal; box-pack: center; box-align: center; } /* compress search box on mobile, expand when focused */ .searchbox input[type="search"] { width: 15%; -webkit-transition: width 100ms; -moz-transition: width 100ms; -o-transition: width 100ms; transition: width 100ms; } .searchbox input[type="search"]:focus, .searchbox input[type="search"]:active { width: 155px; max-width: 50%; } /* do not show display name on mobile when profile picture is present */ #header .avatardiv.avatardiv-shown + #expandDisplayName { display: none; } /* don’t require a minimum width for controls bar */ #controls { min-width: initial !important; } /* position share dropdown */ #dropdown { margin-right: 10% !important; width: 80% !important; } /* fix error display on smaller screens */ .error-wide { width: 100%; margin-left: 0 !important; -moz-box-sizing: border-box; box-sizing: border-box; } }