@media only screen and (max-width: 768px) { #body-login #header { padding-top: 10px; } #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; } /* app sidebar toggle and swipe */ #app-navigation, #app-content { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } #app-navigation { width: 230px !important; } #app-content { width: 100% !important; left: 0 !important; background-color: #fff; overflow-x: hidden !important; } #app-navigation-toggle { position: fixed; display: inline-block !important; top: 45px; left: 0; width: 44px; height: 44px; z-index: 149; background-color: rgba(255, 255, 255, .7); cursor: pointer; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; filter: alpha(opacity=60); opacity: .6; } #app-navigation-toggle:hover, #app-navigation-toggle:focus { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; } /* fix controls bar for apps which don't use the standard */ #body-user .app-files #controls, #user-controls { left: 0 !important; padding-left: 44px !important; } table.multiselect thead { left: 0 !important; } /* shorten elements for mobile */ #uploadprogresswrapper { width: 50px; } /* fix controls bar jumping when navigation is slid out */ .snapjs-left #app-navigation-toggle { top: 0; } .snapjs-left .app-files #controls, .snapjs-left #user-controls { top: 0; } .snapjs-left table.multiselect thead { top: 44px; } /* end of media query */ }