searxng.css 68 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439244024412442244324442445244624472448244924502451245224532454245524562457245824592460246124622463246424652466246724682469247024712472247324742475247624772478247924802481248224832484248524862487248824892490249124922493249424952496249724982499250025012502250325042505250625072508250925102511251225132514251525162517251825192520252125222523252425252526252725282529253025312532253325342535253625372538253925402541254225432544254525462547254825492550255125522553255425552556255725582559256025612562256325642565256625672568256925702571257225732574257525762577257825792580258125822583258425852586258725882589259025912592259325942595259625972598259926002601260226032604260526062607260826092610261126122613261426152616261726182619262026212622262326242625262626272628262926302631263226332634263526362637263826392640264126422643264426452646264726482649265026512652265326542655265626572658265926602661266226632664266526662667266826692670267126722673267426752676267726782679268026812682268326842685268626872688268926902691269226932694269526962697269826992700270127022703270427052706270727082709271027112712271327142715271627172718271927202721272227232724272527262727272827292730273127322733273427352736273727382739274027412742274327442745274627472748274927502751275227532754275527562757275827592760276127622763276427652766276727682769277027712772277327742775277627772778277927802781278227832784278527862787278827892790279127922793279427952796279727982799280028012802280328042805280628072808280928102811281228132814281528162817281828192820282128222823282428252826282728282829283028312832283328342835283628372838283928402841284228432844284528462847284828492850285128522853285428552856285728582859286028612862286328642865286628672868286928702871287228732874287528762877287828792880288128822883288428852886288728882889289028912892289328942895289628972898289929002901290229032904290529062907290829092910291129122913291429152916291729182919292029212922292329242925292629272928292929302931293229332934293529362937293829392940294129422943294429452946294729482949295029512952295329542955295629572958295929602961296229632964296529662967296829692970297129722973297429752976297729782979298029812982298329842985298629872988298929902991299229932994299529962997299829993000300130023003300430053006300730083009301030113012301330143015301630173018301930203021302230233024302530263027302830293030303130323033303430353036303730383039304030413042304330443045304630473048304930503051305230533054305530563057305830593060306130623063306430653066306730683069307030713072307330743075307630773078307930803081308230833084308530863087308830893090309130923093309430953096309730983099310031013102310331043105310631073108310931103111311231133114311531163117311831193120312131223123312431253126312731283129313031313132313331343135313631373138313931403141314231433144314531463147314831493150315131523153315431553156315731583159316031613162316331643165316631673168316931703171317231733174317531763177317831793180318131823183318431853186318731883189319031913192319331943195319631973198319932003201320232033204320532063207320832093210
  1. /*
  2. * SearXNG, A privacy-respecting, hackable metasearch engine
  3. *
  4. * To convert "style.less" to "style.css" run: $make styles
  5. */
  6. .github-issue-button {
  7. display: block;
  8. padding: 8px 16px;
  9. font-family: sans-serif;
  10. font-size: 16px;
  11. color: white;
  12. background-color: #238636 !important;
  13. /* important is needed cause to an !important in logicodev-dark */
  14. border: #2ea043;
  15. border-radius: 10px !important;
  16. box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px;
  17. }
  18. .github-issue-button:hover {
  19. background-color: #2ea043;
  20. }
  21. .issue-hide {
  22. display: none;
  23. }
  24. .engine-stats .engine-name {
  25. width: 20rem;
  26. }
  27. .engine-stats .engine-score {
  28. width: 7rem;
  29. text-align: right;
  30. }
  31. .engine-stats .engine-reliability {
  32. text-align: right;
  33. }
  34. .engine-stats table.engine-error {
  35. max-width: 1280px;
  36. margin: 1rem;
  37. border: 1px solid gray;
  38. }
  39. .engine-stats table.engine-error th.engine-error-type,
  40. .engine-stats table.engine-error td.engine-error-type,
  41. .engine-stats failed-test {
  42. width: 10rem;
  43. }
  44. .engine-stats table.engine-error span.log_parameters {
  45. border-right: 1px solid gray;
  46. padding: 0 1rem 0 0;
  47. margin: 0 0 0 0.5rem;
  48. }
  49. .bar-chart-value {
  50. width: 3em;
  51. display: inline-block;
  52. text-align: right;
  53. padding-right: 0.5rem;
  54. }
  55. .bar-chart-graph {
  56. width: calc(100% - 5rem);
  57. display: inline-block;
  58. }
  59. .bar-chart-bar {
  60. border: 3px solid #5bc0de;
  61. margin: 1px 0;
  62. }
  63. .bar-chart-serie1 {
  64. border: 3px solid #5bc0de;
  65. margin: 1px 0;
  66. float: left;
  67. }
  68. .bar-chart-serie2 {
  69. border: 3px solid #deb15b;
  70. margin: 1px 0;
  71. float: left;
  72. }
  73. .bar0 {
  74. width: 0;
  75. border: 0;
  76. }
  77. .bar1 {
  78. width: 1%;
  79. }
  80. .bar2 {
  81. width: 2%;
  82. }
  83. .bar3 {
  84. width: 3%;
  85. }
  86. .bar4 {
  87. width: 4%;
  88. }
  89. .bar5 {
  90. width: 5%;
  91. }
  92. .bar6 {
  93. width: 6%;
  94. }
  95. .bar7 {
  96. width: 7%;
  97. }
  98. .bar8 {
  99. width: 8%;
  100. }
  101. .bar9 {
  102. width: 9%;
  103. }
  104. .bar10 {
  105. width: 10%;
  106. }
  107. .bar11 {
  108. width: 11%;
  109. }
  110. .bar12 {
  111. width: 12%;
  112. }
  113. .bar13 {
  114. width: 13%;
  115. }
  116. .bar14 {
  117. width: 14%;
  118. }
  119. .bar15 {
  120. width: 15%;
  121. }
  122. .bar16 {
  123. width: 16%;
  124. }
  125. .bar17 {
  126. width: 17%;
  127. }
  128. .bar18 {
  129. width: 18%;
  130. }
  131. .bar19 {
  132. width: 19%;
  133. }
  134. .bar20 {
  135. width: 20%;
  136. }
  137. .bar21 {
  138. width: 21%;
  139. }
  140. .bar22 {
  141. width: 22%;
  142. }
  143. .bar23 {
  144. width: 23%;
  145. }
  146. .bar24 {
  147. width: 24%;
  148. }
  149. .bar25 {
  150. width: 25%;
  151. }
  152. .bar26 {
  153. width: 26%;
  154. }
  155. .bar27 {
  156. width: 27%;
  157. }
  158. .bar28 {
  159. width: 28%;
  160. }
  161. .bar29 {
  162. width: 29%;
  163. }
  164. .bar30 {
  165. width: 30%;
  166. }
  167. .bar31 {
  168. width: 31%;
  169. }
  170. .bar32 {
  171. width: 32%;
  172. }
  173. .bar33 {
  174. width: 33%;
  175. }
  176. .bar34 {
  177. width: 34%;
  178. }
  179. .bar35 {
  180. width: 35%;
  181. }
  182. .bar36 {
  183. width: 36%;
  184. }
  185. .bar37 {
  186. width: 37%;
  187. }
  188. .bar38 {
  189. width: 38%;
  190. }
  191. .bar39 {
  192. width: 39%;
  193. }
  194. .bar40 {
  195. width: 40%;
  196. }
  197. .bar41 {
  198. width: 41%;
  199. }
  200. .bar42 {
  201. width: 42%;
  202. }
  203. .bar43 {
  204. width: 43%;
  205. }
  206. .bar44 {
  207. width: 44%;
  208. }
  209. .bar45 {
  210. width: 45%;
  211. }
  212. .bar46 {
  213. width: 46%;
  214. }
  215. .bar47 {
  216. width: 47%;
  217. }
  218. .bar48 {
  219. width: 48%;
  220. }
  221. .bar49 {
  222. width: 49%;
  223. }
  224. .bar50 {
  225. width: 50%;
  226. }
  227. .bar51 {
  228. width: 51%;
  229. }
  230. .bar52 {
  231. width: 52%;
  232. }
  233. .bar53 {
  234. width: 53%;
  235. }
  236. .bar54 {
  237. width: 54%;
  238. }
  239. .bar55 {
  240. width: 55%;
  241. }
  242. .bar56 {
  243. width: 56%;
  244. }
  245. .bar57 {
  246. width: 57%;
  247. }
  248. .bar58 {
  249. width: 58%;
  250. }
  251. .bar59 {
  252. width: 59%;
  253. }
  254. .bar60 {
  255. width: 60%;
  256. }
  257. .bar61 {
  258. width: 61%;
  259. }
  260. .bar62 {
  261. width: 62%;
  262. }
  263. .bar63 {
  264. width: 63%;
  265. }
  266. .bar64 {
  267. width: 64%;
  268. }
  269. .bar65 {
  270. width: 65%;
  271. }
  272. .bar66 {
  273. width: 66%;
  274. }
  275. .bar67 {
  276. width: 67%;
  277. }
  278. .bar68 {
  279. width: 68%;
  280. }
  281. .bar69 {
  282. width: 69%;
  283. }
  284. .bar70 {
  285. width: 70%;
  286. }
  287. .bar71 {
  288. width: 71%;
  289. }
  290. .bar72 {
  291. width: 72%;
  292. }
  293. .bar73 {
  294. width: 73%;
  295. }
  296. .bar74 {
  297. width: 74%;
  298. }
  299. .bar75 {
  300. width: 75%;
  301. }
  302. .bar76 {
  303. width: 76%;
  304. }
  305. .bar77 {
  306. width: 77%;
  307. }
  308. .bar78 {
  309. width: 78%;
  310. }
  311. .bar79 {
  312. width: 79%;
  313. }
  314. .bar80 {
  315. width: 80%;
  316. }
  317. .bar81 {
  318. width: 81%;
  319. }
  320. .bar82 {
  321. width: 82%;
  322. }
  323. .bar83 {
  324. width: 83%;
  325. }
  326. .bar84 {
  327. width: 84%;
  328. }
  329. .bar85 {
  330. width: 85%;
  331. }
  332. .bar86 {
  333. width: 86%;
  334. }
  335. .bar87 {
  336. width: 87%;
  337. }
  338. .bar88 {
  339. width: 88%;
  340. }
  341. .bar89 {
  342. width: 89%;
  343. }
  344. .bar90 {
  345. width: 90%;
  346. }
  347. .bar91 {
  348. width: 91%;
  349. }
  350. .bar92 {
  351. width: 92%;
  352. }
  353. .bar93 {
  354. width: 93%;
  355. }
  356. .bar94 {
  357. width: 94%;
  358. }
  359. .bar95 {
  360. width: 95%;
  361. }
  362. .bar96 {
  363. width: 96%;
  364. }
  365. .bar97 {
  366. width: 97%;
  367. }
  368. .bar98 {
  369. width: 98%;
  370. }
  371. .bar99 {
  372. width: 99%;
  373. }
  374. .bar100 {
  375. width: 100%;
  376. }
  377. .osm-map-box {
  378. height: 300px;
  379. width: 100%;
  380. margin: 10px 0;
  381. }
  382. /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
  383. /* Document
  384. ========================================================================== */
  385. /**
  386. * 1. Correct the line height in all browsers.
  387. * 2. Prevent adjustments of font size after orientation changes in iOS.
  388. */
  389. html {
  390. line-height: 1.15; /* 1 */
  391. -webkit-text-size-adjust: 100%; /* 2 */
  392. }
  393. /* Sections
  394. ========================================================================== */
  395. /**
  396. * Remove the margin in all browsers.
  397. */
  398. body {
  399. margin: 0;
  400. }
  401. /**
  402. * Render the `main` element consistently in IE.
  403. */
  404. main {
  405. display: block;
  406. }
  407. /**
  408. * Correct the font size and margin on `h1` elements within `section` and
  409. * `article` contexts in Chrome, Firefox, and Safari.
  410. */
  411. h1 {
  412. font-size: 2em;
  413. margin: 0.67em 0;
  414. }
  415. /* Grouping content
  416. ========================================================================== */
  417. /**
  418. * 1. Add the correct box sizing in Firefox.
  419. * 2. Show the overflow in Edge and IE.
  420. */
  421. hr {
  422. box-sizing: content-box; /* 1 */
  423. height: 0; /* 1 */
  424. overflow: visible; /* 2 */
  425. }
  426. /**
  427. * 1. Correct the inheritance and scaling of font size in all browsers.
  428. * 2. Correct the odd `em` font sizing in all browsers.
  429. */
  430. pre {
  431. font-family: monospace, monospace; /* 1 */
  432. font-size: 1em; /* 2 */
  433. }
  434. /* Text-level semantics
  435. ========================================================================== */
  436. /**
  437. * Remove the gray background on active links in IE 10.
  438. */
  439. a {
  440. background-color: transparent;
  441. }
  442. /**
  443. * 1. Remove the bottom border in Chrome 57-
  444. * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
  445. */
  446. abbr[title] {
  447. border-bottom: none; /* 1 */
  448. text-decoration: underline; /* 2 */
  449. text-decoration: underline dotted; /* 2 */
  450. }
  451. /**
  452. * Add the correct font weight in Chrome, Edge, and Safari.
  453. */
  454. b,
  455. strong {
  456. font-weight: bolder;
  457. }
  458. /**
  459. * 1. Correct the inheritance and scaling of font size in all browsers.
  460. * 2. Correct the odd `em` font sizing in all browsers.
  461. */
  462. code,
  463. kbd,
  464. samp {
  465. font-family: monospace, monospace; /* 1 */
  466. font-size: 1em; /* 2 */
  467. }
  468. /**
  469. * Add the correct font size in all browsers.
  470. */
  471. small {
  472. font-size: 80%;
  473. }
  474. /**
  475. * Prevent `sub` and `sup` elements from affecting the line height in
  476. * all browsers.
  477. */
  478. sub,
  479. sup {
  480. font-size: 75%;
  481. line-height: 0;
  482. position: relative;
  483. vertical-align: baseline;
  484. }
  485. sub {
  486. bottom: -0.25em;
  487. }
  488. sup {
  489. top: -0.5em;
  490. }
  491. /* Embedded content
  492. ========================================================================== */
  493. /**
  494. * Remove the border on images inside links in IE 10.
  495. */
  496. img {
  497. border-style: none;
  498. }
  499. /* Forms
  500. ========================================================================== */
  501. /**
  502. * 1. Change the font styles in all browsers.
  503. * 2. Remove the margin in Firefox and Safari.
  504. */
  505. button,
  506. input,
  507. optgroup,
  508. select,
  509. textarea {
  510. font-family: inherit; /* 1 */
  511. font-size: 100%; /* 1 */
  512. line-height: 1.15; /* 1 */
  513. margin: 0; /* 2 */
  514. }
  515. /**
  516. * Show the overflow in IE.
  517. * 1. Show the overflow in Edge.
  518. */
  519. button,
  520. input { /* 1 */
  521. overflow: visible;
  522. }
  523. /**
  524. * Remove the inheritance of text transform in Edge, Firefox, and IE.
  525. * 1. Remove the inheritance of text transform in Firefox.
  526. */
  527. button,
  528. select { /* 1 */
  529. text-transform: none;
  530. }
  531. /**
  532. * Correct the inability to style clickable types in iOS and Safari.
  533. */
  534. button,
  535. [type="button"],
  536. [type="reset"],
  537. [type="submit"] {
  538. -webkit-appearance: button;
  539. }
  540. /**
  541. * Remove the inner border and padding in Firefox.
  542. */
  543. button::-moz-focus-inner,
  544. [type="button"]::-moz-focus-inner,
  545. [type="reset"]::-moz-focus-inner,
  546. [type="submit"]::-moz-focus-inner {
  547. border-style: none;
  548. padding: 0;
  549. }
  550. /**
  551. * Restore the focus styles unset by the previous rule.
  552. */
  553. button:-moz-focusring,
  554. [type="button"]:-moz-focusring,
  555. [type="reset"]:-moz-focusring,
  556. [type="submit"]:-moz-focusring {
  557. outline: 1px dotted ButtonText;
  558. }
  559. /**
  560. * Correct the padding in Firefox.
  561. */
  562. fieldset {
  563. padding: 0.35em 0.75em 0.625em;
  564. }
  565. /**
  566. * 1. Correct the text wrapping in Edge and IE.
  567. * 2. Correct the color inheritance from `fieldset` elements in IE.
  568. * 3. Remove the padding so developers are not caught out when they zero out
  569. * `fieldset` elements in all browsers.
  570. */
  571. legend {
  572. box-sizing: border-box; /* 1 */
  573. color: inherit; /* 2 */
  574. display: table; /* 1 */
  575. max-width: 100%; /* 1 */
  576. padding: 0; /* 3 */
  577. white-space: normal; /* 1 */
  578. }
  579. /**
  580. * Add the correct vertical alignment in Chrome, Firefox, and Opera.
  581. */
  582. progress {
  583. vertical-align: baseline;
  584. }
  585. /**
  586. * Remove the default vertical scrollbar in IE 10+.
  587. */
  588. textarea {
  589. overflow: auto;
  590. }
  591. /**
  592. * 1. Add the correct box sizing in IE 10.
  593. * 2. Remove the padding in IE 10.
  594. */
  595. [type="checkbox"],
  596. [type="radio"] {
  597. box-sizing: border-box; /* 1 */
  598. padding: 0; /* 2 */
  599. }
  600. /**
  601. * Correct the cursor style of increment and decrement buttons in Chrome.
  602. */
  603. [type="number"]::-webkit-inner-spin-button,
  604. [type="number"]::-webkit-outer-spin-button {
  605. height: auto;
  606. }
  607. /**
  608. * 1. Correct the odd appearance in Chrome and Safari.
  609. * 2. Correct the outline style in Safari.
  610. */
  611. [type="search"] {
  612. -webkit-appearance: textfield; /* 1 */
  613. outline-offset: -2px; /* 2 */
  614. }
  615. /**
  616. * Remove the inner padding in Chrome and Safari on macOS.
  617. */
  618. [type="search"]::-webkit-search-decoration {
  619. -webkit-appearance: none;
  620. }
  621. /**
  622. * 1. Correct the inability to style clickable types in iOS and Safari.
  623. * 2. Change font properties to `inherit` in Safari.
  624. */
  625. ::-webkit-file-upload-button {
  626. -webkit-appearance: button; /* 1 */
  627. font: inherit; /* 2 */
  628. }
  629. /* Interactive
  630. ========================================================================== */
  631. /*
  632. * Add the correct display in Edge, IE 10+, and Firefox.
  633. */
  634. details {
  635. display: block;
  636. }
  637. /*
  638. * Add the correct display in all browsers.
  639. */
  640. summary {
  641. display: list-item;
  642. }
  643. /* Misc
  644. ========================================================================== */
  645. /**
  646. * Add the correct display in IE 10+.
  647. */
  648. template {
  649. display: none;
  650. }
  651. /**
  652. * Add the correct display in IE 10.
  653. */
  654. [hidden] {
  655. display: none;
  656. }
  657. @font-face {
  658. font-family: "ion";
  659. src: url("../fonts/ion.eot?31a1b735188db616a2142d17947e8a45");
  660. src: url("../fonts/ion.eot?31a1b735188db616a2142d17947e8a45#iefix") format("embedded-opentype"), url("../fonts/ion.woff2?31a1b735188db616a2142d17947e8a45") format("woff2"), url("../fonts/ion.woff?31a1b735188db616a2142d17947e8a45") format("woff"), url("../fonts/ion.ttf?31a1b735188db616a2142d17947e8a45") format("truetype"), url("../fonts/ion.svg?31a1b735188db616a2142d17947e8a45#ion") format("svg");
  661. font-weight: normal;
  662. font-style: normal;
  663. }
  664. .ion-icon {
  665. display: inline-block;
  666. line-height: 1;
  667. font-weight: normal;
  668. font-style: normal;
  669. speak: none;
  670. text-decoration: inherit;
  671. text-transform: none;
  672. text-rendering: auto;
  673. -webkit-font-smoothing: antialiased;
  674. -moz-osx-font-smoothing: grayscale;
  675. }
  676. .ion-icon:before {
  677. font-family: "ion";
  678. }
  679. .ion-navicon-round:before {
  680. content: "\f101";
  681. }
  682. .ion-search:before {
  683. content: "\f102";
  684. }
  685. .ion-play:before {
  686. content: "\f103";
  687. }
  688. .ion-link:before {
  689. content: "\f104";
  690. }
  691. .ion-chevron-up:before {
  692. content: "\f105";
  693. }
  694. .ion-chevron-left:before {
  695. content: "\f106";
  696. }
  697. .ion-chevron-right:before {
  698. content: "\f107";
  699. }
  700. .ion-arrow-down-a:before {
  701. content: "\f108";
  702. }
  703. .ion-arrow-up-a:before {
  704. content: "\f109";
  705. }
  706. .ion-arrow-swap:before {
  707. content: "\f10a";
  708. }
  709. .ion-arrow-dropdown:before {
  710. content: "\f10b";
  711. }
  712. .ion-globe:before {
  713. content: "\f10c";
  714. }
  715. .ion-time:before {
  716. content: "\f10d";
  717. }
  718. .ion-location:before {
  719. content: "\f10e";
  720. }
  721. .ion-warning:before {
  722. content: "\f10f";
  723. }
  724. .ion-error:before {
  725. content: "\f110";
  726. }
  727. .ion-film-outline:before {
  728. content: "\f111";
  729. }
  730. .ion-music-note:before {
  731. content: "\f112";
  732. }
  733. .ion-more-vertical:before {
  734. content: "\f113";
  735. }
  736. .ion-magnet:before {
  737. content: "\f114";
  738. }
  739. .ion-close:before {
  740. content: "\f115";
  741. }
  742. /*
  743. * SearXNG, A privacy-respecting, hackable metasearch engine
  744. *
  745. * To change the colors of the site, simple edit this variables
  746. */
  747. html {
  748. --color-base-font: #444;
  749. --color-base-background: #fff;
  750. --color-url-font: #29314d;
  751. --color-url-visited-font: #80b;
  752. --color-header-background: #f7f7f7;
  753. --color-header-border: #ddd;
  754. --color-footer-background: #f7f7f7;
  755. --color-footer-border: #ddd;
  756. --color-sidebar-border: #ddd;
  757. --color-sidebar-font: #000;
  758. --color-backtotop-border: #ddd;
  759. --color-backtotop-background: #fff;
  760. --color-backtotop-shadow: #ccc;
  761. --color-btn-background: #3050ff;
  762. --color-btn-font: #fff;
  763. --color-search-border: #bbb;
  764. --color-search-background: #fff;
  765. --color-search-font: #222;
  766. --color-search-background-hover: #3050ff;
  767. --color-error: #db3434;
  768. --color-error-background: #fae1e1;
  769. --color-warning: #dbba34;
  770. --color-warning-background: #faf5e1;
  771. --color-success: #42db34;
  772. --color-success-background: #e3fae1;
  773. --color-categories-item-selected-font: #3050ff;
  774. --color-categories-item-border-selected: #3050ff;
  775. --color-autocomplete-font: #000;
  776. --color-autocomplete-border: #bbb;
  777. --color-autocomplete-background: #fff;
  778. --color-autocomplete-background-hover: #f7f7f7;
  779. --color-answer-border: #ddd;
  780. --color-answer-font: #000;
  781. --color-result-shadow: #ccc;
  782. --color-result-border: #ddd;
  783. --color-result-url-font: #000;
  784. --color-result-vim-selected: #f7f7f7;
  785. --color-result-vim-arrow: #000bbb;
  786. --color-result-description-highlight-font: #000;
  787. --color-result-link-font: #000bbb;
  788. --color-result-link-font-highlight: #000bbb;
  789. --color-result-link-visited-font: #80b;
  790. --color-result-publishdate-font: #777;
  791. --color-result-engines-font: #777;
  792. --color-result-search-url-border: #ddd;
  793. --color-result-search-url-font: #000;
  794. --color-result-image-span-background-hover: rgba(0, 0, 0, 0.6);
  795. --color-result-image-span-font: #fff;
  796. --color-result-image-background: #000bbb;
  797. --color-settings-tr-hover: #f7f7f7;
  798. --color-settings-engine-description-font: #909090;
  799. --color-result-detail-font: #fff;
  800. --color-result-detail-label-font: lightgray;
  801. --color-result-detail-background: #000;
  802. --color-result-detail-hr: #333;
  803. --color-result-detail-link: #8af;
  804. --color-result-detail-loader-border: rgba(255, 255, 255, 0.2);
  805. --color-result-detail-loader-borderleft: rgba(0, 0, 0, 0);
  806. --color-toolkit-badge-font: #fff;
  807. --color-toolkit-badge-background: #777;
  808. --color-toolkit-kbd-font: #fff;
  809. --color-toolkit-kbd-background: #000;
  810. --color-toolkit-dialog-border: #ddd;
  811. --color-toolkit-dialog-background: #fff;
  812. --color-toolkit-tabs-label-border: #fff;
  813. --color-toolkit-tabs-section-border: #ddd;
  814. --color-toolkit-select-border: #ddd;
  815. --color-toolkit-checkbox-onoff-background: #ddd;
  816. --color-toolkit-checkbox-onoff-label-shadow: rgba(0, 0, 0, 0.3);
  817. --color-toolkit-checkbox-onoff-label-background: #3050ff;
  818. --color-toolkit-checkbox-onoff-checked-background: #ddd;
  819. --color-toolkit-checkbox-label-background: #fff;
  820. --color-toolkit-checkbox-label-border: #ddd;
  821. --color-toolkit-checkbox-input-border: #3050ff;
  822. --color-toolkit-engine-tooltip-border: #ddd;
  823. --color-toolkit-engine-tooltip-shadow: #ccc;
  824. --color-toolkit-engine-tooltip-background: #fff;
  825. --color-toolkit-loader-border: rgba(0, 0, 0, 0.2);
  826. --color-toolkit-loader-borderleft: rgba(255, 255, 255, 0);
  827. }
  828. @media (prefers-color-scheme: dark) {
  829. html {
  830. --color-base-font: #bbb;
  831. --color-base-background: #222;
  832. --color-url-font: #8af;
  833. --color-url-visited-font: #96b;
  834. --color-header-background: #181818;
  835. --color-header-border: #333;
  836. --color-footer-background: #181818;
  837. --color-footer-border: #333;
  838. --color-sidebar-border: #333;
  839. --color-sidebar-font: #fff;
  840. --color-backtotop-border: #333;
  841. --color-backtotop-background: #181818;
  842. --color-backtotop-shadow: #444;
  843. --color-btn-background: #58f;
  844. --color-btn-font: #fff;
  845. --color-search-border: #444;
  846. --color-search-background: #222;
  847. --color-search-font: #fff;
  848. --color-search-background-hover: #58f;
  849. --color-error: #f55b5b;
  850. --color-error-background: #390a0a;
  851. --color-warning: #f1d561;
  852. --color-warning-background: #39300a;
  853. --color-success: #79f56e;
  854. --color-success-background: #0e390a;
  855. --color-categories-item-selected-font: #58f;
  856. --color-categories-item-border-selected: #58f;
  857. --color-autocomplete-font: #fff;
  858. --color-autocomplete-border: #444;
  859. --color-autocomplete-background: #222;
  860. --color-autocomplete-background-hover: #181818;
  861. --color-answer-border: #ddd;
  862. --color-answer-font: #fff;
  863. --color-result-shadow: #444;
  864. --color-result-border: #333;
  865. --color-result-url-font: #fff;
  866. --color-result-vim-selected: #181818;
  867. --color-result-vim-arrow: #8af;
  868. --color-result-description-highlight-font: #fff;
  869. --color-result-link-font: #8af;
  870. --color-result-link-font-highlight: #8af;
  871. --color-result-link-visited-font: #96b;
  872. --color-result-publishdate-font: #777;
  873. --color-result-engines-font: #777;
  874. --color-result-search-url-border: #333;
  875. --color-result-search-url-font: #fff;
  876. --color-result-detail-font: #fff;
  877. --color-result-detail-label-font: lightgray;
  878. --color-result-detail-background: #000;
  879. --color-result-detail-hr: #333;
  880. --color-result-detail-link: #8af;
  881. --color-result-detail-loader-border: rgba(255, 255, 255, 0.2);
  882. --color-result-detail-loader-borderleft: rgba(0, 0, 0, 0);
  883. --color-result-image-span-background-hover: rgba(0, 0, 0, 0.6);
  884. --color-result-image-span-font: #fff;
  885. --color-result-image-background: #8af;
  886. --color-settings-tr-hover: #333;
  887. --color-settings-engine-description-font: #909090;
  888. --color-toolkit-badge-font: #fff;
  889. --color-toolkit-badge-background: #777;
  890. --color-toolkit-kbd-font: #000;
  891. --color-toolkit-kbd-background: #fff;
  892. --color-toolkit-dialog-border: #333;
  893. --color-toolkit-dialog-background: #222;
  894. --color-toolkit-tabs-label-border: #222;
  895. --color-toolkit-tabs-section-border: #333;
  896. --color-toolkit-select-border: #333;
  897. --color-toolkit-checkbox-onoff-background: #ddd;
  898. --color-toolkit-checkbox-onoff-label-shadow: rgba(0, 0, 0, 0.3);
  899. --color-toolkit-checkbox-onoff-label-background: #58f;
  900. --color-toolkit-checkbox-onoff-checked-background: #ddd;
  901. --color-toolkit-checkbox-label-background: #fff;
  902. --color-toolkit-checkbox-label-border: #333;
  903. --color-toolkit-checkbox-input-border: #58f;
  904. --color-toolkit-engine-tooltip-border: #333;
  905. --color-toolkit-engine-tooltip-shadow: #444;
  906. --color-toolkit-engine-tooltip-background: #222;
  907. --color-toolkit-loader-border: rgba(255, 255, 255, 0.2);
  908. --color-toolkit-loader-borderleft: rgba(0, 0, 0, 0);
  909. }
  910. }
  911. /*
  912. * SearXNG, A privacy-respecting, hackable metasearch engine
  913. */
  914. .code-highlight pre {
  915. overflow: auto;
  916. background-color: inherit;
  917. color: inherit;
  918. border: inherit;
  919. }
  920. /*
  921. this file is generated automatically by searxng_extra/update/update_pygments.py
  922. using pygments version 2.10.0
  923. */
  924. .code-highlight .linenos {
  925. -webkit-touch-callout: none;
  926. -webkit-user-select: none;
  927. -khtml-user-select: none;
  928. -moz-user-select: none;
  929. -ms-user-select: none;
  930. user-select: none;
  931. cursor: default;
  932. margin-right: 8px;
  933. text-align: right;
  934. }
  935. .code-highlight .linenos::selection {
  936. background: transparent;
  937. /* WebKit/Blink Browsers */
  938. }
  939. .code-highlight .linenos::-moz-selection {
  940. background: transparent;
  941. /* Gecko Browsers */
  942. }
  943. .code-highlight pre {
  944. line-height: 125%;
  945. }
  946. .code-highlight td.linenos .normal {
  947. color: inherit;
  948. background-color: transparent;
  949. padding-left: 5px;
  950. padding-right: 5px;
  951. }
  952. .code-highlight span.linenos {
  953. color: inherit;
  954. background-color: transparent;
  955. padding-left: 5px;
  956. padding-right: 5px;
  957. }
  958. .code-highlight td.linenos .special {
  959. color: #000000;
  960. background-color: #ffffc0;
  961. padding-left: 5px;
  962. padding-right: 5px;
  963. }
  964. .code-highlight span.linenos.special {
  965. color: #000000;
  966. background-color: #ffffc0;
  967. padding-left: 5px;
  968. padding-right: 5px;
  969. }
  970. .code-highlight .hll {
  971. background-color: #ffffcc;
  972. }
  973. .code-highlight {
  974. background: #f8f8f8;
  975. }
  976. .code-highlight .c {
  977. color: #408080;
  978. font-style: italic;
  979. }
  980. /* Comment */
  981. .code-highlight .err {
  982. border: 1px solid #FF0000;
  983. }
  984. /* Error */
  985. .code-highlight .k {
  986. color: #008000;
  987. font-weight: bold;
  988. }
  989. /* Keyword */
  990. .code-highlight .o {
  991. color: #666666;
  992. }
  993. /* Operator */
  994. .code-highlight .ch {
  995. color: #408080;
  996. font-style: italic;
  997. }
  998. /* Comment.Hashbang */
  999. .code-highlight .cm {
  1000. color: #408080;
  1001. font-style: italic;
  1002. }
  1003. /* Comment.Multiline */
  1004. .code-highlight .cp {
  1005. color: #BC7A00;
  1006. }
  1007. /* Comment.Preproc */
  1008. .code-highlight .cpf {
  1009. color: #408080;
  1010. font-style: italic;
  1011. }
  1012. /* Comment.PreprocFile */
  1013. .code-highlight .c1 {
  1014. color: #408080;
  1015. font-style: italic;
  1016. }
  1017. /* Comment.Single */
  1018. .code-highlight .cs {
  1019. color: #408080;
  1020. font-style: italic;
  1021. }
  1022. /* Comment.Special */
  1023. .code-highlight .gd {
  1024. color: #A00000;
  1025. }
  1026. /* Generic.Deleted */
  1027. .code-highlight .ge {
  1028. font-style: italic;
  1029. }
  1030. /* Generic.Emph */
  1031. .code-highlight .gr {
  1032. color: #FF0000;
  1033. }
  1034. /* Generic.Error */
  1035. .code-highlight .gh {
  1036. color: #000080;
  1037. font-weight: bold;
  1038. }
  1039. /* Generic.Heading */
  1040. .code-highlight .gi {
  1041. color: #00A000;
  1042. }
  1043. /* Generic.Inserted */
  1044. .code-highlight .go {
  1045. color: #888888;
  1046. }
  1047. /* Generic.Output */
  1048. .code-highlight .gp {
  1049. color: #000080;
  1050. font-weight: bold;
  1051. }
  1052. /* Generic.Prompt */
  1053. .code-highlight .gs {
  1054. font-weight: bold;
  1055. }
  1056. /* Generic.Strong */
  1057. .code-highlight .gu {
  1058. color: #800080;
  1059. font-weight: bold;
  1060. }
  1061. /* Generic.Subheading */
  1062. .code-highlight .gt {
  1063. color: #0044DD;
  1064. }
  1065. /* Generic.Traceback */
  1066. .code-highlight .kc {
  1067. color: #008000;
  1068. font-weight: bold;
  1069. }
  1070. /* Keyword.Constant */
  1071. .code-highlight .kd {
  1072. color: #008000;
  1073. font-weight: bold;
  1074. }
  1075. /* Keyword.Declaration */
  1076. .code-highlight .kn {
  1077. color: #008000;
  1078. font-weight: bold;
  1079. }
  1080. /* Keyword.Namespace */
  1081. .code-highlight .kp {
  1082. color: #008000;
  1083. }
  1084. /* Keyword.Pseudo */
  1085. .code-highlight .kr {
  1086. color: #008000;
  1087. font-weight: bold;
  1088. }
  1089. /* Keyword.Reserved */
  1090. .code-highlight .kt {
  1091. color: #B00040;
  1092. }
  1093. /* Keyword.Type */
  1094. .code-highlight .m {
  1095. color: #666666;
  1096. }
  1097. /* Literal.Number */
  1098. .code-highlight .s {
  1099. color: #BA2121;
  1100. }
  1101. /* Literal.String */
  1102. .code-highlight .na {
  1103. color: #7D9029;
  1104. }
  1105. /* Name.Attribute */
  1106. .code-highlight .nb {
  1107. color: #008000;
  1108. }
  1109. /* Name.Builtin */
  1110. .code-highlight .nc {
  1111. color: #0000FF;
  1112. font-weight: bold;
  1113. }
  1114. /* Name.Class */
  1115. .code-highlight .no {
  1116. color: #880000;
  1117. }
  1118. /* Name.Constant */
  1119. .code-highlight .nd {
  1120. color: #AA22FF;
  1121. }
  1122. /* Name.Decorator */
  1123. .code-highlight .ni {
  1124. color: #999999;
  1125. font-weight: bold;
  1126. }
  1127. /* Name.Entity */
  1128. .code-highlight .ne {
  1129. color: #D2413A;
  1130. font-weight: bold;
  1131. }
  1132. /* Name.Exception */
  1133. .code-highlight .nf {
  1134. color: #0000FF;
  1135. }
  1136. /* Name.Function */
  1137. .code-highlight .nl {
  1138. color: #A0A000;
  1139. }
  1140. /* Name.Label */
  1141. .code-highlight .nn {
  1142. color: #0000FF;
  1143. font-weight: bold;
  1144. }
  1145. /* Name.Namespace */
  1146. .code-highlight .nt {
  1147. color: #008000;
  1148. font-weight: bold;
  1149. }
  1150. /* Name.Tag */
  1151. .code-highlight .nv {
  1152. color: #19177C;
  1153. }
  1154. /* Name.Variable */
  1155. .code-highlight .ow {
  1156. color: #AA22FF;
  1157. font-weight: bold;
  1158. }
  1159. /* Operator.Word */
  1160. .code-highlight .w {
  1161. color: #bbbbbb;
  1162. }
  1163. /* Text.Whitespace */
  1164. .code-highlight .mb {
  1165. color: #666666;
  1166. }
  1167. /* Literal.Number.Bin */
  1168. .code-highlight .mf {
  1169. color: #666666;
  1170. }
  1171. /* Literal.Number.Float */
  1172. .code-highlight .mh {
  1173. color: #666666;
  1174. }
  1175. /* Literal.Number.Hex */
  1176. .code-highlight .mi {
  1177. color: #666666;
  1178. }
  1179. /* Literal.Number.Integer */
  1180. .code-highlight .mo {
  1181. color: #666666;
  1182. }
  1183. /* Literal.Number.Oct */
  1184. .code-highlight .sa {
  1185. color: #BA2121;
  1186. }
  1187. /* Literal.String.Affix */
  1188. .code-highlight .sb {
  1189. color: #BA2121;
  1190. }
  1191. /* Literal.String.Backtick */
  1192. .code-highlight .sc {
  1193. color: #BA2121;
  1194. }
  1195. /* Literal.String.Char */
  1196. .code-highlight .dl {
  1197. color: #BA2121;
  1198. }
  1199. /* Literal.String.Delimiter */
  1200. .code-highlight .sd {
  1201. color: #BA2121;
  1202. font-style: italic;
  1203. }
  1204. /* Literal.String.Doc */
  1205. .code-highlight .s2 {
  1206. color: #BA2121;
  1207. }
  1208. /* Literal.String.Double */
  1209. .code-highlight .se {
  1210. color: #BB6622;
  1211. font-weight: bold;
  1212. }
  1213. /* Literal.String.Escape */
  1214. .code-highlight .sh {
  1215. color: #BA2121;
  1216. }
  1217. /* Literal.String.Heredoc */
  1218. .code-highlight .si {
  1219. color: #BB6688;
  1220. font-weight: bold;
  1221. }
  1222. /* Literal.String.Interpol */
  1223. .code-highlight .sx {
  1224. color: #008000;
  1225. }
  1226. /* Literal.String.Other */
  1227. .code-highlight .sr {
  1228. color: #BB6688;
  1229. }
  1230. /* Literal.String.Regex */
  1231. .code-highlight .s1 {
  1232. color: #BA2121;
  1233. }
  1234. /* Literal.String.Single */
  1235. .code-highlight .ss {
  1236. color: #19177C;
  1237. }
  1238. /* Literal.String.Symbol */
  1239. .code-highlight .bp {
  1240. color: #008000;
  1241. }
  1242. /* Name.Builtin.Pseudo */
  1243. .code-highlight .fm {
  1244. color: #0000FF;
  1245. }
  1246. /* Name.Function.Magic */
  1247. .code-highlight .vc {
  1248. color: #19177C;
  1249. }
  1250. /* Name.Variable.Class */
  1251. .code-highlight .vg {
  1252. color: #19177C;
  1253. }
  1254. /* Name.Variable.Global */
  1255. .code-highlight .vi {
  1256. color: #19177C;
  1257. }
  1258. /* Name.Variable.Instance */
  1259. .code-highlight .vm {
  1260. color: #19177C;
  1261. }
  1262. /* Name.Variable.Magic */
  1263. .code-highlight .il {
  1264. color: #666666;
  1265. }
  1266. /* Literal.Number.Integer.Long */
  1267. html.no-js .hide_if_nojs {
  1268. display: none;
  1269. }
  1270. html.js .show_if_nojs {
  1271. display: none;
  1272. }
  1273. .center {
  1274. text-align: center;
  1275. }
  1276. .right {
  1277. float: right;
  1278. }
  1279. .left {
  1280. float: left;
  1281. }
  1282. .invisible {
  1283. display: none !important;
  1284. }
  1285. .list-unstyled {
  1286. list-style-type: none;
  1287. }
  1288. .list-unstyled li {
  1289. margin-top: 4px;
  1290. margin-bottom: 4px;
  1291. }
  1292. .danger {
  1293. background-color: var(--color-error-background);
  1294. }
  1295. .warning {
  1296. background: var(--color-warning-background);
  1297. }
  1298. .success {
  1299. background: var(--color-success-background);
  1300. }
  1301. .badge {
  1302. display: inline-block;
  1303. color: var(--color-toolkit-badge-font);
  1304. background-color: var(--color-toolkit-badge-background);
  1305. text-align: center;
  1306. white-space: nowrap;
  1307. vertical-align: baseline;
  1308. min-width: 10px;
  1309. padding: 1px 5px;
  1310. border-radius: 5px;
  1311. }
  1312. kbd {
  1313. padding: 2px 4px;
  1314. margin: 1px;
  1315. font-size: 90%;
  1316. color: var(--color-toolkit-kbd-font);
  1317. background: var(--color-toolkit-kbd-background);
  1318. }
  1319. table {
  1320. width: 100%;
  1321. }
  1322. table.striped tr {
  1323. border-bottom: 1px solid var(--color-settings-tr-hover);
  1324. }
  1325. th {
  1326. padding: 0.4em;
  1327. }
  1328. td {
  1329. padding: 0 4px;
  1330. }
  1331. tr:hover {
  1332. background: var(--color-settings-tr-hover);
  1333. }
  1334. div.selectable_url {
  1335. display: block;
  1336. border: 1px solid var(--color-result-search-url-border);
  1337. padding: 4px;
  1338. color: var(--color-result-search-url-font);
  1339. margin: 0.1em;
  1340. overflow: hidden;
  1341. height: 1.2em;
  1342. line-height: 1.2em;
  1343. }
  1344. div.selectable_url pre {
  1345. display: block;
  1346. font-size: 0.8em;
  1347. word-break: break-all;
  1348. margin: 0.1em;
  1349. -webkit-user-select: all;
  1350. -moz-user-select: all;
  1351. -ms-user-select: element;
  1352. user-select: all;
  1353. }
  1354. .dialog-error {
  1355. position: relative;
  1356. padding: 1em 1em 1em 2.7em;
  1357. margin: 0 0 1em 0;
  1358. border: 1px solid var(--color-toolkit-dialog-border);
  1359. text-align: left;
  1360. -webkit-border-radius: 10px;
  1361. -moz-border-radius: 10px;
  1362. border-radius: 10px;
  1363. color: var(--color-error);
  1364. background: var(--color-error-background);
  1365. border-color: var(--color-error);
  1366. }
  1367. .dialog-error::before {
  1368. position: absolute;
  1369. top: 0.5em;
  1370. left: 0.5em;
  1371. font-family: "ion";
  1372. font-size: 1.5em;
  1373. }
  1374. .dialog-error .close {
  1375. float: right;
  1376. position: relative;
  1377. top: -3px;
  1378. color: inherit;
  1379. font-size: 1.5em;
  1380. }
  1381. .dialog-error ul,
  1382. .dialog-error ol,
  1383. .dialog-error p {
  1384. margin: 1px 0 0 0;
  1385. }
  1386. .dialog-error table {
  1387. width: auto;
  1388. }
  1389. .dialog-error tr {
  1390. vertical-align: text-top;
  1391. }
  1392. .dialog-error tr:hover {
  1393. background: transparent;
  1394. }
  1395. .dialog-error td {
  1396. padding: 0 1em 0 0;
  1397. }
  1398. .dialog-error h4 {
  1399. margin-top: 0.3em;
  1400. margin-bottom: 0.3em;
  1401. }
  1402. .dialog-error:before {
  1403. content: "\f110";
  1404. }
  1405. .dialog-warning {
  1406. position: relative;
  1407. padding: 1em 1em 1em 2.7em;
  1408. margin: 0 0 1em 0;
  1409. border: 1px solid var(--color-toolkit-dialog-border);
  1410. text-align: left;
  1411. -webkit-border-radius: 10px;
  1412. -moz-border-radius: 10px;
  1413. border-radius: 10px;
  1414. color: var(--color-warning);
  1415. background: var(--color-warning-background);
  1416. border-color: var(--color-warning);
  1417. }
  1418. .dialog-warning::before {
  1419. position: absolute;
  1420. top: 0.5em;
  1421. left: 0.5em;
  1422. font-family: "ion";
  1423. font-size: 1.5em;
  1424. }
  1425. .dialog-warning .close {
  1426. float: right;
  1427. position: relative;
  1428. top: -3px;
  1429. color: inherit;
  1430. font-size: 1.5em;
  1431. }
  1432. .dialog-warning ul,
  1433. .dialog-warning ol,
  1434. .dialog-warning p {
  1435. margin: 1px 0 0 0;
  1436. }
  1437. .dialog-warning table {
  1438. width: auto;
  1439. }
  1440. .dialog-warning tr {
  1441. vertical-align: text-top;
  1442. }
  1443. .dialog-warning tr:hover {
  1444. background: transparent;
  1445. }
  1446. .dialog-warning td {
  1447. padding: 0 1em 0 0;
  1448. }
  1449. .dialog-warning h4 {
  1450. margin-top: 0.3em;
  1451. margin-bottom: 0.3em;
  1452. }
  1453. .dialog-warning:before {
  1454. content: "\f10f";
  1455. }
  1456. .dialog-modal {
  1457. position: relative;
  1458. padding: 1em 1em 1em 2.7em;
  1459. margin: 0 0 1em 0;
  1460. border: 1px solid var(--color-toolkit-dialog-border);
  1461. text-align: left;
  1462. -webkit-border-radius: 10px;
  1463. -moz-border-radius: 10px;
  1464. border-radius: 10px;
  1465. background: var(--color-toolkit-dialog-background);
  1466. position: fixed;
  1467. top: 50%;
  1468. left: 50%;
  1469. /* bring your own prefixes */
  1470. transform: translate(-50%, -50%);
  1471. z-index: 100000;
  1472. margin: 0 50% 0 0;
  1473. box-shadow: 0 0 1em;
  1474. }
  1475. .dialog-modal::before {
  1476. position: absolute;
  1477. top: 0.5em;
  1478. left: 0.5em;
  1479. font-family: "ion";
  1480. font-size: 1.5em;
  1481. }
  1482. .dialog-modal .close {
  1483. float: right;
  1484. position: relative;
  1485. top: -3px;
  1486. color: inherit;
  1487. font-size: 1.5em;
  1488. }
  1489. .dialog-modal ul,
  1490. .dialog-modal ol,
  1491. .dialog-modal p {
  1492. margin: 1px 0 0 0;
  1493. }
  1494. .dialog-modal table {
  1495. width: auto;
  1496. }
  1497. .dialog-modal tr {
  1498. vertical-align: text-top;
  1499. }
  1500. .dialog-modal tr:hover {
  1501. background: transparent;
  1502. }
  1503. .dialog-modal td {
  1504. padding: 0 1em 0 0;
  1505. }
  1506. .dialog-modal h4 {
  1507. margin-top: 0.3em;
  1508. margin-bottom: 0.3em;
  1509. }
  1510. .btn-collapse {
  1511. cursor: pointer;
  1512. }
  1513. .scrollx {
  1514. overflow-x: auto;
  1515. overflow-y: hidden;
  1516. display: block;
  1517. padding: 0;
  1518. margin: 0;
  1519. border: none;
  1520. }
  1521. /* -- tabs -- */
  1522. .tabs .tabs > label {
  1523. font-size: 90%;
  1524. }
  1525. .tabs {
  1526. display: -webkit-box;
  1527. display: -moz-box;
  1528. display: -webkit-flex;
  1529. display: -ms-flexbox;
  1530. display: flex;
  1531. flex-wrap: wrap;
  1532. width: 100%;
  1533. min-width: 100%;
  1534. }
  1535. .tabs > * {
  1536. order: 2;
  1537. }
  1538. .tabs > input[type=radio] {
  1539. display: none;
  1540. }
  1541. .tabs > label {
  1542. order: 1;
  1543. padding: 0.7em;
  1544. margin: 0 0.7em;
  1545. letter-spacing: 0.5px;
  1546. text-transform: uppercase;
  1547. border: solid var(--color-toolkit-tabs-label-border);
  1548. border-width: 0 0 2px 0;
  1549. -webkit-touch-callout: none;
  1550. -webkit-user-select: none;
  1551. -khtml-user-select: none;
  1552. -moz-user-select: none;
  1553. -ms-user-select: none;
  1554. user-select: none;
  1555. cursor: pointer;
  1556. }
  1557. .tabs > label:hover {
  1558. border-bottom: 2px solid var(--color-categories-item-border-selected);
  1559. }
  1560. .tabs > section {
  1561. min-width: 100%;
  1562. padding: 0.7rem 0;
  1563. box-sizing: border-box;
  1564. border-top: 1px solid var(--color-toolkit-tabs-section-border);
  1565. display: none;
  1566. }
  1567. .tabs > label:last-of-type {
  1568. border-bottom: 2px solid var(--color-categories-item-border-selected);
  1569. background: var(--color-categories-item-selected);
  1570. color: var(--color-categories-item-selected-font);
  1571. font-weight: bold;
  1572. letter-spacing: -0.1px;
  1573. }
  1574. .tabs > section:last-of-type {
  1575. display: block;
  1576. }
  1577. html body .tabs > input:checked ~ section {
  1578. display: none;
  1579. }
  1580. html body .tabs > input:checked ~ label {
  1581. position: inherited;
  1582. background: inherit;
  1583. border-bottom: 2px solid transparent;
  1584. font-weight: normal;
  1585. color: inherit;
  1586. }
  1587. html body .tabs > input:checked ~ label:hover {
  1588. border-bottom: 2px solid var(--color-categories-item-border-selected);
  1589. }
  1590. html body .tabs > input:checked + label {
  1591. border-bottom: 2px solid var(--color-categories-item-border-selected);
  1592. background: var(--color-categories-item-selected);
  1593. color: var(--color-categories-item-selected-font);
  1594. }
  1595. html body .tabs > input:checked + label + section {
  1596. display: block;
  1597. }
  1598. /* -- select -- */
  1599. select {
  1600. height: 28px;
  1601. margin: 0 1em 0 0;
  1602. padding: 2px 8px 2px 0 !important;
  1603. color: var(--color-search-font);
  1604. font-size: 12px;
  1605. z-index: 2;
  1606. }
  1607. select:hover,
  1608. select:focus {
  1609. cursor: pointer;
  1610. }
  1611. @supports ((background-position-x: 100%) and ((appearance: none) or (-webkit-appearance: none) or (-moz-appearance: none))) {
  1612. select {
  1613. appearance: none;
  1614. -webkit-appearance: none;
  1615. -moz-appearance: none;
  1616. border: none;
  1617. border-bottom: 1px solid var(--color-toolkit-select-border);
  1618. background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI1MTJweCIgaGVpZ2h0PSI1MTJweCIgdmlld0JveD0iMCAwIDUxMiA1MTIiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDUxMiA1MTIiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxnPjxwb2x5Z29uIHBvaW50cz0iMTI4LDE5MiAyNTYsMzIwIDM4NCwxOTIiLz48L2c+PC9zdmc+Cg==) no-repeat;
  1619. background-position-x: 105%;
  1620. background-size: 2em;
  1621. background-origin: content-box;
  1622. outline: medium none;
  1623. }
  1624. select:hover,
  1625. select:focus {
  1626. border-bottom: 1px solid var(--color-search-border);
  1627. }
  1628. }
  1629. /* -- checkbox-onoff -- */
  1630. @supports (border-radius: 50px) {
  1631. .checkbox-onoff {
  1632. display: inline-block;
  1633. width: 40px;
  1634. height: 10px;
  1635. background: var(--color-toolkit-checkbox-onoff-background);
  1636. margin: 8px 1rem;
  1637. position: relative;
  1638. border-radius: 50px;
  1639. }
  1640. .checkbox-onoff label {
  1641. display: block;
  1642. width: 20px;
  1643. height: 20px;
  1644. position: absolute;
  1645. top: -5px;
  1646. cursor: pointer;
  1647. border-radius: 50px;
  1648. box-shadow: 0 3px 5px 0 var(--color-toolkit-checkbox-onoff-label-shadow);
  1649. transition: all 0.4s ease;
  1650. left: 27px;
  1651. background-color: var(--color-toolkit-checkbox-onoff-label-background);
  1652. }
  1653. .checkbox-onoff input[type=checkbox] {
  1654. visibility: hidden;
  1655. }
  1656. .checkbox-onoff input[type=checkbox]:checked + label {
  1657. left: -5px;
  1658. background: var(--color-toolkit-checkbox-onoff-checked-background);
  1659. }
  1660. }
  1661. /* -- checkbox -- */
  1662. @supports (transform: rotate(-45deg)) {
  1663. .checkbox {
  1664. width: 20px;
  1665. position: relative;
  1666. margin: 20px auto;
  1667. }
  1668. .checkbox label {
  1669. width: 20px;
  1670. height: 20px;
  1671. cursor: pointer;
  1672. position: absolute;
  1673. top: 0;
  1674. left: 0;
  1675. background: var(--color-toolkit-checkbox-label-background);
  1676. -webkit-border-radius: 10px;
  1677. -moz-border-radius: 10px;
  1678. border-radius: 10px;
  1679. }
  1680. .checkbox label::after {
  1681. content: '';
  1682. width: 9px;
  1683. height: 5px;
  1684. position: absolute;
  1685. top: 4px;
  1686. left: 4px;
  1687. border: 3px solid var(--color-toolkit-checkbox-label-border);
  1688. border-top: none;
  1689. border-right: none;
  1690. background: transparent;
  1691. opacity: 0;
  1692. transform: rotate(-45deg);
  1693. }
  1694. .checkbox input[type=checkbox] {
  1695. visibility: hidden;
  1696. }
  1697. .checkbox input[type=checkbox]:checked + label::after {
  1698. border-color: var(--color-toolkit-checkbox-input-border);
  1699. opacity: 1;
  1700. }
  1701. .checkbox input[disabled] + label {
  1702. background-color: transparent !important;
  1703. box-shadow: none !important;
  1704. cursor: inherit;
  1705. }
  1706. .checkbox input:not(:checked):not([readonly]):not([disabled]) + label:hover::after {
  1707. opacity: 0.5;
  1708. }
  1709. }
  1710. @media screen and (max-width: 50em) {
  1711. .tabs > label {
  1712. width: 100%;
  1713. }
  1714. }
  1715. /* -- loader -- */
  1716. .loader,
  1717. .loader::after {
  1718. border-radius: 50%;
  1719. width: 2em;
  1720. height: 2em;
  1721. }
  1722. .loader {
  1723. margin: 1em auto;
  1724. font-size: 10px;
  1725. position: relative;
  1726. text-indent: -9999em;
  1727. border-top: 0.5em solid var(--color-toolkit-loader-border);
  1728. border-right: 0.5em solid var(--color-toolkit-loader-border);
  1729. border-bottom: 0.5em solid var(--color-toolkit-loader-border);
  1730. border-left: 0.5em solid var(--color-toolkit-loader-borderleft);
  1731. -webkit-transform: translateZ(0);
  1732. -ms-transform: translateZ(0);
  1733. transform: translateZ(0);
  1734. -webkit-animation: load8 1.2s infinite linear;
  1735. animation: load8 1.2s infinite linear;
  1736. }
  1737. @-webkit-keyframes load8 {
  1738. 0% {
  1739. -webkit-transform: rotate(0deg);
  1740. transform: rotate(0deg);
  1741. }
  1742. 100% {
  1743. -webkit-transform: rotate(360deg);
  1744. transform: rotate(360deg);
  1745. }
  1746. }
  1747. @keyframes load8 {
  1748. 0% {
  1749. -webkit-transform: rotate(0deg);
  1750. transform: rotate(0deg);
  1751. }
  1752. 100% {
  1753. -webkit-transform: rotate(360deg);
  1754. transform: rotate(360deg);
  1755. }
  1756. }
  1757. /* -- engine-tooltip -- */
  1758. .engine-tooltip {
  1759. display: none;
  1760. position: absolute;
  1761. padding: 0.5rem 1rem;
  1762. margin: 0 0 0 2rem;
  1763. border: 1px solid var(--color-toolkit-engine-tooltip-border);
  1764. box-shadow: 0 0 5px var(--color-toolkit-engine-tooltip-shadow);
  1765. background: var(--color-toolkit-engine-tooltip-background);
  1766. font-size: 14px;
  1767. font-weight: normal;
  1768. z-index: 1000000;
  1769. text-align: left;
  1770. -webkit-border-radius: 10px;
  1771. -moz-border-radius: 10px;
  1772. border-radius: 10px;
  1773. }
  1774. th:hover .engine-tooltip,
  1775. td:hover .engine-tooltip,
  1776. .engine-tooltip:hover {
  1777. display: inline-block;
  1778. }
  1779. /* -- stacked bar chart -- */
  1780. .stacked-bar-chart {
  1781. margin: 0;
  1782. padding: 0 0.125rem 0 4rem;
  1783. width: 100%;
  1784. width: -moz-available;
  1785. width: -webkit-fill-available;
  1786. width: fill;
  1787. flex-direction: row;
  1788. flex-wrap: nowrap;
  1789. align-items: center;
  1790. display: inline-flex;
  1791. }
  1792. .stacked-bar-chart-value {
  1793. width: 3rem;
  1794. display: inline-block;
  1795. position: absolute;
  1796. padding: 0 0.5rem;
  1797. text-align: right;
  1798. }
  1799. .stacked-bar-chart-base {
  1800. display: flex;
  1801. flex-shrink: 0;
  1802. flex-grow: 0;
  1803. flex-basis: unset;
  1804. }
  1805. .stacked-bar-chart-median {
  1806. display: flex;
  1807. flex-shrink: 0;
  1808. flex-grow: 0;
  1809. flex-basis: unset;
  1810. background: #000000;
  1811. border: 1px solid rgba(0, 0, 0, 0.9);
  1812. padding: 0.3rem 0;
  1813. }
  1814. .stacked-bar-chart-rate80 {
  1815. display: flex;
  1816. flex-shrink: 0;
  1817. flex-grow: 0;
  1818. flex-basis: unset;
  1819. background: transparent;
  1820. border: 1px solid rgba(0, 0, 0, 0.3);
  1821. padding: 0.3rem 0;
  1822. }
  1823. .stacked-bar-chart-rate95 {
  1824. display: flex;
  1825. flex-shrink: 0;
  1826. flex-grow: 0;
  1827. flex-basis: unset;
  1828. background: transparent;
  1829. border-bottom: 1px dotted rgba(0, 0, 0, 0.5);
  1830. padding: 0;
  1831. }
  1832. .stacked-bar-chart-rate100 {
  1833. display: flex;
  1834. flex-shrink: 0;
  1835. flex-grow: 0;
  1836. flex-basis: unset;
  1837. background: transparent;
  1838. border-left: 1px solid rgba(0, 0, 0, 0.9);
  1839. padding: 0.4rem 0;
  1840. width: 1px;
  1841. }
  1842. /*! Autocomplete.js v2.6.3 | license MIT | (c) 2017, Baptiste Donaux | http://autocomplete-js.com */
  1843. .autocomplete {
  1844. position: absolute;
  1845. max-height: 0;
  1846. overflow-y: hidden;
  1847. text-align: left;
  1848. -webkit-border-radius: 10px;
  1849. -moz-border-radius: 10px;
  1850. border-radius: 10px;
  1851. }
  1852. .autocomplete:active,
  1853. .autocomplete:focus,
  1854. .autocomplete:hover {
  1855. background-color: var(--color-autocomplete-background);
  1856. }
  1857. .autocomplete:empty {
  1858. display: none;
  1859. }
  1860. .autocomplete > ul {
  1861. list-style-type: none;
  1862. margin: 0;
  1863. padding: 0;
  1864. }
  1865. .autocomplete > ul > li {
  1866. cursor: pointer;
  1867. padding: 8px 0 8px 8px;
  1868. }
  1869. .autocomplete > ul > li.active,
  1870. .autocomplete > ul > li:active,
  1871. .autocomplete > ul > li:focus,
  1872. .autocomplete > ul > li:hover {
  1873. background-color: var(--color-autocomplete-background-hover);
  1874. }
  1875. .autocomplete > ul > li.active a:active,
  1876. .autocomplete > ul > li:active a:active,
  1877. .autocomplete > ul > li:focus a:active,
  1878. .autocomplete > ul > li:hover a:active,
  1879. .autocomplete > ul > li.active a:focus,
  1880. .autocomplete > ul > li:active a:focus,
  1881. .autocomplete > ul > li:focus a:focus,
  1882. .autocomplete > ul > li:hover a:focus,
  1883. .autocomplete > ul > li.active a:hover,
  1884. .autocomplete > ul > li:active a:hover,
  1885. .autocomplete > ul > li:focus a:hover,
  1886. .autocomplete > ul > li:hover a:hover {
  1887. text-decoration: none;
  1888. }
  1889. .autocomplete > ul > li.locked {
  1890. cursor: inherit;
  1891. }
  1892. .autocomplete.open {
  1893. display: block;
  1894. background-color: var(--color-autocomplete-background);
  1895. color: var(--color-autocomplete-font);
  1896. border: 1px solid var(--color-autocomplete-border);
  1897. max-height: 500px;
  1898. overflow-y: auto;
  1899. z-index: 100;
  1900. }
  1901. .autocomplete.open:empty {
  1902. display: none;
  1903. }
  1904. @media screen and (max-width: 50em) {
  1905. .autocomplete {
  1906. bottom: 0;
  1907. }
  1908. .autocomplete > ul > li {
  1909. border-bottom: 1px solid var(--color-result-top-border);
  1910. text-align: left;
  1911. }
  1912. }
  1913. #main_results #results.image-detail-open.only_template_images {
  1914. width: 59.25rem !important;
  1915. }
  1916. #main_results #results.only_template_images.image-detail-open #backToTop {
  1917. left: 56.75rem !important;
  1918. right: inherit;
  1919. }
  1920. article.result-images .detail {
  1921. display: none;
  1922. }
  1923. #results.image-detail-open article.result-images[data-vim-selected] .detail {
  1924. display: flex;
  1925. flex-direction: column;
  1926. position: fixed;
  1927. left: 60rem;
  1928. right: 0;
  1929. top: 7.5rem;
  1930. bottom: 0;
  1931. background: var(--color-result-detail-background);
  1932. border: 1px solid var(--color-result-detail-background);
  1933. z-index: 10000;
  1934. padding: 4rem 3rem 3rem 3rem;
  1935. }
  1936. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-images-source {
  1937. display: block;
  1938. flex: 1;
  1939. text-align: left;
  1940. width: 100%;
  1941. border: none;
  1942. text-decoration: none;
  1943. }
  1944. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-images-source img {
  1945. padding: 0;
  1946. margin: 0;
  1947. border: none;
  1948. object-fit: contain;
  1949. width: inherit;
  1950. max-width: 100%;
  1951. min-height: inherit;
  1952. max-height: calc(100vh - 25rem - 7rem);
  1953. background: inherit;
  1954. }
  1955. #results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels {
  1956. color: var(--color-result-detail-font);
  1957. max-height: 16rem;
  1958. min-height: 16rem;
  1959. }
  1960. #results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels hr {
  1961. border-top: 1px solid var(--color-result-detail-hr);
  1962. border-bottom: none;
  1963. }
  1964. #results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels h4 {
  1965. height: 2rem;
  1966. overflow: hidden;
  1967. text-overflow: ellipsis;
  1968. font-size: 0.9rem;
  1969. }
  1970. #results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels p {
  1971. color: var(--color-result-detail-label-font);
  1972. font-size: 0.9rem;
  1973. }
  1974. #results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels p span {
  1975. display: inline-block;
  1976. width: 12rem;
  1977. }
  1978. #results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels h4,
  1979. #results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels p,
  1980. #results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels a {
  1981. text-align: left;
  1982. }
  1983. #results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels p.result-content {
  1984. height: 2rem;
  1985. overflow: hidden;
  1986. text-overflow: ellipsis;
  1987. }
  1988. #results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels p.result-url {
  1989. white-space: nowrap;
  1990. overflow-x: hidden;
  1991. text-overflow: ellipsis;
  1992. }
  1993. #results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels p.result-content:hover,
  1994. #results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels p.result-url:hover {
  1995. position: relative;
  1996. overflow: inherit !important;
  1997. background: var(--color-result-detail-background);
  1998. text-overflow: inherit !important;
  1999. }
  2000. #results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels a,
  2001. #results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels a:visited,
  2002. #results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels a:hover,
  2003. #results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels a:active {
  2004. color: var(--color-result-detail-link);
  2005. }
  2006. #results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels a:hover {
  2007. text-decoration: underline;
  2008. }
  2009. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-close {
  2010. top: 1rem;
  2011. left: 1rem;
  2012. padding: 0.4rem;
  2013. }
  2014. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-previous {
  2015. top: 1rem;
  2016. right: 6rem;
  2017. padding: 0.4rem 0.5rem 0.4rem 0.3rem;
  2018. }
  2019. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-next {
  2020. top: 1rem;
  2021. right: 2rem;
  2022. padding: 0.4rem;
  2023. }
  2024. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-close,
  2025. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-next,
  2026. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-previous {
  2027. border-radius: 50%;
  2028. display: block;
  2029. width: 1.5rem;
  2030. height: 1.5rem;
  2031. position: absolute;
  2032. filter: opacity(40%);
  2033. z-index: 2000002;
  2034. }
  2035. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-close span,
  2036. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-next span,
  2037. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-previous span {
  2038. display: block;
  2039. width: 1.5rem;
  2040. height: 1.5rem;
  2041. text-align: center;
  2042. }
  2043. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-next span::before,
  2044. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-previous span::before {
  2045. vertical-align: sub;
  2046. }
  2047. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-close,
  2048. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-close:visited,
  2049. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-close:hover,
  2050. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-close:active,
  2051. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-previous,
  2052. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-previous:visited,
  2053. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-previous:hover,
  2054. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-previous:active,
  2055. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-next,
  2056. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-next:visited,
  2057. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-next:hover,
  2058. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-next:active {
  2059. color: var(--color-result-detail-font);
  2060. background: var(--color-result-detail-background);
  2061. border: 1px solid var(--color-result-detail-font);
  2062. }
  2063. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-close:focus,
  2064. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-close:hover,
  2065. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-previous:focus,
  2066. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-previous:hover,
  2067. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-next:focus,
  2068. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-next:hover {
  2069. filter: opacity(80%);
  2070. }
  2071. #results.image-detail-open article.result-images[data-vim-selected] .detail .loader {
  2072. position: absolute;
  2073. top: 1rem;
  2074. right: 50%;
  2075. border-top: 0.5em solid var(--color-result-detail-loader-border);
  2076. border-right: 0.5em solid var(--color-result-detail-loader-border);
  2077. border-bottom: 0.5em solid var(--color-result-detail-loader-border);
  2078. border-left: 0.5em solid var(--color-result-detail-loader-borderleft);
  2079. }
  2080. #results.image-detail-open.scrolling article.result-images[data-vim-selected] .detail {
  2081. top: 0;
  2082. }
  2083. #results.image-detail-open.scrolling article.result-images[data-vim-selected] .detail a.result-images-source img {
  2084. max-height: calc(100vh - 25rem);
  2085. }
  2086. @media screen and (max-width: 80em) {
  2087. #results.image-detail-open article.result-images[data-vim-selected] .detail {
  2088. top: 0;
  2089. left: 0;
  2090. }
  2091. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-images-source {
  2092. display: flex;
  2093. flex-direction: column;
  2094. justify-content: center;
  2095. }
  2096. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-images-source img {
  2097. width: 100%;
  2098. max-height: calc(100vh - 24rem);
  2099. }
  2100. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-detail-next {
  2101. right: 1rem;
  2102. }
  2103. }
  2104. @media screen and (max-width: 50em) {
  2105. #results.image-detail-open article.result-images[data-vim-selected] .detail {
  2106. top: 0;
  2107. left: 0;
  2108. padding: 1rem;
  2109. }
  2110. #results.image-detail-open article.result-images[data-vim-selected] .detail a.result-images-source img {
  2111. width: 100%;
  2112. max-height: calc(100vh - 20rem);
  2113. margin: 0;
  2114. }
  2115. #results.image-detail-open article.result-images[data-vim-selected] .detail .result-images-labels p span {
  2116. width: inherit;
  2117. margin-right: 1rem;
  2118. }
  2119. }
  2120. #main_index {
  2121. margin-top: 24vh;
  2122. }
  2123. #main_index #linkto_preferences {
  2124. right: 1.8rem;
  2125. }
  2126. .index {
  2127. text-align: center;
  2128. }
  2129. .index .title {
  2130. background: url('../img/searx.png') no-repeat;
  2131. width: 100%;
  2132. min-height: 80px;
  2133. background-position: center;
  2134. }
  2135. .index h1 {
  2136. font-size: 5em;
  2137. visibility: hidden;
  2138. }
  2139. .index #search {
  2140. margin: 0 auto;
  2141. background: inherit;
  2142. border: inherit;
  2143. padding: 0;
  2144. display: block;
  2145. }
  2146. .index .search_filters {
  2147. display: block;
  2148. margin: 1em 0;
  2149. }
  2150. .index .category label {
  2151. padding: 6px 10px;
  2152. border-bottom: initial !important;
  2153. }
  2154. @media screen and (max-width: 80em) {
  2155. div.title h1 {
  2156. font-size: 1em;
  2157. }
  2158. #main_index {
  2159. margin-top: 6em;
  2160. }
  2161. }
  2162. @media screen and (max-width: 50em) {
  2163. #main_index {
  2164. margin-top: 0;
  2165. }
  2166. }
  2167. #tab-contentquery table td,
  2168. #tab-contentquery table th {
  2169. text-align: left !important;
  2170. height: 3rem;
  2171. }
  2172. #main_preferences form {
  2173. width: 100%;
  2174. }
  2175. #main_preferences fieldset {
  2176. margin: 8px;
  2177. border: none;
  2178. }
  2179. #main_preferences legend {
  2180. margin: 0;
  2181. padding: 5px 0 0 0;
  2182. display: block;
  2183. float: left;
  2184. width: 300px;
  2185. }
  2186. #main_preferences .value {
  2187. margin: 0;
  2188. padding: 0;
  2189. float: left;
  2190. width: 15em;
  2191. }
  2192. #main_preferences .description {
  2193. margin: 0;
  2194. padding: 5px 0 0 0;
  2195. float: left;
  2196. width: 50%;
  2197. color: var(--color-settings-engine-description-font);
  2198. font-size: 90%;
  2199. }
  2200. #main_preferences select {
  2201. width: 200px;
  2202. font-size: inherit !important;
  2203. }
  2204. #main_preferences table {
  2205. border-collapse: collapse;
  2206. }
  2207. #main_preferences table td {
  2208. text-align: center;
  2209. }
  2210. #main_preferences table.cookies {
  2211. width: auto;
  2212. }
  2213. #main_preferences table.cookies th,
  2214. #main_preferences table.cookies td {
  2215. text-align: left;
  2216. padding: 0.25em;
  2217. }
  2218. #main_preferences table.cookies th:first-child,
  2219. #main_preferences table.cookies td:first-child {
  2220. padding-right: 4em;
  2221. }
  2222. #main_preferences table.cookies > tbody > tr:nth-child(even) > th,
  2223. #main_preferences table.cookies > tbody > tr:nth-child(even) > td {
  2224. background-color: var(--color-settings-tr-hover);
  2225. }
  2226. #main_preferences .name,
  2227. #main_preferences .shortcut {
  2228. text-align: left;
  2229. }
  2230. #main_preferences .preferences_back {
  2231. background: none repeat scroll 0 0 var(--color-btn-background);
  2232. color: var(--color-btn-font);
  2233. border: 0 none;
  2234. -webkit-border-radius: 10px;
  2235. -moz-border-radius: 10px;
  2236. border-radius: 10px;
  2237. cursor: pointer;
  2238. display: inline-block;
  2239. margin: 2px 4px;
  2240. padding: 0.7em;
  2241. }
  2242. #main_preferences .preferences_back a {
  2243. display: block;
  2244. color: var(--color-settings-return-font);
  2245. }
  2246. #main_preferences .preferences_back a::first-letter {
  2247. text-transform: uppercase;
  2248. }
  2249. #main_preferences div.selectable_url pre {
  2250. width: 100%;
  2251. }
  2252. #main_preferences th.name .engine-tooltip {
  2253. margin-top: 1.8rem;
  2254. left: calc((100% - 85em) / 2 + 10em);
  2255. max-width: 40rem;
  2256. }
  2257. #main_preferences th.name .engine-tooltip .engine-description {
  2258. margin-top: 0.5rem;
  2259. }
  2260. @media screen and (max-width: 80em) {
  2261. .preferences_back {
  2262. clear: both;
  2263. }
  2264. .engine-tooltip {
  2265. left: 10em !important;
  2266. }
  2267. }
  2268. /*
  2269. * SearXNG, A privacy-respecting, hackable metasearch engine
  2270. */
  2271. #search {
  2272. padding: 1.5em 2em 0 6rem;
  2273. margin: 0;
  2274. background: var(--color-header-background);
  2275. border-bottom: 1px solid var(--color-header-border);
  2276. display: grid;
  2277. column-gap: 1rem;
  2278. row-gap: 1rem;
  2279. grid-template-columns: 3rem 1fr;
  2280. grid-template-areas: "logo search" "spacer categories";
  2281. }
  2282. #search_logo {
  2283. grid-area: logo;
  2284. }
  2285. .search_logo_img {
  2286. width: 40px;
  2287. }
  2288. .search_categories {
  2289. grid-area: categories;
  2290. }
  2291. #search_wrapper {
  2292. padding: 0;
  2293. grid-area: search;
  2294. }
  2295. .search_box {
  2296. margin: 0 12px 0 0;
  2297. display: inline-flex;
  2298. flex-direction: row;
  2299. white-space: nowrap;
  2300. /*
  2301. &:has(q:focus) {
  2302. box-shadow: 0px 0px 5px #CCC;
  2303. }
  2304. */
  2305. }
  2306. #clear_search {
  2307. display: block;
  2308. border-collapse: separate;
  2309. box-sizing: border-box;
  2310. width: 1.8em;
  2311. margin: 0;
  2312. padding: 8px 2px;
  2313. background: none repeat scroll 0 0 var(--color-search-background);
  2314. border-top: 1px solid var(--color-search-border);
  2315. border-bottom: 1px solid var(--color-search-border);
  2316. border-right: none;
  2317. border-left: none;
  2318. border-radius: 0;
  2319. outline: none;
  2320. color: var(--color-search-font);
  2321. font-size: 16px;
  2322. z-index: 10000;
  2323. }
  2324. #clear_search:hover {
  2325. color: var(--color-search-background-hover);
  2326. }
  2327. #clear_search.empty * {
  2328. display: none;
  2329. }
  2330. #q,
  2331. #send_search {
  2332. display: block !important;
  2333. border-collapse: separate;
  2334. box-sizing: border-box;
  2335. margin: 0;
  2336. padding: 8px;
  2337. background: none repeat scroll 0 0 var(--color-search-background);
  2338. border: 1px solid var(--color-search-border);
  2339. border-radius: 0;
  2340. outline: none;
  2341. color: var(--color-search-font);
  2342. font-size: 16px;
  2343. z-index: 2;
  2344. }
  2345. #q {
  2346. outline: medium none;
  2347. padding-left: 12px;
  2348. padding-right: 0 !important;
  2349. border-right: none;
  2350. width: 40rem;
  2351. border-radius: 10px 0 0 10px;
  2352. }
  2353. #q::-ms-clear,
  2354. #q::-webkit-search-cancel-button {
  2355. display: none;
  2356. }
  2357. #send_search {
  2358. border-left: none;
  2359. border-radius: 0 10px 10px 0;
  2360. }
  2361. #send_search:hover {
  2362. cursor: pointer;
  2363. background-color: var(--color-search-background-hover);
  2364. color: var(--color-search-background);
  2365. }
  2366. .no-js #send_search {
  2367. width: auto !important;
  2368. }
  2369. .search_filters {
  2370. display: inline-block;
  2371. margin: 0.8rem 0 0 0;
  2372. }
  2373. @media screen and (max-width: 80em) {
  2374. #search {
  2375. padding: 1.5em 0.5rem 0 0.5rem;
  2376. column-gap: 0.5rem;
  2377. }
  2378. #categories {
  2379. font-size: 90%;
  2380. clear: both;
  2381. }
  2382. #categories .checkbox_container {
  2383. margin: auto;
  2384. margin-top: 2px;
  2385. }
  2386. html.touch #main_index #categories_container,
  2387. html.touch #main_results #categories_container {
  2388. width: 1000px;
  2389. width: -moz-max-content;
  2390. width: -webkit-max-content;
  2391. width: max-content;
  2392. }
  2393. html.touch #main_index #categories_container .category,
  2394. html.touch #main_results #categories_container .category {
  2395. display: inline-block;
  2396. width: auto;
  2397. }
  2398. html.touch #main_index #categories,
  2399. html.touch #main_results #categories {
  2400. width: 100%;
  2401. margin: 0;
  2402. text-align: left;
  2403. overflow-x: scroll;
  2404. overflow-y: hidden;
  2405. -webkit-overflow-scrolling: touch;
  2406. }
  2407. }
  2408. @media screen and (max-width: 50em) {
  2409. #search {
  2410. width: 100%;
  2411. margin: 0;
  2412. padding: 0.1em 0 0 0;
  2413. column-gap: 0;
  2414. row-gap: 0;
  2415. grid-template-areas: "logo search" "categories categories";
  2416. }
  2417. .search_logo {
  2418. padding: 0;
  2419. }
  2420. #search_wrapper {
  2421. width: 100%;
  2422. padding: 0;
  2423. }
  2424. .search_box {
  2425. width: 99%;
  2426. margin: 0.1em;
  2427. padding: 0 0.1em 0 0;
  2428. display: flex;
  2429. flex-direction: row;
  2430. }
  2431. #q {
  2432. width: auto !important;
  2433. flex: 1;
  2434. }
  2435. .search_filters {
  2436. display: block;
  2437. margin: 0.8em 0;
  2438. }
  2439. .language,
  2440. .time_range {
  2441. width: 45%;
  2442. }
  2443. .category {
  2444. display: block;
  2445. width: 100%;
  2446. }
  2447. .category label {
  2448. padding: 10px !important;
  2449. }
  2450. }
  2451. #categories {
  2452. margin: 0 10px 0 0;
  2453. -webkit-touch-callout: none;
  2454. -webkit-user-select: none;
  2455. -khtml-user-select: none;
  2456. -moz-user-select: none;
  2457. -ms-user-select: none;
  2458. user-select: none;
  2459. }
  2460. #categories::-webkit-scrollbar {
  2461. width: 0;
  2462. height: 0;
  2463. }
  2464. .category {
  2465. display: inline-block;
  2466. position: relative;
  2467. margin: 0 3px;
  2468. padding: 0;
  2469. }
  2470. .category input {
  2471. display: none;
  2472. }
  2473. .category label {
  2474. cursor: pointer;
  2475. padding: 0.3rem 0.75rem 0.5rem 0.75rem;
  2476. margin: 0;
  2477. display: block;
  2478. text-transform: capitalize;
  2479. font-size: 0.9em;
  2480. border-bottom: 2px solid transparent;
  2481. -webkit-touch-callout: none;
  2482. -webkit-user-select: none;
  2483. -khtml-user-select: none;
  2484. -moz-user-select: none;
  2485. -ms-user-select: none;
  2486. user-select: none;
  2487. }
  2488. .category input[type="checkbox"]:focus + label {
  2489. box-shadow: 0 0 8px var(--color-categories-item-border-selected);
  2490. }
  2491. .category input[type="checkbox"]:checked + label {
  2492. color: var(--color-categories-item-selected-font);
  2493. border-bottom: 2px solid var(--color-categories-item-border-selected);
  2494. }
  2495. #categories_container {
  2496. position: relative;
  2497. }
  2498. .ion-icon-big {
  2499. display: inline-block;
  2500. line-height: 1;
  2501. font-weight: normal;
  2502. font-style: normal;
  2503. speak: none;
  2504. text-decoration: inherit;
  2505. text-transform: none;
  2506. text-rendering: auto;
  2507. -webkit-font-smoothing: antialiased;
  2508. -moz-osx-font-smoothing: grayscale;
  2509. font-size: 149%;
  2510. }
  2511. .ion-icon-big:before {
  2512. font-family: "ion";
  2513. }
  2514. html {
  2515. font-family: sans-serif;
  2516. font-size: 0.9em;
  2517. -webkit-text-size-adjust: 100%;
  2518. -ms-text-size-adjust: 100%;
  2519. -moz-text-size-adjust: 100%;
  2520. text-size-adjust: 100%;
  2521. color: var(--color-base-font);
  2522. background-color: var(--color-base-background);
  2523. padding: 0;
  2524. margin: 0;
  2525. }
  2526. body,
  2527. main {
  2528. padding: 0;
  2529. margin: 0;
  2530. }
  2531. body {
  2532. display: flex;
  2533. flex-direction: column;
  2534. height: 100vh;
  2535. margin: 0;
  2536. }
  2537. main {
  2538. width: 100%;
  2539. margin-bottom: 2rem;
  2540. flex: 1;
  2541. }
  2542. #main_preferences,
  2543. #main_about,
  2544. #main_stats {
  2545. margin: 2em auto;
  2546. width: 85em;
  2547. }
  2548. footer {
  2549. clear: both;
  2550. min-height: 4rem;
  2551. padding: 1rem 0;
  2552. width: 100%;
  2553. text-align: center;
  2554. background-color: var(--color-footer-background);
  2555. border-top: 1px solid var(--color-footer-border);
  2556. overflow: hidden;
  2557. }
  2558. footer p {
  2559. font-size: 0.9em;
  2560. }
  2561. #main_preferences h1,
  2562. #main_stats h1 {
  2563. background: url('../img/searx.png') no-repeat;
  2564. background-size: auto 75%;
  2565. min-height: 40px;
  2566. margin: 0 auto;
  2567. }
  2568. #main_preferences h1 span,
  2569. #main_stats h1 span {
  2570. visibility: hidden;
  2571. }
  2572. input[type="submit"],
  2573. #results button[type="submit"] {
  2574. padding: 0.7rem;
  2575. display: inline-block;
  2576. background: var(--color-btn-background);
  2577. color: var(--color-btn-font);
  2578. -webkit-border-radius: 10px;
  2579. -moz-border-radius: 10px;
  2580. border-radius: 10px;
  2581. border: 0;
  2582. cursor: pointer;
  2583. }
  2584. a {
  2585. text-decoration: none;
  2586. color: var(--color-url-font);
  2587. }
  2588. a:visited {
  2589. color: var(--color-url-visited-font);
  2590. }
  2591. a:visited .highlight {
  2592. color: var(--color-url-visited-font);
  2593. }
  2594. article[data-vim-selected] {
  2595. background: var(--color-result-vim-selected);
  2596. }
  2597. article[data-vim-selected]::before {
  2598. position: absolute;
  2599. left: 8rem;
  2600. padding: 2px;
  2601. content: ">";
  2602. font-weight: bold;
  2603. color: var(--color-result-vim-arrow);
  2604. }
  2605. article.result-images[data-vim-selected] {
  2606. background: var(--color-result-vim-arrow);
  2607. }
  2608. article.result-images[data-vim-selected] .image_thumbnail {
  2609. filter: opacity(60%);
  2610. }
  2611. article.result-images[data-vim-selected]::before {
  2612. display: none;
  2613. content: "";
  2614. }
  2615. .result {
  2616. margin: 2rem 0;
  2617. padding: 0;
  2618. }
  2619. .result h3 {
  2620. font-size: 1.1em;
  2621. word-wrap: break-word;
  2622. margin: 0.4rem 0 0.4rem 0;
  2623. padding: 0;
  2624. }
  2625. .result h3 a {
  2626. color: var(--color-result-link-font);
  2627. font-weight: normal;
  2628. font-size: 1.1em;
  2629. }
  2630. .result h3 a:visited {
  2631. color: var(--color-result-link-visited-font);
  2632. }
  2633. .result h3 a:focus,
  2634. .result h3 a:hover {
  2635. text-decoration: underline;
  2636. border: none;
  2637. -webkit-box-shadow: none;
  2638. box-shadow: none;
  2639. outline: none;
  2640. }
  2641. .result .cache_link,
  2642. .result .proxyfied_link {
  2643. font-size: 0.9em !important;
  2644. }
  2645. .result .content,
  2646. .result .stat,
  2647. .result .altlink {
  2648. font-size: 0.9em;
  2649. margin: 0;
  2650. padding: 0;
  2651. max-width: 54em;
  2652. word-wrap: break-word;
  2653. line-height: 1.24;
  2654. }
  2655. .result .content .highlight,
  2656. .result .stat .highlight,
  2657. .result .altlink .highlight {
  2658. color: var(--color-result-description-highlight-font);
  2659. background: inherit;
  2660. font-weight: bold;
  2661. }
  2662. .result .codelines .highlight {
  2663. color: inherit;
  2664. background: inherit;
  2665. font-weight: normal;
  2666. }
  2667. .result .url {
  2668. font-size: 0.96em;
  2669. margin: 0 0 3px 0;
  2670. padding: 0;
  2671. max-width: 54em;
  2672. word-wrap: break-word;
  2673. color: var(--color-result-url-font);
  2674. }
  2675. .result .published_date {
  2676. font-size: 0.8em;
  2677. color: var(--color-result-publishdate-font);
  2678. }
  2679. .result img.thumbnail {
  2680. float: left;
  2681. padding: 0 5px 10px 0;
  2682. width: 20em;
  2683. min-width: 20em;
  2684. min-height: 8em;
  2685. }
  2686. .result img.image {
  2687. float: left;
  2688. padding: 0 5px 10px 0;
  2689. width: 100px;
  2690. max-height: 100px;
  2691. object-fit: scale-down;
  2692. object-position: right top;
  2693. }
  2694. .result .break {
  2695. clear: both;
  2696. }
  2697. .category-social .image {
  2698. width: auto !important;
  2699. min-width: 48px;
  2700. min-height: 48px;
  2701. padding: 0 5px 25px 0 !important;
  2702. }
  2703. .result-videos .content {
  2704. overflow: hidden;
  2705. }
  2706. .engines {
  2707. float: right;
  2708. color: var(--color-result-engines-font);
  2709. }
  2710. .engines span {
  2711. font-size: smaller;
  2712. margin: 0 0.5em 0 0;
  2713. }
  2714. .small_font {
  2715. font-size: 0.8em;
  2716. }
  2717. .highlight {
  2718. color: var(--color-result-link-font-highlight);
  2719. background: inherit;
  2720. }
  2721. .result-images {
  2722. display: inline-block;
  2723. margin: 0;
  2724. padding: 0;
  2725. position: relative;
  2726. max-height: 200px;
  2727. }
  2728. .result-images img {
  2729. float: inherit;
  2730. margin: 0.125rem;
  2731. padding: 0;
  2732. border: none;
  2733. max-height: 200px;
  2734. background: var(--color-result-image-background);
  2735. }
  2736. .result-images span.title {
  2737. display: none;
  2738. color: var(--color-result-image-span-font);
  2739. }
  2740. .result-images:hover span.title {
  2741. display: block;
  2742. position: absolute;
  2743. bottom: 0;
  2744. right: 0;
  2745. padding: 4px;
  2746. margin: 0 0 4px 4px;
  2747. background-color: var(--color-result-image-span-background-hover);
  2748. font-size: 0.7em;
  2749. }
  2750. .result-map img.image {
  2751. float: right !important;
  2752. height: 100px !important;
  2753. width: auto !important;
  2754. }
  2755. .result-map table {
  2756. font-size: 0.9em;
  2757. width: auto;
  2758. border-collapse: separate;
  2759. border-spacing: 0 0.35rem;
  2760. }
  2761. .result-map table th {
  2762. font-weight: inherit;
  2763. width: 17rem;
  2764. vertical-align: top;
  2765. text-align: left;
  2766. }
  2767. .result-map table td {
  2768. vertical-align: top;
  2769. text-align: left;
  2770. }
  2771. .hidden {
  2772. display: none !important;
  2773. }
  2774. #results {
  2775. margin: 2rem 2rem 0 10rem;
  2776. display: grid;
  2777. grid-template-columns: 45rem 25rem;
  2778. grid-template-rows: min-content min-content 1fr min-content;
  2779. gap: 0 5rem;
  2780. grid-template-areas: "corrections sidebar" "answers sidebar" "urls sidebar" "pagination sidebar";
  2781. }
  2782. #results #answers *:first-child,
  2783. #results #sidebar *:first-child,
  2784. #results #urls *:first-child {
  2785. margin-top: 0;
  2786. }
  2787. #urls {
  2788. padding: 0;
  2789. grid-area: urls;
  2790. }
  2791. #suggestions .wrapper {
  2792. display: flex;
  2793. flex-flow: row wrap;
  2794. justify-content: flex-end;
  2795. }
  2796. #suggestions .wrapper form {
  2797. display: inline-block;
  2798. flex: 1 1 50%;
  2799. }
  2800. #suggestions input,
  2801. #answers input,
  2802. #infoboxes input,
  2803. #corrections input {
  2804. padding: 0;
  2805. margin: 3px;
  2806. font-size: 0.9em;
  2807. display: inline-block;
  2808. background: transparent;
  2809. color: var(--color-result-search-url-font);
  2810. cursor: pointer;
  2811. }
  2812. #suggestions input[type="submit"],
  2813. #answers input[type="submit"],
  2814. #infoboxes input[type="submit"],
  2815. #corrections input[type="submit"],
  2816. #suggestions .infobox .url a,
  2817. #answers .infobox .url a,
  2818. #infoboxes .infobox .url a,
  2819. #corrections .infobox .url a {
  2820. color: var(--color-result-link-font);
  2821. text-decoration: none;
  2822. font-size: 0.9rem;
  2823. }
  2824. #suggestions input[type="submit"]:hover,
  2825. #answers input[type="submit"]:hover,
  2826. #infoboxes input[type="submit"]:hover,
  2827. #corrections input[type="submit"]:hover,
  2828. #suggestions .infobox .url a:hover,
  2829. #answers .infobox .url a:hover,
  2830. #infoboxes .infobox .url a:hover,
  2831. #corrections .infobox .url a:hover {
  2832. text-decoration: underline;
  2833. }
  2834. #corrections {
  2835. grid-area: corrections;
  2836. display: flex;
  2837. flex-flow: row wrap;
  2838. margin: 0 0 1em 0;
  2839. }
  2840. #corrections h4,
  2841. #corrections input[type="submit"] {
  2842. display: inline-block;
  2843. margin: 0 0.5em 0 0;
  2844. }
  2845. #corrections input[type="submit"]::after {
  2846. content: ", ";
  2847. }
  2848. #suggestions .title,
  2849. #search_url .title,
  2850. #apis .title {
  2851. margin: 2em 0 0.5em 0;
  2852. color: var(--color-base-font);
  2853. }
  2854. #answers {
  2855. grid-area: answers;
  2856. border: 1px solid var(--color-answer-border);
  2857. padding: 0.9em;
  2858. margin-bottom: 2rem;
  2859. color: var(--color-answer-font);
  2860. -webkit-border-radius: 10px;
  2861. -moz-border-radius: 10px;
  2862. border-radius: 10px;
  2863. }
  2864. #answers h4 {
  2865. display: none;
  2866. }
  2867. #answers .answer {
  2868. display: block;
  2869. font-size: 1.2em;
  2870. font-weight: bold;
  2871. }
  2872. #answers form,
  2873. #infoboxes form {
  2874. min-width: 210px;
  2875. }
  2876. #sidebar {
  2877. grid-area: sidebar;
  2878. word-wrap: break-word;
  2879. color: var(--color-sidebar-font);
  2880. }
  2881. #sidebar .infobox {
  2882. margin: 10px 0 10px;
  2883. border: 1px solid var(--color-sidebar-border);
  2884. padding: 0.9em;
  2885. font-size: 0.9em;
  2886. -webkit-border-radius: 10px;
  2887. -moz-border-radius: 10px;
  2888. border-radius: 10px;
  2889. }
  2890. #sidebar .infobox h2 {
  2891. margin: 0 0 0.5em 0;
  2892. }
  2893. #sidebar .infobox img {
  2894. max-width: 100%;
  2895. max-height: 12em;
  2896. display: block;
  2897. margin: 0;
  2898. padding: 0;
  2899. }
  2900. #sidebar .infobox dl {
  2901. margin: 0.5em 0;
  2902. }
  2903. #sidebar .infobox dt {
  2904. display: inline;
  2905. margin: 0.5em 0.25em 0.5em 0;
  2906. padding: 0;
  2907. font-weight: bold;
  2908. }
  2909. #sidebar .infobox dd {
  2910. display: inline;
  2911. margin: 0.5em 0;
  2912. padding: 0;
  2913. }
  2914. #sidebar .infobox input {
  2915. font-size: 1em;
  2916. }
  2917. #sidebar .infobox br {
  2918. clear: both;
  2919. }
  2920. #sidebar .infobox .attributes,
  2921. #sidebar .infobox .urls {
  2922. clear: both;
  2923. }
  2924. #search_url {
  2925. margin-top: 8px;
  2926. }
  2927. #search_url div.selectable_url pre {
  2928. width: 200em;
  2929. }
  2930. #linkto_preferences {
  2931. position: absolute;
  2932. right: 10px;
  2933. top: 2rem;
  2934. padding: 0;
  2935. border: 0;
  2936. display: block;
  2937. font-size: 1.2em;
  2938. color: var(--color-search-font);
  2939. }
  2940. #linkto_preferences a:link *,
  2941. #linkto_preferences a:hover *,
  2942. #linkto_preferences a:visited *,
  2943. #linkto_preferences a:active * {
  2944. color: var(--color-search-font);
  2945. }
  2946. #pagination {
  2947. grid-area: pagination;
  2948. }
  2949. #pagination br {
  2950. clear: both;
  2951. }
  2952. #apis {
  2953. margin-top: 8px;
  2954. clear: both;
  2955. }
  2956. #backToTop {
  2957. border: 1px solid var(--color-backtotop-border);
  2958. margin: 0;
  2959. padding: 0;
  2960. font-size: 1em;
  2961. box-shadow: 0 0 5px var(--color-backtotop-shadow);
  2962. background: var(--color-backtotop-background);
  2963. position: fixed;
  2964. bottom: 8rem;
  2965. left: 56.3rem;
  2966. transition: opacity 0.5s;
  2967. opacity: 0;
  2968. -webkit-border-radius: 10px;
  2969. -moz-border-radius: 10px;
  2970. border-radius: 10px;
  2971. }
  2972. #backToTop a {
  2973. display: block;
  2974. margin: 0;
  2975. padding: 0.7em;
  2976. }
  2977. #results.scrolling #backToTop {
  2978. opacity: 1;
  2979. }
  2980. @media screen and (max-width: 80em) {
  2981. #main_preferences,
  2982. #main_about,
  2983. #main_stats {
  2984. margin: 2rem 0.5rem;
  2985. width: auto;
  2986. }
  2987. #infoboxes {
  2988. position: inherit;
  2989. max-width: inherit;
  2990. }
  2991. #infoboxes .infobox {
  2992. clear: both;
  2993. }
  2994. #infoboxes .infobox img {
  2995. float: left;
  2996. max-width: 10em;
  2997. margin: 0.5em 0.5em 0.5em 0;
  2998. }
  2999. #sidebar {
  3000. margin-bottom: 2rem;
  3001. padding: 0;
  3002. float: none;
  3003. border: none;
  3004. width: auto;
  3005. }
  3006. #sidebar input {
  3007. border: 0;
  3008. }
  3009. #apis {
  3010. display: none;
  3011. }
  3012. #search_url {
  3013. display: none;
  3014. }
  3015. .result .thumbnail {
  3016. max-width: 98%;
  3017. }
  3018. .result .url span.url {
  3019. display: block;
  3020. white-space: nowrap;
  3021. text-overflow: ellipsis;
  3022. overflow: hidden;
  3023. width: 100%;
  3024. }
  3025. .result .engines {
  3026. float: right;
  3027. padding: 0 0 3px 0;
  3028. }
  3029. .result-images {
  3030. border-bottom: none !important;
  3031. }
  3032. .image_result {
  3033. max-width: 98%;
  3034. }
  3035. .image_result img {
  3036. max-width: 98%;
  3037. }
  3038. #backToTop {
  3039. display: none;
  3040. }
  3041. #pagination {
  3042. margin: 2rem 0 0 0 !important;
  3043. }
  3044. #main_results div#results {
  3045. margin: 2rem auto 0 auto;
  3046. justify-content: center;
  3047. display: grid;
  3048. grid-template-columns: 45rem;
  3049. grid-template-rows: min-content min-content min-content 1fr min-content min-content;
  3050. gap: 0;
  3051. grid-template-areas: "corrections" "answers" "sidebar" "urls" "pagination";
  3052. }
  3053. article[data-vim-selected]::before {
  3054. left: calc(((100% - 45rem) / 2) - 20px);
  3055. }
  3056. }
  3057. #main_results div#results.only_template_images {
  3058. margin: 2rem 0.5rem 0 0.5rem;
  3059. display: grid;
  3060. grid-template-columns: 100%;
  3061. grid-template-rows: min-content min-content 1fr min-content min-content;
  3062. gap: 0;
  3063. grid-template-areas: "corrections" "urls" "answers" "sidebar" "pagination";
  3064. }
  3065. #main_results div#results.only_template_images #urls {
  3066. width: inherit;
  3067. margin: 0;
  3068. }
  3069. #main_results div#results.only_template_images #backToTop {
  3070. left: auto;
  3071. right: 1rem;
  3072. }
  3073. #main_results div#results.only_template_images #pagination {
  3074. margin-right: 4rem;
  3075. }
  3076. @media screen and (max-width: 50em) {
  3077. #main_results div#results {
  3078. grid-template-columns: 100%;
  3079. margin: 2rem 0 0 0;
  3080. }
  3081. article[data-vim-selected]::before {
  3082. display: none;
  3083. content: "";
  3084. }
  3085. #linkto_preferences {
  3086. display: none;
  3087. position: fixed !important;
  3088. top: 100px;
  3089. right: 0;
  3090. }
  3091. #sidebar {
  3092. margin: 0 5px 2px 5px;
  3093. }
  3094. .infobox {
  3095. box-shadow: 0 0 5px var(--color-result-shadow);
  3096. }
  3097. #corrections,
  3098. #answers {
  3099. margin: 0 5px 1em 5px;
  3100. box-shadow: 0 0 5px var(--color-result-shadow);
  3101. }
  3102. #results {
  3103. margin: 0;
  3104. padding: 0;
  3105. }
  3106. #pagination {
  3107. margin: 2rem 1rem 0 1rem !important;
  3108. }
  3109. .result {
  3110. padding: 8px 10px 6px 10px;
  3111. margin: 0.5rem;
  3112. border: 1px solid var(--color-result-border);
  3113. box-shadow: 0 0 5px var(--color-result-shadow);
  3114. -webkit-border-radius: 10px;
  3115. -moz-border-radius: 10px;
  3116. border-radius: 10px;
  3117. }
  3118. .result-images {
  3119. margin: 0;
  3120. padding: 0;
  3121. border: none;
  3122. box-shadow: none;
  3123. }
  3124. }
  3125. @media screen and (max-width: 35em) {
  3126. .result-videos img.thumbnail {
  3127. float: none !important;
  3128. }
  3129. .result-videos .content {
  3130. overflow: inherit;
  3131. }
  3132. }
  3133. pre code {
  3134. white-space: pre-wrap;
  3135. }