1 /* This Source Code Form is subject to the terms of the Mozilla Public
2 * License, v. 2.0. If a copy of the MPL was not distributed with this file,
3 * You can obtain one at http://mozilla.org/MPL/2.0/. */
6 font-family: sans-serif;
8 background: url("loading.png") repeat;
19 transition-property: opacity;
20 transition-duration: .2s;
26 transition-duration: 1s;
29 #dialogArea:-moz-system-metric(touch-enabled),
30 .overlayArea:-moz-system-metric(touch-enabled),
31 .menuDrawer:-moz-system-metric(touch-enabled) {
35 #dialogArea input[type="button"]:-moz-system-metric(touch-enabled),
36 #dialogArea input[type="text"]:-moz-system-metric(touch-enabled),
37 #dialogArea select:-moz-system-metric(touch-enabled),
38 .overlayArea input[type="button"]:-moz-system-metric(touch-enabled),
39 .overlayArea select:-moz-system-metric(touch-enabled),
40 .menuDrawer input[type="button"]:-moz-system-metric(touch-enabled),
41 .menuDrawer select:-moz-system-metric(touch-enabled) {
57 #zoomArea > input[type="button"],
58 #fullscreenArea > input[type="button"],
66 background-color: rgba(255, 255, 255, .25);
67 background-image: radial-gradient(circle 1.5em, #FFFFFF, transparent);
72 #zoomArea > input[type="button"] {
73 border: 2px solid #0000FF;
76 #zoomArea > input[type="button"]:hover,
77 #fullscreenArea > input[type="button"]:hover,
79 #settingsButton:hover {
80 background-color: rgba(255, 255, 255, .8);
83 #zoomArea > input[type="button"]:active,
84 #fullscreenArea > input[type="button"]:active,
86 #settingsButton:active {
87 background-color: rgba(255, 255, 127, .8);
90 #zoomArea > input[type="button"]:focus,
91 #fullscreenArea > input[type="button"]:focus,
93 #settingsButton:focus {
94 background-color: rgba(255, 255, 255, .5);
104 /* background-color: rgba(255, 255, 255, .8); */
105 background-image: radial-gradient(circle 1.5em, #FFFFFF, transparent);
115 left: calc(-40ch - 1ch); /* account for padding */
117 background-color: rgba(15, 15, 15, .9);
120 padding: 0 .5ch; /* account for legend */
123 transition-property: left;
124 transition-duration: 1s;
125 transition-timing-function: ease;
128 .menuDrawer:not(.hidden) {
132 @media screen and (max-width: 330px) {
134 left: calc(-300px - 1ch); /* account for padding */
143 background-color: rgba(255, 255, 255, .8);
149 .menuDrawer > h2 > img {
150 vertical-align: text-top;
181 background-color: rgba(255, 255, 255, .8);
187 vertical-align: text-bottom;
206 background-color: rgba(255, 255, 255, 1);
222 background-color: rgba(255, 255, 255, .8);
248 @media screen and (max-width: 500px),
249 screen and (max-height: 500px) {