Tweak sidebar css to simplify it

We can change the logic subtly and reduce replication of properties.
Also set visibility to improve accessibility.

Signed-off-by: Martyn Welch <martyn.welch@collabora.com>

themes/beautifulhugo/static/css/main.css

@@ -840,13 +840,11 @@ div.notices.tip p:first-child:after {
   font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
 }
 
-.sidebar-hidden {
-  width: 0px;
-}
-
-@media only screen and (min-width: 1450px) {
+@media not screen, screen and (max-width: 1450px) {
   .sidebar-hidden {
-    width: 300px;
+    width: 0px;
+    visibility: hidden;
+    transition: width 0.5s, visibility 0s linear 0.5s;
   }
 }