+ #show-menu {
+ display: block;
+ float: left;
+ @include size-px(line-height, 13);
+ @include size-px(padding-top, 18);
+ @include size-px(padding-bottom, 18);
+ @include size-px(padding-left, 13);
+ @include size-px(padding-right, 13);
+ color: #0c7076;
+ @include size-px(font-size, 11);
+ @include mono;
+
+ .long {
+ display: none;
+
+ &:after {
+ @include size-px(padding-left, 10);
+ content: url("/static/img/arrow-gray.png");
+ vertical-align: top;
+ }
+ }
+
+ @media screen and (min-width: 20em) {
+ .long { display: inline; }
+ .short { display: none; }
+ }
+
+ @media screen and (min-width: 53em) {
+ display: none;
+ }
+ }
+