PluginProbe ʕ •ᴥ•ʔ
EmbedPress – PDF Embedder, 3D PDF FlipBook, Google Reviews, YouTube Videos, Upload & Embed PDF documents / 3.6.2
EmbedPress – PDF Embedder, 3D PDF FlipBook, Google Reviews, YouTube Videos, Upload & Embed PDF documents v3.6.2
4.6.0 4.5.6 4.5.5 4.5.4 4.5.3 4.5.2 trunk 1.0.0 1.1.0 1.1.1 1.1.2 1.1.3 1.2.0 1.3.0 1.3.1 1.4.0 1.4.1 1.4.2 1.4.3 1.4.4 1.5.0 1.6.0 1.6.1 1.6.2 1.6.3 1.7.0 1.7.1 1.7.2 1.7.3 1.7.4 1.7.5 2.0.0 2.0.1 2.0.2 2.0.3 2.1.0 2.1.1 2.1.2 2.1.3 2.1.4 2.1.5 2.1.6 2.2.0 2.2.1 2.2.2 2.3.0 2.3.1 2.3.2 2.3.3 2.4.0 2.4.1 2.5.0 2.5.1 2.5.2 2.5.3 2.5.4 2.5.5 2.6.0 2.6.1 2.6.2 2.7.0 2.7.1 2.7.2 2.7.3 2.7.4 2.7.5 2.7.6 2.7.7 3.0.0 3.0.1 3.0.2 3.0.3 3.0.4 3.1.0 3.1.1 3.1.2 3.1.3 3.2.0 3.2.1 3.3.0 3.3.1 3.3.2 3.3.3 3.3.4 3.3.5 3.3.6 3.3.7 3.4.0 3.4.1 3.4.2 3.4.3 3.5.0 3.5.1 3.5.2 3.5.3 3.6.0 3.6.1 3.6.2 3.6.3 3.6.4 3.6.5 3.6.6 3.6.7 3.6.8 3.7.0 3.7.1 3.7.2 3.7.3 3.8.0 3.8.1 3.8.2 3.8.3 3.8.4 3.8.5 3.9.0 3.9.1 3.9.10 3.9.11 3.9.12 3.9.13 3.9.14 3.9.15 3.9.16 3.9.17 3.9.2 3.9.3 3.9.4 3.9.5 3.9.6 3.9.7 3.9.8 3.9.9 4.0.0 4.0.1 4.0.10 4.0.11 4.0.12 4.0.13 4.0.14 4.0.2 4.0.3 4.0.4 4.0.5 4.0.6 4.0.7 4.0.8 4.0.9 4.1.0 4.1.1 4.1.10 4.1.2 4.1.3 4.1.4 4.1.5 4.1.6 4.1.7 4.1.8 4.1.9 4.2.0 4.2.1 4.2.2 4.2.3 4.2.4 4.2.5 4.2.6 4.2.7 4.2.8 4.2.9 4.3.0 4.3.1 4.4.0 4.4.1 4.4.10 4.4.11 4.4.2 4.4.3 4.4.4 4.4.5 4.4.6 4.4.7 4.4.8 4.4.9 4.5.0 4.5.1
embedpress / assets / pdf / web / viewer.css
embedpress / assets / pdf / web Last commit date
images 4 years ago locale 4 years ago viewer.css 3 years ago viewer.html 3 years ago viewer.js 4 years ago
viewer.css
2762 lines
1 /* Copyright 2014 Mozilla Foundation
2 *
3 * Licensed under the Apache License, Version 2.0 (the "License");
4 * you may not use this file except in compliance with the License.
5 * You may obtain a copy of the License at
6 *
7 * http://www.apache.org/licenses/LICENSE-2.0
8 *
9 * Unless required by applicable law or agreed to in writing, software
10 * distributed under the License is distributed on an "AS IS" BASIS,
11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12 * See the License for the specific language governing permissions and
13 * limitations under the License.
14 */
15
16 /* Modified version */
17
18 .textLayer {
19 position: absolute;
20 left: 0;
21 top: 0;
22 right: 0;
23 bottom: 0;
24 overflow: hidden;
25 opacity: 0.2;
26 line-height: 1;
27 }
28
29 .textLayer span,
30 .textLayer br {
31 color: transparent;
32 position: absolute;
33 white-space: pre;
34 cursor: text;
35 transform-origin: 0% 0%;
36 }
37
38 .textLayer .highlight {
39 position: relative;
40 margin: -1px;
41 padding: 1px;
42 background-color: rgba(180, 0, 170, 1);
43 border-radius: 4px;
44 }
45
46 .textLayer .highlight.begin {
47 border-radius: 4px 0 0 4px;
48 }
49
50 .textLayer .highlight.end {
51 border-radius: 0 4px 4px 0;
52 }
53
54 .textLayer .highlight.middle {
55 border-radius: 0;
56 }
57
58 .textLayer .highlight.selected {
59 background-color: rgba(0, 100, 0, 1);
60 }
61
62 .textLayer ::-moz-selection {
63 background: rgba(0, 0, 255, 1);
64 }
65
66 .textLayer ::selection {
67 background: rgba(0, 0, 255, 1);
68 }
69
70 .textLayer .endOfContent {
71 display: block;
72 position: absolute;
73 left: 0;
74 top: 100%;
75 right: 0;
76 bottom: 0;
77 z-index: -1;
78 cursor: default;
79 -webkit-user-select: none;
80 -moz-user-select: none;
81 user-select: none;
82 }
83
84 .textLayer .endOfContent.active {
85 top: 0;
86 }
87
88
89 .annotationLayer section {
90 position: absolute;
91 text-align: initial;
92 }
93
94 .annotationLayer .linkAnnotation > a,
95 .annotationLayer .buttonWidgetAnnotation.pushButton > a {
96 position: absolute;
97 font-size: 1em;
98 top: 0;
99 left: 0;
100 width: 100%;
101 height: 100%;
102 }
103
104 .annotationLayer .linkAnnotation > a:hover,
105 .annotationLayer .buttonWidgetAnnotation.pushButton > a:hover {
106 opacity: 0.2;
107 background: rgba(255, 255, 0, 1);
108 box-shadow: 0 2px 10px rgba(255, 255, 0, 1);
109 }
110
111 .annotationLayer .textAnnotation img {
112 position: absolute;
113 cursor: pointer;
114 }
115
116 .annotationLayer .textWidgetAnnotation input,
117 .annotationLayer .textWidgetAnnotation textarea,
118 .annotationLayer .choiceWidgetAnnotation select,
119 .annotationLayer .buttonWidgetAnnotation.checkBox input,
120 .annotationLayer .buttonWidgetAnnotation.radioButton input {
121 background-color: rgba(0, 54, 255, 0.13);
122 border: 1px solid transparent;
123 box-sizing: border-box;
124 font-size: 9px;
125 height: 100%;
126 margin: 0;
127 padding: 0 3px;
128 vertical-align: top;
129 width: 100%;
130 }
131
132 .annotationLayer .choiceWidgetAnnotation select option {
133 padding: 0;
134 }
135
136 .annotationLayer .buttonWidgetAnnotation.radioButton input {
137 border-radius: 50%;
138 }
139
140 .annotationLayer .textWidgetAnnotation textarea {
141 font: message-box;
142 font-size: 9px;
143 resize: none;
144 }
145
146 .annotationLayer .textWidgetAnnotation input[disabled],
147 .annotationLayer .textWidgetAnnotation textarea[disabled],
148 .annotationLayer .choiceWidgetAnnotation select[disabled],
149 .annotationLayer .buttonWidgetAnnotation.checkBox input[disabled],
150 .annotationLayer .buttonWidgetAnnotation.radioButton input[disabled] {
151 background: none;
152 border: 1px solid transparent;
153 cursor: not-allowed;
154 }
155
156 .annotationLayer .textWidgetAnnotation input:hover,
157 .annotationLayer .textWidgetAnnotation textarea:hover,
158 .annotationLayer .choiceWidgetAnnotation select:hover,
159 .annotationLayer .buttonWidgetAnnotation.checkBox input:hover,
160 .annotationLayer .buttonWidgetAnnotation.radioButton input:hover {
161 border: 1px solid rgba(0, 0, 0, 1);
162 }
163
164 .annotationLayer .textWidgetAnnotation input:focus,
165 .annotationLayer .textWidgetAnnotation textarea:focus,
166 .annotationLayer .choiceWidgetAnnotation select:focus {
167 background: none;
168 border: 1px solid transparent;
169 }
170
171 .annotationLayer .buttonWidgetAnnotation.checkBox input:checked:before,
172 .annotationLayer .buttonWidgetAnnotation.checkBox input:checked:after,
173 .annotationLayer .buttonWidgetAnnotation.radioButton input:checked:before {
174 background-color: rgba(0, 0, 0, 1);
175 content: "";
176 display: block;
177 position: absolute;
178 }
179
180 .annotationLayer .buttonWidgetAnnotation.checkBox input:checked:before,
181 .annotationLayer .buttonWidgetAnnotation.checkBox input:checked:after {
182 height: 80%;
183 left: 45%;
184 width: 1px;
185 }
186
187 .annotationLayer .buttonWidgetAnnotation.checkBox input:checked:before {
188 transform: rotate(45deg);
189 }
190
191 .annotationLayer .buttonWidgetAnnotation.checkBox input:checked:after {
192 transform: rotate(-45deg);
193 }
194
195 .annotationLayer .buttonWidgetAnnotation.radioButton input:checked:before {
196 border-radius: 50%;
197 height: 50%;
198 left: 30%;
199 top: 20%;
200 width: 50%;
201 }
202
203 .annotationLayer .textWidgetAnnotation input.comb {
204 font-family: monospace;
205 padding-left: 2px;
206 padding-right: 0;
207 }
208
209 .annotationLayer .textWidgetAnnotation input.comb:focus {
210 /*
211 * Letter spacing is placed on the right side of each character. Hence, the
212 * letter spacing of the last character may be placed outside the visible
213 * area, causing horizontal scrolling. We avoid this by extending the width
214 * when the element has focus and revert this when it loses focus.
215 */
216 width: 115%;
217 }
218
219 .annotationLayer .buttonWidgetAnnotation.checkBox input,
220 .annotationLayer .buttonWidgetAnnotation.radioButton input {
221 -webkit-appearance: none;
222 -moz-appearance: none;
223 appearance: none;
224 padding: 0;
225 }
226
227 .annotationLayer .popupWrapper {
228 position: absolute;
229 width: 20em;
230 }
231
232 .annotationLayer .popup {
233 position: absolute;
234 z-index: 200;
235 max-width: 20em;
236 background-color: rgba(255, 255, 153, 1);
237 box-shadow: 0 2px 5px rgba(136, 136, 136, 1);
238 border-radius: 2px;
239 padding: 6px;
240 margin-left: 5px;
241 cursor: pointer;
242 font: message-box;
243 font-size: 9px;
244 white-space: normal;
245 word-wrap: break-word;
246 }
247
248 .annotationLayer .popup > * {
249 font-size: 9px;
250 }
251
252 .annotationLayer .popup h1 {
253 display: inline-block;
254 }
255
256 .annotationLayer .popup span {
257 display: inline-block;
258 margin-left: 5px;
259 }
260
261 .annotationLayer .popup p {
262 border-top: 1px solid rgba(51, 51, 51, 1);
263 margin-top: 2px;
264 padding-top: 2px;
265 }
266
267 .annotationLayer .highlightAnnotation,
268 .annotationLayer .underlineAnnotation,
269 .annotationLayer .squigglyAnnotation,
270 .annotationLayer .strikeoutAnnotation,
271 .annotationLayer .freeTextAnnotation,
272 .annotationLayer .lineAnnotation svg line,
273 .annotationLayer .squareAnnotation svg rect,
274 .annotationLayer .circleAnnotation svg ellipse,
275 .annotationLayer .polylineAnnotation svg polyline,
276 .annotationLayer .polygonAnnotation svg polygon,
277 .annotationLayer .caretAnnotation,
278 .annotationLayer .inkAnnotation svg polyline,
279 .annotationLayer .stampAnnotation,
280 .annotationLayer .fileAttachmentAnnotation {
281 cursor: pointer;
282 }
283
284
285 .xfaLayer {
286 position: absolute;
287 top: 0;
288 left: 0;
289 z-index: 200;
290 transform-origin: 0 0;
291 }
292
293 .xfaLayer * {
294 color: inherit;
295 font: inherit;
296 font-style: inherit;
297 font-weight: inherit;
298 font-kerning: inherit;
299 letter-spacing: inherit;
300 text-align: inherit;
301 text-decoration: inherit;
302 vertical-align: inherit;
303 box-sizing: border-box;
304 background: transparent;
305 }
306
307 .xfaLayer a {
308 color: blue;
309 }
310
311 .xfaRich li {
312 margin-left: 3em;
313 }
314
315 .xfaFont {
316 color: black;
317 font-weight: normal;
318 font-kerning: none;
319 font-size: 10px;
320 font-style: normal;
321 letter-spacing: 0;
322 text-decoration: none;
323 vertical-align: 0;
324 }
325
326 .xfaDraw {
327 z-index: 100;
328 }
329
330 .xfaExclgroup {
331 z-index: 200;
332 }
333
334 .xfaField {
335 z-index: 300;
336 }
337
338 .xfaRich {
339 z-index: 300;
340 line-height: 1.2;
341 }
342
343 .xfaSubform {
344 z-index: 200;
345 }
346
347 .xfaLabel {
348 display: flex;
349 flex-direction: row;
350 align-items: center;
351 width: 100%;
352 height: 100%;
353 }
354
355 .xfaCaption {
356 flex: 1 1 auto;
357 }
358
359 .xfaBorderDiv {
360 background: transparent;
361 position: absolute;
362 pointer-events: none;
363 }
364
365 .xfaWrapper {
366 position: relative;
367 display: flex;
368 align-items: center;
369 justify-content: center;
370 width: auto;
371 height: auto;
372 }
373
374 .xfaContentArea {
375 overflow: hidden;
376 }
377
378 .xfaTextfield,
379 .xfaSelect {
380 background-color: rgba(0, 54, 255, 0.13);
381 }
382
383 .xfaTextfield:focus,
384 .xfaSelect:focus {
385 background-color: transparent;
386 }
387
388 .xfaTextfield,
389 .xfaSelect {
390 width: 100%;
391 height: 100%;
392 flex: 100 1 0;
393 border: none;
394 resize: none;
395 }
396
397 .xfaLabel > input[type="radio"] {
398 /* Use this trick to make the checkbox invisible but
399 but still focusable. */
400 position: absolute;
401 left: -99999px;
402 }
403
404 .xfaLabel > input[type="radio"]:focus + .xfaCheckboxMark {
405 box-shadow: 0 0 5px rgba(0, 0, 0, 0.7);
406 }
407
408 .xfaCheckboxMark {
409 cursor: pointer;
410 flex: 0 0 auto;
411 border-style: solid;
412 border-width: 2px;
413 border-color: #8f8f9d;
414 font-size: 10px;
415 line-height: 10px;
416 width: 10px;
417 height: 10px;
418 text-align: center;
419 vertical-align: middle;
420 display: flex;
421 flex-direction: row;
422 align-items: center;
423 }
424
425 .xfaCheckbox:checked + .xfaCheckboxMark::after {
426 content: attr(mark);
427 }
428
429 .xfaButton {
430 cursor: pointer;
431 width: 100%;
432 height: 100%;
433 border: none;
434 text-align: center;
435 }
436
437 .xfaButton:hover {
438 background: Highlight;
439 }
440
441 .xfaRich {
442 white-space: pre-wrap;
443 }
444
445 .xfaImage {
446 width: 100%;
447 height: 100%;
448 }
449
450 .xfaRich {
451 width: 100%;
452 height: auto;
453 }
454
455 .xfaPosition {
456 display: block;
457 }
458
459 .xfaLrTb,
460 .xfaRlTb,
461 .xfaTb {
462 display: flex;
463 flex-direction: column;
464 align-items: stretch;
465 }
466
467 .xfaLr,
468 .xfaRl,
469 .xfaTb > div {
470 flex: 1 1 auto;
471 }
472
473 .xfaTb > div {
474 justify-content: left;
475 }
476
477 .xfaLr > div {
478 display: inline;
479 float: left;
480 }
481
482 .xfaRl > div {
483 display: inline;
484 float: right;
485 }
486
487 .xfaPosition {
488 position: relative;
489 }
490
491 .xfaArea {
492 position: relative;
493 }
494
495 .xfaValignMiddle {
496 display: flex;
497 align-items: center;
498 }
499
500 .xfaLrTb > div {
501 display: inline;
502 float: left;
503 }
504
505 .xfaRlTb > div {
506 display: inline;
507 float: right;
508 }
509
510 .xfaTable {
511 display: flex;
512 flex-direction: column;
513 }
514
515 .xfaTable .xfaRow {
516 display: flex;
517 flex-direction: row;
518 flex: 1 1 auto;
519 }
520
521 .xfaTable .xfaRow > div {
522 flex: 1 1 auto;
523 }
524
525 .xfaTable .xfaRlRow {
526 display: flex;
527 flex-direction: row-reverse;
528 flex: 1;
529 }
530
531 .xfaTable .xfaRlRow > div {
532 flex: 1;
533 }
534
535 :root {
536 --pdfViewer-padding-bottom: none;
537 --page-margin: 1px auto -8px;
538 --page-border: 9px solid transparent;
539 --spreadHorizontalWrapped-margin-LR: -3.5px;
540 }
541
542 @media screen and (forced-colors: active) {
543 :root {
544 --pdfViewer-padding-bottom: 9px;
545 --page-margin: 9px auto 0;
546 --page-border: none;
547 --spreadHorizontalWrapped-margin-LR: 4.5px;
548 }
549 }
550
551 .pdfViewer {
552 padding-bottom: var(--pdfViewer-padding-bottom);
553 }
554
555 .pdfViewer .canvasWrapper {
556 overflow: hidden;
557 }
558
559 .pdfViewer .page {
560 direction: ltr;
561 width: 816px;
562 height: 1056px;
563 margin: var(--page-margin);
564 position: relative;
565 overflow: visible;
566 border: var(--page-border);
567 background-clip: content-box;
568 -o-border-image: url(images/shadow.png) 9 9 repeat;
569 border-image: url(images/shadow.png) 9 9 repeat;
570 background-color: rgba(255, 255, 255, 1);
571 }
572
573 .pdfViewer.removePageBorders .page {
574 margin: 0 auto 10px;
575 border: none;
576 }
577
578 .pdfViewer.singlePageView {
579 display: inline-block;
580 }
581
582 .pdfViewer.singlePageView .page {
583 margin: 0;
584 border: none;
585 }
586
587 .pdfViewer.scrollHorizontal,
588 .pdfViewer.scrollWrapped,
589 .spread {
590 margin-left: 3.5px;
591 margin-right: 3.5px;
592 text-align: center;
593 }
594
595 .pdfViewer.scrollHorizontal,
596 .spread {
597 white-space: nowrap;
598 }
599
600 .pdfViewer.removePageBorders,
601 .pdfViewer.scrollHorizontal .spread,
602 .pdfViewer.scrollWrapped .spread {
603 margin-left: 0;
604 margin-right: 0;
605 }
606
607 .spread .page,
608 .pdfViewer.scrollHorizontal .page,
609 .pdfViewer.scrollWrapped .page,
610 .pdfViewer.scrollHorizontal .spread,
611 .pdfViewer.scrollWrapped .spread {
612 display: inline-block;
613 vertical-align: middle;
614 }
615
616 .spread .page,
617 .pdfViewer.scrollHorizontal .page,
618 .pdfViewer.scrollWrapped .page {
619 margin-left: var(--spreadHorizontalWrapped-margin-LR);
620 margin-right: var(--spreadHorizontalWrapped-margin-LR);
621 }
622
623 .pdfViewer.removePageBorders .spread .page,
624 .pdfViewer.removePageBorders.scrollHorizontal .page,
625 .pdfViewer.removePageBorders.scrollWrapped .page {
626 margin-left: 5px;
627 margin-right: 5px;
628 }
629
630 .pdfViewer .page canvas {
631 margin: 0;
632 display: block;
633 }
634
635 .pdfViewer .page canvas[hidden] {
636 display: none;
637 }
638
639 .pdfViewer .page .loadingIcon {
640 position: absolute;
641 display: block;
642 left: 0;
643 top: 0;
644 right: 0;
645 bottom: 0;
646 background: url("images/loading-icon.gif") center no-repeat;
647 }
648
649 .pdfPresentationMode .pdfViewer {
650 margin-left: 0;
651 margin-right: 0;
652 }
653
654 .pdfPresentationMode .pdfViewer .page,
655 .pdfPresentationMode .pdfViewer .spread {
656 display: block;
657 }
658
659 .pdfPresentationMode .pdfViewer .page,
660 .pdfPresentationMode .pdfViewer.removePageBorders .page {
661 margin-left: auto;
662 margin-right: auto;
663 }
664
665 .pdfPresentationMode:-webkit-full-screen .pdfViewer .page {
666 margin-bottom: 100%;
667 border: 0;
668 }
669
670 .pdfPresentationMode:fullscreen .pdfViewer .page {
671 margin-bottom: 100%;
672 border: 0;
673 }
674
675 /* define for system light */
676 :root {
677 --sidebar-width: 200px;
678 --sidebar-transition-duration: 200ms;
679 --sidebar-transition-timing-function: ease;
680 --loadingBar-end-offset: 0;
681
682 --toolbar-icon-opacity: 0.7;
683 --doorhanger-icon-opacity: 0.9;
684
685 --main-color: rgba(12, 12, 13, 1);
686 --body-bg-color: rgba(237, 237, 240, 1);
687 --errorWrapper-bg-color: rgba(255, 110, 110, 1);
688 --progressBar-color: rgba(10, 132, 255, 1);
689 --progressBar-indeterminate-bg-color: rgba(221, 221, 222, 1);
690 --progressBar-indeterminate-blend-color: rgba(116, 177, 239, 1);
691 --scrollbar-color: auto;
692 --scrollbar-bg-color: auto;
693 --toolbar-icon-bg-color: rgba(0, 0, 0, 1);
694 --toolbar-icon-hover-bg-color: rgba(0, 0, 0, 1);
695
696 --sidebar-narrow-bg-color: rgba(237, 237, 240, 0.9);
697 --sidebar-toolbar-bg-color: rgba(245, 246, 247, 1);
698 --toolbar-bg-color: rgba(249, 249, 250, 1);
699 --toolbar-border-color: rgba(204, 204, 204, 1);
700 --button-hover-color: rgba(221, 222, 223, 1);
701 --toggled-btn-color: rgba(0, 0, 0, 1);
702 --toggled-btn-bg-color: rgba(0, 0, 0, 0.3);
703 --toggled-hover-active-btn-color: rgba(0, 0, 0, 0.4);
704 --dropdown-btn-bg-color: rgba(215, 215, 219, 1);
705 --separator-color: rgba(0, 0, 0, 0.3);
706 --field-color: rgba(6, 6, 6, 1);
707 --field-bg-color: rgba(255, 255, 255, 1);
708 --field-border-color: rgba(187, 187, 188, 1);
709 --findbar-nextprevious-btn-bg-color: rgba(227, 228, 230, 1);
710 --treeitem-color: rgba(0, 0, 0, 0.8);
711 --treeitem-hover-color: rgba(0, 0, 0, 0.9);
712 --treeitem-selected-color: rgba(0, 0, 0, 0.9);
713 --treeitem-selected-bg-color: rgba(0, 0, 0, 0.25);
714 --sidebaritem-bg-color: rgba(0, 0, 0, 0.15);
715 --doorhanger-bg-color: rgba(255, 255, 255, 1);
716 --doorhanger-border-color: rgba(12, 12, 13, 0.2);
717 --doorhanger-hover-color: rgba(12, 12, 13, 1);
718 --doorhanger-hover-bg-color: rgba(237, 237, 237, 1);
719 --doorhanger-separator-color: rgba(222, 222, 222, 1);
720 --overlay-button-border: 0 none;
721 --overlay-button-bg-color: rgba(12, 12, 13, 0.1);
722 --overlay-button-hover-bg-color: rgba(12, 12, 13, 0.3);
723
724 --loading-icon: url(images/loading.svg);
725 --treeitem-expanded-icon: url(images/treeitem-expanded.svg);
726 --treeitem-collapsed-icon: url(images/treeitem-collapsed.svg);
727 --toolbarButton-menuArrow-icon: url(images/toolbarButton-menuArrow.svg);
728 --toolbarButton-sidebarToggle-icon: url(images/toolbarButton-sidebarToggle.svg);
729 --toolbarButton-secondaryToolbarToggle-icon: url(images/toolbarButton-secondaryToolbarToggle.svg);
730 --toolbarButton-pageUp-icon: url(images/toolbarButton-pageUp.svg);
731 --toolbarButton-pageDown-icon: url(images/toolbarButton-pageDown.svg);
732 --toolbarButton-zoomOut-icon: url(images/toolbarButton-zoomOut.svg);
733 --toolbarButton-zoomIn-icon: url(images/toolbarButton-zoomIn.svg);
734 --toolbarButton-presentationMode-icon: url(images/toolbarButton-presentationMode.svg);
735 --toolbarButton-print-icon: url(images/toolbarButton-print.svg);
736 --toolbarButton-openFile-icon: url(images/toolbarButton-openFile.svg);
737 --toolbarButton-download-icon: url(images/toolbarButton-download.svg);
738 --toolbarButton-bookmark-icon: url(images/toolbarButton-bookmark.svg);
739 --toolbarButton-viewThumbnail-icon: url(images/toolbarButton-viewThumbnail.svg);
740 --toolbarButton-viewOutline-icon: url(images/toolbarButton-viewOutline.svg);
741 --toolbarButton-viewAttachments-icon: url(images/toolbarButton-viewAttachments.svg);
742 --toolbarButton-viewLayers-icon: url(images/toolbarButton-viewLayers.svg);
743 --toolbarButton-currentOutlineItem-icon: url(images/toolbarButton-currentOutlineItem.svg);
744 --toolbarButton-search-icon: url(images/toolbarButton-search.svg);
745 --findbarButton-previous-icon: url(images/findbarButton-previous.svg);
746 --findbarButton-next-icon: url(images/findbarButton-next.svg);
747 --secondaryToolbarButton-firstPage-icon: url(images/secondaryToolbarButton-firstPage.svg);
748 --secondaryToolbarButton-lastPage-icon: url(images/secondaryToolbarButton-lastPage.svg);
749 --secondaryToolbarButton-rotateCcw-icon: url(images/secondaryToolbarButton-rotateCcw.svg);
750 --secondaryToolbarButton-rotateCw-icon: url(images/secondaryToolbarButton-rotateCw.svg);
751 --secondaryToolbarButton-selectTool-icon: url(images/secondaryToolbarButton-selectTool.svg);
752 --secondaryToolbarButton-handTool-icon: url(images/secondaryToolbarButton-handTool.svg);
753 --secondaryToolbarButton-scrollVertical-icon: url(images/secondaryToolbarButton-scrollVertical.svg);
754 --secondaryToolbarButton-scrollHorizontal-icon: url(images/secondaryToolbarButton-scrollHorizontal.svg);
755 --secondaryToolbarButton-scrollWrapped-icon: url(images/secondaryToolbarButton-scrollWrapped.svg);
756 --secondaryToolbarButton-spreadNone-icon: url(images/secondaryToolbarButton-spreadNone.svg);
757 --secondaryToolbarButton-spreadOdd-icon: url(images/secondaryToolbarButton-spreadOdd.svg);
758 --secondaryToolbarButton-spreadEven-icon: url(images/secondaryToolbarButton-spreadEven.svg);
759 --secondaryToolbarButton-documentProperties-icon: url(images/secondaryToolbarButton-documentProperties.svg);
760 }
761 /* define for system dark */
762 @media (prefers-color-scheme: dark) {
763 :root {
764 --main-color: rgba(249, 249, 250, 1);
765 --body-bg-color: rgba(42, 42, 46, 1);
766 --errorWrapper-bg-color: rgba(169, 14, 14, 1);
767 --progressBar-color: rgba(0, 96, 223, 1);
768 --progressBar-indeterminate-bg-color: rgba(40, 40, 43, 1);
769 --progressBar-indeterminate-blend-color: rgba(20, 68, 133, 1);
770 --scrollbar-color: rgba(121, 121, 123, 1);
771 --scrollbar-bg-color: rgba(35, 35, 39, 1);
772 --toolbar-icon-bg-color: rgba(255, 255, 255, 1);
773 --toolbar-icon-hover-bg-color: rgba(255, 255, 255, 1);
774
775 --sidebar-narrow-bg-color: rgba(42, 42, 46, 0.9);
776 --sidebar-toolbar-bg-color: rgba(50, 50, 52, 1);
777 --toolbar-bg-color: rgba(56, 56, 61, 1);
778 --toolbar-border-color: rgba(12, 12, 13, 1);
779 --button-hover-color: rgba(102, 102, 103, 1);
780 --toggled-btn-color: rgba(255, 255, 255, 1);
781 --toggled-btn-bg-color: rgba(0, 0, 0, 0.3);
782 --toggled-hover-active-btn-color: rgba(0, 0, 0, 0.4);
783 --dropdown-btn-bg-color: rgba(74, 74, 79, 1);
784 --separator-color: rgba(0, 0, 0, 0.3);
785 --field-color: rgba(250, 250, 250, 1);
786 --field-bg-color: rgba(64, 64, 68, 1);
787 --field-border-color: rgba(115, 115, 115, 1);
788 --findbar-nextprevious-btn-bg-color: rgba(89, 89, 89, 1);
789 --treeitem-color: rgba(255, 255, 255, 0.8);
790 --treeitem-hover-color: rgba(255, 255, 255, 0.9);
791 --treeitem-selected-color: rgba(255, 255, 255, 0.9);
792 --treeitem-selected-bg-color: rgba(255, 255, 255, 0.25);
793 --sidebaritem-bg-color: rgba(255, 255, 255, 0.15);
794 --doorhanger-bg-color: rgba(74, 74, 79, 1);
795 --doorhanger-border-color: rgba(39, 39, 43, 1);
796 --doorhanger-hover-color: rgba(249, 249, 250, 1);
797 --doorhanger-hover-bg-color: rgba(93, 94, 98, 1);
798 --doorhanger-separator-color: rgba(92, 92, 97, 1);
799 --overlay-button-bg-color: rgba(92, 92, 97, 1);
800 --overlay-button-hover-bg-color: rgba(115, 115, 115, 1);
801
802 /* This image is used in <input> elements, which unfortunately means that
803 * the `mask-image` approach used with all of the other images doesn't work
804 * here; hence why we still have two versions of this particular image. */
805 --loading-icon: url(images/loading-dark.svg);
806 }
807 }
808
809 [ep-data-theme="light"] {
810 --sidebar-width: 200px;
811 --sidebar-transition-duration: 200ms;
812 --sidebar-transition-timing-function: ease;
813 --loadingBar-end-offset: 0;
814
815 --toolbar-icon-opacity: 0.7;
816 --doorhanger-icon-opacity: 0.9;
817
818 --main-color: rgba(12, 12, 13, 1);
819 --body-bg-color: rgba(237, 237, 240, 1);
820 --errorWrapper-bg-color: rgba(255, 110, 110, 1);
821 --progressBar-color: rgba(10, 132, 255, 1);
822 --progressBar-indeterminate-bg-color: rgba(221, 221, 222, 1);
823 --progressBar-indeterminate-blend-color: rgba(116, 177, 239, 1);
824 --scrollbar-color: auto;
825 --scrollbar-bg-color: auto;
826 --toolbar-icon-bg-color: rgba(0, 0, 0, 1);
827 --toolbar-icon-hover-bg-color: rgba(0, 0, 0, 1);
828
829 --sidebar-narrow-bg-color: rgba(237, 237, 240, 0.9);
830 --sidebar-toolbar-bg-color: rgba(245, 246, 247, 1);
831 --toolbar-bg-color: rgba(249, 249, 250, 1);
832 --toolbar-border-color: rgba(204, 204, 204, 1);
833 --button-hover-color: rgba(221, 222, 223, 1);
834 --toggled-btn-color: rgba(0, 0, 0, 1);
835 --toggled-btn-bg-color: rgba(0, 0, 0, 0.3);
836 --toggled-hover-active-btn-color: rgba(0, 0, 0, 0.4);
837 --dropdown-btn-bg-color: rgba(215, 215, 219, 1);
838 --separator-color: rgba(0, 0, 0, 0.3);
839 --field-color: rgba(6, 6, 6, 1);
840 --field-bg-color: rgba(255, 255, 255, 1);
841 --field-border-color: rgba(187, 187, 188, 1);
842 --findbar-nextprevious-btn-bg-color: rgba(227, 228, 230, 1);
843 --treeitem-color: rgba(0, 0, 0, 0.8);
844 --treeitem-hover-color: rgba(0, 0, 0, 0.9);
845 --treeitem-selected-color: rgba(0, 0, 0, 0.9);
846 --treeitem-selected-bg-color: rgba(0, 0, 0, 0.25);
847 --sidebaritem-bg-color: rgba(0, 0, 0, 0.15);
848 --doorhanger-bg-color: rgba(255, 255, 255, 1);
849 --doorhanger-border-color: rgba(12, 12, 13, 0.2);
850 --doorhanger-hover-color: rgba(12, 12, 13, 1);
851 --doorhanger-hover-bg-color: rgba(237, 237, 237, 1);
852 --doorhanger-separator-color: rgba(222, 222, 222, 1);
853 --overlay-button-border: 0 none;
854 --overlay-button-bg-color: rgba(12, 12, 13, 0.1);
855 --overlay-button-hover-bg-color: rgba(12, 12, 13, 0.3);
856
857 --loading-icon: url(images/loading.svg);
858 --treeitem-expanded-icon: url(images/treeitem-expanded.svg);
859 --treeitem-collapsed-icon: url(images/treeitem-collapsed.svg);
860 --toolbarButton-menuArrow-icon: url(images/toolbarButton-menuArrow.svg);
861 --toolbarButton-sidebarToggle-icon: url(images/toolbarButton-sidebarToggle.svg);
862 --toolbarButton-secondaryToolbarToggle-icon: url(images/toolbarButton-secondaryToolbarToggle.svg);
863 --toolbarButton-pageUp-icon: url(images/toolbarButton-pageUp.svg);
864 --toolbarButton-pageDown-icon: url(images/toolbarButton-pageDown.svg);
865 --toolbarButton-zoomOut-icon: url(images/toolbarButton-zoomOut.svg);
866 --toolbarButton-zoomIn-icon: url(images/toolbarButton-zoomIn.svg);
867 --toolbarButton-presentationMode-icon: url(images/toolbarButton-presentationMode.svg);
868 --toolbarButton-print-icon: url(images/toolbarButton-print.svg);
869 --toolbarButton-openFile-icon: url(images/toolbarButton-openFile.svg);
870 --toolbarButton-download-icon: url(images/toolbarButton-download.svg);
871 --toolbarButton-bookmark-icon: url(images/toolbarButton-bookmark.svg);
872 --toolbarButton-viewThumbnail-icon: url(images/toolbarButton-viewThumbnail.svg);
873 --toolbarButton-viewOutline-icon: url(images/toolbarButton-viewOutline.svg);
874 --toolbarButton-viewAttachments-icon: url(images/toolbarButton-viewAttachments.svg);
875 --toolbarButton-viewLayers-icon: url(images/toolbarButton-viewLayers.svg);
876 --toolbarButton-currentOutlineItem-icon: url(images/toolbarButton-currentOutlineItem.svg);
877 --toolbarButton-search-icon: url(images/toolbarButton-search.svg);
878 --findbarButton-previous-icon: url(images/findbarButton-previous.svg);
879 --findbarButton-next-icon: url(images/findbarButton-next.svg);
880 --secondaryToolbarButton-firstPage-icon: url(images/secondaryToolbarButton-firstPage.svg);
881 --secondaryToolbarButton-lastPage-icon: url(images/secondaryToolbarButton-lastPage.svg);
882 --secondaryToolbarButton-rotateCcw-icon: url(images/secondaryToolbarButton-rotateCcw.svg);
883 --secondaryToolbarButton-rotateCw-icon: url(images/secondaryToolbarButton-rotateCw.svg);
884 --secondaryToolbarButton-selectTool-icon: url(images/secondaryToolbarButton-selectTool.svg);
885 --secondaryToolbarButton-handTool-icon: url(images/secondaryToolbarButton-handTool.svg);
886 --secondaryToolbarButton-scrollVertical-icon: url(images/secondaryToolbarButton-scrollVertical.svg);
887 --secondaryToolbarButton-scrollHorizontal-icon: url(images/secondaryToolbarButton-scrollHorizontal.svg);
888 --secondaryToolbarButton-scrollWrapped-icon: url(images/secondaryToolbarButton-scrollWrapped.svg);
889 --secondaryToolbarButton-spreadNone-icon: url(images/secondaryToolbarButton-spreadNone.svg);
890 --secondaryToolbarButton-spreadOdd-icon: url(images/secondaryToolbarButton-spreadOdd.svg);
891 --secondaryToolbarButton-spreadEven-icon: url(images/secondaryToolbarButton-spreadEven.svg);
892 --secondaryToolbarButton-documentProperties-icon: url(images/secondaryToolbarButton-documentProperties.svg);
893 }
894 [ep-data-theme="dark"] {
895 --main-color: rgba(249, 249, 250, 1);
896 --body-bg-color: rgba(42, 42, 46, 1);
897 --errorWrapper-bg-color: rgba(169, 14, 14, 1);
898 --progressBar-color: rgba(0, 96, 223, 1);
899 --progressBar-indeterminate-bg-color: rgba(40, 40, 43, 1);
900 --progressBar-indeterminate-blend-color: rgba(20, 68, 133, 1);
901 --scrollbar-color: rgba(121, 121, 123, 1);
902 --scrollbar-bg-color: rgba(35, 35, 39, 1);
903 --toolbar-icon-bg-color: rgba(255, 255, 255, 1);
904 --toolbar-icon-hover-bg-color: rgba(255, 255, 255, 1);
905
906 --sidebar-narrow-bg-color: rgba(42, 42, 46, 0.9);
907 --sidebar-toolbar-bg-color: rgba(50, 50, 52, 1);
908 --toolbar-bg-color: rgba(56, 56, 61, 1);
909 --toolbar-border-color: rgba(12, 12, 13, 1);
910 --button-hover-color: rgba(102, 102, 103, 1);
911 --toggled-btn-color: rgba(255, 255, 255, 1);
912 --toggled-btn-bg-color: rgba(0, 0, 0, 0.3);
913 --toggled-hover-active-btn-color: rgba(0, 0, 0, 0.4);
914 --dropdown-btn-bg-color: rgba(74, 74, 79, 1);
915 --separator-color: rgba(0, 0, 0, 0.3);
916 --field-color: rgba(250, 250, 250, 1);
917 --field-bg-color: rgba(64, 64, 68, 1);
918 --field-border-color: rgba(115, 115, 115, 1);
919 --findbar-nextprevious-btn-bg-color: rgba(89, 89, 89, 1);
920 --treeitem-color: rgba(255, 255, 255, 0.8);
921 --treeitem-hover-color: rgba(255, 255, 255, 0.9);
922 --treeitem-selected-color: rgba(255, 255, 255, 0.9);
923 --treeitem-selected-bg-color: rgba(255, 255, 255, 0.25);
924 --sidebaritem-bg-color: rgba(255, 255, 255, 0.15);
925 --doorhanger-bg-color: rgba(74, 74, 79, 1);
926 --doorhanger-border-color: rgba(39, 39, 43, 1);
927 --doorhanger-hover-color: rgba(249, 249, 250, 1);
928 --doorhanger-hover-bg-color: rgba(93, 94, 98, 1);
929 --doorhanger-separator-color: rgba(92, 92, 97, 1);
930 --overlay-button-bg-color: rgba(92, 92, 97, 1);
931 --overlay-button-hover-bg-color: rgba(115, 115, 115, 1);
932
933 /* This image is used in <input> elements, which unfortunately means that
934 * the `mask-image` approach used with all of the other images doesn't work
935 * here; hence why we still have two versions of this particular image. */
936 --loading-icon: url(images/loading-dark.svg);
937 }
938
939 @media screen and (forced-colors: active) {
940 :root {
941 --main-color: ButtonText;
942 --button-hover-color: Highlight;
943 --doorhanger-hover-bg-color: Highlight;
944 --toolbar-icon-opacity: 1;
945 --toolbar-icon-bg-color: ButtonText;
946 --toolbar-icon-hover-bg-color: ButtonFace;
947 --toggled-btn-color: HighlightText;
948 --toggled-btn-bg-color: LinkText;
949 --doorhanger-hover-color: ButtonFace;
950 --doorhanger-border-color-whcm: 1px solid ButtonText;
951 --doorhanger-triangle-opacity-whcm: 0;
952 --overlay-button-border: 1px solid Highlight;
953 --overlay-button-hover-bg-color: Highlight;
954 --overlay-button-hover-color: ButtonFace;
955 --field-border-color: ButtonText;
956 }
957 }
958
959 * {
960 padding: 0;
961 margin: 0;
962 }
963
964 html {
965 height: 100%;
966 width: 100%;
967 /* Font size is needed to make the activity bar the correct size. */
968 font-size: 10px;
969 }
970
971 body {
972 height: 100%;
973 width: 100%;
974 background-color: var(--body-bg-color);
975 }
976
977 body,
978 input,
979 button,
980 select {
981 font: message-box;
982 outline: none;
983 scrollbar-color: var(--scrollbar-color) var(--scrollbar-bg-color);
984 }
985
986 .hidden {
987 display: none !important;
988 }
989 [hidden] {
990 display: none !important;
991 }
992
993 .pdfViewer.enablePermissions .textLayer span {
994 -webkit-user-select: none !important;
995 -moz-user-select: none !important;
996 user-select: none !important;
997 cursor: not-allowed;
998 }
999
1000 #viewerContainer.pdfPresentationMode:-webkit-full-screen {
1001 top: 0;
1002 border-top: 2px solid rgba(0, 0, 0, 0);
1003 background-color: rgba(0, 0, 0, 1);
1004 width: 100%;
1005 height: 100%;
1006 overflow: hidden;
1007 cursor: none;
1008 -webkit-user-select: none;
1009 user-select: none;
1010 }
1011
1012 #viewerContainer.pdfPresentationMode:fullscreen {
1013 top: 0;
1014 border-top: 2px solid rgba(0, 0, 0, 0);
1015 background-color: rgba(0, 0, 0, 1);
1016 width: 100%;
1017 height: 100%;
1018 overflow: hidden;
1019 cursor: none;
1020 -webkit-user-select: none;
1021 -moz-user-select: none;
1022 user-select: none;
1023 }
1024
1025 .pdfPresentationMode:-webkit-full-screen a:not(.internalLink) {
1026 display: none;
1027 }
1028
1029 .pdfPresentationMode:fullscreen a:not(.internalLink) {
1030 display: none;
1031 }
1032
1033 .pdfPresentationMode:-webkit-full-screen .textLayer span {
1034 cursor: none;
1035 }
1036
1037 .pdfPresentationMode:fullscreen .textLayer span {
1038 cursor: none;
1039 }
1040
1041 .pdfPresentationMode.pdfPresentationModeControls > *,
1042 .pdfPresentationMode.pdfPresentationModeControls .textLayer span {
1043 cursor: default;
1044 }
1045
1046 #outerContainer {
1047 width: 100%;
1048 height: 100%;
1049 position: relative;
1050 }
1051
1052 #sidebarContainer {
1053 position: absolute;
1054 top: 32px;
1055 bottom: 0;
1056 width: var(--sidebar-width);
1057 visibility: hidden;
1058 z-index: 100;
1059 border-top: 1px solid rgba(51, 51, 51, 1);
1060 transition-duration: var(--sidebar-transition-duration);
1061 transition-timing-function: var(--sidebar-transition-timing-function);
1062 }
1063 html[dir="ltr"] #sidebarContainer {
1064 transition-property: left;
1065 left: calc(0px - var(--sidebar-width));
1066 border-right: var(--doorhanger-border-color-whcm);
1067 }
1068 html[dir="rtl"] #sidebarContainer {
1069 transition-property: right;
1070 right: calc(0px - var(--sidebar-width));
1071 border-left: var(--doorhanger-border-color-whcm);
1072 }
1073
1074 #outerContainer.sidebarResizing #sidebarContainer {
1075 /* Improve responsiveness and avoid visual glitches when the sidebar is resized. */
1076 transition-duration: 0s;
1077 /* Prevent e.g. the thumbnails being selected when the sidebar is resized. */
1078 -webkit-user-select: none;
1079 -moz-user-select: none;
1080 user-select: none;
1081 }
1082
1083 #outerContainer.sidebarMoving #sidebarContainer,
1084 #outerContainer.sidebarOpen #sidebarContainer {
1085 visibility: visible;
1086 }
1087 html[dir="ltr"] #outerContainer.sidebarOpen #sidebarContainer {
1088 left: 0;
1089 }
1090 html[dir="rtl"] #outerContainer.sidebarOpen #sidebarContainer {
1091 right: 0;
1092 }
1093
1094 #mainContainer {
1095 position: absolute;
1096 top: 0;
1097 right: 0;
1098 bottom: 0;
1099 left: 0;
1100 min-width: 320px;
1101 }
1102
1103 #sidebarContent {
1104 top: 32px;
1105 bottom: 0;
1106 overflow: auto;
1107 -webkit-overflow-scrolling: touch;
1108 position: absolute;
1109 width: 100%;
1110 background-color: rgba(0, 0, 0, 0.1);
1111 }
1112 html[dir="ltr"] #sidebarContent {
1113 left: 0;
1114 box-shadow: inset -1px 0 0 rgba(0, 0, 0, 0.25);
1115 }
1116 html[dir="rtl"] #sidebarContent {
1117 right: 0;
1118 box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.25);
1119 }
1120
1121 #viewerContainer {
1122 overflow: auto;
1123 -webkit-overflow-scrolling: touch;
1124 position: absolute;
1125 top: 32px;
1126 right: 0;
1127 bottom: 0;
1128 left: 0;
1129 outline: none;
1130 }
1131 #viewerContainer:not(.pdfPresentationMode) {
1132 transition-duration: var(--sidebar-transition-duration);
1133 transition-timing-function: var(--sidebar-transition-timing-function);
1134 }
1135
1136 #outerContainer.sidebarResizing #viewerContainer {
1137 /* Improve responsiveness and avoid visual glitches when the sidebar is resized. */
1138 transition-duration: 0s;
1139 }
1140
1141 html[dir="ltr"]
1142 #outerContainer.sidebarOpen
1143 #viewerContainer:not(.pdfPresentationMode) {
1144 transition-property: left;
1145 left: var(--sidebar-width);
1146 }
1147 html[dir="rtl"]
1148 #outerContainer.sidebarOpen
1149 #viewerContainer:not(.pdfPresentationMode) {
1150 transition-property: right;
1151 right: var(--sidebar-width);
1152 }
1153
1154 .toolbar {
1155 position: relative;
1156 left: 0;
1157 right: 0;
1158 z-index: 9999;
1159 cursor: default;
1160 }
1161
1162 #toolbarContainer {
1163 width: 100%;
1164 }
1165
1166 #toolbarSidebar {
1167 width: 100%;
1168 height: 32px;
1169 background-color: var(--sidebar-toolbar-bg-color);
1170 }
1171 html[dir="ltr"] #toolbarSidebar {
1172 box-shadow: inset -1px 0 0 rgba(0, 0, 0, 0.25), 0 1px 0 rgba(0, 0, 0, 0.15),
1173 0 0 1px rgba(0, 0, 0, 0.1);
1174 }
1175 html[dir="rtl"] #toolbarSidebar {
1176 box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.25), 0 1px 0 rgba(0, 0, 0, 0.15),
1177 0 0 1px rgba(0, 0, 0, 0.1);
1178 }
1179
1180 html[dir="ltr"] #toolbarSidebar .toolbarButton {
1181 margin-right: 2px !important;
1182 }
1183 html[dir="rtl"] #toolbarSidebar .toolbarButton {
1184 margin-left: 2px !important;
1185 }
1186
1187 html[dir="ltr"] #toolbarSidebarRight .toolbarButton {
1188 margin-right: 3px !important;
1189 }
1190 html[dir="rtl"] #toolbarSidebarRight .toolbarButton {
1191 margin-left: 3px !important;
1192 }
1193
1194 #sidebarResizer {
1195 position: absolute;
1196 top: 0;
1197 bottom: 0;
1198 width: 6px;
1199 z-index: 200;
1200 cursor: ew-resize;
1201 }
1202 html[dir="ltr"] #sidebarResizer {
1203 right: -6px;
1204 }
1205 html[dir="rtl"] #sidebarResizer {
1206 left: -6px;
1207 }
1208
1209 #toolbarContainer,
1210 .findbar,
1211 .secondaryToolbar {
1212 position: relative;
1213 height: 32px;
1214 background-color: var(--toolbar-bg-color);
1215 box-shadow: 0 1px 0 var(--toolbar-border-color);
1216 }
1217
1218 #toolbarViewer {
1219 height: 32px;
1220 }
1221
1222 #loadingBar {
1223 position: absolute;
1224 height: 4px;
1225 background-color: var(--body-bg-color);
1226 border-bottom: 1px solid var(--toolbar-border-color);
1227
1228 transition-duration: var(--sidebar-transition-duration);
1229 transition-timing-function: var(--sidebar-transition-timing-function);
1230 }
1231 html[dir="ltr"] #loadingBar {
1232 transition-property: left;
1233 left: 0;
1234 right: var(--loadingBar-end-offset);
1235 }
1236 html[dir="rtl"] #loadingBar {
1237 transition-property: right;
1238 left: var(--loadingBar-end-offset);
1239 right: 0;
1240 }
1241
1242 html[dir="ltr"] #outerContainer.sidebarOpen #loadingBar {
1243 left: var(--sidebar-width);
1244 }
1245 html[dir="rtl"] #outerContainer.sidebarOpen #loadingBar {
1246 right: var(--sidebar-width);
1247 }
1248
1249 #outerContainer.sidebarResizing #loadingBar {
1250 /* Improve responsiveness and avoid visual glitches when the sidebar is resized. */
1251 transition-duration: 0s;
1252 }
1253
1254 #loadingBar .progress {
1255 position: absolute;
1256 top: 0;
1257 left: 0;
1258 width: 0%;
1259 height: 100%;
1260 background-color: var(--progressBar-color);
1261 overflow: hidden;
1262 transition: width 200ms;
1263 }
1264
1265 @-webkit-keyframes progressIndeterminate {
1266 0% {
1267 left: -142px;
1268 }
1269 100% {
1270 left: 0;
1271 }
1272 }
1273
1274 @keyframes progressIndeterminate {
1275 0% {
1276 left: -142px;
1277 }
1278 100% {
1279 left: 0;
1280 }
1281 }
1282
1283 #loadingBar .progress.indeterminate {
1284 background-color: var(--progressBar-indeterminate-bg-color);
1285 transition: none;
1286 }
1287
1288 #loadingBar .progress.indeterminate .glimmer {
1289 position: absolute;
1290 top: 0;
1291 left: 0;
1292 height: 100%;
1293 width: calc(100% + 150px);
1294 background: repeating-linear-gradient(
1295 135deg,
1296 var(--progressBar-indeterminate-blend-color) 0,
1297 var(--progressBar-indeterminate-bg-color) 5px,
1298 var(--progressBar-indeterminate-bg-color) 45px,
1299 var(--progressBar-color) 55px,
1300 var(--progressBar-color) 95px,
1301 var(--progressBar-indeterminate-blend-color) 100px
1302 );
1303 -webkit-animation: progressIndeterminate 1s linear infinite;
1304 animation: progressIndeterminate 1s linear infinite;
1305 }
1306
1307 .findbar,
1308 .secondaryToolbar {
1309 top: 32px;
1310 position: absolute;
1311 z-index: 10000;
1312 height: auto;
1313 min-width: 16px;
1314 padding: 0 4px;
1315 margin: 4px 2px;
1316 color: rgba(217, 217, 217, 1);
1317 font-size: 12px;
1318 line-height: 14px;
1319 text-align: left;
1320 cursor: default;
1321 }
1322
1323 .findbar {
1324 min-width: 300px;
1325 background-color: var(--toolbar-bg-color);
1326 }
1327 .findbar > div {
1328 height: 32px;
1329 }
1330 .findbar.wrapContainers > div {
1331 clear: both;
1332 }
1333 .findbar.wrapContainers > div#findbarMessageContainer {
1334 height: auto;
1335 }
1336 html[dir="ltr"] .findbar {
1337 left: 64px;
1338 }
1339 html[dir="rtl"] .findbar {
1340 right: 64px;
1341 }
1342
1343 .findbar .splitToolbarButton {
1344 margin-top: 3px;
1345 }
1346 html[dir="ltr"] .findbar .splitToolbarButton {
1347 margin-left: 0;
1348 margin-right: 5px;
1349 }
1350 html[dir="rtl"] .findbar .splitToolbarButton {
1351 margin-left: 5px;
1352 margin-right: 0;
1353 }
1354
1355 .findbar .splitToolbarButton > .toolbarButton {
1356 background-color: var(--findbar-nextprevious-btn-bg-color);
1357 border-radius: 0;
1358 height: 26px;
1359 border-top: 1px solid var(--field-border-color);
1360 border-bottom: 1px solid var(--field-border-color);
1361 }
1362
1363 .findbar .splitToolbarButton > .toolbarButton::before {
1364 top: 5px;
1365 }
1366
1367 .findbar .splitToolbarButton > .findNext {
1368 width: 29px;
1369 }
1370 html[dir="ltr"] .findbar .splitToolbarButton > .findNext {
1371 border-bottom-right-radius: 2px;
1372 border-top-right-radius: 2px;
1373 border-right: 1px solid var(--field-border-color);
1374 }
1375 html[dir="rtl"] .findbar .splitToolbarButton > .findNext {
1376 border-bottom-left-radius: 2px;
1377 border-top-left-radius: 2px;
1378 border-left: 1px solid var(--field-border-color);
1379 }
1380
1381 .findbar input[type="checkbox"] {
1382 pointer-events: none;
1383 }
1384
1385 .findbar label {
1386 -webkit-user-select: none;
1387 -moz-user-select: none;
1388 user-select: none;
1389 }
1390
1391 .findbar label:hover,
1392 .findbar input:focus + label {
1393 color: var(--toggled-btn-color);
1394 background-color: var(--button-hover-color);
1395 }
1396
1397 html[dir="ltr"] #findInput {
1398 border-top-right-radius: 0;
1399 border-bottom-right-radius: 0;
1400 }
1401 html[dir="rtl"] #findInput {
1402 border-top-left-radius: 0;
1403 border-bottom-left-radius: 0;
1404 }
1405
1406 .findbar .toolbarField[type="checkbox"]:checked + .toolbarLabel {
1407 background-color: var(--toggled-btn-bg-color) !important;
1408 color: var(--toggled-btn-color);
1409 }
1410
1411 #findInput {
1412 width: 200px;
1413 }
1414 #findInput::-moz-placeholder {
1415 font-style: normal;
1416 }
1417 #findInput::placeholder {
1418 font-style: normal;
1419 }
1420 #findInput[data-status="pending"] {
1421 background-image: var(--loading-icon);
1422 background-repeat: no-repeat;
1423 background-position: 98%;
1424 }
1425 html[dir="rtl"] #findInput[data-status="pending"] {
1426 background-position: 3px;
1427 }
1428 #findInput[data-status="notFound"] {
1429 background-color: rgba(255, 102, 102, 1);
1430 }
1431
1432 .secondaryToolbar {
1433 padding: 6px 0 10px;
1434 height: auto;
1435 z-index: 30000;
1436 background-color: var(--doorhanger-bg-color);
1437 }
1438 html[dir="ltr"] .secondaryToolbar {
1439 right: 4px;
1440 }
1441 html[dir="rtl"] .secondaryToolbar {
1442 left: 4px;
1443 }
1444
1445 #secondaryToolbarButtonContainer {
1446 max-width: 220px;
1447 max-height: 400px;
1448 overflow-y: auto;
1449 -webkit-overflow-scrolling: touch;
1450 margin-bottom: -4px;
1451 }
1452
1453 #secondaryToolbarButtonContainer.hiddenScrollModeButtons > .scrollModeButtons,
1454 #secondaryToolbarButtonContainer.hiddenSpreadModeButtons > .spreadModeButtons {
1455 display: none !important;
1456 }
1457
1458 .doorHanger,
1459 .doorHangerRight {
1460 border-radius: 2px;
1461 box-shadow: 0 1px 5px var(--doorhanger-border-color),
1462 0 0 0 1px var(--doorhanger-border-color);
1463 border: var(--doorhanger-border-color-whcm);
1464 }
1465 .doorHanger:after,
1466 .doorHanger:before,
1467 .doorHangerRight:after,
1468 .doorHangerRight:before {
1469 bottom: 100%;
1470 border: solid rgba(0, 0, 0, 0);
1471 content: " ";
1472 height: 0;
1473 width: 0;
1474 position: absolute;
1475 pointer-events: none;
1476 opacity: var(--doorhanger-triangle-opacity-whcm);
1477 }
1478 .doorHanger:after,
1479 .doorHangerRight:after {
1480 border-width: 8px;
1481 }
1482 .doorHanger:after {
1483 border-bottom-color: var(--toolbar-bg-color);
1484 }
1485 .doorHangerRight:after {
1486 border-bottom-color: var(--doorhanger-bg-color);
1487 }
1488 .doorHanger:before,
1489 .doorHangerRight:before {
1490 border-bottom-color: var(--doorhanger-border-color);
1491 border-width: 9px;
1492 }
1493
1494 html[dir="ltr"] .doorHanger:after,
1495 html[dir="rtl"] .doorHangerRight:after {
1496 left: 10px;
1497 margin-left: -8px;
1498 }
1499
1500 html[dir="ltr"] .doorHanger:before,
1501 html[dir="rtl"] .doorHangerRight:before {
1502 left: 10px;
1503 margin-left: -9px;
1504 }
1505
1506 html[dir="rtl"] .doorHanger:after,
1507 html[dir="ltr"] .doorHangerRight:after {
1508 right: 10px;
1509 margin-right: -8px;
1510 }
1511
1512 html[dir="rtl"] .doorHanger:before,
1513 html[dir="ltr"] .doorHangerRight:before {
1514 right: 10px;
1515 margin-right: -9px;
1516 }
1517
1518 #findResultsCount {
1519 background-color: rgba(217, 217, 217, 1);
1520 color: rgba(82, 82, 82, 1);
1521 text-align: center;
1522 padding: 4px 5px;
1523 margin: 5px;
1524 }
1525
1526 #findMsg {
1527 color: rgba(251, 0, 0, 1);
1528 }
1529 #findMsg:empty {
1530 display: none;
1531 }
1532
1533 #toolbarViewerMiddle {
1534 position: absolute;
1535 left: 50%;
1536 transform: translateX(-50%);
1537 }
1538
1539 html[dir="ltr"] #toolbarViewerLeft,
1540 html[dir="rtl"] #toolbarViewerRight,
1541 html[dir="ltr"] #toolbarSidebarLeft,
1542 html[dir="rtl"] #toolbarSidebarRight {
1543 float: left;
1544 }
1545 html[dir="ltr"] #toolbarViewerRight,
1546 html[dir="rtl"] #toolbarViewerLeft,
1547 html[dir="ltr"] #toolbarSidebarRight,
1548 html[dir="rtl"] #toolbarSidebarLeft {
1549 float: right;
1550 }
1551 html[dir="ltr"] #toolbarViewerLeft > *,
1552 html[dir="ltr"] #toolbarViewerMiddle > *,
1553 html[dir="ltr"] #toolbarViewerRight > *,
1554 html[dir="ltr"] #toolbarSidebarLeft *,
1555 html[dir="ltr"] #toolbarSidebarRight *,
1556 html[dir="ltr"] .findbar * {
1557 position: relative;
1558 float: left;
1559 }
1560 html[dir="rtl"] #toolbarViewerLeft > *,
1561 html[dir="rtl"] #toolbarViewerMiddle > *,
1562 html[dir="rtl"] #toolbarViewerRight > *,
1563 html[dir="rtl"] #toolbarSidebarLeft *,
1564 html[dir="rtl"] #toolbarSidebarRight *,
1565 html[dir="rtl"] .findbar * {
1566 position: relative;
1567 float: right;
1568 }
1569
1570 .splitToolbarButton {
1571 margin: 2px 2px 0;
1572 display: inline-block;
1573 }
1574 html[dir="ltr"] .splitToolbarButton > .toolbarButton {
1575 float: left;
1576 }
1577 html[dir="rtl"] .splitToolbarButton > .toolbarButton {
1578 float: right;
1579 }
1580
1581 .toolbarButton,
1582 .secondaryToolbarButton,
1583 .overlayButton {
1584 border: 0 none;
1585 background: none;
1586 width: 28px;
1587 height: 28px;
1588 }
1589
1590 .overlayButton:hover,
1591 .overlayButton:focus {
1592 background-color: var(--overlay-button-hover-bg-color);
1593 }
1594
1595 .overlayButton:hover > span,
1596 .overlayButton:focus > span {
1597 color: var(--overlay-button-hover-color);
1598 }
1599
1600 .toolbarButton > span {
1601 display: inline-block;
1602 width: 0;
1603 height: 0;
1604 overflow: hidden;
1605 }
1606
1607 .toolbarButton[disabled],
1608 .secondaryToolbarButton[disabled],
1609 .overlayButton[disabled] {
1610 opacity: 0.5;
1611 }
1612
1613 .splitToolbarButton.toggled .toolbarButton {
1614 margin: 0;
1615 }
1616
1617 .splitToolbarButton > .toolbarButton:hover,
1618 .splitToolbarButton > .toolbarButton:focus,
1619 .dropdownToolbarButton:hover,
1620 .toolbarButton.textButton:hover,
1621 .toolbarButton.textButton:focus {
1622 background-color: var(--button-hover-color);
1623 z-index: 199;
1624 }
1625 .splitToolbarButton > .toolbarButton {
1626 position: relative;
1627 }
1628 html[dir="ltr"] .splitToolbarButton > .toolbarButton:first-child,
1629 html[dir="rtl"] .splitToolbarButton > .toolbarButton:last-child {
1630 margin: 0;
1631 }
1632 html[dir="ltr"] .splitToolbarButton > .toolbarButton:last-child,
1633 html[dir="rtl"] .splitToolbarButton > .toolbarButton:first-child {
1634 margin: 0;
1635 }
1636 .splitToolbarButtonSeparator {
1637 padding: 10px 0;
1638 width: 1px;
1639 background-color: var(--separator-color);
1640 z-index: 99;
1641 display: inline-block;
1642 margin: 4px 0;
1643 }
1644
1645 .findbar .splitToolbarButtonSeparator {
1646 background-color: var(--field-border-color);
1647 margin: 0;
1648 padding: 13px 0;
1649 }
1650
1651 html[dir="ltr"] .splitToolbarButtonSeparator {
1652 float: left;
1653 }
1654 html[dir="rtl"] .splitToolbarButtonSeparator {
1655 float: right;
1656 }
1657
1658 .toolbarButton,
1659 .dropdownToolbarButton,
1660 .secondaryToolbarButton,
1661 .overlayButton {
1662 min-width: 16px;
1663 margin: 2px 1px;
1664 padding: 2px 6px 0;
1665 border: none;
1666 border-radius: 2px;
1667 color: var(--main-color);
1668 font-size: 12px;
1669 line-height: 14px;
1670 -webkit-user-select: none;
1671 -moz-user-select: none;
1672 user-select: none;
1673 cursor: default;
1674 box-sizing: border-box;
1675 }
1676
1677 html[dir="ltr"] #toolbarViewerLeft > .toolbarButton:first-child,
1678 html[dir="rtl"] #toolbarViewerRight > .toolbarButton:last-child {
1679 margin-left: 2px;
1680 }
1681
1682 html[dir="ltr"] #toolbarViewerRight > .toolbarButton:last-child,
1683 html[dir="rtl"] #toolbarViewerLeft > .toolbarButton:first-child {
1684 margin-right: 2px;
1685 }
1686 .toolbarButton:hover,
1687 .toolbarButton:focus {
1688 background-color: var(--button-hover-color);
1689 }
1690 .secondaryToolbarButton:hover,
1691 .secondaryToolbarButton:focus {
1692 background-color: var(--doorhanger-hover-bg-color);
1693 color: var(--doorhanger-hover-color);
1694 }
1695
1696 .toolbarButton.toggled,
1697 .splitToolbarButton.toggled > .toolbarButton.toggled,
1698 .secondaryToolbarButton.toggled {
1699 background-color: var(--toggled-btn-bg-color);
1700 color: var(--toggled-btn-color);
1701 }
1702
1703 .secondaryToolbarButton.toggled::before {
1704 background-color: var(--toggled-btn-color);
1705 }
1706
1707 .toolbarButton.toggled::before {
1708 background-color: var(--toggled-btn-color);
1709 }
1710
1711 .toolbarButton.toggled:hover:active,
1712 .splitToolbarButton.toggled > .toolbarButton.toggled:hover:active,
1713 .secondaryToolbarButton.toggled:hover:active {
1714 background-color: var(--toggled-hover-active-btn-color);
1715 }
1716
1717 .dropdownToolbarButton {
1718 width: 140px;
1719 padding: 0;
1720 overflow: hidden;
1721 background-color: var(--dropdown-btn-bg-color);
1722 margin-top: 2px !important;
1723 }
1724 .dropdownToolbarButton::after {
1725 top: 6px;
1726 pointer-events: none;
1727
1728 -webkit-mask-image: var(--toolbarButton-menuArrow-icon);
1729 mask-image: var(--toolbarButton-menuArrow-icon);
1730 }
1731 html[dir="ltr"] .dropdownToolbarButton::after {
1732 right: 7px;
1733 }
1734 html[dir="rtl"] .dropdownToolbarButton::after {
1735 left: 7px;
1736 }
1737
1738 .dropdownToolbarButton > select {
1739 width: 162px;
1740 height: 28px;
1741 font-size: 12px;
1742 color: var(--main-color);
1743 margin: 0;
1744 padding: 1px 0 2px;
1745 border: none;
1746 background-color: var(--dropdown-btn-bg-color);
1747 }
1748 html[dir="ltr"] .dropdownToolbarButton > select {
1749 padding-left: 4px;
1750 }
1751 html[dir="rtl"] .dropdownToolbarButton > select {
1752 padding-right: 4px;
1753 }
1754 .dropdownToolbarButton > select:hover,
1755 .dropdownToolbarButton > select:focus {
1756 background-color: var(--button-hover-color);
1757 color: var(--toggled-btn-color);
1758 }
1759
1760 .dropdownToolbarButton > select > option {
1761 background: var(--doorhanger-bg-color);
1762 color: var(--main-color);
1763 }
1764
1765 #customScaleOption {
1766 display: none;
1767 }
1768
1769 #pageWidthOption {
1770 border-bottom: 1px rgba(255, 255, 255, 0.5) solid;
1771 }
1772
1773 .toolbarButtonSpacer {
1774 width: 30px;
1775 display: inline-block;
1776 height: 1px;
1777 }
1778
1779 .toolbarButton::before,
1780 .secondaryToolbarButton::before,
1781 .dropdownToolbarButton::after,
1782 .treeItemToggler::before {
1783 /* All matching images have a size of 16x16
1784 * All relevant containers have a size of 28x28 */
1785 position: absolute;
1786 display: inline-block;
1787 width: 16px;
1788 height: 16px;
1789
1790 content: "";
1791 background-color: var(--toolbar-icon-bg-color);
1792 -webkit-mask-size: cover;
1793 mask-size: cover;
1794 }
1795
1796 .dropdownToolbarButton:hover::after,
1797 .dropdownToolbarButton:focus::after,
1798 .dropdownToolbarButton:active::after {
1799 background-color: var(--toolbar-icon-hover-bg-color);
1800 }
1801
1802 .toolbarButton::before {
1803 opacity: var(--toolbar-icon-opacity);
1804 top: 6px;
1805 left: 6px;
1806 }
1807
1808 .toolbarButton:hover::before,
1809 .toolbarButton:focus::before,
1810 .secondaryToolbarButton:hover::before,
1811 .secondaryToolbarButton:focus::before {
1812 background-color: var(--toolbar-icon-hover-bg-color);
1813 }
1814
1815 .secondaryToolbarButton::before {
1816 opacity: var(--doorhanger-icon-opacity);
1817 top: 5px;
1818 }
1819 html[dir="ltr"] .secondaryToolbarButton::before {
1820 left: 12px;
1821 }
1822 html[dir="rtl"] .secondaryToolbarButton::before {
1823 right: 12px;
1824 }
1825
1826 .toolbarButton#sidebarToggle::before {
1827 -webkit-mask-image: var(--toolbarButton-sidebarToggle-icon);
1828 mask-image: var(--toolbarButton-sidebarToggle-icon);
1829 }
1830 html[dir="rtl"] .toolbarButton#sidebarToggle::before {
1831 transform: scaleX(-1);
1832 }
1833
1834 .toolbarButton#secondaryToolbarToggle::before {
1835 -webkit-mask-image: var(--toolbarButton-secondaryToolbarToggle-icon);
1836 mask-image: var(--toolbarButton-secondaryToolbarToggle-icon);
1837 }
1838 html[dir="rtl"] .toolbarButton#secondaryToolbarToggle::before {
1839 transform: scaleX(-1);
1840 }
1841
1842 .toolbarButton.findPrevious::before {
1843 -webkit-mask-image: var(--findbarButton-previous-icon);
1844 mask-image: var(--findbarButton-previous-icon);
1845 }
1846
1847 .toolbarButton.findNext::before {
1848 -webkit-mask-image: var(--findbarButton-next-icon);
1849 mask-image: var(--findbarButton-next-icon);
1850 }
1851
1852 .toolbarButton.pageUp::before {
1853 -webkit-mask-image: var(--toolbarButton-pageUp-icon);
1854 mask-image: var(--toolbarButton-pageUp-icon);
1855 }
1856
1857 .toolbarButton.pageDown::before {
1858 -webkit-mask-image: var(--toolbarButton-pageDown-icon);
1859 mask-image: var(--toolbarButton-pageDown-icon);
1860 }
1861
1862 .toolbarButton.zoomOut::before {
1863 -webkit-mask-image: var(--toolbarButton-zoomOut-icon);
1864 mask-image: var(--toolbarButton-zoomOut-icon);
1865 }
1866
1867 .toolbarButton.zoomIn::before {
1868 -webkit-mask-image: var(--toolbarButton-zoomIn-icon);
1869 mask-image: var(--toolbarButton-zoomIn-icon);
1870 }
1871
1872 .toolbarButton.presentationMode::before,
1873 .secondaryToolbarButton.presentationMode::before {
1874 -webkit-mask-image: var(--toolbarButton-presentationMode-icon);
1875 mask-image: var(--toolbarButton-presentationMode-icon);
1876 }
1877
1878 .toolbarButton.print::before,
1879 .secondaryToolbarButton.print::before {
1880 -webkit-mask-image: var(--toolbarButton-print-icon);
1881 mask-image: var(--toolbarButton-print-icon);
1882 }
1883
1884 .toolbarButton.openFile::before,
1885 .secondaryToolbarButton.openFile::before {
1886 -webkit-mask-image: var(--toolbarButton-openFile-icon);
1887 mask-image: var(--toolbarButton-openFile-icon);
1888 }
1889
1890 .toolbarButton.download::before,
1891 .secondaryToolbarButton.download::before {
1892 -webkit-mask-image: var(--toolbarButton-download-icon);
1893 mask-image: var(--toolbarButton-download-icon);
1894 }
1895
1896 .secondaryToolbarButton.bookmark {
1897 padding-top: 6px;
1898 text-decoration: none;
1899 }
1900
1901 .bookmark[href="#"] {
1902 opacity: 0.5;
1903 pointer-events: none;
1904 }
1905
1906 .toolbarButton.bookmark::before,
1907 .secondaryToolbarButton.bookmark::before {
1908 -webkit-mask-image: var(--toolbarButton-bookmark-icon);
1909 mask-image: var(--toolbarButton-bookmark-icon);
1910 }
1911
1912 #viewThumbnail.toolbarButton::before {
1913 -webkit-mask-image: var(--toolbarButton-viewThumbnail-icon);
1914 mask-image: var(--toolbarButton-viewThumbnail-icon);
1915 }
1916
1917 #viewOutline.toolbarButton::before {
1918 -webkit-mask-image: var(--toolbarButton-viewOutline-icon);
1919 mask-image: var(--toolbarButton-viewOutline-icon);
1920 }
1921 html[dir="rtl"] #viewOutline.toolbarButton::before {
1922 transform: scaleX(-1);
1923 }
1924
1925 #viewAttachments.toolbarButton::before {
1926 -webkit-mask-image: var(--toolbarButton-viewAttachments-icon);
1927 mask-image: var(--toolbarButton-viewAttachments-icon);
1928 }
1929
1930 #viewLayers.toolbarButton::before {
1931 -webkit-mask-image: var(--toolbarButton-viewLayers-icon);
1932 mask-image: var(--toolbarButton-viewLayers-icon);
1933 }
1934
1935 #currentOutlineItem.toolbarButton::before {
1936 -webkit-mask-image: var(--toolbarButton-currentOutlineItem-icon);
1937 mask-image: var(--toolbarButton-currentOutlineItem-icon);
1938 }
1939 html[dir="rtl"] #currentOutlineItem.toolbarButton::before {
1940 transform: scaleX(-1);
1941 }
1942
1943 #viewFind.toolbarButton::before {
1944 -webkit-mask-image: var(--toolbarButton-search-icon);
1945 mask-image: var(--toolbarButton-search-icon);
1946 }
1947
1948 .toolbarButton.pdfSidebarNotification::after {
1949 position: absolute;
1950 display: inline-block;
1951 top: 1px;
1952 /* Create a filled circle, with a diameter of 9 pixels, using only CSS: */
1953 content: "";
1954 background-color: rgba(112, 219, 85, 1);
1955 height: 9px;
1956 width: 9px;
1957 border-radius: 50%;
1958 }
1959 html[dir="ltr"] .toolbarButton.pdfSidebarNotification::after {
1960 left: 17px;
1961 }
1962 html[dir="rtl"] .toolbarButton.pdfSidebarNotification::after {
1963 right: 17px;
1964 }
1965
1966 .secondaryToolbarButton {
1967 position: relative;
1968 margin: 0;
1969 padding: 0 0 1px;
1970 height: auto;
1971 min-height: 26px;
1972 width: auto;
1973 min-width: 100%;
1974 white-space: normal;
1975 border-radius: 0;
1976 box-sizing: border-box;
1977 }
1978 html[dir="ltr"] .secondaryToolbarButton {
1979 padding-left: 36px;
1980 text-align: left;
1981 }
1982 html[dir="rtl"] .secondaryToolbarButton {
1983 padding-right: 36px;
1984 text-align: right;
1985 }
1986
1987 html[dir="ltr"] .secondaryToolbarButton > span {
1988 padding-right: 4px;
1989 }
1990 html[dir="rtl"] .secondaryToolbarButton > span {
1991 padding-left: 4px;
1992 }
1993
1994 .secondaryToolbarButton.firstPage::before {
1995 -webkit-mask-image: var(--secondaryToolbarButton-firstPage-icon);
1996 mask-image: var(--secondaryToolbarButton-firstPage-icon);
1997 }
1998
1999 .secondaryToolbarButton.lastPage::before {
2000 -webkit-mask-image: var(--secondaryToolbarButton-lastPage-icon);
2001 mask-image: var(--secondaryToolbarButton-lastPage-icon);
2002 }
2003
2004 .secondaryToolbarButton.rotateCcw::before {
2005 -webkit-mask-image: var(--secondaryToolbarButton-rotateCcw-icon);
2006 mask-image: var(--secondaryToolbarButton-rotateCcw-icon);
2007 }
2008
2009 .secondaryToolbarButton.rotateCw::before {
2010 -webkit-mask-image: var(--secondaryToolbarButton-rotateCw-icon);
2011 mask-image: var(--secondaryToolbarButton-rotateCw-icon);
2012 }
2013
2014 .secondaryToolbarButton.selectTool::before {
2015 -webkit-mask-image: var(--secondaryToolbarButton-selectTool-icon);
2016 mask-image: var(--secondaryToolbarButton-selectTool-icon);
2017 }
2018
2019 .secondaryToolbarButton.handTool::before {
2020 -webkit-mask-image: var(--secondaryToolbarButton-handTool-icon);
2021 mask-image: var(--secondaryToolbarButton-handTool-icon);
2022 }
2023
2024 .secondaryToolbarButton.scrollVertical::before {
2025 -webkit-mask-image: var(--secondaryToolbarButton-scrollVertical-icon);
2026 mask-image: var(--secondaryToolbarButton-scrollVertical-icon);
2027 }
2028
2029 .secondaryToolbarButton.scrollHorizontal::before {
2030 -webkit-mask-image: var(--secondaryToolbarButton-scrollHorizontal-icon);
2031 mask-image: var(--secondaryToolbarButton-scrollHorizontal-icon);
2032 }
2033
2034 .secondaryToolbarButton.scrollWrapped::before {
2035 -webkit-mask-image: var(--secondaryToolbarButton-scrollWrapped-icon);
2036 mask-image: var(--secondaryToolbarButton-scrollWrapped-icon);
2037 }
2038
2039 .secondaryToolbarButton.spreadNone::before {
2040 -webkit-mask-image: var(--secondaryToolbarButton-spreadNone-icon);
2041 mask-image: var(--secondaryToolbarButton-spreadNone-icon);
2042 }
2043
2044 .secondaryToolbarButton.spreadOdd::before {
2045 -webkit-mask-image: var(--secondaryToolbarButton-spreadOdd-icon);
2046 mask-image: var(--secondaryToolbarButton-spreadOdd-icon);
2047 }
2048
2049 .secondaryToolbarButton.spreadEven::before {
2050 -webkit-mask-image: var(--secondaryToolbarButton-spreadEven-icon);
2051 mask-image: var(--secondaryToolbarButton-spreadEven-icon);
2052 }
2053
2054 .secondaryToolbarButton.documentProperties::before {
2055 -webkit-mask-image: var(--secondaryToolbarButton-documentProperties-icon);
2056 mask-image: var(--secondaryToolbarButton-documentProperties-icon);
2057 }
2058
2059 .verticalToolbarSeparator {
2060 display: block;
2061 padding: 11px 0;
2062 margin: 5px 2px;
2063 width: 1px;
2064 background-color: var(--separator-color);
2065 }
2066 html[dir="ltr"] .verticalToolbarSeparator {
2067 margin-left: 2px;
2068 }
2069 html[dir="rtl"] .verticalToolbarSeparator {
2070 margin-right: 2px;
2071 }
2072
2073 .horizontalToolbarSeparator {
2074 display: block;
2075 margin: 6px 0 5px;
2076 height: 1px;
2077 width: 100%;
2078 border-top: 1px solid var(--doorhanger-separator-color);
2079 }
2080
2081 .toolbarField {
2082 padding: 4px 7px;
2083 margin: 3px 0;
2084 border-radius: 2px;
2085 background-color: var(--field-bg-color);
2086 background-clip: padding-box;
2087 border-width: 1px;
2088 border-style: solid;
2089 border-color: var(--field-border-color);
2090 box-shadow: none;
2091 color: var(--field-color);
2092 font-size: 12px;
2093 line-height: 16px;
2094 outline-style: none;
2095 }
2096
2097 .toolbarField[type="checkbox"] {
2098 opacity: 0;
2099 position: absolute !important;
2100 left: 0;
2101 }
2102
2103 html[dir="ltr"] .toolbarField[type="checkbox"] {
2104 margin: 10px 0 3px 7px;
2105 }
2106
2107 html[dir="rtl"] .toolbarField[type="checkbox"] {
2108 margin: 10px 7px 3px 0;
2109 }
2110
2111 .toolbarField.pageNumber {
2112 -moz-appearance: textfield; /* hides the spinner in moz */
2113 min-width: 16px;
2114 text-align: right;
2115 width: 40px;
2116 }
2117
2118 .toolbarField.pageNumber.visiblePageIsLoading {
2119 background-image: var(--loading-icon);
2120 background-repeat: no-repeat;
2121 background-position: 3px;
2122 }
2123
2124 .toolbarField.pageNumber::-webkit-inner-spin-button,
2125 .toolbarField.pageNumber::-webkit-outer-spin-button {
2126 -webkit-appearance: none;
2127 margin: 0;
2128 }
2129
2130 .toolbarField:focus {
2131 border-color: #0a84ff;
2132 }
2133
2134 .toolbarLabel {
2135 min-width: 16px;
2136 padding: 7px;
2137 margin: 2px;
2138 border-radius: 2px;
2139 color: var(--main-color);
2140 font-size: 12px;
2141 line-height: 14px;
2142 text-align: left;
2143 -webkit-user-select: none;
2144 -moz-user-select: none;
2145 user-select: none;
2146 cursor: default;
2147 }
2148
2149 html[dir="ltr"] #numPages.toolbarLabel {
2150 padding-left: 3px;
2151 }
2152 html[dir="rtl"] #numPages.toolbarLabel {
2153 padding-right: 3px;
2154 }
2155
2156 #thumbnailView {
2157 position: absolute;
2158 width: calc(100% - 60px);
2159 top: 0;
2160 bottom: 0;
2161 padding: 10px 30px 0;
2162 overflow: auto;
2163 -webkit-overflow-scrolling: touch;
2164 }
2165
2166 #thumbnailView > a:active,
2167 #thumbnailView > a:focus {
2168 outline: 0;
2169 }
2170
2171 .thumbnail {
2172 margin: 0 10px 5px;
2173 }
2174 html[dir="ltr"] .thumbnail {
2175 float: left;
2176 }
2177 html[dir="rtl"] .thumbnail {
2178 float: right;
2179 }
2180
2181 #thumbnailView > a:last-of-type > .thumbnail {
2182 margin-bottom: 10px;
2183 }
2184
2185 #thumbnailView > a:last-of-type > .thumbnail:not([data-loaded]) {
2186 margin-bottom: 9px;
2187 }
2188
2189 .thumbnail:not([data-loaded]) {
2190 border: 1px dashed rgba(132, 132, 132, 1);
2191 margin: -1px 9px 4px;
2192 }
2193
2194 .thumbnailImage {
2195 border: 1px solid rgba(0, 0, 0, 0);
2196 box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.5), 0 2px 8px rgba(0, 0, 0, 0.3);
2197 opacity: 0.8;
2198 z-index: 99;
2199 background-color: rgba(255, 255, 255, 1);
2200 background-clip: content-box;
2201 }
2202
2203 .thumbnailSelectionRing {
2204 border-radius: 2px;
2205 padding: 7px;
2206 }
2207
2208 a:focus > .thumbnail > .thumbnailSelectionRing > .thumbnailImage,
2209 .thumbnail:hover > .thumbnailSelectionRing > .thumbnailImage {
2210 opacity: 0.9;
2211 }
2212
2213 a:focus > .thumbnail > .thumbnailSelectionRing,
2214 .thumbnail:hover > .thumbnailSelectionRing {
2215 background-color: var(--sidebaritem-bg-color);
2216 background-clip: padding-box;
2217 color: rgba(255, 255, 255, 0.9);
2218 }
2219
2220 .thumbnail.selected > .thumbnailSelectionRing > .thumbnailImage {
2221 opacity: 1;
2222 }
2223
2224 .thumbnail.selected > .thumbnailSelectionRing {
2225 background-color: var(--sidebaritem-bg-color);
2226 background-clip: padding-box;
2227 color: rgba(255, 255, 255, 1);
2228 }
2229
2230 #outlineView,
2231 #attachmentsView,
2232 #layersView {
2233 position: absolute;
2234 width: calc(100% - 8px);
2235 top: 0;
2236 bottom: 0;
2237 padding: 4px 4px 0;
2238 overflow: auto;
2239 -webkit-overflow-scrolling: touch;
2240 -webkit-user-select: none;
2241 -moz-user-select: none;
2242 user-select: none;
2243 }
2244
2245 html[dir="ltr"] .treeWithDeepNesting > .treeItem,
2246 html[dir="ltr"] .treeItem > .treeItems {
2247 margin-left: 20px;
2248 }
2249
2250 html[dir="rtl"] .treeWithDeepNesting > .treeItem,
2251 html[dir="rtl"] .treeItem > .treeItems {
2252 margin-right: 20px;
2253 }
2254
2255 .treeItem > a {
2256 text-decoration: none;
2257 display: inline-block;
2258 min-width: 95%;
2259 /* Subtract the right padding (left, in RTL mode) of the container: */
2260 min-width: calc(100% - 4px);
2261 height: auto;
2262 margin-bottom: 1px;
2263 border-radius: 2px;
2264 color: var(--treeitem-color);
2265 font-size: 13px;
2266 line-height: 15px;
2267 -webkit-user-select: none;
2268 -moz-user-select: none;
2269 user-select: none;
2270 white-space: normal;
2271 cursor: pointer;
2272 }
2273 html[dir="ltr"] .treeItem > a {
2274 padding: 2px 0 5px 4px;
2275 }
2276 html[dir="rtl"] .treeItem > a {
2277 padding: 2px 4px 5px 0;
2278 }
2279
2280 #layersView .treeItem > a > * {
2281 cursor: pointer;
2282 }
2283 html[dir="ltr"] #layersView .treeItem > a > label {
2284 padding-left: 4px;
2285 }
2286 html[dir="rtl"] #layersView .treesItem > a > label {
2287 padding-right: 4px;
2288 }
2289
2290 .treeItemToggler {
2291 position: relative;
2292 height: 0;
2293 width: 0;
2294 color: rgba(255, 255, 255, 0.5);
2295 }
2296 .treeItemToggler::before {
2297 -webkit-mask-image: var(--treeitem-expanded-icon);
2298 mask-image: var(--treeitem-expanded-icon);
2299 }
2300 .treeItemToggler.treeItemsHidden::before {
2301 -webkit-mask-image: var(--treeitem-collapsed-icon);
2302 mask-image: var(--treeitem-collapsed-icon);
2303 }
2304 html[dir="rtl"] .treeItemToggler.treeItemsHidden::before {
2305 transform: scaleX(-1);
2306 }
2307 .treeItemToggler.treeItemsHidden ~ .treeItems {
2308 display: none;
2309 }
2310 html[dir="ltr"] .treeItemToggler {
2311 float: left;
2312 }
2313 html[dir="rtl"] .treeItemToggler {
2314 float: right;
2315 }
2316 html[dir="ltr"] .treeItemToggler::before {
2317 right: 4px;
2318 }
2319 html[dir="rtl"] .treeItemToggler::before {
2320 left: 4px;
2321 }
2322
2323 .treeItem.selected > a {
2324 background-color: var(--treeitem-selected-bg-color);
2325 color: var(--treeitem-selected-color);
2326 }
2327
2328 .treeItemToggler:hover,
2329 .treeItemToggler:hover + a,
2330 .treeItemToggler:hover ~ .treeItems,
2331 .treeItem > a:hover {
2332 background-color: var(--sidebaritem-bg-color);
2333 background-clip: padding-box;
2334 border-radius: 2px;
2335 color: var(--treeitem-hover-color);
2336 }
2337
2338 /* TODO: file FF bug to support ::-moz-selection:window-inactive
2339 so we can override the opaque grey background when the window is inactive;
2340 see https://bugzilla.mozilla.org/show_bug.cgi?id=706209 */
2341 ::-moz-selection {
2342 background: rgba(0, 0, 255, 0.3);
2343 }
2344 ::selection {
2345 background: rgba(0, 0, 255, 0.3);
2346 }
2347
2348 #errorWrapper {
2349 background: none repeat scroll 0 0 var(--errorWrapper-bg-color);
2350 color: var(--main-color);
2351 left: 0;
2352 position: absolute;
2353 right: 0;
2354 z-index: 1000;
2355 padding: 3px 6px;
2356 }
2357
2358 #errorMessageLeft {
2359 float: left;
2360 }
2361
2362 #errorMessageRight {
2363 float: right;
2364 }
2365
2366 #errorMoreInfo {
2367 background-color: var(--field-bg-color);
2368 color: var(--field-color);
2369 border: 1px solid var(--field-border-color);
2370 padding: 3px;
2371 margin: 3px;
2372 width: 98%;
2373 }
2374
2375 .overlayButton {
2376 width: auto;
2377 margin: 3px 4px 2px !important;
2378 padding: 2px 11px;
2379 color: var(--main-color);
2380 background-color: var(--overlay-button-bg-color);
2381 border: var(--overlay-button-border) !important;
2382 }
2383
2384 #overlayContainer {
2385 display: table;
2386 position: absolute;
2387 width: 100%;
2388 height: 100%;
2389 background-color: rgba(0, 0, 0, 0.2);
2390 z-index: 40000;
2391 }
2392 #overlayContainer > * {
2393 overflow: auto;
2394 -webkit-overflow-scrolling: touch;
2395 }
2396
2397 #overlayContainer > .container {
2398 display: table-cell;
2399 vertical-align: middle;
2400 text-align: center;
2401 }
2402
2403 #overlayContainer > .container > .dialog {
2404 display: inline-block;
2405 padding: 15px;
2406 border-spacing: 4px;
2407 color: var(--main-color);
2408 font-size: 12px;
2409 line-height: 14px;
2410 background-color: var(--doorhanger-bg-color);
2411 border: 1px solid rgba(0, 0, 0, 0.5);
2412 border-radius: 4px;
2413 box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
2414 }
2415
2416 .dialog > .row {
2417 display: table-row;
2418 }
2419
2420 .dialog > .row > * {
2421 display: table-cell;
2422 }
2423
2424 .dialog .toolbarField {
2425 margin: 5px 0;
2426 }
2427
2428 .dialog .separator {
2429 display: block;
2430 margin: 4px 0;
2431 height: 1px;
2432 width: 100%;
2433 background-color: var(--separator-color);
2434 }
2435
2436 .dialog .buttonRow {
2437 text-align: center;
2438 vertical-align: middle;
2439 }
2440
2441 .dialog :link {
2442 color: rgba(255, 255, 255, 1);
2443 }
2444
2445 #passwordOverlay > .dialog {
2446 text-align: center;
2447 }
2448 #passwordOverlay .toolbarField {
2449 width: 200px;
2450 }
2451
2452 #documentPropertiesOverlay > .dialog {
2453 text-align: left;
2454 }
2455 #documentPropertiesOverlay .row > * {
2456 min-width: 100px;
2457 }
2458 html[dir="ltr"] #documentPropertiesOverlay .row > * {
2459 text-align: left;
2460 }
2461 html[dir="rtl"] #documentPropertiesOverlay .row > * {
2462 text-align: right;
2463 }
2464 #documentPropertiesOverlay .row > span {
2465 width: 125px;
2466 word-wrap: break-word;
2467 }
2468 #documentPropertiesOverlay .row > p {
2469 max-width: 225px;
2470 word-wrap: break-word;
2471 }
2472 #documentPropertiesOverlay .buttonRow {
2473 margin-top: 10px;
2474 }
2475
2476 .clearBoth {
2477 clear: both;
2478 }
2479
2480 .fileInput {
2481 background: rgba(255, 255, 255, 1);
2482 color: rgba(0, 0, 0, 1);
2483 margin-top: 5px;
2484 visibility: hidden;
2485 position: fixed;
2486 right: 0;
2487 top: 0;
2488 }
2489
2490 #PDFBug {
2491 background: none repeat scroll 0 0 rgba(255, 255, 255, 1);
2492 border: 1px solid rgba(102, 102, 102, 1);
2493 position: fixed;
2494 top: 32px;
2495 right: 0;
2496 bottom: 0;
2497 font-size: 10px;
2498 padding: 0;
2499 width: 300px;
2500 }
2501 #PDFBug .controls {
2502 background: rgba(238, 238, 238, 1);
2503 border-bottom: 1px solid rgba(102, 102, 102, 1);
2504 padding: 3px;
2505 }
2506 #PDFBug .panels {
2507 bottom: 0;
2508 left: 0;
2509 overflow: auto;
2510 -webkit-overflow-scrolling: touch;
2511 position: absolute;
2512 right: 0;
2513 top: 27px;
2514 }
2515 #PDFBug .panels > div {
2516 padding: 5px;
2517 }
2518 #PDFBug button.active {
2519 font-weight: bold;
2520 }
2521 .debuggerShowText {
2522 background: none repeat scroll 0 0 rgba(255, 255, 0, 1);
2523 color: rgba(0, 0, 255, 1);
2524 }
2525 .debuggerHideText:hover {
2526 background: none repeat scroll 0 0 rgba(255, 255, 0, 1);
2527 }
2528 #PDFBug .stats {
2529 font-family: courier;
2530 font-size: 10px;
2531 white-space: pre;
2532 }
2533 #PDFBug .stats .title {
2534 font-weight: bold;
2535 }
2536 #PDFBug table {
2537 font-size: 10px;
2538 }
2539
2540 #viewer.textLayer-visible .textLayer {
2541 opacity: 1;
2542 }
2543
2544 #viewer.textLayer-visible .canvasWrapper {
2545 background-color: rgba(128, 255, 128, 1);
2546 }
2547
2548 #viewer.textLayer-visible .canvasWrapper canvas {
2549 mix-blend-mode: screen;
2550 }
2551
2552 #viewer.textLayer-visible .textLayer span {
2553 background-color: rgba(255, 255, 0, 0.1);
2554 color: rgba(0, 0, 0, 1);
2555 border: solid 1px rgba(255, 0, 0, 0.5);
2556 box-sizing: border-box;
2557 }
2558
2559 #viewer.textLayer-hover .textLayer span:hover {
2560 background-color: rgba(255, 255, 255, 1);
2561 color: rgba(0, 0, 0, 1);
2562 }
2563
2564 #viewer.textLayer-shadow .textLayer span {
2565 background-color: rgba(255, 255, 255, 0.6);
2566 color: rgba(0, 0, 0, 1);
2567 }
2568
2569 .grab-to-pan-grab {
2570 cursor: url("images/grab.cur"), move !important;
2571 cursor: -webkit-grab !important;
2572 cursor: grab !important;
2573 }
2574 .grab-to-pan-grab
2575 *:not(input):not(textarea):not(button):not(select):not(:link) {
2576 cursor: inherit !important;
2577 }
2578 .grab-to-pan-grab:active,
2579 .grab-to-pan-grabbing {
2580 cursor: url("images/grabbing.cur"), move !important;
2581 cursor: -webkit-grabbing !important;
2582 cursor: grabbing !important;
2583 position: fixed;
2584 background: rgba(0, 0, 0, 0);
2585 display: block;
2586 top: 0;
2587 left: 0;
2588 right: 0;
2589 bottom: 0;
2590 overflow: hidden;
2591 z-index: 50000; /* should be higher than anything else in PDF.js! */
2592 }
2593
2594 @page { {
2595 margin: 0;
2596 }
2597
2598 #printContainer {
2599 display: none;
2600 }
2601
2602 @media print {
2603 /* General rules for printing. */
2604 body {
2605 background: rgba(0, 0, 0, 0) none;
2606 }
2607
2608 /* Rules for browsers that don't support mozPrintCallback. */
2609 #sidebarContainer,
2610 #secondaryToolbar,
2611 .toolbar,
2612 #loadingBox,
2613 #errorWrapper,
2614 .textLayer {
2615 display: none;
2616 }
2617 #viewerContainer {
2618 overflow: visible;
2619 }
2620
2621 #mainContainer,
2622 #viewerContainer,
2623 .page,
2624 .page canvas {
2625 position: static;
2626 padding: 0;
2627 margin: 0;
2628 }
2629
2630 .page {
2631 float: left;
2632 display: none;
2633 border: none;
2634 box-shadow: none;
2635 background-clip: content-box;
2636 background-color: rgba(255, 255, 255, 1);
2637 }
2638
2639 .page[data-loaded] {
2640 display: block;
2641 }
2642
2643 .fileInput {
2644 display: none;
2645 }
2646
2647 /* Rules for browsers that support PDF.js printing */
2648 body[data-pdfjsprinting] #outerContainer {
2649 display: none;
2650 }
2651 body[data-pdfjsprinting] #printContainer {
2652 display: block;
2653 }
2654 #printContainer {
2655 height: 100%;
2656 }
2657 /* wrapper around (scaled) print canvas elements */
2658 #printContainer > div {
2659 page-break-after: always;
2660 page-break-inside: avoid;
2661
2662 /* The wrapper always cover the whole page. */
2663 height: 100%;
2664 width: 100%;
2665
2666 display: flex;
2667 flex-direction: column;
2668 justify-content: center;
2669 align-items: center;
2670 }
2671 #printContainer canvas,
2672 #printContainer img {
2673 /* The intrinsic canvas / image size will make sure that we fit the page. */
2674 max-width: 100%;
2675 max-height: 100%;
2676
2677 direction: ltr;
2678 display: block;
2679 }
2680 }
2681
2682 .visibleLargeView,
2683 .visibleMediumView,
2684 .visibleSmallView {
2685 display: none;
2686 }
2687
2688 @media all and (max-width: 900px) {
2689 #toolbarViewerMiddle {
2690 display: table;
2691 margin: auto;
2692 left: auto;
2693 position: inherit;
2694 transform: none;
2695 }
2696 }
2697
2698 @media all and (max-width: 840px) {
2699 #sidebarContainer {
2700 background-color: var(--sidebar-narrow-bg-color);
2701 }
2702
2703 html[dir="ltr"] #outerContainer.sidebarOpen #viewerContainer {
2704 left: 0 !important;
2705 }
2706 html[dir="rtl"] #outerContainer.sidebarOpen #viewerContainer {
2707 right: 0 !important;
2708 }
2709
2710 #outerContainer .hiddenLargeView,
2711 #outerContainer .hiddenMediumView {
2712 display: inherit;
2713 }
2714 #outerContainer .visibleLargeView,
2715 #outerContainer .visibleMediumView {
2716 display: none;
2717 }
2718 }
2719
2720 @media all and (max-width: 770px) {
2721 #outerContainer .hiddenLargeView {
2722 display: none;
2723 }
2724 #outerContainer .visibleLargeView {
2725 display: inherit;
2726 }
2727 }
2728
2729 @media all and (max-width: 700px) {
2730 #outerContainer .hiddenMediumView {
2731 display: none;
2732 }
2733 #outerContainer .visibleMediumView {
2734 display: none;
2735 }
2736 }
2737
2738 @media all and (max-width: 640px) {
2739 .hiddenSmallView,
2740 .hiddenSmallView * {
2741 display: none;
2742 }
2743 .visibleSmallView {
2744 display: none;
2745 }
2746 .toolbarButtonSpacer {
2747 width: 0;
2748 }
2749 html[dir="ltr"] .findbar {
2750 left: 34px;
2751 }
2752 html[dir="rtl"] .findbar {
2753 right: 34px;
2754 }
2755 }
2756
2757 @media all and (max-width: 535px) {
2758 #scaleSelectContainer {
2759 display: none;
2760 }
2761 }
2762