viewer.css 63 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439244024412442244324442445244624472448244924502451245224532454245524562457245824592460246124622463246424652466246724682469247024712472247324742475247624772478247924802481248224832484248524862487248824892490249124922493249424952496249724982499250025012502250325042505250625072508250925102511251225132514251525162517251825192520252125222523252425252526252725282529253025312532253325342535253625372538253925402541254225432544254525462547254825492550255125522553255425552556255725582559256025612562256325642565256625672568256925702571257225732574257525762577257825792580258125822583258425852586258725882589259025912592259325942595259625972598259926002601260226032604260526062607260826092610261126122613261426152616261726182619262026212622262326242625262626272628262926302631263226332634263526362637263826392640264126422643264426452646264726482649265026512652265326542655265626572658265926602661266226632664266526662667266826692670267126722673267426752676267726782679268026812682268326842685268626872688268926902691269226932694269526962697269826992700270127022703270427052706270727082709271027112712271327142715271627172718271927202721272227232724272527262727272827292730273127322733273427352736273727382739274027412742274327442745274627472748274927502751275227532754275527562757275827592760276127622763276427652766276727682769277027712772277327742775277627772778
  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. .textLayer {
  16. position: absolute;
  17. text-align: initial;
  18. left: 0;
  19. top: 0;
  20. right: 0;
  21. bottom: 0;
  22. overflow: hidden;
  23. opacity: 0.2;
  24. line-height: 1;
  25. -webkit-text-size-adjust: none;
  26. -moz-text-size-adjust: none;
  27. text-size-adjust: none;
  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. /* Only necessary in Google Chrome, see issue 14205, and most unfortunately
  38. * the problem doesn't show up in "text" reference tests. */
  39. .textLayer span.markedContent {
  40. top: 0;
  41. height: 0;
  42. }
  43. .textLayer .highlight {
  44. margin: -1px;
  45. padding: 1px;
  46. background-color: rgba(180, 0, 170, 1);
  47. border-radius: 4px;
  48. }
  49. .textLayer .highlight.appended {
  50. position: initial;
  51. }
  52. .textLayer .highlight.begin {
  53. border-radius: 4px 0 0 4px;
  54. }
  55. .textLayer .highlight.end {
  56. border-radius: 0 4px 4px 0;
  57. }
  58. .textLayer .highlight.middle {
  59. border-radius: 0;
  60. }
  61. .textLayer .highlight.selected {
  62. background-color: rgba(0, 100, 0, 1);
  63. }
  64. .textLayer ::-moz-selection {
  65. background: rgba(0, 0, 255, 1);
  66. }
  67. .textLayer ::selection {
  68. background: rgba(0, 0, 255, 1);
  69. }
  70. /* Avoids https://github.com/mozilla/pdf.js/issues/13840 in Chrome */
  71. .textLayer br::-moz-selection {
  72. background: transparent;
  73. }
  74. .textLayer br::selection {
  75. background: transparent;
  76. }
  77. .textLayer .endOfContent {
  78. display: block;
  79. position: absolute;
  80. left: 0;
  81. top: 100%;
  82. right: 0;
  83. bottom: 0;
  84. z-index: -1;
  85. cursor: default;
  86. -webkit-user-select: none;
  87. -moz-user-select: none;
  88. user-select: none;
  89. }
  90. .textLayer .endOfContent.active {
  91. top: 0;
  92. }
  93. :root {
  94. --annotation-unfocused-field-background: url("data:image/svg+xml;charset=UTF-8,<svg width='1px' height='1px' xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' style='fill:rgba(0, 54, 255, 0.13);'/></svg>");
  95. }
  96. .annotationLayer section {
  97. position: absolute;
  98. text-align: initial;
  99. }
  100. .annotationLayer .linkAnnotation > a,
  101. .annotationLayer .buttonWidgetAnnotation.pushButton > a {
  102. position: absolute;
  103. font-size: 1em;
  104. top: 0;
  105. left: 0;
  106. width: 100%;
  107. height: 100%;
  108. }
  109. .annotationLayer .buttonWidgetAnnotation.pushButton > canvas {
  110. position: relative;
  111. top: 0;
  112. left: 0;
  113. z-index: -1;
  114. }
  115. .annotationLayer .linkAnnotation > a:hover,
  116. .annotationLayer .buttonWidgetAnnotation.pushButton > a:hover {
  117. opacity: 0.2;
  118. background: rgba(255, 255, 0, 1);
  119. box-shadow: 0 2px 10px rgba(255, 255, 0, 1);
  120. }
  121. .annotationLayer .textAnnotation img {
  122. position: absolute;
  123. cursor: pointer;
  124. }
  125. .annotationLayer .textWidgetAnnotation input,
  126. .annotationLayer .textWidgetAnnotation textarea,
  127. .annotationLayer .choiceWidgetAnnotation select,
  128. .annotationLayer .buttonWidgetAnnotation.checkBox input,
  129. .annotationLayer .buttonWidgetAnnotation.radioButton input {
  130. background-image: var(--annotation-unfocused-field-background);
  131. border: 1px solid transparent;
  132. box-sizing: border-box;
  133. font-size: 9px;
  134. height: 100%;
  135. margin: 0;
  136. padding: 0 3px;
  137. vertical-align: top;
  138. width: 100%;
  139. }
  140. .annotationLayer .choiceWidgetAnnotation select option {
  141. padding: 0;
  142. }
  143. .annotationLayer .buttonWidgetAnnotation.radioButton input {
  144. border-radius: 50%;
  145. }
  146. .annotationLayer .textWidgetAnnotation textarea {
  147. font: message-box;
  148. font-size: 9px;
  149. resize: none;
  150. }
  151. .annotationLayer .textWidgetAnnotation input[disabled],
  152. .annotationLayer .textWidgetAnnotation textarea[disabled],
  153. .annotationLayer .choiceWidgetAnnotation select[disabled],
  154. .annotationLayer .buttonWidgetAnnotation.checkBox input[disabled],
  155. .annotationLayer .buttonWidgetAnnotation.radioButton input[disabled] {
  156. background: none;
  157. border: 1px solid transparent;
  158. cursor: not-allowed;
  159. }
  160. .annotationLayer .textWidgetAnnotation input:hover,
  161. .annotationLayer .textWidgetAnnotation textarea:hover,
  162. .annotationLayer .choiceWidgetAnnotation select:hover,
  163. .annotationLayer .buttonWidgetAnnotation.checkBox input:hover,
  164. .annotationLayer .buttonWidgetAnnotation.radioButton input:hover {
  165. border: 1px solid rgba(0, 0, 0, 1);
  166. }
  167. .annotationLayer .textWidgetAnnotation input:focus,
  168. .annotationLayer .textWidgetAnnotation textarea:focus,
  169. .annotationLayer .choiceWidgetAnnotation select:focus {
  170. background: none;
  171. border: 1px solid transparent;
  172. }
  173. .annotationLayer .textWidgetAnnotation input :focus,
  174. .annotationLayer .textWidgetAnnotation textarea :focus,
  175. .annotationLayer .choiceWidgetAnnotation select :focus,
  176. .annotationLayer .buttonWidgetAnnotation.checkBox :focus,
  177. .annotationLayer .buttonWidgetAnnotation.radioButton :focus {
  178. background-image: none;
  179. background-color: transparent;
  180. outline: auto;
  181. }
  182. .annotationLayer .buttonWidgetAnnotation.checkBox input:checked:before,
  183. .annotationLayer .buttonWidgetAnnotation.checkBox input:checked:after,
  184. .annotationLayer .buttonWidgetAnnotation.radioButton input:checked:before {
  185. background-color: rgba(0, 0, 0, 1);
  186. content: "";
  187. display: block;
  188. position: absolute;
  189. }
  190. .annotationLayer .buttonWidgetAnnotation.checkBox input:checked:before,
  191. .annotationLayer .buttonWidgetAnnotation.checkBox input:checked:after {
  192. height: 80%;
  193. left: 45%;
  194. width: 1px;
  195. }
  196. .annotationLayer .buttonWidgetAnnotation.checkBox input:checked:before {
  197. transform: rotate(45deg);
  198. }
  199. .annotationLayer .buttonWidgetAnnotation.checkBox input:checked:after {
  200. transform: rotate(-45deg);
  201. }
  202. .annotationLayer .buttonWidgetAnnotation.radioButton input:checked:before {
  203. border-radius: 50%;
  204. height: 50%;
  205. left: 30%;
  206. top: 20%;
  207. width: 50%;
  208. }
  209. .annotationLayer .textWidgetAnnotation input.comb {
  210. font-family: monospace;
  211. padding-left: 2px;
  212. padding-right: 0;
  213. }
  214. .annotationLayer .textWidgetAnnotation input.comb:focus {
  215. /*
  216. * Letter spacing is placed on the right side of each character. Hence, the
  217. * letter spacing of the last character may be placed outside the visible
  218. * area, causing horizontal scrolling. We avoid this by extending the width
  219. * when the element has focus and revert this when it loses focus.
  220. */
  221. width: 103%;
  222. }
  223. .annotationLayer .buttonWidgetAnnotation.checkBox input,
  224. .annotationLayer .buttonWidgetAnnotation.radioButton input {
  225. -webkit-appearance: none;
  226. -moz-appearance: none;
  227. appearance: none;
  228. padding: 0;
  229. }
  230. .annotationLayer .popupWrapper {
  231. position: absolute;
  232. width: 20em;
  233. }
  234. .annotationLayer .popup {
  235. position: absolute;
  236. z-index: 200;
  237. max-width: 20em;
  238. background-color: rgba(255, 255, 153, 1);
  239. box-shadow: 0 2px 5px rgba(136, 136, 136, 1);
  240. border-radius: 2px;
  241. padding: 6px;
  242. margin-left: 5px;
  243. cursor: pointer;
  244. font: message-box;
  245. font-size: 9px;
  246. white-space: normal;
  247. word-wrap: break-word;
  248. }
  249. .annotationLayer .popup > * {
  250. font-size: 9px;
  251. }
  252. .annotationLayer .popup h1 {
  253. display: inline-block;
  254. }
  255. .annotationLayer .popupDate {
  256. display: inline-block;
  257. margin-left: 5px;
  258. }
  259. .annotationLayer .popupContent {
  260. border-top: 1px solid rgba(51, 51, 51, 1);
  261. margin-top: 2px;
  262. padding-top: 2px;
  263. }
  264. .annotationLayer .richText > * {
  265. white-space: pre-wrap;
  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. :root {
  284. --xfa-unfocused-field-background: url("data:image/svg+xml;charset=UTF-8,<svg width='1px' height='1px' xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' style='fill:rgba(0, 54, 255, 0.13);'/></svg>");
  285. }
  286. .xfaLayer .highlight {
  287. margin: -1px;
  288. padding: 1px;
  289. background-color: rgba(239, 203, 237, 1);
  290. border-radius: 4px;
  291. }
  292. .xfaLayer .highlight.appended {
  293. position: initial;
  294. }
  295. .xfaLayer .highlight.begin {
  296. border-radius: 4px 0 0 4px;
  297. }
  298. .xfaLayer .highlight.end {
  299. border-radius: 0 4px 4px 0;
  300. }
  301. .xfaLayer .highlight.middle {
  302. border-radius: 0;
  303. }
  304. .xfaLayer .highlight.selected {
  305. background-color: rgba(203, 223, 203, 1);
  306. }
  307. .xfaLayer ::-moz-selection {
  308. background: rgba(0, 0, 255, 1);
  309. }
  310. .xfaLayer ::selection {
  311. background: rgba(0, 0, 255, 1);
  312. }
  313. .xfaPage {
  314. overflow: hidden;
  315. position: relative;
  316. }
  317. .xfaContentarea {
  318. position: absolute;
  319. }
  320. .xfaPrintOnly {
  321. display: none;
  322. }
  323. .xfaLayer {
  324. position: absolute;
  325. text-align: initial;
  326. top: 0;
  327. left: 0;
  328. transform-origin: 0 0;
  329. line-height: 1.2;
  330. }
  331. .xfaLayer * {
  332. color: inherit;
  333. font: inherit;
  334. font-style: inherit;
  335. font-weight: inherit;
  336. font-kerning: inherit;
  337. letter-spacing: -0.01px;
  338. text-align: inherit;
  339. text-decoration: inherit;
  340. box-sizing: border-box;
  341. background-color: transparent;
  342. padding: 0;
  343. margin: 0;
  344. pointer-events: auto;
  345. line-height: inherit;
  346. }
  347. .xfaLayer div {
  348. pointer-events: none;
  349. }
  350. .xfaLayer svg {
  351. pointer-events: none;
  352. }
  353. .xfaLayer svg * {
  354. pointer-events: none;
  355. }
  356. .xfaLayer a {
  357. color: blue;
  358. }
  359. .xfaRich li {
  360. margin-left: 3em;
  361. }
  362. .xfaFont {
  363. color: black;
  364. font-weight: normal;
  365. font-kerning: none;
  366. font-size: 10px;
  367. font-style: normal;
  368. letter-spacing: 0;
  369. text-decoration: none;
  370. vertical-align: 0;
  371. }
  372. .xfaCaption {
  373. overflow: hidden;
  374. flex: 0 0 auto;
  375. }
  376. .xfaCaptionForCheckButton {
  377. overflow: hidden;
  378. flex: 1 1 auto;
  379. }
  380. .xfaLabel {
  381. height: 100%;
  382. width: 100%;
  383. }
  384. .xfaLeft {
  385. display: flex;
  386. flex-direction: row;
  387. align-items: center;
  388. }
  389. .xfaRight {
  390. display: flex;
  391. flex-direction: row-reverse;
  392. align-items: center;
  393. }
  394. .xfaLeft > .xfaCaption,
  395. .xfaLeft > .xfaCaptionForCheckButton,
  396. .xfaRight > .xfaCaption,
  397. .xfaRight > .xfaCaptionForCheckButton {
  398. max-height: 100%;
  399. }
  400. .xfaTop {
  401. display: flex;
  402. flex-direction: column;
  403. align-items: flex-start;
  404. }
  405. .xfaBottom {
  406. display: flex;
  407. flex-direction: column-reverse;
  408. align-items: flex-start;
  409. }
  410. .xfaTop > .xfaCaption,
  411. .xfaTop > .xfaCaptionForCheckButton,
  412. .xfaBottom > .xfaCaption,
  413. .xfaBottom > .xfaCaptionForCheckButton {
  414. width: 100%;
  415. }
  416. .xfaBorder {
  417. background-color: transparent;
  418. position: absolute;
  419. pointer-events: none;
  420. }
  421. .xfaWrapped {
  422. width: 100%;
  423. height: 100%;
  424. }
  425. .xfaTextfield:focus,
  426. .xfaSelect:focus {
  427. background-image: none;
  428. background-color: transparent;
  429. outline: auto;
  430. outline-offset: -1px;
  431. }
  432. .xfaCheckbox:focus,
  433. .xfaRadio:focus {
  434. outline: auto;
  435. }
  436. .xfaTextfield,
  437. .xfaSelect {
  438. height: 100%;
  439. width: 100%;
  440. flex: 1 1 auto;
  441. border: none;
  442. resize: none;
  443. background-image: var(--xfa-unfocused-field-background);
  444. }
  445. .xfaTop > .xfaTextfield,
  446. .xfaTop > .xfaSelect,
  447. .xfaBottom > .xfaTextfield,
  448. .xfaBottom > .xfaSelect {
  449. flex: 0 1 auto;
  450. }
  451. .xfaButton {
  452. cursor: pointer;
  453. width: 100%;
  454. height: 100%;
  455. border: none;
  456. text-align: center;
  457. }
  458. .xfaLink {
  459. width: 100%;
  460. height: 100%;
  461. position: absolute;
  462. top: 0;
  463. left: 0;
  464. }
  465. .xfaCheckbox,
  466. .xfaRadio {
  467. width: 100%;
  468. height: 100%;
  469. flex: 0 0 auto;
  470. border: none;
  471. }
  472. .xfaRich {
  473. white-space: pre-wrap;
  474. width: 100%;
  475. height: 100%;
  476. }
  477. .xfaImage {
  478. -o-object-position: left top;
  479. object-position: left top;
  480. -o-object-fit: contain;
  481. object-fit: contain;
  482. width: 100%;
  483. height: 100%;
  484. }
  485. .xfaLrTb,
  486. .xfaRlTb,
  487. .xfaTb {
  488. display: flex;
  489. flex-direction: column;
  490. align-items: stretch;
  491. }
  492. .xfaLr {
  493. display: flex;
  494. flex-direction: row;
  495. align-items: stretch;
  496. }
  497. .xfaRl {
  498. display: flex;
  499. flex-direction: row-reverse;
  500. align-items: stretch;
  501. }
  502. .xfaTb > div {
  503. justify-content: left;
  504. }
  505. .xfaPosition {
  506. position: relative;
  507. }
  508. .xfaArea {
  509. position: relative;
  510. }
  511. .xfaValignMiddle {
  512. display: flex;
  513. align-items: center;
  514. }
  515. .xfaTable {
  516. display: flex;
  517. flex-direction: column;
  518. align-items: stretch;
  519. }
  520. .xfaTable .xfaRow {
  521. display: flex;
  522. flex-direction: row;
  523. align-items: stretch;
  524. }
  525. .xfaTable .xfaRlRow {
  526. display: flex;
  527. flex-direction: row-reverse;
  528. align-items: stretch;
  529. flex: 1;
  530. }
  531. .xfaTable .xfaRlRow > div {
  532. flex: 1;
  533. }
  534. .xfaNonInteractive input,
  535. .xfaNonInteractive textarea,
  536. .xfaDisabled input,
  537. .xfaDisabled textarea,
  538. .xfaReadOnly input,
  539. .xfaReadOnly textarea {
  540. background: initial;
  541. }
  542. @media print {
  543. .xfaTextfield,
  544. .xfaSelect {
  545. background: transparent;
  546. }
  547. .xfaSelect {
  548. -webkit-appearance: none;
  549. -moz-appearance: none;
  550. appearance: none;
  551. text-indent: 1px;
  552. text-overflow: "";
  553. }
  554. }
  555. :root {
  556. --pdfViewer-padding-bottom: 0;
  557. --page-margin: 1px auto -8px;
  558. --page-border: 9px solid transparent;
  559. --spreadHorizontalWrapped-margin-LR: -3.5px;
  560. --zoom-factor: 1;
  561. --viewport-scale-factor: 1;
  562. }
  563. @media screen and (forced-colors: active) {
  564. :root {
  565. --pdfViewer-padding-bottom: 9px;
  566. --page-margin: 9px auto 0;
  567. --page-border: none;
  568. --spreadHorizontalWrapped-margin-LR: 4.5px;
  569. }
  570. }
  571. .pdfViewer {
  572. padding-bottom: var(--pdfViewer-padding-bottom);
  573. }
  574. .pdfViewer .canvasWrapper {
  575. overflow: hidden;
  576. }
  577. .pdfViewer .page {
  578. direction: ltr;
  579. width: 816px;
  580. height: 1056px;
  581. margin: var(--page-margin);
  582. position: relative;
  583. overflow: visible;
  584. border: var(--page-border);
  585. background-clip: content-box;
  586. -o-border-image: url(images/shadow.png) 9 9 repeat;
  587. border-image: url(images/shadow.png) 9 9 repeat;
  588. background-color: rgba(255, 255, 255, 1);
  589. }
  590. .pdfViewer .dummyPage {
  591. position: relative;
  592. width: 0;
  593. /* The height is set via JS, see `BaseViewer.#ensurePageViewVisible`. */
  594. }
  595. .pdfViewer.removePageBorders .page {
  596. margin: 0 auto 10px;
  597. border: none;
  598. }
  599. .pdfViewer.singlePageView {
  600. display: inline-block;
  601. }
  602. .pdfViewer.singlePageView .page {
  603. margin: 0;
  604. border: none;
  605. }
  606. .pdfViewer.scrollHorizontal,
  607. .pdfViewer.scrollWrapped,
  608. .spread {
  609. margin-left: 3.5px;
  610. margin-right: 3.5px;
  611. text-align: center;
  612. }
  613. .pdfViewer.scrollHorizontal,
  614. .spread {
  615. white-space: nowrap;
  616. }
  617. .pdfViewer.removePageBorders,
  618. .pdfViewer.scrollHorizontal .spread,
  619. .pdfViewer.scrollWrapped .spread {
  620. margin-left: 0;
  621. margin-right: 0;
  622. }
  623. .spread .page,
  624. .spread .dummyPage,
  625. .pdfViewer.scrollHorizontal .page,
  626. .pdfViewer.scrollWrapped .page,
  627. .pdfViewer.scrollHorizontal .spread,
  628. .pdfViewer.scrollWrapped .spread {
  629. display: inline-block;
  630. vertical-align: middle;
  631. }
  632. .spread .page,
  633. .pdfViewer.scrollHorizontal .page,
  634. .pdfViewer.scrollWrapped .page {
  635. margin-left: var(--spreadHorizontalWrapped-margin-LR);
  636. margin-right: var(--spreadHorizontalWrapped-margin-LR);
  637. }
  638. .pdfViewer.removePageBorders .spread .page,
  639. .pdfViewer.removePageBorders.scrollHorizontal .page,
  640. .pdfViewer.removePageBorders.scrollWrapped .page {
  641. margin-left: 5px;
  642. margin-right: 5px;
  643. }
  644. .pdfViewer .page canvas {
  645. margin: 0;
  646. display: block;
  647. }
  648. .pdfViewer .page canvas[hidden] {
  649. display: none;
  650. }
  651. .pdfViewer .page .loadingIcon {
  652. position: absolute;
  653. display: block;
  654. left: 0;
  655. top: 0;
  656. right: 0;
  657. bottom: 0;
  658. background: url("images/loading-icon.gif") center no-repeat;
  659. }
  660. .pdfViewer .page .loadingIcon.notVisible {
  661. background: none;
  662. }
  663. .pdfViewer.enablePermissions .textLayer span {
  664. -webkit-user-select: none !important;
  665. -moz-user-select: none !important;
  666. user-select: none !important;
  667. cursor: not-allowed;
  668. }
  669. .pdfPresentationMode .pdfViewer {
  670. padding-bottom: 0;
  671. }
  672. .pdfPresentationMode .spread {
  673. margin: 0;
  674. }
  675. .pdfPresentationMode .pdfViewer .page {
  676. margin: 0 auto;
  677. border: 2px solid transparent;
  678. }
  679. :root {
  680. --sidebar-width: 200px;
  681. --sidebar-transition-duration: 200ms;
  682. --sidebar-transition-timing-function: ease;
  683. --scale-select-container-width: 140px;
  684. --scale-select-overflow: 22px;
  685. --loadingBar-end-offset: 0;
  686. --toolbar-icon-opacity: 0.7;
  687. --doorhanger-icon-opacity: 0.9;
  688. --main-color: rgba(12, 12, 13, 1);
  689. --body-bg-color: rgba(237, 237, 240, 1);
  690. --errorWrapper-bg-color: rgba(255, 110, 110, 1);
  691. --progressBar-color: rgba(10, 132, 255, 1);
  692. --progressBar-indeterminate-bg-color: rgba(221, 221, 222, 1);
  693. --progressBar-indeterminate-blend-color: rgba(116, 177, 239, 1);
  694. --scrollbar-color: auto;
  695. --scrollbar-bg-color: auto;
  696. --toolbar-icon-bg-color: rgba(0, 0, 0, 1);
  697. --toolbar-icon-hover-bg-color: rgba(0, 0, 0, 1);
  698. --sidebar-narrow-bg-color: rgba(237, 237, 240, 0.9);
  699. --sidebar-toolbar-bg-color: rgba(245, 246, 247, 1);
  700. --toolbar-bg-color: rgba(249, 249, 250, 1);
  701. --toolbar-border-color: rgba(204, 204, 204, 1);
  702. --button-hover-color: rgba(221, 222, 223, 1);
  703. --toggled-btn-color: rgba(0, 0, 0, 1);
  704. --toggled-btn-bg-color: rgba(0, 0, 0, 0.3);
  705. --toggled-hover-active-btn-color: rgba(0, 0, 0, 0.4);
  706. --dropdown-btn-bg-color: rgba(215, 215, 219, 1);
  707. --separator-color: rgba(0, 0, 0, 0.3);
  708. --field-color: rgba(6, 6, 6, 1);
  709. --field-bg-color: rgba(255, 255, 255, 1);
  710. --field-border-color: rgba(187, 187, 188, 1);
  711. --findbar-nextprevious-btn-bg-color: rgba(227, 228, 230, 1);
  712. --treeitem-color: rgba(0, 0, 0, 0.8);
  713. --treeitem-hover-color: rgba(0, 0, 0, 0.9);
  714. --treeitem-selected-color: rgba(0, 0, 0, 0.9);
  715. --treeitem-selected-bg-color: rgba(0, 0, 0, 0.25);
  716. --sidebaritem-bg-color: rgba(0, 0, 0, 0.15);
  717. --doorhanger-bg-color: rgba(255, 255, 255, 1);
  718. --doorhanger-border-color: rgba(12, 12, 13, 0.2);
  719. --doorhanger-hover-color: rgba(12, 12, 13, 1);
  720. --doorhanger-hover-bg-color: rgba(237, 237, 237, 1);
  721. --doorhanger-separator-color: rgba(222, 222, 222, 1);
  722. --overlay-button-border: 0 none;
  723. --overlay-button-bg-color: rgba(12, 12, 13, 0.1);
  724. --overlay-button-hover-bg-color: rgba(12, 12, 13, 0.3);
  725. --loading-icon: url(images/loading.svg);
  726. --treeitem-expanded-icon: url(images/treeitem-expanded.svg);
  727. --treeitem-collapsed-icon: url(images/treeitem-collapsed.svg);
  728. --toolbarButton-menuArrow-icon: url(images/toolbarButton-menuArrow.svg);
  729. --toolbarButton-sidebarToggle-icon: url(images/toolbarButton-sidebarToggle.svg);
  730. --toolbarButton-secondaryToolbarToggle-icon: url(images/toolbarButton-secondaryToolbarToggle.svg);
  731. --toolbarButton-pageUp-icon: url(images/toolbarButton-pageUp.svg);
  732. --toolbarButton-pageDown-icon: url(images/toolbarButton-pageDown.svg);
  733. --toolbarButton-zoomOut-icon: url(images/toolbarButton-zoomOut.svg);
  734. --toolbarButton-zoomIn-icon: url(images/toolbarButton-zoomIn.svg);
  735. --toolbarButton-presentationMode-icon: url(images/toolbarButton-presentationMode.svg);
  736. --toolbarButton-print-icon: url(images/toolbarButton-print.svg);
  737. --toolbarButton-openFile-icon: url(images/toolbarButton-openFile.svg);
  738. --toolbarButton-download-icon: url(images/toolbarButton-download.svg);
  739. --toolbarButton-bookmark-icon: url(images/toolbarButton-bookmark.svg);
  740. --toolbarButton-viewThumbnail-icon: url(images/toolbarButton-viewThumbnail.svg);
  741. --toolbarButton-viewOutline-icon: url(images/toolbarButton-viewOutline.svg);
  742. --toolbarButton-viewAttachments-icon: url(images/toolbarButton-viewAttachments.svg);
  743. --toolbarButton-viewLayers-icon: url(images/toolbarButton-viewLayers.svg);
  744. --toolbarButton-currentOutlineItem-icon: url(images/toolbarButton-currentOutlineItem.svg);
  745. --toolbarButton-search-icon: url(images/toolbarButton-search.svg);
  746. --findbarButton-previous-icon: url(images/findbarButton-previous.svg);
  747. --findbarButton-next-icon: url(images/findbarButton-next.svg);
  748. --secondaryToolbarButton-firstPage-icon: url(images/secondaryToolbarButton-firstPage.svg);
  749. --secondaryToolbarButton-lastPage-icon: url(images/secondaryToolbarButton-lastPage.svg);
  750. --secondaryToolbarButton-rotateCcw-icon: url(images/secondaryToolbarButton-rotateCcw.svg);
  751. --secondaryToolbarButton-rotateCw-icon: url(images/secondaryToolbarButton-rotateCw.svg);
  752. --secondaryToolbarButton-selectTool-icon: url(images/secondaryToolbarButton-selectTool.svg);
  753. --secondaryToolbarButton-handTool-icon: url(images/secondaryToolbarButton-handTool.svg);
  754. --secondaryToolbarButton-scrollPage-icon: url(images/secondaryToolbarButton-scrollPage.svg);
  755. --secondaryToolbarButton-scrollVertical-icon: url(images/secondaryToolbarButton-scrollVertical.svg);
  756. --secondaryToolbarButton-scrollHorizontal-icon: url(images/secondaryToolbarButton-scrollHorizontal.svg);
  757. --secondaryToolbarButton-scrollWrapped-icon: url(images/secondaryToolbarButton-scrollWrapped.svg);
  758. --secondaryToolbarButton-spreadNone-icon: url(images/secondaryToolbarButton-spreadNone.svg);
  759. --secondaryToolbarButton-spreadOdd-icon: url(images/secondaryToolbarButton-spreadOdd.svg);
  760. --secondaryToolbarButton-spreadEven-icon: url(images/secondaryToolbarButton-spreadEven.svg);
  761. --secondaryToolbarButton-documentProperties-icon: url(images/secondaryToolbarButton-documentProperties.svg);
  762. }
  763. @media (prefers-color-scheme: dark) {
  764. :root {
  765. --main-color: rgba(249, 249, 250, 1);
  766. --body-bg-color: rgba(42, 42, 46, 1);
  767. --errorWrapper-bg-color: rgba(169, 14, 14, 1);
  768. --progressBar-color: rgba(0, 96, 223, 1);
  769. --progressBar-indeterminate-bg-color: rgba(40, 40, 43, 1);
  770. --progressBar-indeterminate-blend-color: rgba(20, 68, 133, 1);
  771. --scrollbar-color: rgba(121, 121, 123, 1);
  772. --scrollbar-bg-color: rgba(35, 35, 39, 1);
  773. --toolbar-icon-bg-color: rgba(255, 255, 255, 1);
  774. --toolbar-icon-hover-bg-color: rgba(255, 255, 255, 1);
  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. /* This image is used in <input> elements, which unfortunately means that
  802. * the `mask-image` approach used with all of the other images doesn't work
  803. * here; hence why we still have two versions of this particular image. */
  804. --loading-icon: url(images/loading-dark.svg);
  805. }
  806. }
  807. @media screen and (forced-colors: active) {
  808. :root {
  809. --button-hover-color: Highlight;
  810. --doorhanger-hover-bg-color: Highlight;
  811. --toolbar-icon-opacity: 1;
  812. --toolbar-icon-bg-color: ButtonText;
  813. --toolbar-icon-hover-bg-color: ButtonFace;
  814. --toggled-btn-color: HighlightText;
  815. --toggled-btn-bg-color: LinkText;
  816. --doorhanger-hover-color: ButtonFace;
  817. --doorhanger-border-color-whcm: 1px solid ButtonText;
  818. --doorhanger-triangle-opacity-whcm: 0;
  819. --overlay-button-border: 1px solid Highlight;
  820. --overlay-button-hover-bg-color: Highlight;
  821. --overlay-button-hover-color: ButtonFace;
  822. --field-border-color: ButtonText;
  823. }
  824. }
  825. * {
  826. padding: 0;
  827. margin: 0;
  828. }
  829. html {
  830. height: 100%;
  831. width: 100%;
  832. }
  833. body {
  834. height: 100%;
  835. width: 100%;
  836. background-color: var(--body-bg-color);
  837. }
  838. body,
  839. input,
  840. button,
  841. select {
  842. font: message-box;
  843. outline: none;
  844. scrollbar-color: var(--scrollbar-color) var(--scrollbar-bg-color);
  845. }
  846. .hidden {
  847. display: none !important;
  848. }
  849. [hidden] {
  850. display: none !important;
  851. }
  852. #viewerContainer.pdfPresentationMode:-webkit-full-screen {
  853. top: 0;
  854. background-color: rgba(0, 0, 0, 1);
  855. width: 100%;
  856. height: 100%;
  857. overflow: hidden;
  858. cursor: none;
  859. -webkit-user-select: none;
  860. user-select: none;
  861. }
  862. #viewerContainer.pdfPresentationMode:fullscreen {
  863. top: 0;
  864. background-color: rgba(0, 0, 0, 1);
  865. width: 100%;
  866. height: 100%;
  867. overflow: hidden;
  868. cursor: none;
  869. -webkit-user-select: none;
  870. -moz-user-select: none;
  871. user-select: none;
  872. }
  873. .pdfPresentationMode:-webkit-full-screen a:not(.internalLink) {
  874. display: none;
  875. }
  876. .pdfPresentationMode:fullscreen a:not(.internalLink) {
  877. display: none;
  878. }
  879. .pdfPresentationMode:-webkit-full-screen .textLayer span {
  880. cursor: none;
  881. }
  882. .pdfPresentationMode:fullscreen .textLayer span {
  883. cursor: none;
  884. }
  885. .pdfPresentationMode.pdfPresentationModeControls > *,
  886. .pdfPresentationMode.pdfPresentationModeControls .textLayer span {
  887. cursor: default;
  888. }
  889. #outerContainer {
  890. width: 100%;
  891. height: 100%;
  892. position: relative;
  893. }
  894. #sidebarContainer {
  895. position: absolute;
  896. top: 32px;
  897. bottom: 0;
  898. width: var(--sidebar-width);
  899. visibility: hidden;
  900. z-index: 100;
  901. border-top: 1px solid rgba(51, 51, 51, 1);
  902. transition-duration: var(--sidebar-transition-duration);
  903. transition-timing-function: var(--sidebar-transition-timing-function);
  904. }
  905. html[dir="ltr"] #sidebarContainer {
  906. transition-property: left;
  907. left: calc(0px - var(--sidebar-width));
  908. border-right: var(--doorhanger-border-color-whcm);
  909. }
  910. html[dir="rtl"] #sidebarContainer {
  911. transition-property: right;
  912. right: calc(0px - var(--sidebar-width));
  913. border-left: var(--doorhanger-border-color-whcm);
  914. }
  915. #outerContainer.sidebarResizing #sidebarContainer {
  916. /* Improve responsiveness and avoid visual glitches when the sidebar is resized. */
  917. transition-duration: 0s;
  918. /* Prevent e.g. the thumbnails being selected when the sidebar is resized. */
  919. -webkit-user-select: none;
  920. -moz-user-select: none;
  921. user-select: none;
  922. }
  923. #outerContainer.sidebarMoving #sidebarContainer,
  924. #outerContainer.sidebarOpen #sidebarContainer {
  925. visibility: visible;
  926. }
  927. html[dir="ltr"] #outerContainer.sidebarOpen #sidebarContainer {
  928. left: 0;
  929. }
  930. html[dir="rtl"] #outerContainer.sidebarOpen #sidebarContainer {
  931. right: 0;
  932. }
  933. #mainContainer {
  934. position: absolute;
  935. top: 0;
  936. right: 0;
  937. bottom: 0;
  938. left: 0;
  939. min-width: 320px;
  940. }
  941. #sidebarContent {
  942. top: 32px;
  943. bottom: 0;
  944. overflow: auto;
  945. -webkit-overflow-scrolling: touch;
  946. position: absolute;
  947. width: 100%;
  948. background-color: rgba(0, 0, 0, 0.1);
  949. }
  950. html[dir="ltr"] #sidebarContent {
  951. left: 0;
  952. box-shadow: inset -1px 0 0 rgba(0, 0, 0, 0.25);
  953. }
  954. html[dir="rtl"] #sidebarContent {
  955. right: 0;
  956. box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.25);
  957. }
  958. #viewerContainer {
  959. overflow: auto;
  960. -webkit-overflow-scrolling: touch;
  961. position: absolute;
  962. top: 32px;
  963. right: 0;
  964. bottom: 0;
  965. left: 0;
  966. outline: none;
  967. }
  968. #viewerContainer:not(.pdfPresentationMode) {
  969. transition-duration: var(--sidebar-transition-duration);
  970. transition-timing-function: var(--sidebar-transition-timing-function);
  971. }
  972. #outerContainer.sidebarResizing #viewerContainer {
  973. /* Improve responsiveness and avoid visual glitches when the sidebar is resized. */
  974. transition-duration: 0s;
  975. }
  976. html[dir="ltr"]
  977. #outerContainer.sidebarOpen
  978. #viewerContainer:not(.pdfPresentationMode) {
  979. transition-property: left;
  980. left: var(--sidebar-width);
  981. }
  982. html[dir="rtl"]
  983. #outerContainer.sidebarOpen
  984. #viewerContainer:not(.pdfPresentationMode) {
  985. transition-property: right;
  986. right: var(--sidebar-width);
  987. }
  988. .toolbar {
  989. position: relative;
  990. left: 0;
  991. right: 0;
  992. z-index: 9999;
  993. cursor: default;
  994. }
  995. #toolbarContainer {
  996. width: 100%;
  997. }
  998. #toolbarSidebar {
  999. width: 100%;
  1000. height: 32px;
  1001. background-color: var(--sidebar-toolbar-bg-color);
  1002. }
  1003. html[dir="ltr"] #toolbarSidebar {
  1004. box-shadow: inset -1px 0 0 rgba(0, 0, 0, 0.25), 0 1px 0 rgba(0, 0, 0, 0.15),
  1005. 0 0 1px rgba(0, 0, 0, 0.1);
  1006. }
  1007. html[dir="rtl"] #toolbarSidebar {
  1008. box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.25), 0 1px 0 rgba(0, 0, 0, 0.15),
  1009. 0 0 1px rgba(0, 0, 0, 0.1);
  1010. }
  1011. html[dir="ltr"] #toolbarSidebar .toolbarButton {
  1012. margin-right: 2px !important;
  1013. }
  1014. html[dir="rtl"] #toolbarSidebar .toolbarButton {
  1015. margin-left: 2px !important;
  1016. }
  1017. html[dir="ltr"] #toolbarSidebarRight .toolbarButton {
  1018. margin-right: 3px !important;
  1019. }
  1020. html[dir="rtl"] #toolbarSidebarRight .toolbarButton {
  1021. margin-left: 3px !important;
  1022. }
  1023. #sidebarResizer {
  1024. position: absolute;
  1025. top: 0;
  1026. bottom: 0;
  1027. width: 6px;
  1028. z-index: 200;
  1029. cursor: ew-resize;
  1030. }
  1031. html[dir="ltr"] #sidebarResizer {
  1032. right: -6px;
  1033. }
  1034. html[dir="rtl"] #sidebarResizer {
  1035. left: -6px;
  1036. }
  1037. #toolbarContainer,
  1038. .findbar,
  1039. .secondaryToolbar {
  1040. position: relative;
  1041. height: 32px;
  1042. background-color: var(--toolbar-bg-color);
  1043. box-shadow: 0 1px 0 var(--toolbar-border-color);
  1044. }
  1045. #toolbarViewer {
  1046. height: 32px;
  1047. }
  1048. #loadingBar {
  1049. position: absolute;
  1050. height: 4px;
  1051. background-color: var(--body-bg-color);
  1052. border-bottom: 1px solid var(--toolbar-border-color);
  1053. transition-duration: var(--sidebar-transition-duration);
  1054. transition-timing-function: var(--sidebar-transition-timing-function);
  1055. }
  1056. html[dir="ltr"] #loadingBar {
  1057. transition-property: left;
  1058. left: 0;
  1059. right: var(--loadingBar-end-offset);
  1060. }
  1061. html[dir="rtl"] #loadingBar {
  1062. transition-property: right;
  1063. left: var(--loadingBar-end-offset);
  1064. right: 0;
  1065. }
  1066. html[dir="ltr"] #outerContainer.sidebarOpen #loadingBar {
  1067. left: var(--sidebar-width);
  1068. }
  1069. html[dir="rtl"] #outerContainer.sidebarOpen #loadingBar {
  1070. right: var(--sidebar-width);
  1071. }
  1072. #outerContainer.sidebarResizing #loadingBar {
  1073. /* Improve responsiveness and avoid visual glitches when the sidebar is resized. */
  1074. transition-duration: 0s;
  1075. }
  1076. #loadingBar .progress {
  1077. position: absolute;
  1078. top: 0;
  1079. left: 0;
  1080. width: 0%;
  1081. height: 100%;
  1082. background-color: var(--progressBar-color);
  1083. overflow: hidden;
  1084. transition: width 200ms;
  1085. }
  1086. @-webkit-keyframes progressIndeterminate {
  1087. 0% {
  1088. left: -142px;
  1089. }
  1090. 100% {
  1091. left: 0;
  1092. }
  1093. }
  1094. @keyframes progressIndeterminate {
  1095. 0% {
  1096. left: -142px;
  1097. }
  1098. 100% {
  1099. left: 0;
  1100. }
  1101. }
  1102. #loadingBar .progress.indeterminate {
  1103. background-color: var(--progressBar-indeterminate-bg-color);
  1104. transition: none;
  1105. }
  1106. #loadingBar .progress.indeterminate .glimmer {
  1107. position: absolute;
  1108. top: 0;
  1109. left: 0;
  1110. height: 100%;
  1111. width: calc(100% + 150px);
  1112. background: repeating-linear-gradient(
  1113. 135deg,
  1114. var(--progressBar-indeterminate-blend-color) 0,
  1115. var(--progressBar-indeterminate-bg-color) 5px,
  1116. var(--progressBar-indeterminate-bg-color) 45px,
  1117. var(--progressBar-color) 55px,
  1118. var(--progressBar-color) 95px,
  1119. var(--progressBar-indeterminate-blend-color) 100px
  1120. );
  1121. -webkit-animation: progressIndeterminate 1s linear infinite;
  1122. animation: progressIndeterminate 1s linear infinite;
  1123. }
  1124. .findbar,
  1125. .secondaryToolbar {
  1126. top: 32px;
  1127. position: absolute;
  1128. z-index: 10000;
  1129. height: auto;
  1130. min-width: 16px;
  1131. padding: 0 4px;
  1132. margin: 4px 2px;
  1133. color: rgba(217, 217, 217, 1);
  1134. font-size: 12px;
  1135. line-height: 14px;
  1136. text-align: left;
  1137. cursor: default;
  1138. }
  1139. .findbar {
  1140. min-width: 300px;
  1141. background-color: var(--toolbar-bg-color);
  1142. }
  1143. .findbar > div {
  1144. height: 32px;
  1145. }
  1146. .findbar.wrapContainers > div {
  1147. clear: both;
  1148. }
  1149. .findbar.wrapContainers > div.findbarMessageContainer {
  1150. height: auto;
  1151. }
  1152. html[dir="ltr"] .findbar {
  1153. left: 64px;
  1154. }
  1155. html[dir="rtl"] .findbar {
  1156. right: 64px;
  1157. }
  1158. .findbar .splitToolbarButton {
  1159. margin-top: 3px;
  1160. }
  1161. html[dir="ltr"] .findbar .splitToolbarButton {
  1162. margin-left: 0;
  1163. margin-right: 5px;
  1164. }
  1165. html[dir="rtl"] .findbar .splitToolbarButton {
  1166. margin-left: 5px;
  1167. margin-right: 0;
  1168. }
  1169. .findbar .splitToolbarButton > .toolbarButton {
  1170. background-color: var(--findbar-nextprevious-btn-bg-color);
  1171. border-radius: 0;
  1172. height: 26px;
  1173. border-top: 1px solid var(--field-border-color);
  1174. border-bottom: 1px solid var(--field-border-color);
  1175. }
  1176. .findbar .splitToolbarButton > .toolbarButton::before {
  1177. top: 5px;
  1178. }
  1179. .findbar .splitToolbarButton > .findNext {
  1180. width: 29px;
  1181. }
  1182. html[dir="ltr"] .findbar .splitToolbarButton > .findNext {
  1183. border-bottom-right-radius: 2px;
  1184. border-top-right-radius: 2px;
  1185. border-right: 1px solid var(--field-border-color);
  1186. }
  1187. html[dir="rtl"] .findbar .splitToolbarButton > .findNext {
  1188. border-bottom-left-radius: 2px;
  1189. border-top-left-radius: 2px;
  1190. border-left: 1px solid var(--field-border-color);
  1191. }
  1192. .findbar input[type="checkbox"] {
  1193. pointer-events: none;
  1194. }
  1195. .findbar label {
  1196. -webkit-user-select: none;
  1197. -moz-user-select: none;
  1198. user-select: none;
  1199. }
  1200. .findbar label:hover,
  1201. .findbar input:focus-visible + label {
  1202. color: var(--toggled-btn-color);
  1203. background-color: var(--button-hover-color);
  1204. }
  1205. html[dir="ltr"] #findInput {
  1206. border-top-right-radius: 0;
  1207. border-bottom-right-radius: 0;
  1208. }
  1209. html[dir="rtl"] #findInput {
  1210. border-top-left-radius: 0;
  1211. border-bottom-left-radius: 0;
  1212. }
  1213. .findbar .toolbarField[type="checkbox"]:checked + .toolbarLabel {
  1214. background-color: var(--toggled-btn-bg-color) !important;
  1215. color: var(--toggled-btn-color);
  1216. }
  1217. #findInput {
  1218. width: 200px;
  1219. }
  1220. #findInput::-moz-placeholder {
  1221. font-style: normal;
  1222. }
  1223. #findInput::placeholder {
  1224. font-style: normal;
  1225. }
  1226. #findInput[data-status="pending"] {
  1227. background-image: var(--loading-icon);
  1228. background-repeat: no-repeat;
  1229. background-position: 98%;
  1230. }
  1231. html[dir="rtl"] #findInput[data-status="pending"] {
  1232. background-position: 3px;
  1233. }
  1234. #findInput[data-status="notFound"] {
  1235. background-color: rgba(255, 102, 102, 1);
  1236. }
  1237. .secondaryToolbar {
  1238. padding: 6px 0 10px;
  1239. height: auto;
  1240. z-index: 30000;
  1241. background-color: var(--doorhanger-bg-color);
  1242. }
  1243. html[dir="ltr"] .secondaryToolbar {
  1244. right: 4px;
  1245. }
  1246. html[dir="rtl"] .secondaryToolbar {
  1247. left: 4px;
  1248. }
  1249. #secondaryToolbarButtonContainer {
  1250. max-width: 220px;
  1251. max-height: 400px;
  1252. overflow-y: auto;
  1253. -webkit-overflow-scrolling: touch;
  1254. margin-bottom: -4px;
  1255. }
  1256. .doorHanger,
  1257. .doorHangerRight {
  1258. border-radius: 2px;
  1259. box-shadow: 0 1px 5px var(--doorhanger-border-color),
  1260. 0 0 0 1px var(--doorhanger-border-color);
  1261. border: var(--doorhanger-border-color-whcm);
  1262. }
  1263. .doorHanger:after,
  1264. .doorHanger:before,
  1265. .doorHangerRight:after,
  1266. .doorHangerRight:before {
  1267. bottom: 100%;
  1268. border: solid rgba(0, 0, 0, 0);
  1269. content: " ";
  1270. height: 0;
  1271. width: 0;
  1272. position: absolute;
  1273. pointer-events: none;
  1274. opacity: var(--doorhanger-triangle-opacity-whcm);
  1275. }
  1276. .doorHanger:after,
  1277. .doorHangerRight:after {
  1278. border-width: 8px;
  1279. }
  1280. .doorHanger:after {
  1281. border-bottom-color: var(--toolbar-bg-color);
  1282. }
  1283. .doorHangerRight:after {
  1284. border-bottom-color: var(--doorhanger-bg-color);
  1285. }
  1286. .doorHanger:before,
  1287. .doorHangerRight:before {
  1288. border-bottom-color: var(--doorhanger-border-color);
  1289. border-width: 9px;
  1290. }
  1291. html[dir="ltr"] .doorHanger:after,
  1292. html[dir="rtl"] .doorHangerRight:after {
  1293. left: 10px;
  1294. margin-left: -8px;
  1295. }
  1296. html[dir="ltr"] .doorHanger:before,
  1297. html[dir="rtl"] .doorHangerRight:before {
  1298. left: 10px;
  1299. margin-left: -9px;
  1300. }
  1301. html[dir="rtl"] .doorHanger:after,
  1302. html[dir="ltr"] .doorHangerRight:after {
  1303. right: 10px;
  1304. margin-right: -8px;
  1305. }
  1306. html[dir="rtl"] .doorHanger:before,
  1307. html[dir="ltr"] .doorHangerRight:before {
  1308. right: 10px;
  1309. margin-right: -9px;
  1310. }
  1311. #findResultsCount {
  1312. background-color: rgba(217, 217, 217, 1);
  1313. color: rgba(82, 82, 82, 1);
  1314. text-align: center;
  1315. padding: 4px 5px;
  1316. margin: 5px;
  1317. }
  1318. #findMsg {
  1319. color: rgba(251, 0, 0, 1);
  1320. }
  1321. #findResultsCount:empty,
  1322. #findMsg:empty {
  1323. display: none;
  1324. }
  1325. #toolbarViewerMiddle {
  1326. position: absolute;
  1327. left: 50%;
  1328. transform: translateX(-50%);
  1329. }
  1330. html[dir="ltr"] #toolbarViewerLeft,
  1331. html[dir="rtl"] #toolbarViewerRight,
  1332. html[dir="ltr"] #toolbarSidebarLeft,
  1333. html[dir="rtl"] #toolbarSidebarRight {
  1334. float: left;
  1335. }
  1336. html[dir="ltr"] #toolbarViewerRight,
  1337. html[dir="rtl"] #toolbarViewerLeft,
  1338. html[dir="ltr"] #toolbarSidebarRight,
  1339. html[dir="rtl"] #toolbarSidebarLeft {
  1340. float: right;
  1341. }
  1342. html[dir="ltr"] #toolbarViewerLeft > *,
  1343. html[dir="ltr"] #toolbarViewerMiddle > *,
  1344. html[dir="ltr"] #toolbarViewerRight > *,
  1345. html[dir="ltr"] #toolbarSidebarLeft *,
  1346. html[dir="ltr"] #toolbarSidebarRight *,
  1347. html[dir="ltr"] .findbar * {
  1348. position: relative;
  1349. float: left;
  1350. }
  1351. html[dir="rtl"] #toolbarViewerLeft > *,
  1352. html[dir="rtl"] #toolbarViewerMiddle > *,
  1353. html[dir="rtl"] #toolbarViewerRight > *,
  1354. html[dir="rtl"] #toolbarSidebarLeft *,
  1355. html[dir="rtl"] #toolbarSidebarRight *,
  1356. html[dir="rtl"] .findbar * {
  1357. position: relative;
  1358. float: right;
  1359. }
  1360. .splitToolbarButton {
  1361. margin: 2px 2px 0;
  1362. display: inline-block;
  1363. }
  1364. html[dir="ltr"] .splitToolbarButton > .toolbarButton {
  1365. float: left;
  1366. }
  1367. html[dir="rtl"] .splitToolbarButton > .toolbarButton {
  1368. float: right;
  1369. }
  1370. .toolbarButton,
  1371. .secondaryToolbarButton,
  1372. .overlayButton {
  1373. border: 0 none;
  1374. background: none;
  1375. width: 28px;
  1376. height: 28px;
  1377. }
  1378. .overlayButton:hover,
  1379. .overlayButton:focus-visible {
  1380. background-color: var(--overlay-button-hover-bg-color);
  1381. }
  1382. .overlayButton:hover > span,
  1383. .overlayButton:focus-visible > span {
  1384. color: var(--overlay-button-hover-color);
  1385. }
  1386. .toolbarButton > span {
  1387. display: inline-block;
  1388. width: 0;
  1389. height: 0;
  1390. overflow: hidden;
  1391. }
  1392. .toolbarButton[disabled],
  1393. .secondaryToolbarButton[disabled],
  1394. .overlayButton[disabled] {
  1395. opacity: 0.5;
  1396. }
  1397. .splitToolbarButton.toggled .toolbarButton {
  1398. margin: 0;
  1399. }
  1400. .splitToolbarButton > .toolbarButton:hover,
  1401. .splitToolbarButton > .toolbarButton:focus-visible,
  1402. .dropdownToolbarButton:hover,
  1403. .toolbarButton.textButton:hover,
  1404. .toolbarButton.textButton:focus-visible {
  1405. background-color: var(--button-hover-color);
  1406. z-index: 199;
  1407. }
  1408. .splitToolbarButton > .toolbarButton {
  1409. position: relative;
  1410. }
  1411. html[dir="ltr"] .splitToolbarButton > .toolbarButton:first-child,
  1412. html[dir="rtl"] .splitToolbarButton > .toolbarButton:last-child {
  1413. margin: 0;
  1414. }
  1415. html[dir="ltr"] .splitToolbarButton > .toolbarButton:last-child,
  1416. html[dir="rtl"] .splitToolbarButton > .toolbarButton:first-child {
  1417. margin: 0;
  1418. }
  1419. .splitToolbarButtonSeparator {
  1420. padding: 10px 0;
  1421. width: 1px;
  1422. background-color: var(--separator-color);
  1423. z-index: 99;
  1424. display: inline-block;
  1425. margin: 4px 0;
  1426. }
  1427. .findbar .splitToolbarButtonSeparator {
  1428. background-color: var(--field-border-color);
  1429. margin: 0;
  1430. padding: 13px 0;
  1431. }
  1432. html[dir="ltr"] .splitToolbarButtonSeparator {
  1433. float: left;
  1434. }
  1435. html[dir="rtl"] .splitToolbarButtonSeparator {
  1436. float: right;
  1437. }
  1438. .toolbarButton,
  1439. .dropdownToolbarButton,
  1440. .secondaryToolbarButton,
  1441. .overlayButton {
  1442. min-width: 16px;
  1443. margin: 2px 1px;
  1444. padding: 2px 6px 0;
  1445. border: none;
  1446. border-radius: 2px;
  1447. color: var(--main-color);
  1448. font-size: 12px;
  1449. line-height: 14px;
  1450. -webkit-user-select: none;
  1451. -moz-user-select: none;
  1452. user-select: none;
  1453. cursor: default;
  1454. box-sizing: border-box;
  1455. }
  1456. html[dir="ltr"] #toolbarViewerLeft > .toolbarButton:first-child,
  1457. html[dir="rtl"] #toolbarViewerRight > .toolbarButton:last-child {
  1458. margin-left: 2px;
  1459. }
  1460. html[dir="ltr"] #toolbarViewerRight > .toolbarButton:last-child,
  1461. html[dir="rtl"] #toolbarViewerLeft > .toolbarButton:first-child {
  1462. margin-right: 2px;
  1463. }
  1464. .toolbarButton:hover,
  1465. .toolbarButton:focus-visible {
  1466. background-color: var(--button-hover-color);
  1467. }
  1468. .secondaryToolbarButton:hover,
  1469. .secondaryToolbarButton:focus-visible {
  1470. background-color: var(--doorhanger-hover-bg-color);
  1471. color: var(--doorhanger-hover-color);
  1472. }
  1473. .toolbarButton.toggled,
  1474. .splitToolbarButton.toggled > .toolbarButton.toggled,
  1475. .secondaryToolbarButton.toggled {
  1476. background-color: var(--toggled-btn-bg-color);
  1477. color: var(--toggled-btn-color);
  1478. }
  1479. .secondaryToolbarButton.toggled::before {
  1480. background-color: var(--toggled-btn-color);
  1481. }
  1482. .toolbarButton.toggled::before {
  1483. background-color: var(--toggled-btn-color);
  1484. }
  1485. .toolbarButton.toggled:hover:active,
  1486. .splitToolbarButton.toggled > .toolbarButton.toggled:hover:active,
  1487. .secondaryToolbarButton.toggled:hover:active {
  1488. background-color: var(--toggled-hover-active-btn-color);
  1489. }
  1490. .dropdownToolbarButton {
  1491. width: var(--scale-select-container-width);
  1492. padding: 0;
  1493. overflow: hidden;
  1494. background-color: var(--dropdown-btn-bg-color);
  1495. margin-top: 2px !important;
  1496. }
  1497. .dropdownToolbarButton::after {
  1498. top: 6px;
  1499. pointer-events: none;
  1500. -webkit-mask-image: var(--toolbarButton-menuArrow-icon);
  1501. mask-image: var(--toolbarButton-menuArrow-icon);
  1502. }
  1503. html[dir="ltr"] .dropdownToolbarButton::after {
  1504. right: 7px;
  1505. }
  1506. html[dir="rtl"] .dropdownToolbarButton::after {
  1507. left: 7px;
  1508. }
  1509. .dropdownToolbarButton > select {
  1510. width: calc(var(--scale-select-container-width) + var(--scale-select-overflow));
  1511. height: 28px;
  1512. font-size: 12px;
  1513. color: var(--main-color);
  1514. margin: 0;
  1515. padding: 1px 0 2px;
  1516. border: none;
  1517. background-color: var(--dropdown-btn-bg-color);
  1518. }
  1519. html[dir="ltr"] .dropdownToolbarButton > select {
  1520. padding-left: 4px;
  1521. }
  1522. html[dir="rtl"] .dropdownToolbarButton > select {
  1523. padding-right: 4px;
  1524. }
  1525. .dropdownToolbarButton > select:hover,
  1526. .dropdownToolbarButton > select:focus-visible {
  1527. background-color: var(--button-hover-color);
  1528. color: var(--toggled-btn-color);
  1529. }
  1530. .dropdownToolbarButton > select > option {
  1531. background: var(--doorhanger-bg-color);
  1532. color: var(--main-color);
  1533. }
  1534. #customScaleOption {
  1535. display: none;
  1536. }
  1537. #pageWidthOption {
  1538. border-bottom: 1px rgba(255, 255, 255, 0.5) solid;
  1539. }
  1540. .toolbarButtonSpacer {
  1541. width: 30px;
  1542. display: inline-block;
  1543. height: 1px;
  1544. }
  1545. .toolbarButton::before,
  1546. .secondaryToolbarButton::before,
  1547. .dropdownToolbarButton::after,
  1548. .treeItemToggler::before {
  1549. /* All matching images have a size of 16x16
  1550. * All relevant containers have a size of 28x28 */
  1551. position: absolute;
  1552. display: inline-block;
  1553. width: 16px;
  1554. height: 16px;
  1555. content: "";
  1556. background-color: var(--toolbar-icon-bg-color);
  1557. -webkit-mask-size: cover;
  1558. mask-size: cover;
  1559. }
  1560. .dropdownToolbarButton:hover::after,
  1561. .dropdownToolbarButton:focus-visible::after,
  1562. .dropdownToolbarButton:active::after {
  1563. background-color: var(--toolbar-icon-hover-bg-color);
  1564. }
  1565. .toolbarButton::before {
  1566. opacity: var(--toolbar-icon-opacity);
  1567. top: 6px;
  1568. left: 6px;
  1569. }
  1570. .toolbarButton:hover::before,
  1571. .toolbarButton:focus-visible::before,
  1572. .secondaryToolbarButton:hover::before,
  1573. .secondaryToolbarButton:focus-visible::before {
  1574. background-color: var(--toolbar-icon-hover-bg-color);
  1575. }
  1576. .secondaryToolbarButton::before {
  1577. opacity: var(--doorhanger-icon-opacity);
  1578. top: 5px;
  1579. }
  1580. html[dir="ltr"] .secondaryToolbarButton::before {
  1581. left: 12px;
  1582. }
  1583. html[dir="rtl"] .secondaryToolbarButton::before {
  1584. right: 12px;
  1585. }
  1586. .toolbarButton#sidebarToggle::before {
  1587. -webkit-mask-image: var(--toolbarButton-sidebarToggle-icon);
  1588. mask-image: var(--toolbarButton-sidebarToggle-icon);
  1589. }
  1590. html[dir="rtl"] .toolbarButton#sidebarToggle::before {
  1591. transform: scaleX(-1);
  1592. }
  1593. .toolbarButton#secondaryToolbarToggle::before {
  1594. -webkit-mask-image: var(--toolbarButton-secondaryToolbarToggle-icon);
  1595. mask-image: var(--toolbarButton-secondaryToolbarToggle-icon);
  1596. }
  1597. html[dir="rtl"] .toolbarButton#secondaryToolbarToggle::before {
  1598. transform: scaleX(-1);
  1599. }
  1600. .toolbarButton.findPrevious::before {
  1601. -webkit-mask-image: var(--findbarButton-previous-icon);
  1602. mask-image: var(--findbarButton-previous-icon);
  1603. }
  1604. .toolbarButton.findNext::before {
  1605. -webkit-mask-image: var(--findbarButton-next-icon);
  1606. mask-image: var(--findbarButton-next-icon);
  1607. }
  1608. .toolbarButton.pageUp::before {
  1609. -webkit-mask-image: var(--toolbarButton-pageUp-icon);
  1610. mask-image: var(--toolbarButton-pageUp-icon);
  1611. }
  1612. .toolbarButton.pageDown::before {
  1613. -webkit-mask-image: var(--toolbarButton-pageDown-icon);
  1614. mask-image: var(--toolbarButton-pageDown-icon);
  1615. }
  1616. .toolbarButton.zoomOut::before {
  1617. -webkit-mask-image: var(--toolbarButton-zoomOut-icon);
  1618. mask-image: var(--toolbarButton-zoomOut-icon);
  1619. }
  1620. .toolbarButton.zoomIn::before {
  1621. -webkit-mask-image: var(--toolbarButton-zoomIn-icon);
  1622. mask-image: var(--toolbarButton-zoomIn-icon);
  1623. }
  1624. .toolbarButton.presentationMode::before,
  1625. .secondaryToolbarButton.presentationMode::before {
  1626. -webkit-mask-image: var(--toolbarButton-presentationMode-icon);
  1627. mask-image: var(--toolbarButton-presentationMode-icon);
  1628. }
  1629. .toolbarButton.print::before,
  1630. .secondaryToolbarButton.print::before {
  1631. -webkit-mask-image: var(--toolbarButton-print-icon);
  1632. mask-image: var(--toolbarButton-print-icon);
  1633. }
  1634. .toolbarButton.openFile::before,
  1635. .secondaryToolbarButton.openFile::before {
  1636. -webkit-mask-image: var(--toolbarButton-openFile-icon);
  1637. mask-image: var(--toolbarButton-openFile-icon);
  1638. }
  1639. .toolbarButton.download::before,
  1640. .secondaryToolbarButton.download::before {
  1641. -webkit-mask-image: var(--toolbarButton-download-icon);
  1642. mask-image: var(--toolbarButton-download-icon);
  1643. }
  1644. .secondaryToolbarButton.bookmark {
  1645. padding-top: 6px;
  1646. text-decoration: none;
  1647. }
  1648. .bookmark[href="#"] {
  1649. opacity: 0.5;
  1650. pointer-events: none;
  1651. }
  1652. .toolbarButton.bookmark::before,
  1653. .secondaryToolbarButton.bookmark::before {
  1654. -webkit-mask-image: var(--toolbarButton-bookmark-icon);
  1655. mask-image: var(--toolbarButton-bookmark-icon);
  1656. }
  1657. #viewThumbnail.toolbarButton::before {
  1658. -webkit-mask-image: var(--toolbarButton-viewThumbnail-icon);
  1659. mask-image: var(--toolbarButton-viewThumbnail-icon);
  1660. }
  1661. #viewOutline.toolbarButton::before {
  1662. -webkit-mask-image: var(--toolbarButton-viewOutline-icon);
  1663. mask-image: var(--toolbarButton-viewOutline-icon);
  1664. }
  1665. html[dir="rtl"] #viewOutline.toolbarButton::before {
  1666. transform: scaleX(-1);
  1667. }
  1668. #viewAttachments.toolbarButton::before {
  1669. -webkit-mask-image: var(--toolbarButton-viewAttachments-icon);
  1670. mask-image: var(--toolbarButton-viewAttachments-icon);
  1671. }
  1672. #viewLayers.toolbarButton::before {
  1673. -webkit-mask-image: var(--toolbarButton-viewLayers-icon);
  1674. mask-image: var(--toolbarButton-viewLayers-icon);
  1675. }
  1676. #currentOutlineItem.toolbarButton::before {
  1677. -webkit-mask-image: var(--toolbarButton-currentOutlineItem-icon);
  1678. mask-image: var(--toolbarButton-currentOutlineItem-icon);
  1679. }
  1680. html[dir="rtl"] #currentOutlineItem.toolbarButton::before {
  1681. transform: scaleX(-1);
  1682. }
  1683. #viewFind.toolbarButton::before {
  1684. -webkit-mask-image: var(--toolbarButton-search-icon);
  1685. mask-image: var(--toolbarButton-search-icon);
  1686. }
  1687. .toolbarButton.pdfSidebarNotification::after {
  1688. position: absolute;
  1689. display: inline-block;
  1690. top: 1px;
  1691. /* Create a filled circle, with a diameter of 9 pixels, using only CSS: */
  1692. content: "";
  1693. background-color: rgba(112, 219, 85, 1);
  1694. height: 9px;
  1695. width: 9px;
  1696. border-radius: 50%;
  1697. }
  1698. html[dir="ltr"] .toolbarButton.pdfSidebarNotification::after {
  1699. left: 17px;
  1700. }
  1701. html[dir="rtl"] .toolbarButton.pdfSidebarNotification::after {
  1702. right: 17px;
  1703. }
  1704. .secondaryToolbarButton {
  1705. position: relative;
  1706. margin: 0;
  1707. padding: 0 0 1px;
  1708. height: auto;
  1709. min-height: 26px;
  1710. width: auto;
  1711. min-width: 100%;
  1712. white-space: normal;
  1713. border-radius: 0;
  1714. box-sizing: border-box;
  1715. }
  1716. html[dir="ltr"] .secondaryToolbarButton {
  1717. padding-left: 36px;
  1718. text-align: left;
  1719. }
  1720. html[dir="rtl"] .secondaryToolbarButton {
  1721. padding-right: 36px;
  1722. text-align: right;
  1723. }
  1724. html[dir="ltr"] .secondaryToolbarButton > span {
  1725. padding-right: 4px;
  1726. }
  1727. html[dir="rtl"] .secondaryToolbarButton > span {
  1728. padding-left: 4px;
  1729. }
  1730. .secondaryToolbarButton.firstPage::before {
  1731. -webkit-mask-image: var(--secondaryToolbarButton-firstPage-icon);
  1732. mask-image: var(--secondaryToolbarButton-firstPage-icon);
  1733. }
  1734. .secondaryToolbarButton.lastPage::before {
  1735. -webkit-mask-image: var(--secondaryToolbarButton-lastPage-icon);
  1736. mask-image: var(--secondaryToolbarButton-lastPage-icon);
  1737. }
  1738. .secondaryToolbarButton.rotateCcw::before {
  1739. -webkit-mask-image: var(--secondaryToolbarButton-rotateCcw-icon);
  1740. mask-image: var(--secondaryToolbarButton-rotateCcw-icon);
  1741. }
  1742. .secondaryToolbarButton.rotateCw::before {
  1743. -webkit-mask-image: var(--secondaryToolbarButton-rotateCw-icon);
  1744. mask-image: var(--secondaryToolbarButton-rotateCw-icon);
  1745. }
  1746. .secondaryToolbarButton.selectTool::before {
  1747. -webkit-mask-image: var(--secondaryToolbarButton-selectTool-icon);
  1748. mask-image: var(--secondaryToolbarButton-selectTool-icon);
  1749. }
  1750. .secondaryToolbarButton.handTool::before {
  1751. -webkit-mask-image: var(--secondaryToolbarButton-handTool-icon);
  1752. mask-image: var(--secondaryToolbarButton-handTool-icon);
  1753. }
  1754. .secondaryToolbarButton.scrollPage::before {
  1755. -webkit-mask-image: var(--secondaryToolbarButton-scrollPage-icon);
  1756. mask-image: var(--secondaryToolbarButton-scrollPage-icon);
  1757. }
  1758. .secondaryToolbarButton.scrollVertical::before {
  1759. -webkit-mask-image: var(--secondaryToolbarButton-scrollVertical-icon);
  1760. mask-image: var(--secondaryToolbarButton-scrollVertical-icon);
  1761. }
  1762. .secondaryToolbarButton.scrollHorizontal::before {
  1763. -webkit-mask-image: var(--secondaryToolbarButton-scrollHorizontal-icon);
  1764. mask-image: var(--secondaryToolbarButton-scrollHorizontal-icon);
  1765. }
  1766. .secondaryToolbarButton.scrollWrapped::before {
  1767. -webkit-mask-image: var(--secondaryToolbarButton-scrollWrapped-icon);
  1768. mask-image: var(--secondaryToolbarButton-scrollWrapped-icon);
  1769. }
  1770. .secondaryToolbarButton.spreadNone::before {
  1771. -webkit-mask-image: var(--secondaryToolbarButton-spreadNone-icon);
  1772. mask-image: var(--secondaryToolbarButton-spreadNone-icon);
  1773. }
  1774. .secondaryToolbarButton.spreadOdd::before {
  1775. -webkit-mask-image: var(--secondaryToolbarButton-spreadOdd-icon);
  1776. mask-image: var(--secondaryToolbarButton-spreadOdd-icon);
  1777. }
  1778. .secondaryToolbarButton.spreadEven::before {
  1779. -webkit-mask-image: var(--secondaryToolbarButton-spreadEven-icon);
  1780. mask-image: var(--secondaryToolbarButton-spreadEven-icon);
  1781. }
  1782. .secondaryToolbarButton.documentProperties::before {
  1783. -webkit-mask-image: var(--secondaryToolbarButton-documentProperties-icon);
  1784. mask-image: var(--secondaryToolbarButton-documentProperties-icon);
  1785. }
  1786. .verticalToolbarSeparator {
  1787. display: block;
  1788. padding: 11px 0;
  1789. margin: 5px 2px;
  1790. width: 1px;
  1791. background-color: var(--separator-color);
  1792. }
  1793. html[dir="ltr"] .verticalToolbarSeparator {
  1794. margin-left: 2px;
  1795. }
  1796. html[dir="rtl"] .verticalToolbarSeparator {
  1797. margin-right: 2px;
  1798. }
  1799. .horizontalToolbarSeparator {
  1800. display: block;
  1801. margin: 6px 0 5px;
  1802. height: 1px;
  1803. width: 100%;
  1804. border-top: 1px solid var(--doorhanger-separator-color);
  1805. }
  1806. .toolbarField {
  1807. padding: 4px 7px;
  1808. margin: 3px 0;
  1809. border-radius: 2px;
  1810. background-color: var(--field-bg-color);
  1811. background-clip: padding-box;
  1812. border-width: 1px;
  1813. border-style: solid;
  1814. border-color: var(--field-border-color);
  1815. box-shadow: none;
  1816. color: var(--field-color);
  1817. font-size: 12px;
  1818. line-height: 16px;
  1819. outline-style: none;
  1820. }
  1821. .toolbarField[type="checkbox"] {
  1822. opacity: 0;
  1823. position: absolute !important;
  1824. left: 0;
  1825. }
  1826. html[dir="ltr"] .toolbarField[type="checkbox"] {
  1827. margin: 10px 0 3px 7px;
  1828. }
  1829. html[dir="rtl"] .toolbarField[type="checkbox"] {
  1830. margin: 10px 7px 3px 0;
  1831. }
  1832. .toolbarField.pageNumber {
  1833. -moz-appearance: textfield; /* hides the spinner in moz */
  1834. min-width: 16px;
  1835. text-align: right;
  1836. width: 40px;
  1837. }
  1838. .toolbarField.pageNumber.visiblePageIsLoading {
  1839. background-image: var(--loading-icon);
  1840. background-repeat: no-repeat;
  1841. background-position: 3px;
  1842. }
  1843. .toolbarField.pageNumber::-webkit-inner-spin-button,
  1844. .toolbarField.pageNumber::-webkit-outer-spin-button {
  1845. -webkit-appearance: none;
  1846. margin: 0;
  1847. }
  1848. .toolbarField:focus {
  1849. border-color: #0a84ff;
  1850. }
  1851. .toolbarLabel {
  1852. min-width: 16px;
  1853. padding: 7px;
  1854. margin: 2px;
  1855. border-radius: 2px;
  1856. color: var(--main-color);
  1857. font-size: 12px;
  1858. line-height: 14px;
  1859. text-align: left;
  1860. -webkit-user-select: none;
  1861. -moz-user-select: none;
  1862. user-select: none;
  1863. cursor: default;
  1864. }
  1865. html[dir="ltr"] #numPages.toolbarLabel {
  1866. padding-left: 3px;
  1867. }
  1868. html[dir="rtl"] #numPages.toolbarLabel {
  1869. padding-right: 3px;
  1870. }
  1871. #thumbnailView {
  1872. position: absolute;
  1873. width: calc(100% - 60px);
  1874. top: 0;
  1875. bottom: 0;
  1876. padding: 10px 30px 0;
  1877. overflow: auto;
  1878. -webkit-overflow-scrolling: touch;
  1879. }
  1880. #thumbnailView > a:active,
  1881. #thumbnailView > a:focus {
  1882. outline: 0;
  1883. }
  1884. .thumbnail {
  1885. margin: 0 10px 5px;
  1886. }
  1887. html[dir="ltr"] .thumbnail {
  1888. float: left;
  1889. }
  1890. html[dir="rtl"] .thumbnail {
  1891. float: right;
  1892. }
  1893. #thumbnailView > a:last-of-type > .thumbnail {
  1894. margin-bottom: 10px;
  1895. }
  1896. #thumbnailView > a:last-of-type > .thumbnail:not([data-loaded]) {
  1897. margin-bottom: 9px;
  1898. }
  1899. .thumbnail:not([data-loaded]) {
  1900. border: 1px dashed rgba(132, 132, 132, 1);
  1901. margin: -1px 9px 4px;
  1902. }
  1903. .thumbnailImage {
  1904. border: 1px solid rgba(0, 0, 0, 0);
  1905. box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.5), 0 2px 8px rgba(0, 0, 0, 0.3);
  1906. opacity: 0.8;
  1907. z-index: 99;
  1908. background-color: rgba(255, 255, 255, 1);
  1909. background-clip: content-box;
  1910. }
  1911. .thumbnailSelectionRing {
  1912. border-radius: 2px;
  1913. padding: 7px;
  1914. }
  1915. a:focus > .thumbnail > .thumbnailSelectionRing > .thumbnailImage,
  1916. .thumbnail:hover > .thumbnailSelectionRing > .thumbnailImage {
  1917. opacity: 0.9;
  1918. }
  1919. a:focus > .thumbnail > .thumbnailSelectionRing,
  1920. .thumbnail:hover > .thumbnailSelectionRing {
  1921. background-color: var(--sidebaritem-bg-color);
  1922. background-clip: padding-box;
  1923. color: rgba(255, 255, 255, 0.9);
  1924. }
  1925. .thumbnail.selected > .thumbnailSelectionRing > .thumbnailImage {
  1926. opacity: 1;
  1927. }
  1928. .thumbnail.selected > .thumbnailSelectionRing {
  1929. background-color: var(--sidebaritem-bg-color);
  1930. background-clip: padding-box;
  1931. color: rgba(255, 255, 255, 1);
  1932. }
  1933. #outlineView,
  1934. #attachmentsView,
  1935. #layersView {
  1936. position: absolute;
  1937. width: calc(100% - 8px);
  1938. top: 0;
  1939. bottom: 0;
  1940. padding: 4px 4px 0;
  1941. overflow: auto;
  1942. -webkit-overflow-scrolling: touch;
  1943. -webkit-user-select: none;
  1944. -moz-user-select: none;
  1945. user-select: none;
  1946. }
  1947. html[dir="ltr"] .treeWithDeepNesting > .treeItem,
  1948. html[dir="ltr"] .treeItem > .treeItems {
  1949. margin-left: 20px;
  1950. }
  1951. html[dir="rtl"] .treeWithDeepNesting > .treeItem,
  1952. html[dir="rtl"] .treeItem > .treeItems {
  1953. margin-right: 20px;
  1954. }
  1955. .treeItem > a {
  1956. text-decoration: none;
  1957. display: inline-block;
  1958. min-width: 95%;
  1959. /* Subtract the right padding (left, in RTL mode) of the container: */
  1960. min-width: calc(100% - 4px);
  1961. height: auto;
  1962. margin-bottom: 1px;
  1963. border-radius: 2px;
  1964. color: var(--treeitem-color);
  1965. font-size: 13px;
  1966. line-height: 15px;
  1967. -webkit-user-select: none;
  1968. -moz-user-select: none;
  1969. user-select: none;
  1970. white-space: normal;
  1971. cursor: pointer;
  1972. }
  1973. html[dir="ltr"] .treeItem > a {
  1974. padding: 2px 0 5px 4px;
  1975. }
  1976. html[dir="rtl"] .treeItem > a {
  1977. padding: 2px 4px 5px 0;
  1978. }
  1979. #layersView .treeItem > a > * {
  1980. cursor: pointer;
  1981. }
  1982. html[dir="ltr"] #layersView .treeItem > a > label {
  1983. padding-left: 4px;
  1984. }
  1985. html[dir="rtl"] #layersView .treesItem > a > label {
  1986. padding-right: 4px;
  1987. }
  1988. .treeItemToggler {
  1989. position: relative;
  1990. height: 0;
  1991. width: 0;
  1992. color: rgba(255, 255, 255, 0.5);
  1993. }
  1994. .treeItemToggler::before {
  1995. -webkit-mask-image: var(--treeitem-expanded-icon);
  1996. mask-image: var(--treeitem-expanded-icon);
  1997. }
  1998. .treeItemToggler.treeItemsHidden::before {
  1999. -webkit-mask-image: var(--treeitem-collapsed-icon);
  2000. mask-image: var(--treeitem-collapsed-icon);
  2001. }
  2002. html[dir="rtl"] .treeItemToggler.treeItemsHidden::before {
  2003. transform: scaleX(-1);
  2004. }
  2005. .treeItemToggler.treeItemsHidden ~ .treeItems {
  2006. display: none;
  2007. }
  2008. html[dir="ltr"] .treeItemToggler {
  2009. float: left;
  2010. }
  2011. html[dir="rtl"] .treeItemToggler {
  2012. float: right;
  2013. }
  2014. html[dir="ltr"] .treeItemToggler::before {
  2015. right: 4px;
  2016. }
  2017. html[dir="rtl"] .treeItemToggler::before {
  2018. left: 4px;
  2019. }
  2020. .treeItem.selected > a {
  2021. background-color: var(--treeitem-selected-bg-color);
  2022. color: var(--treeitem-selected-color);
  2023. }
  2024. .treeItemToggler:hover,
  2025. .treeItemToggler:hover + a,
  2026. .treeItemToggler:hover ~ .treeItems,
  2027. .treeItem > a:hover {
  2028. background-color: var(--sidebaritem-bg-color);
  2029. background-clip: padding-box;
  2030. border-radius: 2px;
  2031. color: var(--treeitem-hover-color);
  2032. }
  2033. /* TODO: file FF bug to support ::-moz-selection:window-inactive
  2034. so we can override the opaque grey background when the window is inactive;
  2035. see https://bugzilla.mozilla.org/show_bug.cgi?id=706209 */
  2036. ::-moz-selection {
  2037. background: rgba(0, 0, 255, 0.3);
  2038. }
  2039. ::selection {
  2040. background: rgba(0, 0, 255, 0.3);
  2041. }
  2042. #errorWrapper {
  2043. background: none repeat scroll 0 0 var(--errorWrapper-bg-color);
  2044. color: var(--main-color);
  2045. left: 0;
  2046. position: absolute;
  2047. right: 0;
  2048. z-index: 1000;
  2049. padding: 3px 6px;
  2050. }
  2051. #errorMessageLeft {
  2052. float: left;
  2053. }
  2054. #errorMessageRight {
  2055. float: right;
  2056. }
  2057. #errorMoreInfo {
  2058. background-color: var(--field-bg-color);
  2059. color: var(--field-color);
  2060. border: 1px solid var(--field-border-color);
  2061. padding: 3px;
  2062. margin: 3px;
  2063. width: 98%;
  2064. }
  2065. .overlayButton {
  2066. width: auto;
  2067. margin: 3px 4px 2px !important;
  2068. padding: 2px 11px;
  2069. color: var(--main-color);
  2070. background-color: var(--overlay-button-bg-color);
  2071. border: var(--overlay-button-border) !important;
  2072. }
  2073. #overlayContainer {
  2074. display: table;
  2075. position: absolute;
  2076. width: 100%;
  2077. height: 100%;
  2078. background-color: rgba(0, 0, 0, 0.2);
  2079. z-index: 40000;
  2080. }
  2081. #overlayContainer > * {
  2082. overflow: auto;
  2083. -webkit-overflow-scrolling: touch;
  2084. }
  2085. #overlayContainer > .container {
  2086. display: table-cell;
  2087. vertical-align: middle;
  2088. text-align: center;
  2089. }
  2090. #overlayContainer > .container > .dialog {
  2091. display: inline-block;
  2092. padding: 15px;
  2093. border-spacing: 4px;
  2094. color: var(--main-color);
  2095. font-size: 12px;
  2096. line-height: 14px;
  2097. background-color: var(--doorhanger-bg-color);
  2098. border: 1px solid rgba(0, 0, 0, 0.5);
  2099. border-radius: 4px;
  2100. box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
  2101. }
  2102. .dialog > .row {
  2103. display: table-row;
  2104. }
  2105. .dialog > .row > * {
  2106. display: table-cell;
  2107. }
  2108. .dialog .toolbarField {
  2109. margin: 5px 0;
  2110. }
  2111. .dialog .separator {
  2112. display: block;
  2113. margin: 4px 0;
  2114. height: 1px;
  2115. width: 100%;
  2116. background-color: var(--separator-color);
  2117. }
  2118. .dialog .buttonRow {
  2119. text-align: center;
  2120. vertical-align: middle;
  2121. }
  2122. .dialog :link {
  2123. color: rgba(255, 255, 255, 1);
  2124. }
  2125. #passwordOverlay > .dialog {
  2126. text-align: center;
  2127. }
  2128. #passwordOverlay .toolbarField {
  2129. width: 200px;
  2130. }
  2131. #documentPropertiesOverlay > .dialog {
  2132. text-align: left;
  2133. }
  2134. #documentPropertiesOverlay .row > * {
  2135. min-width: 100px;
  2136. }
  2137. html[dir="ltr"] #documentPropertiesOverlay .row > * {
  2138. text-align: left;
  2139. }
  2140. html[dir="rtl"] #documentPropertiesOverlay .row > * {
  2141. text-align: right;
  2142. }
  2143. #documentPropertiesOverlay .row > span {
  2144. width: 125px;
  2145. word-wrap: break-word;
  2146. }
  2147. #documentPropertiesOverlay .row > p {
  2148. max-width: 225px;
  2149. word-wrap: break-word;
  2150. }
  2151. #documentPropertiesOverlay .buttonRow {
  2152. margin-top: 10px;
  2153. }
  2154. .clearBoth {
  2155. clear: both;
  2156. }
  2157. .fileInput {
  2158. background: rgba(255, 255, 255, 1);
  2159. color: rgba(0, 0, 0, 1);
  2160. margin-top: 5px;
  2161. visibility: hidden;
  2162. position: fixed;
  2163. right: 0;
  2164. top: 0;
  2165. }
  2166. #PDFBug {
  2167. background: none repeat scroll 0 0 rgba(255, 255, 255, 1);
  2168. border: 1px solid rgba(102, 102, 102, 1);
  2169. position: fixed;
  2170. top: 32px;
  2171. right: 0;
  2172. bottom: 0;
  2173. font-size: 10px;
  2174. padding: 0;
  2175. width: 300px;
  2176. }
  2177. #PDFBug .controls {
  2178. background: rgba(238, 238, 238, 1);
  2179. border-bottom: 1px solid rgba(102, 102, 102, 1);
  2180. padding: 3px;
  2181. }
  2182. #PDFBug .panels {
  2183. bottom: 0;
  2184. left: 0;
  2185. overflow: auto;
  2186. -webkit-overflow-scrolling: touch;
  2187. position: absolute;
  2188. right: 0;
  2189. top: 27px;
  2190. }
  2191. #PDFBug .panels > div {
  2192. padding: 5px;
  2193. }
  2194. #PDFBug button.active {
  2195. font-weight: bold;
  2196. }
  2197. .debuggerShowText {
  2198. background: none repeat scroll 0 0 rgba(255, 255, 0, 1);
  2199. color: rgba(0, 0, 255, 1);
  2200. }
  2201. .debuggerHideText:hover {
  2202. background: none repeat scroll 0 0 rgba(255, 255, 0, 1);
  2203. }
  2204. #PDFBug .stats {
  2205. font-family: courier;
  2206. font-size: 10px;
  2207. white-space: pre;
  2208. }
  2209. #PDFBug .stats .title {
  2210. font-weight: bold;
  2211. }
  2212. #PDFBug table {
  2213. font-size: 10px;
  2214. white-space: pre;
  2215. }
  2216. #PDFBug table.showText {
  2217. border-collapse: collapse;
  2218. text-align: center;
  2219. }
  2220. #PDFBug table.showText,
  2221. #PDFBug table.showText tr,
  2222. #PDFBug table.showText td {
  2223. border: 1px solid black;
  2224. padding: 1px;
  2225. }
  2226. #PDFBug table.showText td.advance {
  2227. color: grey;
  2228. }
  2229. #viewer.textLayer-visible .textLayer {
  2230. opacity: 1;
  2231. }
  2232. #viewer.textLayer-visible .canvasWrapper {
  2233. background-color: rgba(128, 255, 128, 1);
  2234. }
  2235. #viewer.textLayer-visible .canvasWrapper canvas {
  2236. mix-blend-mode: screen;
  2237. }
  2238. #viewer.textLayer-visible .textLayer span {
  2239. background-color: rgba(255, 255, 0, 0.1);
  2240. color: rgba(0, 0, 0, 1);
  2241. border: solid 1px rgba(255, 0, 0, 0.5);
  2242. box-sizing: border-box;
  2243. }
  2244. #viewer.textLayer-hover .textLayer span:hover {
  2245. background-color: rgba(255, 255, 255, 1);
  2246. color: rgba(0, 0, 0, 1);
  2247. }
  2248. #viewer.textLayer-shadow .textLayer span {
  2249. background-color: rgba(255, 255, 255, 0.6);
  2250. color: rgba(0, 0, 0, 1);
  2251. }
  2252. .grab-to-pan-grab {
  2253. cursor: url("images/grab.cur"), move !important;
  2254. cursor: -webkit-grab !important;
  2255. cursor: grab !important;
  2256. }
  2257. .grab-to-pan-grab
  2258. *:not(input):not(textarea):not(button):not(select):not(:link) {
  2259. cursor: inherit !important;
  2260. }
  2261. .grab-to-pan-grab:active,
  2262. .grab-to-pan-grabbing {
  2263. cursor: url("images/grabbing.cur"), move !important;
  2264. cursor: -webkit-grabbing !important;
  2265. cursor: grabbing !important;
  2266. position: fixed;
  2267. background: rgba(0, 0, 0, 0);
  2268. display: block;
  2269. top: 0;
  2270. left: 0;
  2271. right: 0;
  2272. bottom: 0;
  2273. overflow: hidden;
  2274. z-index: 50000; /* should be higher than anything else in PDF.js! */
  2275. }
  2276. @page {
  2277. margin: 0;
  2278. }
  2279. #printContainer {
  2280. display: none;
  2281. }
  2282. @media print {
  2283. /* General rules for printing. */
  2284. body {
  2285. background: rgba(0, 0, 0, 0) none;
  2286. }
  2287. /* Rules for browsers that don't support mozPrintCallback. */
  2288. #sidebarContainer,
  2289. #secondaryToolbar,
  2290. .toolbar,
  2291. #loadingBox,
  2292. #errorWrapper,
  2293. .textLayer,
  2294. .canvasWrapper {
  2295. display: none;
  2296. }
  2297. #viewerContainer {
  2298. overflow: visible;
  2299. }
  2300. #mainContainer,
  2301. #viewerContainer,
  2302. .page,
  2303. .page canvas {
  2304. position: static;
  2305. padding: 0;
  2306. margin: 0;
  2307. }
  2308. .page {
  2309. float: left;
  2310. display: none;
  2311. border: none;
  2312. box-shadow: none;
  2313. background-clip: content-box;
  2314. background-color: rgba(255, 255, 255, 1);
  2315. }
  2316. .page[data-loaded] {
  2317. display: block;
  2318. }
  2319. .fileInput {
  2320. display: none;
  2321. }
  2322. /* Rules for browsers that support PDF.js printing */
  2323. body[data-pdfjsprinting] #outerContainer {
  2324. display: none;
  2325. }
  2326. body[data-pdfjsprinting] #printContainer {
  2327. display: block;
  2328. }
  2329. #printContainer {
  2330. height: 100%;
  2331. }
  2332. /* wrapper around (scaled) print canvas elements */
  2333. #printContainer > .printedPage {
  2334. page-break-after: always;
  2335. page-break-inside: avoid;
  2336. /* The wrapper always cover the whole page. */
  2337. height: 100%;
  2338. width: 100%;
  2339. display: flex;
  2340. flex-direction: column;
  2341. justify-content: center;
  2342. align-items: center;
  2343. }
  2344. #printContainer > .xfaPrintedPage .xfaPage {
  2345. position: absolute;
  2346. }
  2347. #printContainer > .xfaPrintedPage {
  2348. page-break-after: always;
  2349. page-break-inside: avoid;
  2350. width: 100%;
  2351. height: 100%;
  2352. position: relative;
  2353. }
  2354. #printContainer > .printedPage canvas,
  2355. #printContainer > .printedPage img {
  2356. /* The intrinsic canvas / image size will make sure that we fit the page. */
  2357. max-width: 100%;
  2358. max-height: 100%;
  2359. direction: ltr;
  2360. display: block;
  2361. }
  2362. }
  2363. .visibleLargeView,
  2364. .visibleMediumView,
  2365. .visibleSmallView {
  2366. display: none;
  2367. }
  2368. @media all and (max-width: 900px) {
  2369. #toolbarViewerMiddle {
  2370. display: table;
  2371. margin: auto;
  2372. left: auto;
  2373. position: inherit;
  2374. transform: none;
  2375. }
  2376. }
  2377. @media all and (max-width: 840px) {
  2378. #sidebarContainer {
  2379. background-color: var(--sidebar-narrow-bg-color);
  2380. }
  2381. html[dir="ltr"] #outerContainer.sidebarOpen #viewerContainer {
  2382. left: 0 !important;
  2383. }
  2384. html[dir="rtl"] #outerContainer.sidebarOpen #viewerContainer {
  2385. right: 0 !important;
  2386. }
  2387. #outerContainer .hiddenLargeView,
  2388. #outerContainer .hiddenMediumView {
  2389. display: inherit;
  2390. }
  2391. #outerContainer .visibleLargeView,
  2392. #outerContainer .visibleMediumView {
  2393. display: none;
  2394. }
  2395. }
  2396. @media all and (max-width: 770px) {
  2397. #outerContainer .hiddenLargeView {
  2398. display: none;
  2399. }
  2400. #outerContainer .visibleLargeView {
  2401. display: inherit;
  2402. }
  2403. }
  2404. @media all and (max-width: 700px) {
  2405. #outerContainer .hiddenMediumView {
  2406. display: none;
  2407. }
  2408. #outerContainer .visibleMediumView {
  2409. display: inherit;
  2410. }
  2411. }
  2412. @media all and (max-width: 640px) {
  2413. .hiddenSmallView,
  2414. .hiddenSmallView * {
  2415. display: none;
  2416. }
  2417. .visibleSmallView {
  2418. display: inherit;
  2419. }
  2420. .toolbarButtonSpacer {
  2421. width: 0;
  2422. }
  2423. html[dir="ltr"] .findbar {
  2424. left: 34px;
  2425. }
  2426. html[dir="rtl"] .findbar {
  2427. right: 34px;
  2428. }
  2429. }
  2430. @media all and (max-width: 535px) {
  2431. #scaleSelectContainer {
  2432. display: none;
  2433. }
  2434. }